/*Regal Blue
#04446C

Porsche
#ECAB57

Curious Blue
#1988D9

Horizon
#5C84A4

**Fonts**
font-family: 'Roboto', sans-serif;
font-family: 'Roboto Condensed', sans-serif;
font-family: 'Source Sans Pro', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Montserrat Alternates', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Stick No Bills', sans-serif;

*/
:root {
    --main-heading-color:#1988D9;
    --fontmt-font-family: 'Montserrat', 'Roboto', 'Segoe UI', sans-serif;
    --fontmt-alt-font-family: 'Montserrat Alternates', 'Montserrat', 'Segoe UI', sans-serif;
    --fontrobo-font-family: 'Roboto', 'Source Sans Pro', 'Segon UI', sans-serif;
    --fontrobocon-font-family: 'Roboto Condensed', 'Segoe UI', sans-serif;
    --fontsourcesans-font-family: 'Source Sans Pro', 'Segon UI', sans-serif;
}

html, body {
    height: 100%;
}

body {
    font-family: 'Source Sans Pro', sans-serif;
}

.font-lobseter {
    font-family: 'Lobster', cursive;
}

#header-block {
    /* background: linear-gradient(to bottom, #1988D9, #04446C); 
    background: url(../images/b1.jpg) center no-repeat;*/
    background-size: cover;
    /* -webkit-backdrop-filter: grayscale(1) opacity(0.8);
    backdrop-filter: grayscale(1) opacity(0.8); */
}

header {
    -webkit-backdrop-filter: grayscale(1) opacity(0.8) drop-shadow(4px 4px 10px blue);
    backdrop-filter: grayscale(1) opacity(0.8) drop-shadow(4px 4px 10px blue);
    /* padding: 4.5em 0 3em 0; */
    /* padding: 8.5em 0 3em 0; */
}

#mainNav {
    position: absolute;
    top: 1rem;
    left: 0;
    right: 0;
    z-index: 1030;
  }

  .mlogo {
    max-height: 12vh; 
    width:auto;
}

/***Carousel****/
.carousel-item {
    height: 90vh;
    min-height: 350px;
    background: no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
  }

#slider-img-1 {
    background-image: url('../images/b1.jpg');
}

#slider-img-2 {
    background-image: url('../images/banners/science_fair_mobi.jpg');
    background-position: center;
}

#slider-img-3 {
    background-image: url('../images/banners/spellingbee.jpg');
    background-position: center left;   
}

#slider-img-4 {
    background-image: url('../images/banners/best-igcse-3.jpg');
    background-position: center center;   
}

#slider-img-5 {
    background-image: url('../images/banners/cadet.jpg');
    background-position: center center;   
}

#slider-img-6 {
    background-image: url('../images/banners/seminar.jpg');
    background-position: center left;   
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    header {
        /* padding: 10.5em 0 3em 0; */
    }
    #mainNav {
        position: absolute;
        top: 2rem;
        left: 0;
        right: 0;
        z-index: 1030;
      }
    
    .mlogo {
        max-height: 15vh; 
        width:auto;
    }

    #slider-img-1 {
        background-image: url('../images/b1.jpg');
        background-position: center;
    }
    
    #slider-img-2 {
        background-image: url('../images/banners/science_fair.jpg');
        background-position: center;
    }
    
    #slider-img-3 {
        background-image: url('../images/banners/spellingbee.jpg');
        background-position: center;   
    }
    
    #slider-img-4 {
    background-image: url('../images/banners/best-igcse-3.jpg');
    background-position: center center;   
}

    #slider-img-5 {
    background-image: url('../images/banners/cadet.jpg');
    background-position: center center;   
}

    #slider-img-6 {
        background-image: url('../images/banners/seminar.jpg');
        background-position: center left;   
    }

}

#banner-1 {
    height: 30%;
    /* padding: 10rem; */
    background: #FFF;
    /* margin-bottom: 3em; */
}


/* #banner#contact {
    min-height: 700px !important;
} */

/* main {
} */

section {
    font-size: 1.3rem;
}

#welcome {
    background: #FAF7F4;
    /* background: #04446C; */
    /* background: linear-gradient(to bottom, #1988D9, #04446C); */
    line-height: 2rem;
    /* color: #FFF; */
    padding: 2rem;
    font-size: 1.2rem;
}

