﻿/***** fixes *****/
/** fixing ribbon after bootstrap **/

/* *{box-sizing:unset;}*/

/* #wrapper *{box-sizing:border-box;}*/

/* fix padding bottom on body */
#s4-bodyContainer{padding:0;}
/* fixing notification area margin*/
#pageStatusBar[class], .ms-status-msg{ margin-bottom: 0;}

.ms-signInLink{display:inline-block; line-height:unset; padding: 1px 5px 0 0; vertical-align: middle;}
/***** fixes *****/


#s4-workspace{ overflow: inherit;}
.sharepoint-bars-fix
{
	position: fixed;
	top: 0;
	width: 100%;
	left: 0;
	right: 0;
	z-index: 100;
}

#s4-ribbonrow {
    background-color: #f2f2f2;
}


/*fix sharepoint ribbon submenu*/
.ms-cui-menu{
	position: fixed !important;
}

.ms-cui-tt, .ms-cui-cg {
  margin: 0px 10px 2px 0px  !important;
}

.ms-cui-tts-scale-2 .ms-cui-tt-a
{width:auto  !important;}

@font-face {
    font-family: 'Poppins-bold';
    src: url('../fonts/Poppins-Bold.eot');
    src: url('../fonts/Poppins-Bold.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Poppins-Bold.woff2') format('woff2'),
         url('../fonts/Poppins-Bold.woff') format('woff'),
         url('../fonts/Poppins-Bold.ttf') format('truetype'),
         url('../fonts/Poppins-Bold.svg#Poppins-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins-Regular.eot');
    src: url('../fonts/Poppins-Regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Poppins-Regular.woff2') format('woff2'),
         url('../fonts/Poppins-Regular.woff') format('woff'),
         url('../fonts/Poppins-Regular.ttf') format('truetype'),
         url('../fonts/Poppins-Regular.svg#Poppins-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins-light';
    src: url('../fonts/Poppins-Light.eot');
    src: url('../fonts/Poppins-Light.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Poppins-Light.woff2') format('woff2'),
         url('../fonts/Poppins-Light.woff') format('woff'),
         url('../fonts/Poppins-Light.ttf') format('truetype'),
         url('../fontsPoppins-Light.svg#Poppins-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

.scroll-top-div {
   
    color: white;
    border: none;
    border-radius: 50%;
    width: 95px;
    height: 100px;
    font-size: 24px;
    text-align: center;
    line-height: 50px;
    cursor: pointer;
    /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);*/
    z-index: 1000;
    transition: opacity 0.3s ease-in-out;
}

.scroll-top-span{
	background-color: #fff;
	position: fixed;
    bottom: 50px;
    right: 28px;
    display: none; /* Hidden by default */
   	width: 56px;           /* Set the desired diameter */
    height: 55px;          /* Same as the width to create a circle */
    border-radius: 50%;    /* Makes it a perfect circle */
    border: 2px solid #ccc; /* Optional: Add a border for better visibility */
    text-align: center;    /* Center text horizontally */
    line-height: 50px;
    z-index:20;
}

.scroll-top-span:hover {
    background-color: #bfd5f5;
}

html {
    	scroll-behavior: smooth; /* Enables smooth scrolling globally */
	}
	
	*{
	
}

.subscribe-btn{
 position: fixed;
   bottom: 120px;
    right: 5px;
    background: linear-gradient(0.25turn,#ee7b47 , #f2ab48 );
    height: 42px;
    line-height: normal;
    border-radius: 4px;
    font-size:1.2rem !important;
color:#fff !important;

z-index:20;
}

.social-div{
 position: fixed;
   	top:23%;
    left: 0;
    height: 42px;
	z-index:50;
}


.social-div img {
    width: 32px;
}

.social-col{
	background-color:#346c97;
	
}

.social-col > div{
	border-bottom:dotted #fff 1px;
}


*
{
	margin: 0;
	padding: 0;
}

.nopadding {padding: 0;}
.nomargin {margin: 0;}


html {
  scroll-behavior: smooth;
}

body {
	 /* fix ios smooth scrolling*/    
    -webkit-overflow-scrolling: touch;
    font-family: 'Poppins'; 
    font-size: 14pt;
    overflow: auto;
    overflow-x: hidden;
}

#wrapper {
    position:relative;
    height:100%;
    width:100%;
    /*overflow: hidden;*/
}

.text-underlined{
	text-decoration:underline;
}

.title
{
	margin-top: 30px;
	margin-bottom: 30px;
	font-family: poppins-bold;
	padding: 0 20px;
}

@media (min-width: 1200px) {  
.title-span{
		border-bottom: 3px solid #f1a334;
	  	
	  	display: inline-block;
	}
}

@media (max-width: 1199px) {  
.title-span{
		border-bottom: 3px solid #f1a334;
	  	height: 55px;
	  	display: inline-block;
	}
}


.top-header
{
	/*background: linear-gradient(180deg, rgb(0, 0, 0) 14%, rgba(0, 0, 0, 0) 100%);	*/
	position: fixed;
	height: auto;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 30;
	background: linear-gradient(to left, white 7%, #01467d 40%, #01467d 100%);
}

.top-header .logo
{
	margin-bottom:5px;
	margin-top:5px;
}

.menu{
	font-size:1.3rem;
}
.nav-item a , .nav-item a:visited{
	color:#fff;
}

a.dropdown-item , a.dropdown-item:visited{
	color:#000;
}

.bg-light{
	background-color: rgba(0, 0, 0, 0) !important;
}
.navbar-light .navbar-toggler{
	border:none;
	min-width:4rem;
}

.navbar-light .navbar-toggler-icon {
  background-image:url('../images/toggler-icon.svg');
}
.navbar-toggler:hover .navbar-toggler-icon  {
  background-image: url("../images/toggler-icon-hover.svg");
}

.navbar-toggler:focus{
	box-shadow:0 0 0 0;
}

@media (max-width: 1399.98px) {
  #navbarSupportedContent {
	  background-color: #fff;
	  border-radius: 10px;
	}
	.nav-item:hover{
		background-color:#e9ecef;
		border-radius: 10px;
		
	}
	.nav-item{
	padding:10px;
	font-size:1.2rem;
	}
	a.dropdown-item, a.dropdown-item:visited{
		color: rgba(0,0,0,0.55);
	}

	.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link.visited , .navbar-light .navbar-nav .nav-link {
			color: rgba(0,0,0,0.55) !important;
	}
	.navbar-light .navbar-nav .nav-link:hover{
	color: rgba(0,0,0,0.99) !important;
	}
	
}

.navbar-toggler:hover{
	background-color:#fff;
}
.navbar-toggler:hover:not(.collapsed){
		border-bottom-right-radius: 0;
		border-bottom-left-radius: 0;
}
.navbar-toggler:hover:not(.collapsed) + #navbarSupportedContent{
	border-top-right-radius: 0;
}

.navbar-toggler.collapsed:hover{

	border-bottom-right-radius: 10;
}

.navbar-light .navbar-nav .nav-link.active,.navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link.visited , .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link:hover {
		color:#FFF;
	}

.dropdown-item {
  font-size: 1.2rem;
  }  




  @media(min-width:1399.98px) {
      .dropdown-menu {
          opacity: 0; /* Fully visible */
          display: block;
          transition: all 0.5s;
          visibility: hidden;
      }

      .dropdown:hover .dropdown-menu {
          display: block; 
          margin-top: 0;
          opacity: 1;
          visibility: visible;
      }
  } 
 
 



#carouselExampleIndicators .carousel-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(195deg, rgba(255, 255, 255, 0) 42.94%, #01477D 89.37%);
  z-index: 1; 
}


