@import "https://use.fontawesome.com/releases/v5.5.0/css/all.css";

/*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;600;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;600;700;800&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;600;700;800;900&display=swap');
/*@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;800&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');


/*{
    font-family: 'poppins', sans-serif; 
}*/

.topcontainer{
    background-color: #17a2b8 !important;
    margin-bottom: 60px;
    top: 0;
    bottom: 0;
}

.xyz{
    background-color: #17a2b8 !important;   
}

.restog{
    background: #ffc107 !important;color: #fff !important; 
}

body{
    box-sizing: border-box;
    padding: 0;
    margin: 0;
    font-family: 'Poppins', sans-serif;
    background: #ECECEC;
}
 

.top{
    height: 25px;
    border-bottom: 1px solid #4F4F4F;
}

.top h4{
    font-size: 10px;
    letter-spacing: 0.1em;
    line-height: 29px;
    color: white; 
    padding-left: 10px;
}

#time{
    margin-left: 3px;
}

.naxvbar{
    font-size: 20px;
    position: fixed;
    cursor: pointer;
    position: sticky;
}

.navbar-heading{
    color: #fff!important;
    font-size: 23px;
    text-transform: uppercase;
    font-weight: bold;
}

.navbar-heading:hover{
    text-decoration: none;
}

.nav-item{
    padding: 0 5px;
    text-transform: uppercase;
    line-height: 30px;
}

.nav-link{
    color: rgb(220, 229, 243)!important;
    font-weight: bold;
    font-size: 13px !important;
}

.dropdown, .dropdown a{
    /*color: rgb(220, 229, 243)!important;*/
    color: #fff;
    font-weight: bold;
    font-size: 13px !important;
}

.slidingImg{
    /*border: 2px solid red;*/
    margin-top: 3px;
}

.sldTitle{
    font-weight: bold;
}

.sldTitleDesc{
    font-weight: bold;
    letter-spacing: 0.5px;
}

/* If the screen size is 1200px wide or more*/
@media (min-width: 1200px) {
  .sldTitle {
    font-size: 30px;
  }

  .sldTitleDesc {
    font-size: 15px;
  }
}
/* If the screen size is smaller than 1200px*/
@media (max-width: 1199.98px) {
    .sldTitle {
    font-size: 25px;
  }

  .sldTitleDesc {
    font-size: 10px;
  }
}

.slideCaptn{
    position: absolute;
    background: #171717; 
    opacity: 0.7;
    margin-top: 50px;
    height: 100px;
}

.pag-word{   
    margin-top: 10vh;
    /*border: 2px solid blue;*/
}

.pag-word h3{
    text-transform: uppercase;    
    margin-bottom: 3vh;
    font-weight: 600;
    text-align: center;
    font-size: 35px;
}

.pag-word h5{
    text-align: justify;
    font-size: 17px;
}

.pag-departments{   
    margin-top: 8vh;
    /*border: 2px solid red;*/
}

.pag-departments h3{
    text-transform: uppercase;    
    margin-bottom: 5vh;
    font-weight: 600;
    text-align: center;
    font-size: 22px;
}

.x{
   /*border: 2px solid green;*/
    height: auto;
}

.dept{
    box-shadow: 0 2px 5px #9798AA;
    margin-left: auto;
    margin-right: auto;
    /*border: 1px solid black;*/
}

.dept h4{
    text-align: center;
    padding: 20px;
}

.dept h5{
    text-align: center;
    padding: 20px;
    text-align: justify;
    font-size: 15px;
}

.Askofu{

}

.head-img{
    /*border: 1px solid black;*/
    border: 0.4px solid #EBEBEB;   
}

.head-words{
    /*border: 1px solid black;*/
    border: 0.4px solid #EBEBEB;
    padding: 15px;
}

.head-words p, .faithr p{
    text-align: justify;
    font-size: 15px;
    color: #000;
}