.main-heading, .main-heading-2 {
    line-height: 2.5rem;
    font-family: 'Roboto',"Segoe UI", "Trebuchet Ms", sans-serif;
    font-weight: 700;
}

.main-heading-2 {
    color: #1988D9;
}

.display-type-1 {
    font-size: 3rem;
}


.subheading {
	font-weight: bold;
	text-align: left;
}

.subheading2 {
	font-family: "Segoe UI", "Trebuchet MS", Verdana, sans-serif;
	font-weight: 600;
	text-align: left;
}

.subheading-3 {
	padding-top: 1.5rem;
	font-family: "Segoe UI", Verdana, sans-serif;
	text-align: left;
}

.heading-color1 {
	color: #0e5dbb; /*#0d72c4; #FF6F00; rgba(13,71,161,1);*/
}

.heading-color2 {
	color: #FFF;
}

.heading-color3 {
	color: #F50057;
}
.welcome-note{
    font-size: 30px !important;
}

#department {
    /*background: #04446C; 
     background: #FFF url(../images/geometric-leaves.png);*/
    color: #FFF;
}

#academics .grade-range h4, #academics .grade-range h6  {
    color: #333;
}

#upcoming {
    background-image: url(../images/inner-sect-bg.jpg);
    background-position: center;
    background-size: cover;
    color: #FFF; 
}

.sect-inner {
    background: url(../images/overlay2.png);
}

#upcoming a {
    font-weight: bold;
    color: #FFF;
}

#upcoming h3 {
    text-transform: uppercase;
    text-decoration: underline;
}

#admissions {
    background: url(../images/enrol.JPG) center center;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
}

#admissions a {
    text-decoration: none;
    color:#FFF;
}

#admissions .sect-inner {
    background: url(../images/overlay3.png) center center;
}

.why-heading {
    font-family: var(--fontmt-font-family);
    font-size: 3rem;
}

.why-number {  
    font-family: var(--fontmt-alt-font-family);
    font-size: 3rem;
    font-weight: 700;
}

.why-text {
    font-family: var(--fontmt-alt-font-family);
    font-size: 1.2rem;
}

#admission-s1 {
    background: #04446C;
    color: #FFF; 
}

#admission-s2 {
    background: #FFC;
    
}

#admission-s3 {
    background: #5C84A4;
    color: #FFF;
    
}

#admission-s4 {
    background: #FFF;
    
}
#admission-s1 ul li, #admission-s2 ul li {
    line-height: 30px;
    list-style-type:square;
}
/******About Us****/

#about-us {
    background: #04446C;
    color: #FFF; 
    text-align: left;
}

#about-us1 {
    background-color: #FFF;
    color: #000;
}

#about-us2 {
    background-color: #5C84A4;
    color: #000;
}

.mission-pic {
    background: url(../images/ab1.JPG) center center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
}

.vision-pic {
    background: url(../images/ab2.jpg) center center;
    background-repeat: no-repeat;
    background-size: cover;
    color: #FFF;
}
/****Calendar*****/
#CalEvents {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

#CalEvents .c-icon {
    font-size: 3rem;
    /* font-family: 'Roboto Condensed', sans-serif;     */
}

#CalEvents .c-day {
    font-size: 2rem;
    font-family: var(--fontrobocon-font-family);
    font-weight: 600;
    text-align: center;
    padding: 0;
    line-height: 15px;
}

a#cal-btn {
    color: #FFF;
    text-shadow: 2px 2px 3px #000000;
}

.eventDate {
    font-style: italic;
    font-size: 1rem;
    color:#ECAB57;
}

thead tr td {
    font-weight: bold;
}
/*******Newsletters********/
#newsletters {
    background-image: url(../images/enrol.JPG);
    background-position: center;
    background-size: cover;
    color: #FFF;
}

#newsletters .sect-inner {
    background: url(../images/overlay5.png);
}

span.ndate {
    text-align: right;
}
.news-corner {
    color: #333; 
}

.news-corner h1 {
    font-family: 'Lobster', cursive;
    color: #FFF;
    
}

.newsrow {
    background-color: #FFF;
}
/*******Contact Us*********/
#contact-us {
    background: url(../images/enrol.JPG);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.contact-us-inner1 {
    background: url(../images/overlay4.png) center center;
}

.contact-us-inner2 {
    background: url(../images/overlay2.png) center center;
}