.carousel-item {
  float: left;
  margin-right: -100%;
  margin-left: 0;
}

.slider-text{
	/*position: absolute;
  top: 53%;
  left: 6%;
  font-size: 2.0rem;
  font-weight:bold;
  color: #fff;
  z-index: 1;
  */
  width: 37%;
  margin: 1% 4% 1% 0;
  display: inline-block;
  font-size: 3.2rem;
  }
  
  .slider-slogan{
  font-size: 2.0rem;  
  margin: 1% 4% 1% 0;
  display: block;
}

@media(max-width: 991.98px){
	.slider-text{	 
	  font-size: 1.3rem;	 
	  width: 60%;
  }
  .slider-slogan{
  font-size: 1.0rem;  
  margin: 1% 4% 1% 0;
  display: block;

	}
}

@media(max-width: 1199.98px){
	.slider-text{	 
	  font-size: 1.8rem;	 
	  width: 60%;
  }
  .slider-slogan{
  font-size: 1.2rem;  
  margin: 1% 4% 1% 0;
  display: block;
  }


}



.social-col > div:hover{
background-color:#49afb7;}

.partners-row{

	background:#fff;
}

.partner-item-div
{
min-height: 200px;
	align-items: center;
  display: flex;
}
.partner-item-div > a > img{
	width:150px;
	transition: all 0.2s ease-in;
}

.partner-item-div > a > img:hover {
    transform: scale(1.1);
    
    
}


.marquee {
    width: 100%;
    grid-column-gap: 1rem;
   background-color: #dfeeff;
   margin-top: 1rem;
    margin-bottom: 1rem;
    padding-top: 2rem;
    padding-bottom: 0.5rem;
    display: flex;
    overflow: hidden;
   }
   .marquee-image {
    -webkit-transform: translateZ(0);
}
   .marquee-content {
    min-width: 100%;
    grid-column-gap: 1rem;
    flex: none;
    justify-content: space-around;
    display: flex;
}
   
   .scroll {
    animation: scroll 15s linear infinite;
}


@keyframes scroll{
    from {
        transform: translateX(0%);
    }
    to {
        transform: translateX(calc(-100% - 1rem));
    }
}


.scale-partner-img{
	scale:1.5;
}

.scale-partner-img2{
	scale:1.8;
}



.wwd-item-div  > a > img{
	width:100%;
}

.wwd-span-title-hover-text{
	font-size:1.5rem;
}
.wwd-span-title-hover a, .wwd-span-title-hover a:hover, .wwd-span-title-hover a:visited {
	color:#fff; font-size:1rem;
}

@media ((min-width: 992px) and (max-width: 1199.98px) ){
	.wwd-span-title-hover-text{
		font-size:1.2rem;
	}

}


@media ((min-width: 992px) and (max-width: 1199.98px) ){
	.wwd-span-title {
	  color: #fff;
	  padding: 9px;
	  border-radius: 5px;
	  font-size: 0.8rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 92%;
	  height: 25%;
	  background: rgba(0,0,0,0.5);
	   display:block;

	}	
	.wwd-span-title-hover{
	 color: #fff;
	  padding: 0;
	  border-radius: 5px;
	  font-size: 0.9rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 92%;
	  height: 0;
	  background: rgba(0,0,0,0.5);
      transition: all 0.2s ease-in;
     
	}
	.wwd-span-title-hover > div {
		display:none !important;
	}
	
	 .wwd-item-div:hover .wwd-span-title-hover{
		height: 90%;
		
	}
	 .wwd-item-div:hover .wwd-span-title-hover > div{
		display:flex !important;
		padding:9px;
		
	}
	
	.wwd-item-div:hover .wwd-span-title{
	display:none;
	}

}
@media (max-width: 767.98px) {
	.wwd-span-title {
	  color: #fff;
	  padding: 9px;
	  border-radius: 5px;
	  font-size: 0.8rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 92%;
	  height: 25%;
	  background: rgba(0,0,0,0.5);
	  display:block;
	}
	
	.wwd-span-title-hover{
	 color: #fff;
	  padding: 0;
	  border-radius: 5px;
	  font-size: 0.9rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 94%;
	  height: 0;
	  background: rgba(0,0,0,0.5);
      transition: all 0.2s ease-in;
     
	}
	.wwd-span-title-hover > div {
		display:none !important;
		padding:9px;
	}
	
	 .wwd-item-div:hover .wwd-span-title-hover{
		height: 90%;
		
	}
	 .wwd-item-div:hover .wwd-span-title-hover > div{
		display:flex !important;
		
	}
	
	.wwd-item-div:hover .wwd-span-title{
	display:none;
	}

	
}

@media (((min-width: 768px) and (max-width: 991.98px)) or (min-width: 1200px) )
{
	.wwd-span-title
	{	
	  color: #fff;
	  padding: 9px;
	  border-radius: 5px;
	  font-size: 0.9rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 94%;
	  height: 20%;
	  background: rgba(0,0,0,0.5);
	  display:block;
	}
	
	.wwd-span-title-hover{
	 color: #fff;
	  padding: 0;
	  border-radius: 5px;
	  font-size: 0.9rem;
	  z-index: 2;
	  position: absolute;
	  bottom: 28px;
	  left: 10px;
	  width: 94%;
	  height: 0;
	  background: rgba(0,0,0,0.5);
      transition: all 0.2s ease-in;
     
	}
	.wwd-span-title-hover > div {
		display:none !important;
	}
	
	 .wwd-item-div:hover .wwd-span-title-hover{
		height: 90%;
		
	}
	 .wwd-item-div:hover .wwd-span-title-hover > div{
		display:flex !important;
		padding:9px;
		
	}
	
	.wwd-item-div:hover .wwd-span-title{
	display:none !important;
	}


}
.news-row{
	margin-left:50px;
	margin-bottom: 60px;
}

.news-item{
	padding:20px;
	 border-bottom: 2px solid transparent;
    border-image: linear-gradient(0.25turn,rgb(253, 253, 250), rgb(198, 194, 195), rgba(245, 244, 247, 0));    
    border-image-slice: 1;
	
}
.news-item:hover{
	background-color:#eff7fc;
}

.news-small-img{
	width: 95%;	
  margin: 0 auto;
  display: block;
  border-radius: 35px;
}


.news-title{
font-size: 1.2rem; font-weight:bold;
}

@media (min-width: 992px) and (max-width: 1199.98px)  { 
	.news-title{
		font-size:0.8rem; font-weight:bold;
	}
}

.carousel-indicators {
  display: flex !important;
  position:static !important;
  justify-content: center !important;
  margin-top: 15px !important;
}

.carousel-indicators div {
  width: 12px !important;
  height: 12px !important;
  border-radius: 50% !important;
  background-color: gray !important;
  margin: 0 5px !important;
  cursor: pointer !important;
  transition: background-color 0.3s !important;
}

.carousel-indicators .active {
  background-color: darkgray !important;
}

.carousel-indicators div:hover {
  background-color: lightgray !important; 
}



.main-slider-controls{
	position:absolute !important;
}



.all-news-link, .all-news-link:hover, .all-news-link:visited, .all-news-link:active{

  text-decoration: none;
  margin-bottom: 40px;
  display: block;
  margin-top:40px;
  }

.all-link-dark, .all-link-dark:hover, .all-link-dark:visited, .all-link-dark:active{
	color: #373636;
}

.all-link-light, .all-link-light:hover, .all-link-light:visited, .all-link-light:active {
	color: #fff;
}


#carouselNews img {
	border-radius: 15px;
	background: var(--overlay, linear-gradient(195deg, rgba(255, 255, 255, 0.00) 42.94%, #01477D 89.37%));
	
}

#carouselNews .carousel-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(195deg, rgba(255, 255, 255, 0) 42.94%, #01477D 89.37%);
  z-index: 1;
}

#carouselNews .carousel-item {
  position: relative;
}

