@import url('https://fonts.googleapis.com/css2?family=Zain:ital,wght@0,200;0,300;0,400;0,700;0,800;0,900;1,300;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&display=swap');


body {

  background-color: #F5FFFA !important;
  
}

* ,h1 ,h2 ,h3 ,h4 ,h5 ,h6{
  font-family: "Zain", sans-serif;
  font-weight: bold;
  font-style: normal;
  
}

p{
  /* font-family: 'Amiri Quran', serif; */
   
}

.navbar{

}

.navbar{
  position: absolute;
  z-index:1;
  width:100%;
  background-color: rgb(0, 0, 0 , 37%);
  z-index: 10;
}

.navbar .nav-item{

}

.navbar .nav-item a{
  text-decoration: none;
  margin:  0px 5px;
}


.HomeSlider{
  max-height: 100vh !important;
  min-height: 100vh !important;
}

.HomeSlider .uk-slideshow-items{
  max-height: 100vh !important;
  min-height: 100vh !important;
}

.HomeSlider .uk-slideshow-items .uk-slideshow-items{
  max-height: 100vh !important;
  min-height: 100vh !important;
}

.HomeSlider .uk-slideshow-items ul li{
  max-height: 100vh !important;
  min-height: 100vh !important;
}

.HomeSlider .uk-slideshow-items ul li img{
  width: 100%;
  
}

.About-oau .main h2{
  font-size: 80px;
  font-family: 'Zain', sans-serif;
  font-weight: bold;
}

@media only screen and (max-width: 600px) {
  .About-oau .main h2{
    font-size: 40px;
    font-family: 'Zain', sans-serif;
    font-weight: bold;
  }
}

@media (min-width: 320px) and (max-width: 480px) {
  .About-oau p{
    font-size: 14px !important;
    text-align: justify;
  }


  .About-oau .main-x{
    font-size: 20px !important;
  }

  .news .news-title{
    font-size: 18px;
  }

  .news p{
    font-size: 14px !important;
  }
}

.main{
  width: 100%;
  margin:10px auto;
  padding: 10px;
  background: #fff;
  text-align: center;
}
.About-oau .main h2{
  position:relative;
}
.About-oau .main h2:after{
  content:"";
  width: 2px;
  height: 100%;
  background: #333;
  position: absolute;
  opacity: 0;
  animation:cursor 0.5s infinite;
}
@keyframes cursor{
  0%{
    opacity: 0;
  }
  100%{
    opacity: 0;
  }
}

/*.About-oau p*/
.About-oau p{
  font-size: 22px;
  text-align: justify;
}



/*news Section*/
.news{

  margin-top: 80px;
  background-color: #dfdfdf; background: linear-gradient(0deg, #dfdfdf 0%, white 100%); margin-top: 100px;
}

.news .news-title{
  text-align: center;
  font-family: 'Zain', sans-serif;
  font-weight: bold;
  padding: 20px 0px;
}

.news .uk-card-media-top p{
    position: absolute;
    z-index: 1;
    bottom: -24px;
    background: #06914478;
    width: 100%;
    padding: 20px;
    color: #FFF;
}