.contact .card-title {
    font-family: var(--fontrobo-font-family);
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 25px;
    padding: 1rem;
}

.collapse-body {
    margin-top: 1rem;
}

.d-contact {
    border-bottom: 1px solid #eee;
    font-family: var(--fontrobo-font-family);
    padding-bottom: 1rem;
    margin-bottom: 1rem;
}

.d-contact span {
    display: block;
}
/* #newsletters{
    
} */

#above-footer {
    /* background: linear-gradient(to bottom, #1988D9, #04446C); */
    background-color: #1988D9;
    font-family: var(--fontsourcesans-font-family);
    font-weight: 400;
}

#above-footer h5 {
    font-weight: 600;
}
.info {
    font-family: var(--fontsourcesans-font-family);
    color: #FFF;
    line-height: 35px;
    font-size: 1.1rem;
    text-align: left;
}

.info i {
    padding-right: 2rem;
    /* color: #F50057; */
    color: #FFF;
}

#above-footer .social .fa-whatsapp {
    color: #25D366;
}   

#above-footer ul {
    padding: 0;
}
ul.quicklinks li {
    list-style: none;
    color: #FFF;
    line-height: 32px;
    list-style-position: outside;
}

ul.quicklinks li a, ul.quicklinks li a:visited {
    text-decoration: none;
    text-transform: none;
    color: inherit;
}



.info div{
    display: block;
    padding: 0.2rem 1rem;
}

#location {
    background-color: #25D366;
}

#phone {
    background-color: #F50057;
}

#phone-2 {
    background-color: #023047;
}

#email {
    background-color: #FFB703;
}

footer {
    background-color: #04446C;
    color: #FFF;
}

.img-thumbnail {
    border: none !important;
}
.level-img {
	height: auto;
	width: auto;
	text-align: center;
	border-radius: 50%;
}

.grade-range {
	text-align: center;
    color: #04446C;
    color: #FFF;
}

.grade-range h4 {
	font-family: 'Stick No Bills', sans-serif;
	text-transform: uppercase;
	/* color: #0d72c4; */
    color: #04446C;
	font-weight: 600;
	padding-top: 15px;
    color: #FFF;
}

.grade-range h6 {
	font-family: "Dosis", sans-serif;
}

.psc.img-thumbnail {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);
    border-color: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);
    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);
    background-size: 200% auto;
    animation: shine 3s linear infinite;
}

.pri.img-thumbnail {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
    border-color: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);

    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(9,9,121,1) 35%, rgba(0,212,255,1) 100%);
    background-size: 200% auto;
    
    animation: shine 3s linear infinite;
}

.jh.img-thumbnail {
    background: rgb(131,58,180);
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    border-color: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);

    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 50%, rgba(252,176,69,1) 100%);
    background-size: 200% auto;
    
    animation: shine 3s linear infinite;
}

.sec1.img-thumbnail {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);
    border-color: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);

    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(121,9,105,1) 53%, rgba(255,0,151,1) 100%);
    background-size: 200% auto;
    
    animation: shine 3s linear infinite;
}

.sec2.img-thumbnail {
    background: rgb(2,0,36);
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(28,9,121,1) 53%, rgba(0,249,255,1) 100%);
    border-color: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(28,9,121,1) 53%, rgba(0,249,255,1) 100%);

    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(28,9,121,1) 53%, rgba(0,249,255,1) 100%);
    background-size: 200% auto;
    
    animation: shine 3s linear infinite;
}

.bhse.img-thumbnail {
    background: rgb(58,142,180);
    background: linear-gradient(90deg, rgba(58,142,180,1) 0%, rgba(253,29,79,1) 50%, rgba(252,176,69,1) 100%);
    border-color: linear-gradient(90deg, rgba(58,142,180,1) 0%, rgba(253,29,79,1) 50%, rgba(252,176,69,1) 100%);

    transform: rotate(-5deg);
    overflow: hidden;
    background: linear-gradient(90deg, rgba(58,142,180,1) 0%, rgba(253,29,79,1) 50%, rgba(252,176,69,1) 100%);
    background-size: 200% auto;
    
    animation: shine 3s linear infinite;
}

  /*Begin shimmer code*/
  
  @keyframes shine {
      to {
        background-position: 200% center;
      }
    }


/****Summary Section*****/
#summary {
    min-height: 290px;
}