#carouselNews img {
  width: 100%;
  z-index: 0;
  position: relative;
}

.carousel-text {
  position: absolute;
  z-index: 2; /* Higher than the gradient and image */
  color: white;
  font-size: 24px;
  font-weight: bold;
  top: 75%;
  left: 50%;
  transform: translate(-50%, -50%); /* Center the text */
  text-align: center;
  padding: 0 20px; /* Optional: to avoid text touching the edges */
  width: 100%; /* Optional: to make sure text is contained within the image */
}

.carousel-text a, .carousel-text a:visited , .carousel-text a:hover, .carousel-text a:active {
	text-decoration:none;
	color:#fff;
}

.news-item a, .news-item a:hover, .news-item a:visited, .news-item a:active {
	text-decoration:none;
	color:#212529;
}

.news-date{
	text-align:center;
	margin:5px;
	color:#989ea0;
}

.events-row{

  	/*padding: 10px 0 25px 0;*/
  	padding-bottom:25px;
    background: #01477d url('/ar/assets/images/messions-vesions.png') no-repeat left bottom;
	background-size: cover;
	padding: 10px 0 25px 0;
}

.event-row-title{
	color:#fff;
	margin-bottom: 80px;
}

.event-item-div{
	background-color:#fff;
	height:100%;
	/*width:20%;*/
	margin:0 10px;
	border-radius: 15px;
	position:relative;
}

