@charset "utf-8";
/* CSS Document */



#mc_embed_signup{clear:left; font:14px Helvetica,Arial,sans-serif; }
	/* Add your own Mailchimp form style overrides in your site stylesheet or in this style block.
	   We recommend moving this block and the preceding CSS link to the HEAD of your HTML file. */



/* ------------------------------------
    1. NAVIGATION
---------------------------------------*/	
#head-nav {
	height:80px;
	/*background-color:#9e44b4;*/
}


.nav-scroller {
  position: relative;
  /*z-index: 2;*/
  height: 2.95rem;
  overflow-y: hidden;
}

.nav-scroller .nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding-bottom: 1rem;
  margin-top: -5px;
  overflow-x: auto;
  color: rgba(255, 255, 255, .75);
  float:right;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
 
}

.nav-underline .nav-link {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: .875rem;
  color: #6c757d;
 
}


.nav-underline .nav-link:hover {
  color:#3a8cc1;
  background-color:#3a8cc1 ;
}


	
.nav-underline .active {
  font-weight: 500;
  color: #343a40;
}


a {
	color:#672c91;
}


/* ------------------------------------
    2. CAROUSEL - HOMEPAGE
---------------------------------------*/

/*.carousel-caption h1, .carousel-caption p{
	color: #039;
}*/

.content {
 position: absolute;
 /* bottom:0;*/
  background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
  color: #f1f1f1;
  width: 100%;
  height:100%;
 
}


.carousel-indicators .active {
	background-color:#9e44b4;
}

.carousel-indicators li {
	background-color: rgba(97,84,164,0.5);
}

.fa-angle-left, .fa-angle-right {
	color:#9e44b4;
}


/* ------------------------------------
    3. SERVICES SECTION - HOMEPAGE
---------------------------------------*/

.services-item {
   min-height:600px;
   transition: width 400ms;
    
}


@media (min-width: 768px) {
   .services-item:hover{
	width:35%!important;
}

}


.services-item__content {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70%;
    padding: 40px 50px;
    background: #1d1d23;
	
  	
}

.services-item:hover .services-item_content {
	opacity:1;

}

.services-item__bg {
    position: absolute;
    top: 0;
    left: -1px;
    width: 100%;
    height: 100%;
	background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    transition: filter 600ms,top 600ms;
	
}	


.services-item h2 {
 	font-size:50px;
	font-weight:700;
    position: absolute;
    padding: 0 35px;
    color: #fff;
    top: 28%;
   transition: top 600ms,opacity 200ms,transform 900ms;
    z-index: 10;
	
}


.services-item h2 a {
	font-family: "essonnes-headline",TimesNewRoman,"Times New Roman",Times,Baskerville,Georgia,serif;
    color: #fff;
	font-size:40px;
	
}

.services-item__content ul {
    font-size: 12px;
    font-size: 1.2rem;
    list-style: none;
    margin: 0 0 30px;
    padding: 0;
    text-transform: uppercase;
    letter-spacing: .25em;
}


.services-item__content ul li a {
    font-weight: 700px;
    padding: 15px 0;
    display: block;
    color: #fff;
    border-top: 1px solid #27272c;
}



#services-heading {
	position:	relative;
	min-height:	200px;
	background:	url(../images1/services3.jpg);
	background-attachment: fixed;
	background-repeat:	no-repeat;
	text-align:	center;
	color:	#fff;
}


/* ------------------------------------
    4. STICKY PAGE - HOMEPAGE
---------------------------------------*/

.overlay {
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background: rgba(0,0,0,0.4);
}

/* ------------------------------------
    5. RESOURCES SECTION - HOMEPAGE
---------------------------------------*/

.fa-film, .fa-chalkboard, .fa-image  {
	color:#3a8cc1;
}

.fa-facebook-square {
	color:#36C;
}

#social .fa-instagram {
	color:#F39;
}



.fa-pencil-alt, .fa-flask, .fa-headphones {
	color:#672c91;
}


#resources-heading {
	position:	relative;
	min-height:	200px;
	background:	url(../images1/services3.jpg);
	background-attachment: fixed;
	background-repeat:	no-repeat;
	background-position:0 -300px;
	text-align:	center;
	color:	#fff;
}


/* ------------------------------------
    6. WHAT'S HAPPENING VIDEO - HOMEPAGE
---------------------------------------*/

#video-play {
	position:	relative;
	min-height:	200px;
	background:	url(../images1/schools-activities.jpg);
	background-attachment: fixed;
	background-repeat:	no-repeat;
	background-position:0 -300px;
	text-align:	center;
	color:	#fff;
}


#video-play a {
	color:#fff;
}


/* ------------------------------------
    7. PAGE HEADER - RESOURCES & SCHOOLS
---------------------------------------*/
#page-header {
	height:	200px;
	background:url(../images1/schools2.jpg);
	background-position:	0 -360px;
	background-attachment:	fixed;
	color:	#fff;
	border-bottom: 1px #eee solid;
	padding-top:50px;
}

