﻿body{
	 overflow:auto;
	 overflow-x:hidden;
}

.ms-webpart-zone,.ms-webpart-chrome-vertical,div.ms-webpart-cell-vertical-inline-table {
    display: block;
    width: 100%;
}
.banner img{
	width:63%
}
button{
	min-width:0;border:none
}
#s4-bodyContainer{
	padding-bottom:0px
}

.main-menu a{
	text-decoration:none!important
}
dialog[open] {
  display: flex !important;
  flex-direction: column;
}
 
.slick-slider {
  width: 100% !important;
  max-width: 100%;
}

.main-menu a:link, .main-menu a:visited{
	color:#fff
}

.main-menu a.auth-btn{
	color:rgb(138 21 56 / var(--tw-text-opacity, 1))!important;
}

header nav a.auth-btn:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(138 21 56 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1))!important;
    }
    
    a.media-center-tab{
	color:rgba(var(--lightBlueTextColor))!important
}

   a.media-center-tab:hover{
	color: rgb(157 20 57 / var(--tw-text-opacity, 1))!important;
	text-decoration:none!important
}

a.media-center-tab--active, a.media-center-tab--active:hover {
    color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

[dir='rtl'] .slick-slide {
    float: right;
}

h1, h2, h3, h4, h5, h6{
	font-family:FrutigerLTArabic!important;

}

.content h1{
	color:#fff
}

.about-us h1, .about-us h2, .contact-us h2{
	color:#000
}
.ms-WPBody{
	display:block!important
}
.EnglishContents{
	display:none
}

/*button{
	border:none
}*/
*/
.faq-link:visited{
	color:rgba(var(--primaryColor))
}
.faq-link.active {
    background-color: rgba(var(--primaryColor));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

footer a:visited{
	color:#fff
}
 .sm\:tw-grid-cols-\[3fr_1fr\] {
        grid-template-columns: 2fr 1fr;
    }





  
.banner a:visited{
	color:#fff
}


.magazines a{
	color:rgb(138 21 56 / var(--tw-text-opacity, 1))!important
	}
	
	.magazines .media-center-tab--active{
	color:#fff!important
}

.logo-wrapper {
  margin-inline-end: 0.75rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.logo-wrapper img {
  height: 6.5rem;

     object-fit: contain;
}

a.calculator-link {
  all: unset;
  display: inline;
  cursor: pointer;
  text-decoration: none;
}

.close-btn:hover{
	background-color:transparent!important;
	border-color:transparent!important
}
.text-black{
	color:#000!important
}






/*================Hover Effect===================*/

.tw-fill-current {
  fill: #ffffff;
}

.media-center-link {
  border: 7px solid transparent;
  transition: all 1s;
}

.media-center-link {
  border: 7px solid transparent;
  transition: all 0.5s;
}
.media-center-link svg {
 transition: all 0.5s;
}
.media-center-link:hover {
  border: 7px solid #ffffff;
  background-color: #A3AFB2;
  
}

.media-center-link:hover svg {
  transform: scale(0.8);
}
.media-center-item
{
  overflow: hidden;
}
.media-center-item img
{
  transition: all 1s;
}
.media-center-item:hover img
{
 transform: scale(1.2);
}

.media-center-item:hover:after
{
 /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(0 0 0 / 85%) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
 
}

.media-center-item.media-center-item--audio:hover:after
{
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#465f65+0,465f65+100&0+0,1+100 */
background: linear-gradient(to bottom,  rgba(70,95,101,0) 0%,rgba(70,95,101,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
.media-center-item.media-center-item--audio img,.media-center-item.media-center-item--audio h6,.media-center-item--audio .tw-font-normal
{
transition: all 0.3s;
}
.media-center-item.media-center-item--audio:hover img, .media-center-item.media-center-item--audio:hover span.tw-font-normal
{
  transform: scale(0.8);
  filter: brightness(0) invert(1);
   z-index: 1;
}

.media-center-item.media-center-item--audio:hover h6
{
  color: white;
  font-size: 1.2rem;
  z-index: 1;
}

.media-center-item--album figure {
    overflow: hidden;
    transition: all 0.5s;
}

.media-center-item--album:hover {
    border: 1px solid #93a9af;
}

.media-center-item--album:hover::before {
    content: "";
    position: absolute;
    top: 45%;
    left: 50%;
    z-index: 10;
    height: 3rem;
    width: 3rem;
    --tw-translate-x: -50%;
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    background-image: url('/Style Library/Portal_Images/album.svg');
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}




.home-slide .slick-slide img
{
  width: 100%;
  height:100%;
  object-fit: cover;
}

#home-modal img
{
    height: 100%;
    object-fit: cover;
}

.home-slide figure{
	height:300px
}

header.no-overlay .actions .btn{

background-color: rgba(var(--primaryColor));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

header .actions .btn{
	border-style:solid
}

.social-links
{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}




header.fixed
{
  background-color: #831234;
  position: fixed;
      box-shadow: 0 3px 6px #00000029;
}
#accessibility-menu .tw-fill-current
{
   fill: rgba(var(--lightTextColor));
}
 
 [dir="ltr"] #accessibility-menu.dropdown-menu:after {
    right: 10px;
}
.ms-cui-tabContainer img{
 max-width: inherit !important;
}

[lang="ar"] .magazine-content-layout1 .main-title::before,
[dir="rtl"] .magazine-content-layout1 .main-title::before {
  right: 0px;
}
 
[lang="en"] .magazine-content-layout1 .main-title::before,
[dir="ltr"] .magazine-content-layout1 .main-title::before {
    left: 0px;
}
 
.bordered-content
{
  overflow: hidden;
}
 
 a:hover{
	text-decoration:none
}


@media (min-width: 1024px) {
 
  .dialog-content {
    width: 800px;
  }
  .banner .slick-slide .content .btn{
	font-size:16px
}
#home-modal .dialog-content{
	width:100%
}
}


@font-face {
  font-family: "FrutigerLTArabic";
  src:url("/Style Library/fonts/FrutigerLTArabic55Roman.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "FrutigerLTArabic";
  src:  url("/Style Library/fonts/FrutigerLTArabic65Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: bold;
  font-display: swap;
}

.div-htmlContent{
	font-family:"FrutigerLTArabic"!important;
	background-color: transparent!important;
	
}

.div-articleTop{
	border:none!important
}

/*.inner-banner img{
	transform: scaleX(-1);
}*/

*/

.news-details h1{
	font-size:32px;
	line-height:2.5rem
}

.ExternalClass84D0962C52DE48FA9BD49F87F34E15FD p{
	background-color:transparent!important
}


.richTEXT{
	max-width:1100px
}

.chart-legend .title:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    top: 5px;
    right: 5px;
}

.tw-gap-12{
	gap:1rem
}
.pop-img{
	margin:0 auto
}
 #Category, #RequestType {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;              /* keep Bootstrap look */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23486673' d='M4.47 6.97a.75.75 0 011.06 0L8 9.44l2.47-2.47a.75.75 0 111.06 1.06l-3 3a.75.75 0 01-1.06 0l-3-3a.75.75 0 010-1.06z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .85rem center; /* LTR */
    background-size: 22px 22px;
    padding-right: 2rem;                 /* space for the icon */
    cursor: pointer;
  }

  /* RTL support */
  html[dir="rtl"] #Category, html[dir="rtl"] #RequestType {
    background-position: left .85rem center;
    padding-left: 2rem;
    padding-right: .75rem;
  }
  
 #loginMenu2 .dropdown-handle{
	border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    --tw-text-opacity: 1;
    color:maroon!important;
}

#loginMenu2 .dropdown-handle{
	color:#fff!important;
	background-color:maroon;
}

header.no-overlay.scroll-top #loginMenu2 .dropdown-handle:hover{
	color:#fff!important;
	background-color:transparent;
}

[dir="rtl"]  .btn-back img
{
transform: rotate(180deg);
}


#loginMenu2 #user-menu {
    position: absolute !important;
    top: 34px !important;
    right: 0 !important;
    display: none;
    flex-direction: column;
    width: 200px;
    background-color: #ffffff;
    padding: 25px 5px;
    text-align: start;
}
 
