
/* Large Screens (Desktops) */

@media only screen and (max-width : 1440px) {
	#header:after,
	#intro:after,
	#banner:after,
	#why:before,
	#why:after,
	#acknowledge:before,
	#footer:before {
		background-size: 1440px 100%;
	}
}

@media only screen and (max-width : 1430px) {
	.section {
		max-width: 1200px;
	}

	#header .section {
		max-width: 95%;
	}

	#intro .section {
		padding-top: 125px;
	}

	#intro .rainbow {
		width: 635px;
	}

	.imageText {
		padding-left: 0;
		padding-right: 0;
	}

	.imageText .text {
		width: 560px;
	}

	#welcome .section {
		padding-top: 70px;
		padding-bottom: 70px;
	}

	#why .listing {
		margin-left: -10px;
		margin-right: -10px;
	}

	#why .listing li {
		padding-left: 10px;
		padding-right: 10px;
	}

}

/* Medium Screens (Tablets - Landscape) */

@media only screen and (max-width : 1225px) {
	.section {
		max-width: 970px;
	}

	#header .section {
		max-width: 97%;
		height: 140px;
	}
	
	#header .logo {
		width: 120px;
	}

	#header .options #navigation ul li {
		margin-left: 31px;
	}

	#header .options .phone,
	#header .options .login .toggleBtn {
		font-size: 20px;
	}

	#header .login .dropdown {
		top: 35px;
		width: 384px;
		padding: 22px 26px;
	}

	#intro,
	#why,
	#acknowledge {
		background-attachment: scroll;
	}

	#intro .section {
		padding-top: 100px;
		padding-bottom: 90px;
	}

	#intro .slides li .image {
		font-size: 15px;
	}

	#intro .slides li .text {
		width: 431px;
	}

	#intro .slides li .text .heading {
		font-size: 46px;
	}

	#intro .rainbow {
		width: 547px;
		left: 121px;
	}
	
	#banner:after {
		height: 25px;
	}
	
	#content .section {
		padding-top: 25px;
	}

	.imageText .image {
		font-size: 14px;
	}

	.imageText .text {
		width: 491px;
	}

	#welcome .section {
		padding-top: 50px;
		padding-bottom: 40px;
	}

	#why .listing li .image {
		border-top-left-radius: 40px;
		border-top-right-radius: 40px;
	}

	#why .listing li .text {
		padding-top: 15px;
		border-bottom-left-radius: 40px;
		border-bottom-right-radius: 40px;
	}

	#why .listing li .text:before {
		height: 30px;
		top: -29px;
	}

	#why .listing li .text .desc img {
		height: 80px;
	}

	#why .listing li .text .desc .title {
		font-size: 22px;
	}

	#educator .section {
		padding-top: 55px;
		padding-bottom: 55px;
	}

	#acknowledge .section {
		padding-left: 20px;
		padding-right: 20px;
	}

	#acknowledge .lineArt {
		top: 31px;
		width: 299px;
	}

	#acknowledge .circles {
		width: 147px;
	}

	#footer .top .section {
		padding-top: 40px;
	}

	#footer .top .links {
		margin-left: 64px;
	}
}

/* Small Screens  (Tablets - Portrait ) */

@media only screen and (max-width : 991px) {
	.section {
		max-width: 750px;
		padding-left: 15px;
		padding-right: 15px;
	}

	#mainWrapper {
		font-size: 16px;
	}

	#header .section,
	body.scrolled #header .section {
		height: 94px;
	}

	#header .logo {
		width: 91px;
	}

	#header .options,
	body.scrolled #header .options {
		margin-top: 21px;
	}

	#header .options #navigation ul li {
		font-size: 20px;
		margin-left: 21px;
	}
	
	#header .login .dropdown {
		width: 385px;
		padding: 24px 24px;
	}

	#header .login .dropdown .title {
		font-size: 23px;
	}

	#intro .section {
		padding-top: 110px;
		padding-bottom: 75px;
	}
	
	#intro .slides li .text {
		width: 321px;
	}

	#intro .slides li .text .heading {
		font-size: 35px;
	}
	
	#intro .slides li .image {
		font-size: 11px;
	}

	#intro .slides li .text .heading {
		font-size: 30px;
	}

	#intro .rainbow {
		width: 420px;
		left: 121px;
	}

	#welcome .section {
		padding-top: 30px;
		padding-bottom: 20px;
	}

	.imageText .image {
		font-size: 10px;
	}

	.imageText .text {
		width: 378px;
	}

	#why .listing {
		margin-left: -5px;
		margin-right: -5px;
		margin-top: 32px;
	}

	#why .listing li {
		padding-left: 5px;
		padding-right: 5px;
	}

	#educator .section {
		padding-top: 30px;
		padding-bottom: 30px;
	}

	#acknowledge .section {
		padding-left: 15px;
		padding-right: 15px;
	}

	#acknowledge .lineArt {
		top: 40px;
		width: 268px;
	}

	#acknowledge .circles {
		width: 124px;
	}

	#footer .top .section {
		font-size: 17px;
		padding-top: 25px;
	}

	#footer .top .title {
		font-size: 19px;
	}

	#footer .top .logo {
		width: 117px;
	}

	#footer .top .links {
		margin-left: 36px;
	}

	#footer .bottom .section {
		font-size: 18px;
	}

	.heading {
		font-size: 30px;
	}
	
	.linkBtn {
		font-size: 16px;
	}

}