.event-date{
	text-align:center;
	color:#c2c2c2;
	font-size:0.8em;
}

.event-title{
	font-weight:bold;
	font-size:1.25rem;
	color:#000;
	min-height:100px;
	padding-top: 5%;
}

.event-cont{
	font-size:1.0rem;	
	min-height:150px;
}

.event-icons{
	
}

.event-date-abs{
	position:	absolute;
	left:8px;
	top:-35px;
	background-color:#01477D;
	width:25%;
	color:#fff;
	border-radius: 5px;
}

.day-name{
	font-size: 0.7em;
}
.day-no{
	font-size: 1.5em;
}
.month-name{
	font-size: 0.7em;
}

.event-item-devider{
	display:block; height:25px;
}

.past-event{
	background-color:#c0c0c0;
}

.upcomming-event{
	background-color:#01477D;
}

.next-event{
	background-color:#F1A334;
}

.event-read-more{
	font-size:0.8em;
}

.next-event-full-div{
	 width:20%;
	 scale:	100%;
	 transition: all 0.2s ease-in;

}
.next-event-full-div:hover{
	 /*transform: scale(1.1 1.5 1.2);*/
	 width:25%;
	 margin-top: 20px;
}

.event-item-div {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    transform: scale(1); /* Initial scale (normal size) */
}