#loginMenu2:hover #user-menu {
 display: flex;
}
.div-htmlContent, #ctl00_MainContent_cpMainArea_ctl01__ControlWrapper_RichHtmlField , #ctl00_MainContent_cpMainArea_ctl01__ControlWrapper_RichHtmlField h3, #ctl00_MainContent_cpMainArea_ctl01__ControlWrapper_RichHtmlField  p{
    font-family: "FrutigerLTArabic" !important;
    background-color: transparent !important;
}
.jssocials-share:last-child{
	margin-right:10px
}

.accessbility{
	border-left:1px solid #296375 ;
	padding-left:15px
}

@media (max-width: 1280px) {

.jquerycssmenu UL LI UL LI a:hover{
	color:#fff!important
}
.MLMStaticItem:hover{
	color:#fff!important
}
}

@media (min-width: 768px) {
    .md\:tw-grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}



#closeModalBtn{
	background-color:transparent!important;
	border-color:transparent!important;
	position: absolute;
    left: 0;
    margin-left: 12rem;
    margin-top:-2rem;
}



/** Search **/
#SearchBox .ms-srch-sb.ms-srch-sb-border {

	border: 0;

}
#SearchBox input {
	height: 28px;
	width: 94%;
	color: #fff!important;
	margin-top: 14px;
}
#NoResult .ms-textLarge.ms-srch-result-noResultsTitle {
	color: grey;
}
#NoResult div:nth-child(2){font-weight:bold;}
.srch-advancedtable {
/*margin-top:235px;*/	border: 0;
	background: #fff;
}
td.ms-advsrchText-v2 input[type=password], td.ms-advsrchText-v2 input[type=text], td.ms-advsrchText-v2 input[type=file], td.ms-advsrchText-v2 textarea, td.ms-advsrchText-v2 .ms-inputBox {
	padding: 10px 5px;
}
.ms-advsrchText-v2 input[type=checkbox], .ms-advsrchText-v2 input[type=radio] {
	margin: 5px;
}
.ms-advsrchText-v1 label, .ms-advsrchText-v2 label {
	margin-bottom: 0;
}
.ms-advsrchText-v1 label, .ms-advsrchText-v2 input {
	margin: 5px;
}
.ms-srch-sb.ms-srch-sb-borderFocused {
	width: 100%;
	border: 0;
	border-bottom: 2px solid #fff;
}
.ms-srch-sb > .ms-srch-sb-searchLink {
	background: transparent url("/Style Library/Portal_Images/search-white-icon.png") no-repeat center center;
}
.ms-srch-sb-searchLink:hover {
	cursor: pointer;
}
.ms-srch-sb-searchImg {
	display: none;
}
.ms-srch-sb > .ms-srch-sb-searchLink {
	margin-left: 0px;
	height: 43px;
	width: 35px;
	margin-top: 0px;
	background-size:25px;
}
.ms-textSmall {
	font-size: 1.2em;
}
@media (max-width:990px)
{
.home-page .main-panner {
	height: 580px !important;
}
.ms-srch-sb > .ms-srch-sb-searchLink {
	margin-left: -23px;
}
}
@media (max-width:563px)
{
.ms-srch-sb > .ms-srch-sb-searchLink {
	margin-left: -25px;
}
}


