/* Extra small devices (phones) */
@media (max-width: 575.98px) { 
  /* Your CSS rules for extra small devices */
}

/* Small devices (tablets) */
@media (min-width: 576px) and (max-width: 767.98px) { 
  /* Your CSS rules for small devices */
}

/* Medium devices (laptops) */
@media (min-width: 768px) and (max-width: 991.98px) { 
  /* Your CSS rules for medium devices */
}

/* Large devices (desktops) */
@media (min-width: 992px) and (max-width: 1199.98px) { 
  /* Your CSS rules for large devices */
}

/* Extra large devices (large desktops) */
@media (min-width: 1200px) { 
  /* Your CSS rules for extra-large devices */
}



body {
	background-color: #fff;
}

.font-ar-type {
	font-family: 'Almarai', sans-serif;
}

.footer-bg-color {
	background-color: #4F57A6;
}
/* Make the navbar fixed at the top */
.fixed-top {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background-color: #fff; 
}

}



.navbar-brand {
    padding-top: .3125rem;
    padding-bottom: .3125rem;
    margin-left: 1rem;    
    font-size: 1.25rem;
    text-decoration: none;
    white-space: nowrap;
}

.navbar-nav li a:hover {
    color: #4F57A6;
    font-weight: bold;
  }

.logo-img{
	height: 35px;
}

.carousel {
	margin-top: 70px;
}
.nav-top-mar{
	margin-top: 70px;
}

.carousel-inner .mb-5{
	    margin-bottom: 5rem!important;
}

.carousel-indicators-en {
    left: auto !important;
    right: -5rem !important;
    bottom: 8% !important;
}

.carousel-indicators-ar {
    right: auto !important;
    left: -4.75rem !important;
    bottom: 8% !important;
}

.carousel-indicators [data-bs-target] {
    height: 10px !important;
}

.carousel-caption{
	z-index: 2;
}

/* Style for the background overlay */
.slide-background {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%; /* Adjust the height of the background as needed */
  background: linear-gradient(rgba(0,0,0,0) 13%, rgba(0,0,0, .85));
  z-index: 1; /* Place the background above the image */
}

/* Style for the image */
.slider-image {
	height: 700px;
    object-fit: cover;
    object-position: center;
  	display: block;
  	width: 100%;
 	z-index: 0; /* Place the image behind the background overlay */
}



.slider-english-text {
	text-align: left;
	margin-top: 0;
    margin-bottom: .5rem;
/*    font-weight: 500;*/
    line-height: 1.2;
    margin-left: -7%;
/*    margin-right: 0%;*/
    color: white;
}

/* Media query for mobile devices (adjust the max-width as needed) */
@media (max-width: 767px) {
    .slider-english-text {
        font-size: 16px; /* Change the font size for mobile devices */
    }
    .carousel-indicators-en {
    left: auto !important;
    right: 0rem !important;
    bottom: 7% !important;
}

}

.slider-arabic-text {
	text-align: right;
	margin-top: 0;
    margin-bottom: .5rem;
/*    font-weight: 300;*/
    line-height: 1.2;
    margin-right: -6%;
/*    margin-left: 0%;*/
    color: white;
}

/* Media query for mobile devices (adjust the max-width as needed) */
@media (max-width: 767px) {
    .slider-arabic-text {
        font-size: 16px; /* Change the font size for mobile devices */
    }
    .carousel-indicators-ar {
    right: auto !important;
    left: 0rem !important;
    bottom: 8% !important;
}
}




.footer {
	color: black;
	padding: 20px;
	bottom: 0;
	left: 0;
	width: 100%;
	display: block;
}
 ul.my-custom-list {
    list-style: none; /* Remove the default bullet point */
}
.my-custom-list a {
	color: #ffff;
}
.my-custom-list a:hover {
	text-decoration: underline;
	font-weight: bold;
}


 ul.my-custom-list2 {
    list-style: none; /* Remove the default bullet point */
}
.my-custom-list2 a:hover {
	color: #4F57A6;
	text-decoration: underline;
}


.form-design{
	padding-bottom: 10px;
}

.footer-img {
	height: 60px;
	padding-top: 10px;
}

.text-center2 a{
	color:#4F57A6;
	font-weight: bold;
}

.text-center1 a{
	color:#ffff;
	font-weight: bold;
}

.text-center1 a:hover{
	text-decoration: underline;
}

.text-center1 {
	color:#ffff;
}


a {
	color: #8A9298;
	text-decoration: none;
}


.ss1 a {
	color: #4F57A6;
	text-decoration: none;
}

.ss2 a {
	color: #4F57A6;
	text-decoration: none;
}

.sss2 a {
	color: #4F57A6;
	text-decoration: none;
}

.card-title {
	color: black;
	font-weight: bold;
	font-size: 0.96rem;
	margin-top: 5px;
	padding-bottom: 3px;
/*	padding-left: 5px;*/
}

.card-title a{
	color: black;
/*	font-size: 0.75rem;*/
}

.card-title a:hover {
    text-decoration: underline; /* Add underline on hover */
}

.card-title-s{
	padding-top: 10px;
	padding-right: 5px;
}

.card-title-s2{
	padding-top: 2px;
	padding-right: 2px;
}



.card-img-top-2 {
	height: 250px;
	width: 250px;
	display: block;
}

@media (max-width: 767px) {
    .card-img-top-2{
	height: 350px;
	width: auto;
	display: block;
}
    }