.news, .events{
   /* border: 1px solid black;*/
}

.rnews, .revents, .qlinkshd{
    background: #343A40 ;
    padding: 10px;
    color: rgb(220, 229, 243);
    font-size: 13px;
}

.qlinkshd{    
    font-size: 14px;
}

.events{
   border-left: 1px solid #C6C6C6;
}

.news h3, .events h3{
    text-transform: capitalize;    
    margin-top: 3vh;
    margin-bottom: 3vh;
    font-weight: 600;
    text-align: center;
    font-size: 17px;
}

.newsEvents{
    /*border: 1px solid red;*/
}

.evnts{
    height: auto;
    /*border-bottom: 1px solid #C6C6C6;*/
    padding: 20px;
}

.smedia{
    justify-content: center !important;
    text-align: center;
    height: auto;
    border-bottom: 1px solid #C6C6C6;
    padding-bottom: 5px;
    margin-top: 50px;
}

.qlinks{
    padding-bottom: 5px;
    margin-top: 40px;
}


/*.qlinks a, .smedia a{
    margin-top: 5px;
    list-style: disc;   
}*/

.qlinks a, .smedia a{
    font-size: 13px;
    padding-left: -20px;
    margin-top: 5px;
    font-family: 'Poppins', sans-serif; 
    color: #000; 
    text-align: justify;  
}

.smedia a i{
    posxition: relative;
    margin-right: 25px; 
    font-size: 23px;   
}

.qlinks a:hover, .smedia a:hover{
    text-decoration: none;
}

.card{
    margin-top: 8px;"
    mardgin-bottom: 8px;"
    text-align: justify;
    font-size: 13px;
    color: #000;
}

.areas{
    font-size: 15px;
    color: #000 !important;
    background: #C7C4C4;
    padding: 5px;
    opacity: 0.8;
}

.collapse{
    margin: 0;
    padding: 0;
    text-align: justify;
}

.nws{
    height: auto;
    width: 100%;
    /*border-bottom: 1px solid #f00;*/
    padding-bottom: 5px;
}

.nws h5, .evntDescrptn h5{
    font-size: 17px;
    font-weight: bold;
    margin-top: 10px;
    border-left: 5px solid #000;
    padding-left: 20px;
}

.hod h4{
    text-transform: uppercase;
    margin-top: 15px;
    margin-bottom: 10px;
    font-size: 18px;
    font-weight: bold;
    margin-top: 10px;
    text-align: center;
}

.hod h5{
    font-size: 13px;
    margin-top: 10px;
    margin-bottom: 15px;
    text-align: center;
    padding-bottom: 15px;
    color: #626262;
    border-bottom: 2px solid #3B3B3B;
}

.hod p{
    text-align: justify;
    margin-top: 14px;
    font-size: 13px;
    color: #0C0C0C;
}


.uniheader{
    font-size: 25px;
    font-weight: bold;
    margin-top: 25px;
    margin-bottom: 25px;
    padding-left: 20px;
}


.qlinks p, .nws p, .evntDescrptn p, .unip, .faithr ol li, #event1, #event2, #event3, #news1, #news2, #news3, #news4{
    text-align: justify;
    margin-top: 13px;
    font-size: 13px;
    color: #000;
}

.nws h6, .evntDescrptn h6{
    margin-top: 15px;
    marxgin-bottom: 7px;
    font-size: 11px;
    font-style: italic;
    float: right;
    font-family: sans-serif;
    color: #A1A1A1;
    letter-spacing: 0.02em;
    text-transform: capitalize;
}

#event1 h6, #event2 h6, #event3 h6, #news1 h6, #news2 h6, #news3 h6{
    margin-top: 10px;
}

.readmore a, .readmore a:hover{
    font-size: 11px;
    color: #201300;
    text-decoration: none;
}