/* ------------------------------------
    8. ABOUT PAGE - IMAGE
---------------------------------------*/

.about-img {
	margin-top:	-50px;
}



.thumbnail {
    position:relative;
    overflow:hidden;
}
 
.caption {
    position:absolute;
    top:0;
    right:0;
    background:rgba(66, 139, 202, 0.75);
    width:100%;
    height:100%;
    padding:2%;
    display: none;
    text-align:center;
    color:#fff !important;
    z-index:2;
}




/* ------------------------------------
    8. EDUTUBE 
---------------------------------------*/
 .pb-video-container {
        padding-top: 20px;
        /*background: #bdc3c7;*/
        font-family: Lato;
    }

    .pb-video {
        border: 1px solid #3a8cc1;
        padding: 5px;
    }

        .pb-video:hover {
            background: #2c3e50;
        }

    .pb-video-frame {
        transition: width 2s, height 2s;
    }

        .pb-video-frame:hover {
            height: 300px;
        }

    .pb-row {
        margin-bottom: 10px;
    }
	
	
.video-categories {
	 padding-top: 20px;
	 font-family: Lato;
}


.featurette-divider {
  margin: 2rem 0; /* Space out the Bootstrap <hr> more */
}

/* ------------------------------------
    9. NURSERY, PRIMARY & SECONDARY 
---------------------------------------*/
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}



/* ------------------------------------
    10. SERVICE PAGES 
---------------------------------------*/
.library {
	height:625px;
		
}


.section-title {
font-family: "essonnes-display",TimesNewRoman,"Times New Roman",Times,Baskerville,Georgia,serif;
padding-top:10%;
}


#services-tab {
	margin-top:5%;
}

.nav-tabs {
	border-style:none;
	text-transform: uppercase;
	
}


.service-links
	 {
	/*text-align:center;*/
	border:1px solid #eee;
	margin-top: 2%;
	height:400px;
}

service-links a:link {
	color: #000;
}

.btn-circle {
    width: 20px;
    height: 20px;
    padding: 4px 0px;
    border-radius: 15px;
    text-align: center;
    font-size: 12px;
    line-height: 1.42857;
}



/* ------------------------------------
    11. RADIO
---------------------------------------*/

 .radio-playlist{
            list-style: none;
        }
        .radio-playlist li a{
            color:black;
            text-decoration: none;
        }
        .radio-playlist .current-song a{
            color:blue;
        }
		

/* ------------------------------------
    12. INDIVIDUAL SCHOOL PAGE
---------------------------------------*/
#explore-section .fas {
  background: #333;
  color: #fff;
  padding: 5px;
  border-radius: 5px;
}

.school-org .school-org-list {
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-bottom: 30px;
  text-align: center;
  padding: 23px;
  transition: .3s all ease;
}
.school-org .school-org-list {
  font-size: 60px;
  color: #ffffff;
  margin-bottom: 6px;
}
.school-org .school-org-list {
  color: #ffffff;
  font-weight: 500;
  margin-bottom: 0;
  font-size: 20px;
  text-transform: uppercase;
}
.school-org .school-org-list:hover {
  border-color: #ff3115;
}
.school-org .school-org-list {
  color: #fff;
  font-size: 30px;
  line-height: 28px;
  margin-bottom: 25px;
}
.school-org .school-org-list p {
  margin-bottom: 35px;
  color: rgba(255, 255, 255, 0.6);
}

 .school-org .school-org-list {
  border-radius: 30px;
  border: none;
  background: #92278f;
}
.school-org .school-org-list.counter-number {
  color: #fff;
}
.school-org .school-org-list:hover {
  border-color: #92278f;
}
.school-org .school-org-list.lilac-color{
  background: #be78bf;
}

.school-org .school-org-list.teal-color{
  background: #269aa9;
}
.school-org .school-org-list.green-color {
  background: #79cd7f;
}
.school-org .school-org-list.blue-color {
  background: #29d5e0;
}


.blue-bg {
  position: relative;
}
.blue-bg .blue-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /*background: rgba(0, 188, 212, 0.9);*/
  background-image:	url(../images1/bground6.jpg);
  
}


/* -------------------------------------------
   13. CHANGE BACKGROUND AND BORDER COLOR 
----------------------------------------------*/

.bg-secondary{
	background-color:#9d51d3!important;
}

.bg-dark{
	background-color:#3a8cc1!important;
}

.btn-secondary{
	background-color:#672c91!important;
}

.form-control {
	border: 1px solid #672c91;
}

.btn-outline-secondary{
	border-color:#672c91!important;
}

.list-group-item-info {
	background-color:#3a8cc1!important;
}
	


hr {
	border-top: 3px solid rgba(103,44,145,0.2)!important;
	
}