.img-the-latest{
	height: 160px;
/*	width: 400px;*/
	display: block;
}

.img-the-latest:hover{
    transform: scale(1.05);
}

.img-spotlight{
	height: 204px;
	display: block;
}
.img-spotlight:hover{
    transform: scale(1.05);
}

.img-top-initiatives{
	height: 274px;
	display: block;
}
.img-top-initiatives:hover{
    transform: scale(1.05);
}

.img-videos {
	height: 204px;
	display: block;
}
.img-videos:hover{
    transform: scale(1.05);
}

@media (max-width: 767px) {
    .img-the-latest{
	height: 225px;
	width: auto;
	display: block;
}
	.img-spotlight{
	height: 230px;
	width: auto;
	display: block;
}
	.img-top-initiatives{
	height: 245px;
	width: auto;
	display: block;
}
	.img-videos{
	height: 225px;
	width: auto;
	display: block;
}
    }
 
.img-academics{
	height: 200px;
	width: 200px;
	display: block;
}

@media (max-width: 767px) {
    .img-academics{
	height: 325px;
	width: auto;
	display: block;
}
    }

.img-academics:hover{
    transform: scale(1.05);
}

.img-quotes{
	height: 410px;
	display: block;
}

@media (max-width: 767px) {
    .img-quotes{
	height: 322px;
	display: block;
}
    }

.img-quotes:hover{
    transform: scale(1.05);
}

.img-cat-posts{
	height: 200px;
	display: block;
}

@media (max-width: 767px) {
    .img-cat-posts{
	height: 225px;
	width: auto;
	display: block;
}
    }

.img-cat-posts:hover{
    transform: scale(1.1);
}

.img-cat-posts2{
	height: 275px;
	width: 275px;
	display: block;
}

.img-cat-posts2:hover{
    transform: scale(1.05);
}

.video-you iframe{
	height: 480px;
	width: 100%;
}

@media (max-width: 767px) {
    .video-you iframe{
	height: 225px;
	width: 100%;
	display: block;
}
    }

.img-contact-logo{
	width: 20%;
    height:auto;
    padding-bottom: 20px;
}

.contact-pro{
	color: #4F57A6;
}
.contact-pro1{
	color: #4F57A6;
	font-weight: bold;
	padding-top: 30px;
}
.contact-pro2{
	color: #8A9298;
	font-weight: bold;
}

.circle-icon {
  width: 35px;
}

.cun-social {
	padding-top: 31px;
}

.text{
	padding-top: 12px;
	font-weight: bold;
}

.text a{
	color: #8A9298;
}

.text a:hover{
	color: #4F57A6;
}

.text2{
	text-align: left;
	text-align:justify;  
    text-justify:initial;
}

.text3 {
	text-align: right;
	text-align: justify;
	text-justify: initial;
}

.main-post {
	position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
}

 
 .bar-2 {
 /*	margin-bottom: -5px;
 	margin-top: -5px;*/
 	padding-right: 2rem;
 }

.ss1{
	margin-bottom: 20px;
	font-weight: bold;
}


.ss1:hover{
text-decoration: underline; /* Add underline on hover */
}

.ss2{
	margin-bottom: 20px;
	font-weight: bold;
	padding-right: 2rem;
}

.sss2{
	padding-right: 2rem;
}

.ss2:hover{
text-decoration: underline; 
}

.s1 {
	margin-top: 20px;
	margin-bottom: 40px;

}

.s2-en {
	margin-top: 20px;
	margin-bottom: 40px;
}


.s2-ar {
	margin-top: 20px;
	margin-bottom: 40px;
	margin-right: 20px;
}


.s3-en {
	margin-left: -20px;
}

/*.post-col-3ar {
	background-color: #4F57A6;
}

.post-col-3en {
	background-color: #337ab7;
}*/


.post-col-9en{
	padding-left: 0rem;
}

.post-col-9ar{
	padding-right: 1rem;
}

@media (max-width: 767px) {
    .post-col-9ar{
	padding-right: 0rem;
}
}



.recent-news{
	margin-top: 30px;
	margin-bottom: 8px;
}
.recent-news h4{
	font-weight: bold;
	color: #4F57A6;
	padding-right: 5px;
}

.rand-post {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: var(--bs-card-height);
    word-wrap: break-word;
    background-color: var(--bs-card-bg);
    background-clip: border-box;
}

.main-post-s {
	background-color: #fff;
	width: 100%;
	position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-clip: border-box;
    border-radius: .25rem;
}

.recent-news-s {
	background-color: #fff;
	width: 100%;
    word-wrap: break-word;
    background-clip: border-box;
}

.post-img{
    position: relative;
    width: 100%;
    padding-bottom: 20px;
    overflow: hidden;
 }

 .main-post-s .post-edit-link {
 	position: absolute;
 	top: 0;
 	right: 0;
 	padding: 10px;
 	background-color: #EEE;
 	border-radius: 0 0 0 10px
 }

 .main-post-s .post-edit-link i {
 	color: #337ab7;
 	margin-left: 5px
 }

.image-container {
    position: relative;
    text-align: center;
}

.img-play {
	width: 50px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #f2f2f2; /* Adjust the color of the icon */
}

.img-play2 {
	width: 50px;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #f2f2f2; /* Adjust the color of the icon */
}

.img-play3 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