.readcollapse, .readcollapse:hover{
    font-size: 11px;
    cursor: pointer;
    color: #201300;
    margin-top: 2px;
    padding-left: 5px;
}

.pfaith{
    /*border: 1px solid blue;*/
    margin-top: 20px;
}

.faithl, .faithr{
    /*border: 1px solid red;*/
    height: auto;
}

.faithr{
    border-left: 1px solid #C6C6C6;
}

.dv{
    text-align: center;
    margin-bottom: 15px;
    height: 25vh;
}


.list-group-item-secondary{
    background: #ECECEC !important;
    border-radius: 0px !important;
    border-left: 0px solid #C6C6C6 !important;
    border-right: 0px solid #C6C6C6 !important; 
}

.empty-div{
    /*border: 1px solid blue;*/
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    margin-top: 40px;
    margin-bottom: 40px;
}


/*   * * *  * *  *   *  * * GALLERY *  *  * *  *  * *   *  * * * *  * */


.galConts{
    font-size: 13px;
    text-align: justify;
}

.galleryContainer {
  position: relative;
  width: 100%;
  padding: 10px;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  bottom: 100%;
  left: 0;
  right: 0;
  background-color: #141313;
  overflow: hidden;
  width: 100%;
  height:0;
  transition: .5s ease;
}

.galleryContainer:hover .overlay {
  bottom: 0;
  height: 100%;
  width: 98%;

  /*height: 93.2%; 
  width: 95.4%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 9px;*/
  opacity: 0.8;
}

.text {
  color: white;
  font-size: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 90%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  text-align: center;
}


/*   *  * *  *  *  *  *  EnD  *  *  * *   *  *  *  *  */



.footer{
    margin-bottom: 3px;
    background: #000000;
    opacity: 0.9;
}

.footerLeftSide, .footerRightSide{
    padding: 30px;
}

.unip2{
    color: #efefef; 
    font-size: 15px;   
    opacity: 0.7;
}

.unip2 a i{
    color: #efefef;
}

.unip2 a:hover{
    text-decoration: none;    
}

.twtt:hover{
    color: #00acee;
}

.fcbk:hover{
    color: #3b5998;
    background: #fff;
}

.whtsp:hover{
    background: #08A10B;
    color: #fff;
}

.instgm:hover{
    background: #8a3ab9;
    color: #fff;
}

.mvmContn{
    margin-top: 50px;
    padding: 5px;
}

.mvmInner{
    border-bottom: 5px solid #DE9700;
    padding-left: 6px;
    padding-right: 6px;
}

.mvm{
    top: 8%;
}

.mvmContainer{
    opacity: 0.8;
}

.mvmContainer h3{
    font-size: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    color: #DE9700;
    font-weight: 600;
    text-align: center;
}

.mvmContainer p{
    padding: 15px;
    font-size: 13px;
    text-align: justify;
    color: #efefef;
}
  
  .bubbles{
    margin-bottom: 0%;  
}
  
.sldBubbles{
    border-radius: 50% !important;
    width: 10px !important;
    height: 10px !important;
}

.carousel-item img{
    opacity: 0.7;
}

.leader{
    margin-top: 25px;
}


.majimbo{
    margin-top: 180px;
}
.askName{
    border: 1px solid redd;
}

.askName h3{
    background: #007BFF;
    line-height: 40px;
    color: #FFC107;
}

.askName h4{
    border-top: 2px solid #66cccc;
    padding-top: 10px;
    float: right;
    font-size: 11px; 
    font-weight: bold;
    color: #A1A1A1;
}


.blink, h6 {
            color: red;
            font-weight: 800;
            text-align: center;
            animation: animate 
                0.9s linear infinite;
        }
  
        @keyframes animate {
            0% {
                opacity: 0;
            }
            25% {
                opacity: 0.5;
            }
  
            50% {
                opacity: 1;
            }
            75% {
                opacity: 0.6;
            }
  
            100% {
                opacity: 0;
            }
        }