#searchModal {
	background-color: #486673;
}
#searchModal .modal-content {
	background: transparent;
	border: none;
}
#searchModal .modal-content .form-control {
	background: transparent;
	border: none;
	border-bottom: 2px solid #fff;
	border-radius: 0;
	box-shadow: none !important;
	color: #fff;
}
#searchModal .modal-content .btn {
	position: absolute;
	top: 0;
	right: 5px;
	color: #fff;
	text-decoration: none !important;
}
.modal-content {
	border-radius: 0;
}

#searchModal  .ms-srch-sb-searchLink{
	display:none!important
}

.ms-srch-sb input,.ms-srch-sbLarge input{
	color:#000!important
}




/* Optional: Add some spacing around the web parts */
.ms-webpartzone-cell {
    margin-bottom: 20px; /* Add spacing between web parts */
}

.ms-srchnav-list li:nth-child(2),.ms-srchnav-list li:nth-child(3),.ms-srchnav-list li:nth-child(4)
{
	display:none!important
}

.ms-srch-upscope-top{
	display:none!important
}
.ms-srch-hover-content{
	display:none!important
}


/* This is the container that holds both web parts */
#MSOZoneCell_WebPartWPQ2 {
    display:none
}

/* This is for the actual web part zone containers */
#MSOZoneCell_WebPartWPQ3{
    width: 80%;                      /* You can adjust this to control the width of the elements */
    text-align: center;              /* Optional: Center content inside the divs */
    padding: 10px;                   /* Add padding for spacing inside the web part */
    margin-top:20px
}

/* Optional: Add styling to the web parts themselves (adjust colors, borders, etc.) */
#MSOZoneCell_WebPartWPQ3 {
    background-color: #fff;          /* White background for WPQ3 */
    border-radius: 10px;             /* Rounded corners */
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); /* Optional box-shadow */
}

#ResultFooter{
	display:none!important
}

.ms-srch-item{
	width:100%
}