@media (min-width : 767.99px){
	.event-item-div:hover {
	    transform: scale(1.1); /* Enlarge on hover */
	    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3); /* Optional: Add shadow for emphasis */
	}

}

#carouselEvents .carousel-inner {
  position: relative;
  width: 100%;
  overflow:visible;
}

@media (min-width : 991.99px){
	/*.ann-item{
		width:70%;
	}*/
}


@media (max-width : 575.99px){
	.ann-date{
	/*background-color: #F1A334;*/
  color: #fff;
  padding: 10px 15px;
  }
	
}

@media (min-width : 576px){
	.ann-date{
	/*background-color: #F1A334;*/
  color: #fff;
  padding: 10px 15px;
  /*width:12%;*/
  }
	
}

.ann-date-title-sep{
	padding: 20px;
  border-bottom: 2px solid transparent;
  border-image: linear-gradient(0.25turn,rgb(253, 253, 250), rgb(198, 194, 195), rgba(245, 244, 247, 0));
    border-image-slice: 100%;
  border-image-slice: 1;
  width:50%;
}

.ann-titl-cont:hover{
	background-color:#fff8ce;
}

.ann-titl-cont::before {
  content: '';
  position: absolute;
  top: 0;
  left: 5px;
  width: 2px;
  height: 100%;
  background: linear-gradient(to bottom, #fff 10%, #01477f 50% , #fff 90%);
  z-index: 1;
}

.ann-title a, .ann-title a:hover, .ann-title a:visited, .ann-title a:active{
	color:#000;
}

.num-row{
	background: url('/ar/assets/images/wdc-numbers-bg.jpeg');
	background-attachment: fixed;
	background-size: cover;	
	min-height:684px;
	color:#fff;
	font-family: 'Poppins-bold'; 
	position: inherit;
	z-index: 3;
}

.num-title{
		
}

.num-item-title , .num-text{
	font-family:'Poppins';
	
}

.blue-row{
	background-color: #c8e2ed;
	min-height:387px;
}

.overlay {
  position: absolute; /* Positions it above the image */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(52, 108, 151, 0.5); /* Black with 50% opacity (you can change the color) */
  opacity: 0.5; /* Overall opacity of the overlay */
}


.blue-1{
	color:#01477D; 
	font-family: 'Poppins';
	font-size:3.3rem;
	font-weight: bold;
}
.blue-2{
	color: rgba(0,0,0,0.7);
	font-size:1.4rem;
	text-align: justify;
	padding:5px 20px;
}

blue-3{
	
}

@media (max-width : 991.99px){
	.blue-img{
	width:50%;
	margin:0 auto;
	display: block;
  }
	
}

@media (min-width : 992px){
	.blue-img{
	width:100%;
  }
	
}

.success-row{
	background:#edf5fa;
}
.success-item-div{
	border-radius:10px;
	background-color:#fff;
	margin-top: 1.5rem !important;
  	margin-bottom: 4.3rem !important;
}

.success-name{
	font-weight:bold;
}

.success-position{
	color:#717171;
	font-size:1.0rem;
}

.success-text{
  padding:0.5rem 2rem;
  	font-size:1.0rem;

}

.quote-pic{
  position: absolute; /* Positions it above the image */
  top: 10px;
  right: 10px;
  width:29px;
  height:21px;
  background: url('/ar/assets/images/quote.png');
}


.map-row{
	background-color:#01477D;
	color:#fff;
}

.map-title{
	font-size: 2.5rem;
	margin: 30px 0;
  font-family: poppins-bold;
  padding: 0 20px;
  /*margin-bottom: 75px;*/
}
.map-text{
	font-size: 1.8rem;
	margin-bottom: 75px;
}

 .map-container {
      width: 100%;
      max-width: 900px;
      margin: 0 auto;
    }

    svg {
      width: 100%;
      height: 650px;
    }

    .country {
      fill: #ccc;
      stroke: #333;
      stroke-width: 0.5;
      transition: fill 0.3s;
    }

    .country:hover {
      fill: #00aaff;
    }

   
    .tooltip {
      position: absolute;
      background-color: #333;
      color: #fff;
      padding: 8px;
      border-radius: 4px;
      font-size: 14px;
      display: none;
      pointer-events: none;
    }
	
	.country {
      fill: #ccc;
      stroke: #333;
      stroke-width: 0.5;
      transition: fill 0.3s;
    }

    .country:hover {
      fill: #00aaff;
    }

    .country-label {
      font-family: Arial, sans-serif;
      font-size: 12px;
      fill: #fff;
      pointer-events: none; /* Ensures the text doesn't block mouse events */
    }
    
     .country-label-black{
      fill: #000;
     }
     
     .country-label-white{
      fill: #fff;
     }
     
     .country-label-gray{
	   fill: #aaa
}


    
.small-country-label{
	font-size:0.7rem;
}
    
#my_dataviz {
  transition: all 0.3s ease; /* Smooth transition for margin and scale */
  overflow: hidden;
  z-index: 0;
  margin-bottom: 60px;
}