.firstbox {
    max-height: 600px;
    background: #1988D9;
}

.childbox {
    min-height: 300px;
    max-height: 300px;
}

.childbox button a {
    text-decoration: none;
    color: #050A30;
}

.firstbox,.childbox {
    /* width:auto; */
    overflow: hidden;
    height: auto;
    /*margin:3px;*/
    padding: 0;
    display:block;
    position:relative;
    /* float:left; */
}

.firstbox img, .childbox img {
    width: 100%;
    height: 100%;
    transition-duration: .3s;
    max-width: 100%;
    display:block;
    overflow:hidden;
    cursor:pointer;
    object-fit: cover;
    border: 0px solid #FFF;
    /*filter: grayscale(50%);*/
    opacity: 0.8;
}

.c1 img,.c2 img,.c5 img {
    filter: grayscale(50%);
    opacity: 0.4;
}

.title{
    position:absolute;
    display:block;
    cursor:pointer;
    top: 30%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    font-weight: bold;
    font-size: 1.6em;
    text-shadow: 1px 5px 10px black;
    transition-duration: .3s;
    color: #FFF;
  }
  .text{
    position:absolute;
    top: 59%;
    cursor:pointer;
    max-width: 80%;
    text-align:center;
    left: 50%;
    text-shadow: 1px 5px 10px black;
    font-size: 1em;
    margin-right: -50%;
    transition-duration: .3s;
    transform: translate(-50%, -50%);
    color: #FFF;
  }

  .firstbox:hover img, .childbox:hover img{
    transform: scale(1.2);
    transition-duration: .3s;
    filter: grayscale(50%);
    opacity: 0.1;
  }
  .firstbox:hover span, .childbox:hover span{
    color:white;
    display: block;
    transition-duration: .3s;
  }
.c1,.c3,.c5 {
    background: #04446C;
}

.c2,.c4,.c6 {
    background: #1988D9;
}

.c5 .text {
    top: 61%;
}

.qt {
    /* background: #1988D9; */
    background-color: #023047;
    border-radius: 0rem;
}

.qt h1 {
    font-family: 'Stick No Bills', sans-serif;
    text-align: center; 
    color: #FFF;
    font-weight: bold;
}

.qt-body {
    font-size: 2rem;
    text-align: center;
}


.tots {
    padding: 1rem;
    /* text-align: center; */
    font-weight: 600;
    font-family: var(--fontsourcesans-font-family);
    color: #023047;
}

/****Navbar******/

/* #mainNav {
    position: absolute;
    top: 2rem;
    left: 0;
    right: 0;
    z-index: 1030;
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  } */

  .navbar-nav {
    /* background-color: #050A30; */
    background-color: #219EBC;
    
}

@media (min-width: 768px) {
    .navbar-nav {
        background-color: #0000FF;
        border-radius: 5rem;
    }

    .navbar-dark .navbar-nav .nav-link {
        font-weight:normal;
      }
}

.navbar-toggler {
    padding: 0.5rem 0.75rem;
    font-size: 1.25rem;
    line-height: 1;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    transition: box-shadow 0.15s ease-in-out;
  }

.navbar-dark .navbar-brand {
    color: #fff;
  }
  
  .navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
    color: #fff;
  }
  
  .navbar-dark .navbar-nav .nav-link {
    color: rgba(255, 255, 255, 1);
    font-weight: 600;
  }
  
  .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
    color: rgba(255, 255, 255, 0.75);
  }
  
  .navbar-dark .navbar-nav .nav-link.disabled {
    color: rgba(255, 255, 255, 0.25);
  }
  
  .navbar-dark .navbar-nav .show > .nav-link,
  .navbar-dark .navbar-nav .active > .nav-link,
  .navbar-dark .navbar-nav .nav-link.show,
  .navbar-dark .navbar-nav .nav-link.active {
    color: #fff;
  }
  
  .navbar-dark .navbar-toggler {
    color: rgba(255, 255, 255, 0.5);
    border-color: rgba(255, 255, 255, 0.1);
  }
  
  .navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
  }
  
  .navbar-dark .navbar-text {
    color: rgba(255, 255, 255, 0.5);
  }
  
  .navbar-dark .navbar-text a {
    color: #fff;
  }
  
  .navbar-dark .navbar-text a:hover, .navbar-dark .navbar-text a:focus {
    color: #fff;
  }
  
