
/* NOTE WELL: This Design is MOBILE FIRST
   Therefore, by default all designs such
   as picture dimensions, padding, margins
   and div layouts are written for the
   MOBILE FIRST and then examptions for 
   Desktop is facilitated by Media Queries

*/

/*
Available Google fonts for this website

Body Font --> font-family: 'Livvic', sans-serif;
Navigation Font --> font-family: 'Francois One', sans-serif;
Quotation Font --> font-family: 'Indie Flower', cursive;
Banner Text --> font-family: 'Fredericka the Great', cursive;

*/

body{
	margin-left: 0 .5%;
	
}






/*
img#logo1{
width: 10%;	
position: absolute;
padding-left: 50px;
}
*/


#containerFirstHeroSection{
	width:100%;
}




#containerSecondHeroSection{
	width:100%;
}



#backgroundFirstHeroSection{
	background-image: url("../images/auditorium-1920x1080-blurred.jpg") ;
	background-attachment:fixed ;
	background-position:center;
	background-size: cover;
	background-repeat: no-repeat;
	min-height:225px;
	max-height:1050px;
    
}

#overlayFirstHeroSection{
	background-color: rgba(65, 109, 148, .55);
	min-width:100%;
	
	
}


section#leftAlignedFirstHero{
	background-image: url("../images/chris-pose-1.png");
	background-size: contain;
	background-position:bottom;
	background-repeat: no-repeat;
    min-height:225px;
    padding-top:35%;
        
}


.bigQuotationFirstHeroSection{
	margin:5.5% 13.5%;
	padding:2.5% 2.5% 2.5% 5.5%;
	background-color:rgba(229, 134, 91, .35);
	border-left:double 10px rgb(229, 196, 91);
	font-family: 'Indie Flower', cursive;
	
}

/*
div#multiTextBanner{
	height: 100%;
	background-color: white;
}

*/

#educateSectionBlock, #empowerSectionBlock, #encourageSectionBlock{
	text-align:center;
	padding-top:5%;
	padding-bottom:5%;
}

#educateSectionBlock, #encourageSectionBlock{
	background-color: rgb(229, 134, 91);
}


#empowerSectionBlock{
	background-color: rgb(229, 196, 91);
}

p.bannerText{
	text-transform:uppercase;
	font-size:300%;
	color:white;
	font-family: 'Fredericka the Great', cursive;
}



#backgroundSecondHeroSection{
	background-image: url("../images/design-interface-1920x1080-blurred.jpg") ;
	background-attachment:fixed ;
	background-position:center;
	background-size:cover;
	background-repeat: no-repeat;
    

}


#overlaySecondHeroSection{
	background-color: rgba(65, 109, 148, .50);
	width:100%;
	
}


section#rightAlignedSecondHero{
	background-image: url("../images/chris-pose-3.png");
	background-size: contain;
	background-position:right bottom;
	background-repeat: no-repeat;
    height:575px;

}




#selfPortraitSection1{
width:87.55%;
margin-top:17.75%;
}



#selfPortraitSection2{
width:100%;
margin-top:12.1%;
}



/* Small only */
@media screen and (max-width:39.9375em) {

    section#rightAlignedSecondHero{
        background-image: url("../images/chris-pose-3.png");
        background-size: contain;
        background-position:right bottom;
        background-repeat: no-repeat;
        height:225px;
    }
    
    #educateSectionBlock, #empowerSectionBlock, #encourageSectionBlock{
	text-align:center;
	padding-top:5%;
	padding-bottom:12.5%;
    }
    
}


/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
   section#rightAlignedSecondHero{
	background-image: url("../images/chris-pose-3.png");
	background-size: contain;
	background-position:right bottom;
	background-repeat: no-repeat;
    height:300px;

    } 
    
    p.bannerText{
	text-transform:uppercase;
	font-size:200%;
	color:white;
	font-family: 'Fredericka the Great', cursive;
    }
    
}