.map-info-last-update{
	text-align: end;
	color: rgba(255,255,255,0.8);
}


/*


@media (min-width: 1700px) {
  #my_dataviz {
    margin-left: -2%;
  }
}

@media (max-width: 1699px) and (min-width: 1600px) {
  #my_dataviz {
    margin-left: -6%;
  }
}

@media (max-width: 1599px) and (min-width: 1500px) {
  #my_dataviz {
    margin-left: -10%;
  }
}

@media (max-width: 1499px) and (min-width: 1400px) {
  #my_dataviz {
    margin-left: -14%;
  }
}

@media (max-width: 1399px) and (min-width: 1300px) {
  #my_dataviz {
    margin-left: -20%;
  }
}

@media (max-width: 1299px) and (min-width: 1100px) {
  #my_dataviz {
    margin-left: -36%;
  }
}

@media (max-width: 1099px) and (min-width: 900px) {
  #my_dataviz {
    margin-left: -56%;
  }
}

@media (max-width: 899px) and (min-width: 700px) {
  #my_dataviz {
    margin-left: -88%;
  }
}

@media (max-width: 699px) and (min-width: 550px) {
  #my_dataviz {
    margin-left: -82%;
    scale: 0.7;  }
}


@media (max-width: 549px) {
  #my_dataviz {
    margin-left: -100%;
    transform: scale(0.7); /* Apply scale transformation */
  }
}