.tw-dark .inner-banner .tw-fill-current{
	   filter: invert(0);

}








 
.tw-dark  .tw-fill-current {
    filter: invert(1);
}
#zz1_SideNavMenu tbody > tr:nth-child(odd) > td > a
{
   /* background-color: rgba(var(--primaryColor));
    color: rgb(72 102 115 / var(--tw-text-opacity, 1));*/
}
 
#zz1_SideNavMenu tbody > tr:nth-child(even)  tr
{
 display: block !important;
}
 
#zz1_SideNavMenu > tr:nth-child(even)
{
 display: none;
}



.tw-dark .bordered-content {
    background-color:#434343;
}
 
.tw-dark .highcharts-background
{
fill: #434343 !important;
}
 
.tw-dark .monthly-reports.subscribers-statistics,.tw-dark .monthly-reports.retirees-statistics {
    background-color: #8d8d8d;
}
 
.accessbility {
  position: relative;
}
 
.accessbility .dropdown-menu
{
    top: 37px !important;
    right: auto !important;
    left: 24px !important;
    transform: translate(10px, 10px) !important;
    position: absolute !important;
    z-index: 100 !important;
}
 
.tw-dark .tw-bg-white {
   background-color: rgb(255 255 255 / 30%);
}
 
.tw-dark .tw-bg-white img
{
   border-radius: 15px;
}





#searchModal {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 999999 !important; /* go above SharePoint header */
}



#zz1_SideNavMenu a.zz1_SideNavMenu_1.faq-link:visited{
	color:rgb(71 101 114)!important;
}
#zz1_SideNavMenu a.zz1_SideNavMenu_1.faq-link.active{
	color:#fff!important;
}


#searchModal .tw-border-b
{
border:0px;
}

#searchModal .ms-srch-sb
{
width:100%;
}

#searchModal .tw-border-b
{
border:0px;
}

#SearchBox input {
    height: 28px;
    width: 94%;
    margin-top: 14px;
    background-color: #ffffff;
    color: #000000 !important;
    width: 100%;
    border-radius: 5px;
    padding: 5px;
    height: 49px;
}

#closeModalBtn {
    position: absolute !important;
    right: 50px;
    left: auto !important;
    margin-right: 0 !important;
    margin-left: 0px !important;
    margin-top: 0 !important;
    top: 22px;
    border: 2px solid #ffffff !important;
    padding: 7px 12px;
    border-radius: 50%;
    border-color: #ffffff !important;
}

#DeltaSearch
{
    background: #ffffff;
    height: 170px;
    border: 1px solid #ffffff;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
    max-width: 100%;
    margin: 0px auto;
}

body #SearchBox input {
    height: 28px;
    width: 50% !important;
    margin: 0px auto !important;
    margin-top: 14px;
    color: #000000 !important;
        width: 100%;
    border-radius: 5px;
    padding: 5px;
    height: 49px !important;
    border: 1px solid #898989 !important;
}

#SearchBox .ms-srch-sb.ms-srch-sb-border {
  text-align: center;
}

.ms-srch-sb.ms-srch-sb-borderFocused
{
    text-align: center;
}

#searchTxt{
	
    width: 100px;
    background-color: #486673;
    position: absolute;
    bottom: 23rem;
    padding: 8px;
    color:#fff;
}

@media (max-width: 768px)
{
 
  /* #s4-workspace
   {
    overflow-x: hidden !important;
   }*/
 
   footer > .container > .tw-grid
   {
      display: block!important;
   }
   #HomeStatisticsAllListing2 .tw-px-24
{
 padding-left: 0px !important;
 padding-right: 0px !important;
}
.mobile-mockup img
{
  object-fit: contain;
  height: auto!important;
}
.media-monthlyReports .years-filter .tw-flex
{
width: 100%;
overflow-x: scroll;
}

}

#SocialMediaLinksAllListing2 img {
    width: 50px;
    height: auto !important;
}


@media (max-width: 992px) {

main {
    padding-top: 5.5rem;

}
}

@media (max-width: 1280px)
{
  [dir='ltr'] #loginMenu2 #user-menu {
    top: 45px !important;
    left: 0 !important;
  }
 
  [dir='rtl'] #loginMenu2:hover #user-menu {
    transform: none !important;
    }
}

.div-articleTop > .row > .col-lg-12
{
 width:100% !important;
}

.div-articleTop > .row > .col-lg-12
{
 width:100% !important;
}
@media screen and (max-width: 768px)
{
  .tw-w-\[80\%\] {
    width: 100% !important;
    }
}

