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

/*headline:font-family: "Gugi", sans-serif;
	paragragh: font-family: "Fredoka", sans-serif;
*/

/*education
Funnel Cloud:#153A64
Ball Blue:#27B0D0
Royal Mail Red:#D81E2D
Orange Yellow:#FDB813
Pinkish:#D77182
*/


*{
	box-sizing: border-box;
	margin: 0;
}

body {
	margin: 0 auto;
	padding: 0;
	width: 100%;
}

h1,h2,h3,h4,h5,h6{
	font-family: "Gugi", sans-serif;
}

p{
	font-family: "Fredoka", sans-serif;
}

/*center an image*/ 
img{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/*main navigation*/
#mainNav {
	overflow: hidden;
	margin: 0;
	display: block;
	position: fixed;
	background-color: #27B0D0;
	width: 100%;
	font-family: "Gugi", sans-serif;
	height: 47px;
}

#mainNav a{
	flaot: left;
	margin: 0;
	display: inline-block;
	color: #153A64;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none; /*removes underline*/
}

#mainNav a:hover{
	background-color: #D77182;
	color: #D81E2D;
	font-weight: 900;
}

#mainNav-right .active{
	background-color: #FDB813;
	color: #153A64;
}

#mainNav-right{
	float: right;
}

.row:after {
	content: "";
	display: table;
	clear: both;
}

.home_bg{
	background: #D77182 url("../images/kollsd-board-5599231_1920-optimised.jpg") no-repeat center center;
	background-size: cover;
	height: 300px;
	margin-top: 20px;
}

.home_bg{
	text-align: center;
	line-height: 300px;
	color: #FDB813;
	font-size: 2em;
}

/* flex box 2 colunm lay out*/

.container {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items:baseline;
}



.programs {
	margin: 0;
	padding: 0.5em;
	flex-basis: 40%;
	/* 2 coulunm width is 40% and 3 coulum width is 30%*/
}

.programs h2{
	font-size:2em;
	text-align: baseline;
	font-weight: 900;
	color: #27B0D0;
}

.toutoring{
	background: white url("../images/tylijura-cartoon-9654164_1920-Optimise.jpg") no-repeat center;
	background-size: cover;
	height: 400px;
}

.counselors {
	margin: 0;
	padding: 0.5em;
	flex-basis: 40%;
	/* 2 coulunm width is 40% and 3 coulum width is 30%*/
}

.counselors h2{
	font-size:2em;
	text-align: baseline;
	font-weight: 900;
	color: #27B0D0;
}

.classesandcounselors {
	background: white url("../images/mohamed_hassan-therapy-10029718_1920-Optimise.jpg") no-repeat left center; 
	background-size: cover;
	height: 400px;
}

.end h2{
	font-size:2em;
	text-align: baseline;
	font-weight: 900;
	color:#FDB813;
}



footer{
	background-color: #153A64;
	text-align:left;
	line-height: 60px;
	color: #27B0D0
}