*/

#socialMedia i {
	font-size:1.2rem;
}

.logo-footer{
  margin: 0 auto;
  margin-bottom: 10px;
}

.footer-logo-text{
	width: 44%;
  display: block;
  margin: 0 auto;
  font-size: 0.8rem;
  text-align: justify;
  color: rgba(255,255,255,0.8);
  }
  
  
  

#footer
{
	background-color: #01477f;
	padding: 30px;
	color:  rgba(255,255,255,1.0);
	font-size: 1rem;;
}

#footer #socialMedia
{
	padding-bottom: 20px;
}

#footer #socialMedia a
{
	color: #fff;	
	margin: 0 10px;	
	position: relative;
	overflow: hidden;
	display: inline-block;
}

#footer i
{
	color: #fff;	
}

.contact-icon{
	font-size: 1.2rem;
  margin-right: 10px;
  color: #fff;
}

#footer a, #footer a:visited
{
	/*text-decoration: none;*/
	color: #fff;
}

.footer-title
{
font-weight: bold;
	color: #fff;
	font-size: 1.2rem;
	margin-bottom: 16px;
	text-align:left;
}


#footer ul
{
	/*list-style: none;*/
	padding: 0 0 0 16px;
}

#footer ul li
{
	padding: 0 0 10px 0;
		/*border-bottom: solid 1px #6b7ab5;*/
}


#footer ul li a, #footer ul li a:visited  
{
	color:  rgba(255,255,255,1.0);
	/*font-family: gotham_light;
	text-decoration: none;*/
	transition: all ease 0.3s;
	display: inline-block;
	
}


#footer #socialMedia a{
	font-size: 1.5rem;
	padding-top: 10px;
}

 .hover-effect {
     position: relative;
     text-decoration: none;
     color: #000;
    /* font-weight: bold;*/
 }
 .hover-effect:hover{
	text-decoration:none;
}

     .hover-effect::after {
         content: '';
         position: absolute;
         left: 0;
         bottom: 0;
         width: 0;
         height: 2px;
         background-color: #6aa9da;
         transition: width 0.3s ease;
     }

     .hover-effect:hover::after {
         width: 100%;
     }



.copy-row::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
  	     height: 2px;
  		background: linear-gradient(to right, #01477f 25%, white, #01477f 75%);
  	   z-index: 1;
    }
    
.copy-row{
 	position: relative;
	background-color: #01477f;
  	padding: 30px;
  	color: rgba(255,255,255,0.8);
  	font-size: 11pt;  
}

 .copy-row > * {
        position: relative; /* Ensures child elements are above the pseudo-element */
        z-index: 2;
    }
    
    
.site-title a, .site-title a:visited
{
	color: #fff;
	text-decoration: none;
	text-transform: capitalize;
}


#searchDiv
{
	
	width: auto;
}

#searchDiv .input-group-append
{
	background: rgba(255,255,255,0.8);
}

#searchDiv .input-group-append button
{
	background: rgb(179, 204, 242);
	border: 0;
	color: #000;
	height: 40px;
}


#searchDiv {
            display: none;
            opacity: 0;
            transition: opacity 0.5s ease-in-out;
        }
#searchDiv.visible {
    display: flex;
    opacity: 1;
}
.signin {
    position: relative;
}
#searchDiv {
    position: absolute;
   top: 57%;
  left: 12%;   
  transform: translateX(-50%);
    margin-top: 10px;
    z-index: 1000;
}


#txtSearch{
	background-color: rgb(255, 255, 255);
	border-right: 0px solid #ababab;
  border-bottom: 1px solid #d0c7c7;
  border-top: 0;
  border-left: 1px solid #d0c7c7;}

@media (max-width: 1399.98px) {
	#searchDiv{
	right:-11%;
	}
}


@media (max-width: 768px) {  
		
	.title
	{
	  	font-size: 30pt;
	}	
}



/* Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) { 
	
	.title
	{
	  	font-size: 30pt;
	}
	
	
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {  

	
	.title
	{
	  	font-size: 30pt;
	}
		
}


/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) { 
	.site-title a, .site-title a:visited
	{
		font-size: 25px;
	}
	.title
	{
	  	font-size: 30pt;
	}		
}

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 
	
	.site-title a, .site-title a:visited
	{
		font-size: 32px;
	}	
	
	.title
	{
	  	font-size: 45pt;
	}			
}


.has-sub-menu a {
	display: flex;
}

.2nd-sub-menu a {
	display: flex;
}

.signin {
	position:relative;
	
}

.signbtn{
	margin-left:10px;
}
.signbtn a , .signbtn a:hover , .signbtn a:visited  {
	color: #fff;
}

.clear{clear:both;}

.page-title{
	padding:20px;
	font-size:2rem;
	text-transform:capitalize;
	
}

.carousel-indicators{
	margin-bottom:0 !important;
}


.map-container {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
  }

  svg {
    width: 100%;
    height: auto;
  }

  .country {
    fill: #ccc;
    stroke: #333;
    stroke-width: 0.5;
    transition: fill 0.3s;
  }

  .country:hover {
    fill: #00aaff;
  }


.tooltip-more-info-link , .tooltip-more-info-link:hover, .tooltip-more-info-link:active, .tooltip-more-info-link:visited, .tooltip-more-info-link:focus {
	color:#fff;
	float:right;
}
  
.table , .table-striped , .table-striped > tbody > tr:nth-of-type(2n+1) > * {
  color: #fff;
}
  .map-info-container{	
	 padding:15px 5px 0 5px;
	min-height: 252px;	
}
.map-info-div{	
	color: #fff; 
	padding: 0 8px; 
	border-radius: 4px; 
	font-size: 14px;	
	margin-bottom:60px;
	display:none;
	height:auto;
	
}

.map-info-row{
	color:#FFF !important; 
	background-color: #00aaff; /*rgba(255,255,255,0.4); */
	padding-bottom: 10px;
	height:100%;
}

.map-info-t1{
	font-weight:bold;
		padding-left:1.5rem;
		margin-bottom: 5px;
	display:block;
	font-size: 1.0rem;
}
.map-info-t2{
	display:block;
	padding-left:2.5rem;
	margin-bottom: 5px;
	font-weight:bold;
}

.map-info-t3{
		padding-left:3.5rem;
		margin-bottom: 5px;
		display:block;
}

.contact-form .input-group-text {
  background-color: #589de1;
}

.contact-form input[type="text"] {
  border: 0;
  border-bottom: 1px solid #fff;
  background-color: #338cd0;
  color: #fff;
}

.contact-form .input-group-text {
  border: 0;
  background-color: #338cd0;
  color:#fff;
  align-items: start;
}

.contact-form .form-control::placeholder {
  color: #fff;
}

.contact-form .btn-light {
  color: #807474;
  }
  
.contact-social-media a {
  font-size: 1.5rem;
  padding-top: 10px;
    color: #3b5375;
  margin: 0 10px;
  position: relative;
  overflow: hidden;
  display: inline-block;

}

.contact-form .form-control {
  background-color: #338cd0;
}

.team span {
    display: block;
}

.team .position {
    font-size: 1.0rem;
    font-style: italic;
}

.team .name {
    font-size: 1.2rem;
    font-weight: bold;
    margin-bottom: 10px;
}

.team .email {
    font-size: 0.8rem;
}

.team .phone {
    font-size: 0.8rem;
}

.img-rounded {
    border-top-left-radius: 1.0rem !important;
    border-top-right-radius: 1.0rem !important;
    aspect-ratio:6/6;
    width:100%;
}

.team-card {
    padding-bottom: 20px;
    border: 0;
    border-bottom: 3px solid #000;
}
.team-card-green {
    border-bottom: 3px solid #48b790;
}
.team-card-blue {
    border-bottom: 3px solid #316b97;
}

.social-education a {
  color: #797979;
  margin-right: 0.8rem;
  }
  
.btn-primary {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}
.btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  border-radius: .25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.ExternalClass .btn-primary {
color:#fff !important;
background-color:#0d6efd !important;
border-color:#0d6efd !important;
}

.social-education.btn-primary {
color:#fff !important;
background-color:#0d6efd !important;
border-color:#0d6efd !important;
}