/* Extra Small Screens */

@media only screen and (max-width : 767px) {
	#menuBtn {
		display: block;
	}	

	#header {
		position: relative;
		border-top: 6px solid #e9762e;
		border-bottom: 4px solid #e9762e;
		background: #fff;
		-webkit-filter: drop-shadow(0 5px 5px rgba(0,0,0,0.2));
	    filter: drop-shadow(0 5px 5px rgba(0,0,0,0.2))
	}

	#header:after {
		display: none;
	}

	#header .section,
	body.scrolled #header .section {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		height: auto;
		padding-top: 15px;
	}

	#header .options #navigation {
		display: none;
	}
	
	#header .options,
	body.scrolled #header .options {
		margin: 0;
	}
	
	#header .options {
		display: block;
		width: 100%;
	}

	#header .options .btns {
		flex-direction: column;
		align-items: center;
		margin-left: -30px !important;
		margin-right: -30px !important;
	}

	#header .options .phone {
		margin-bottom: 12px;
	}

	#header .login .dropdown {
		width: 100%;
		border-radius: 0;
		padding: 22px 24px;
	}

	#header .login .dropdown .submitBtn {
		margin-bottom: 15px;
	}

	#header .options .login {
		width: 100%;
	}

	#header .options .login .toggleBtn {
		display: block;
		width: 100%;
		margin: 0;
		text-align: center;
		border-radius: 0;
		font-size: 22px;
	}

	#header .logo,
	body.scrolled #header .logo {
		width: 136px;
		margin: 0 0 10px;
	}

	#intro .section {
		padding: 35px 0 90px;
		min-height: 1px;
	}

	#intro .slides li {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		text-align: center;
	}

	#intro .slides li .image {
		-webkit-box-ordinal-group: 0;
		    -ms-flex-order: -1;
		        order: -1;
		font-size: 8px;
		margin: 0 auto 20px;
	}

	#intro .slides li .image .stars {
		top: -0.263158em;
	}

	#intro .slides li .text {
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
	}

	#intro .rainbow {
		width: 300px;
		left: 50%;
		margin-left: -150px;
	}
	
	#content .section {
		padding-top: 5px;
	}

	.imageText {
		display: block;
		text-align: center;
	}

	.imageText .image {
		font-size: 9px;
		margin: 0 auto 30px;
	}

	.imageText .text {
		width: 100%;
	}

	#welcome .section {
		padding-top: 8px;
		padding-bottom: 8px;
	}

	#why .section {
		padding-top: 85px;
		padding-bottom: 95px;
	}

	#why .listing {
		max-width: 350px;
		margin: 25px auto 0;
	}

	#why .listing li {
		width: 100%;
		margin-bottom: 30px;
	}

	#why .listing li:last-child {
		margin-bottom: 0;
	}

	#why .listing li .text {
		padding-bottom: 15px;
	}

	#why .listing li .text .desc {
		margin-bottom: 10px;
	}

	#educator .section {
		padding-top: 15px;
		padding-bottom: 10px;
	}

	#acknowledge .lineArt {
		left: -12.027778%;
	}

	#acknowledge .circles {
		right: -9.597222%;
	}

	#footer .top .section {
		display: block;
		text-align: center;
		padding-top: 5px;
	}

	#footer .top .logo {
		display: block;
		width: 145px;
		margin: 0 auto 30px;
	}

	#footer .top .links {
		margin: 0 0 20px;
	}

	.linkBtn {
		margin: 0 auto;
	}

}

@media only screen and (max-width : 478px) { 

}

@media only screen and (max-width : 400px) { 

}