.uk-hidden-hover{
  background: linear-gradient(to right, #a18e16 0%, #02a125 100%);
  width: 40px;
    height: 40px;
    text-align: center;
    padding: 10px;
    border-radius: 50%;
}

.read-more-news{
  padding: 50PX 0PX;
}

.read-more-news span{
  background-color: #17aa50;
  padding: 10px 15px;
  color: #FFF;
  font-weight: bold;
  
}
.read-more-news span:hover{
  cursor: pointer;
  background: linear-gradient(to right, #a18e16 0%, #02a125 100%);

}

/* statstics Section*/
.statstics{
  margin-top: 100px;
  background-color: #17aa50;
}

.statstics .icons-statistic{

  padding: 50px 0px;
}

.statstics .icons-statistic i{
  font-size: 100px;
  color: #FFF;
}

.statstics .icons-statistic {
  font-size: 30px; ;
  color: #FFF;
}

.statstics .icons-statistic p {
  margin: 0;
}

/*Oau-Services*/
.oau-services{
  margin-top: 100px;
  background: url(../uploads/img/oau.jpg) no-repeat center center fixed;
  position: relative;
  color: #FFF;
  margin-top: 0px;
  padding-bottom: 100px;
 }

.oau-services .overlay{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgb(23 170 80 / 58%);

}

.oau-services .title-services{
  text-align: center;
  font-family: 'Zain', sans-serif;
  font-weight: bold;
  padding: 20px 0px;
  color: #FFF;
  z-index: 10;
}

.oau-services .card-title{
  text-align: center;
  font-size: 100px;
}

.oau-services .card{
  margin-bottom: 20px;
  border-top: 3px solid #00c851;
}

.oau-services .card p{
  margin-bottom: 10px;
  background-color: #17aa504d;
  color: #333 !important;
  padding: 15px 0px ;
  text-align: center;
  font-weight: bold !important;

}

.oau-services .card p a{
  margin-bottom: 10px;
  color: #333 !important;
  padding: 15px 0px ;
  text-align: center;
  font-weight: bold !important;
  text-decoration: none;

}

.oau-services .card p:hover{
  margin-bottom: 10px;
  background-color: #5f5f5f;
  color: #FFF !important;
  padding: 15px  0px ;
  font-weight: bold;
  cursor: pointer;
}

.oau-services .card p a:hover{
  margin-bottom: 10px;
  background-color: #5f5f5f;
  color: #FFF !important;
  padding: 15px  0px ;
  font-weight: bold;
  cursor: pointer;
}


.footer{
  position: relative;
  /* margin-top: 50px; */
  /* background-image:url(../uploads/img/002.jpg); */
  /* background-color: #17aa50;*/
  background-repeat: no-repeat;
  background-size: contain;
  padding: 40px 0;
  border-top: 2px solid #17aa50;
}


/* .footer .overlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: rgba(2,2,2,0.75);
} */

.footer .overlay .container{
  z-index: 11;
}

.footer .related-links h3{
  font-family: 'Zain', sans-serif;
  font-weight: bold;
  font-size: 24px;
  /* color: #FFF; */
 
}

.footer .related-links h3:after {
  display: inline-block;
  margin: 0 0 8px 20px;
  height: 3px;
  content: " ";
  text-shadow: none;
  background-color: #17aa50;
  width: 40px;
}
.footer .related-links h3:before {
  display: inline-block;
  margin: 0 20px 8px 0;
  height: 3px;
  content: " ";
  text-shadow: none;
  background-color:#17aa50;
  width: 40px;
}

 
.footer .related-links p{
  margin: 0px;
  padding: 15px 0px;
  /* color: #FFF; */
  /* border-bottom: 1px solid #EEE; */
  font-size: 16px;
  font-weight: bold;
  
}

.footer .related-links p span{
  margin-right: 10px;
  /* padding: 15px 0px; */
  /* color: #FFF; */
  /* border-bottom: 1px solid #EEE; */
  font-size: 16px;
  font-weight: bold;
  
}

.footer .related-links p:hover{
  background-color: #17aa50;
  color: #FFF;
  padding-right: 5px;
  cursor: pointer;
  transition:   .8s ease-in-out;
  transition:   .8s ease-out;

}

.footer .related-links img{
  
}

.footer .sosial-media{
  text-align: center;
  font-size: 30px;  
}

.footer .sosial-media .fa-facebook-f{
  color: #1773ea;
}

.footer .sosial-media .fa-youtube{
  color: #f70000;
}

.footer .sosial-media .fa-linkedin{
  color: #006394;
}

.footer .sosial-media .fa-whatsapp{
  color: #45c253;
}

.footer .sosial-media span{
  margin: 40px  ;
}

.copyright{
  background-color: #168a42;
  padding:  20px;
  text-align: center;
  color: #FFF;
 
}




/*Colleges Section Css*/
.colleges-services{
  margin-top: 100px;
  background: url(../uploads/img/oau.jpg) no-repeat center center fixed;
  position: relative;
  color: #FFF;
  margin-top: 0px;
   
 }

.colleges-services .overlay{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgb(17 18 17 / 58%);

}

.colleges-services .title-colleges{
  padding: 100px 0;
  font-family: 'Zain', sans-serif;
  font-weight: bold;
  /* font-size: 24px; */
  color: #FFF;
  z-index: 2;
  text-align: center;
}

.All-colleges{
  margin-top: 100px;
  font-family: 'Zain', sans-serif;
  margin-bottom: 100px;
  
}

.All-colleges .uk-card{
  cursor: pointer;
}

.All-colleges .colleges-name{
  font-size: 22px;
  font-family: 'Zain', sans-serif;
  text-align: center;
  font-weight: bold !important;
}

.All-colleges .description{
 padding:  0px 20px 20px 20px
}

.All-colleges .col-sm-4{
  margin-bottom: 40px;
}










/* toTop */
.toTop {
  /* background: linear-gradient(to right, #a18e16 0%, #465102 100%); */
  background: linear-gradient(to right, #17aa50 0%, #1e1e1e 100%);
  color: #fff;
  position: fixed;
  bottom: 10px;
  right: -60px;
  width: 50px;
  height: 50px;
  cursor: pointer;
  line-height: 52px;
  border-radius: 100%;
  text-align: center;
  z-index: 35;
  -webkit-transition: all .3s ease;
  transition: all .3s ease;
  -webkit-box-shadow: 0 0 15px 5px rgb(0 0 0 / 7%);
  box-shadow: 0 0 15px 5px rgb(0 0 0 / 7%);
  font-size: 17px;
}

.toTop:hover{
  background: linear-gradient(to right, #a18e16 0%, #02a125 100%);

}