/* Large Screens (Desktops) */

@media only screen and (max-width : 1430px) {
	.section {
		max-width: 1200px;
	}

	body {
		border: 2px solid red;
	}

	#mainWrapper {
		padding-top: 157px;
	}

	#header .section {
		height: 158px;
	}

	#header .logo {
		left: 0;
	}

	#header #navigation {
		bottom: 10px;
	}

	#header #navigation ul li ul {
		padding-top: 10px;
	}

	#header:after,
	#video:after,
	#benefits:before,
	#benefits:after,
	#footer:before {
		background-size: 1440px 100%;
	}

	#social .image {
		width: 660px;
	}

	#footer .girl {
		left: 158px;
	}

	#footer .bubbles.one {
		left: 328px;
	}
}

/* Medium Screens (Tablets - Landscape) */

@media only screen and (max-width : 1225px) {
	.section {
		max-width: 970px;
	}

	
	body {
		border: 2px solid green;
	}

	body.scrolled #header .logo {
		width: 240px;
		top: 8px;
	}

	#benefits {
		background-attachment: scroll;
	}
	
	#intro .links {
		font-size: 23px;
		margin-bottom: 50px;
	}

	#intro .welcome .image {
		width: 350px;
	}

	#intro .welcome .text {
		width: 500px;
	}

	#benefits ul {
		margin: 0 40px;
	}

	#ageGroups .image {
		margin-right: 0;
		width: 262px;
	}

	#ageGroups .text {
		width: 700px;
	}

	#ageGroups .text .listing li {
		width: 340px;
	}

	#social .facebook {
		margin-right: 0;
	}
		
	#social .image {
		width: 560px;
	}

	#social .facebook {
		width: 385px;
	}

	#footer .logo {
		width: 236px;
	}

	#footer .girl {
		width: 184px;
		bottom: 174px;
	}

	#footer .bubbles {
		width: 53px;
		z-index: 2;
	}

	#footer .bubbles.one {
		bottom: 414px;
		left: 308px;
	}

	#footer .boy {
		width: 224px;
		right: 151px;
		bottom: 230px;
	}

	#footer .bubbles.two {
		right: 292px;
		bottom: 296px;
	}

	#footer .orangeFish {
		width: 80px;
	}

	#footer .fish.four {
		width: 55px;
	}

	#footer .logo {
		margin-top: 35px;
	}
	
}

/* Small Screens  (Tablets - Portrait ) */

@media only screen and (max-width : 991px) {
	.section {
		max-width: 750px;
		padding-left: 15px;
		padding-right: 15px;
	}
		
	body {
		border: 2px solid blue;
	}

	#mainWrapper {
		padding-top: 123px;
	}

	#header .section {
		height: 124px;
	}

	#header .logo {
		width: 240px;
		left: 15px;
		top: 8px;
	}

	#header .options {
		right: 15px;
	}

	#header #navigation {
		right: 15px;
	}

	#header #navigation ul li {
		margin-left: 15px;
		font-size: 16px;
	}

	#header #navigation ul li.hasSub>a:before {
		margin-top: -0.33em;
	}

	#video:after,
	#footer:before {
		background-size: 1180px 100%;
		height: 149px;
	}

	#intro .section {
		padding-top: 45px;
		padding-bottom: 55px;
	}

	#intro .title {
		font-size: 47px;
		margin-bottom: 50px;
	}

	#intro .links {
		margin-left: -15px;
		margin-right: -15px;
		margin-bottom: 50px;
		font-size: 19px;
	}

	#intro .links li {
		padding-left: 15px;
		padding-right: 15px;
	}

	#intro .welcome .text {
		width: 370px;
		margin-right: 0;
	}

	#intro .welcome .image {
		margin-left: 0;
		width: 326px;
	}

	#ageGroups .section {
		padding-top: 70px;
	}

	#ageGroups .text {
		width: 394px;
	}
	
	#ageGroups .text .listing {
		display: block;
	}

	#ageGroups .image {
		width: 300px;
		margin-top: 80px;
	}

	#benefits .section {
		padding-top: 120px;
		padding-bottom: 120px;
	}

	#benefits:before,
	#benefits:after {
		height: 70px;
	}

	#benefits ul {
		margin: 0 20px;
	}

	#benefits ul li {
		font-size: 17px;
	}

	#benefits ul li:before {
		top: 1px;
	}

	#social .facebook {
		width: 300px;
	}
	
	#social .image {
		width: 394px;
		padding-top: 50px;
		padding-bottom: 50px;
	}

	#ageGroups .section {
		padding-bottom: 30px;
	}

	#footer .section {
		min-height: 565px;
		font-size: 15px;
	}

	#footer .fishCluster.one {
		width: 280px;
	}

	#footer .plant.one {
		width: 180px;
	}

	#footer .plant.two {
		width: 193px;
	}

	#footer .plant.three {
		width: 154px;
	}

	#footer .roundCoral {
		width: 98px;
	}

	#footer .whiskers {
		width: 130px;
		bottom: -33px;
	}

	#footer .rocks.two {
		width: 220px;
	}

	#footer .rocks.one {
		width: 170px;
	}

	#footer .plant.four {
		width: 129px;
	}

	#footer .starFish {
		width: 98px;
	}

	#footer .plant.six {
		width: 120px;
	}

	#footer .plant.seven {
		width: 120px;
	}

	#footer .plant.eight {
		width: 143px;
	}

	#footer .plant.nine {
		width: 110px;
	}

	#footer .plant.ten {
		width: 97px;
	}

	#footer .fishCluster.two {
		width: 190px;
		bottom: 251px;
	}

	#footer .fish.four {
		bottom: 350px;
	}

	#footer .girl {
		left: 94px;
		width: 135px;
		bottom: 158px;
	}

	#footer .bubbles {
		width: 44px;
	}

	#footer .bubbles.two {
		bottom: 334px;
		left: 203px;
	}

	#footer .boy {
		width: 171px;
		right: 53px;
		bottom: 215px;
	}

	#footer .logo {
		margin-top: 0;
	}

	#footer .bubbles.one {
		bottom: 261px;
		left: 537px;
		z-index: 3;
	}
		
	.heading {
		font-size: 41px;
	}

}

/* Extra Small Screens */

@media only screen and (max-width : 767px) {
	#menuBtn {
		display: block;
	}
	
	body {
		border: none;
	}

	#mainWrapper,
	body.scrolled #mainWrapper {
		padding-top: 0;
		transition: -webkit-transform .4s ease;
		-webkit-transition: -webkit-transform .4s ease;
		-o-transition: transform .4s ease;
		transition: transform .4s ease;
		transition: transform .4s ease, -webkit-transform .4s ease;
	}

	#header {
		position: static;
		border-top: 4px solid #ff6600;
	}
	
	#header:after {
		display: none;
	}

	#header .section,
	body.scrolled #header .section {
		height: auto;
		padding-top: 20px;
		padding-bottom: 15px;
	}

	#header #navigation {
		display: none;
	}

	#header .options {
		position: static;
		display: block;
	}

	#header .options .socials {
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		margin-bottom: 10px;
	}

	#header .options .socials li {
		margin: 0 5px;
	}

	#header .options .links {
		display: block;
		margin: 0;
		text-align: center;
	}

	#header .options .links li {
		margin: 0 0 15px;
	}

	#header .options .links li a {
		padding-left: 15px;
		padding-right: 15px;
	}

	#header .options .links li:last-child {
		margin: 0 -30px -15px;
	}

	#header .options .links li:last-child a {
		width: 100%;
		border-radius: 0;
	}

	#header .logo {
		position: static;
		display: block;
		margin: 0 auto 10px;
	}

	#video:after,
	#footer:before {
		background-size: 148vw 100%;
		height: 18vw;
	}
	
	#content .section {
		padding-top: 40px;
		padding-bottom: 40px;
	}

	#intro .section {
		padding-top: 35px;
	}

	#intro .title {
		font-size: 37px;
		padding-bottom: 44px;
		margin-bottom: 20px;
	}

	#intro .title:before,
	#intro .title:after {
		top: auto;
		bottom: 0;
	}

	#intro .title p span {
		margin-top: 10px;
	}

	#intro .links {
		display: block;
		font-size: 22px;
	}

	#intro .links li a {
		margin: 0 auto;
	}

	#intro .welcome {
		display: block;
		text-align: center;
	}
	
	#intro .welcome .text {
		width: 100%;
	}

	#intro .welcome .image {
		margin: 0 auto 45px;
		width: 275px;
	}

	#benefits .section {
		display: block;
		text-align: center;
		padding-top: 90px;
		padding-bottom: 90px;
	}

	#benefits ul {
		margin: 0;
	}

	#benefits ul li {
		margin: 0 auto 15px;
		padding: 0;
	}

	#benefits ul li:last-child {
		margin-bottom: 0;
	}

	#benefits ul li:before {
		position: relative;
		width: 13px;
		height: 13px;
		margin-right: 6px;
	}

	#ageGroups .section {
		display: block;
		text-align: center;
		padding-top: 50px;
	}

	#ageGroups .text {
		width: 100%;
		margin-bottom: 30px;
	}

	#ageGroups .text .listing li {
		width: 100%;
		padding: 0;
	}

	#ageGroups .text .listing li p.title em {
		display: block;
	}

	#ageGroups .text .listing li p.title span {
		position: relative;
		margin: 0;
	}

	#ageGroups .text .listing li p.title span:before {
		content: "";
		display: inline-block;
		width: 20px;
		height: 20px;
		margin-right: 10px;
		border-radius: 100%;
		background: #108896;
	}

	#ageGroups .text .listing li:before {
		display: none;
	}

	#ageGroups .image {
		margin: 0 auto;
		width: 150px;
	}

	#social {
		margin-bottom: 30px;
	}

	#social .section {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
	}

	#footer .logo {
		z-index: 3;
	}

	#social .facebook {
		-webkit-box-ordinal-group: 0;
		    -ms-flex-order: -1;
		        order: -1;
		margin: 0 auto;
		width: 100%;
	}

	#social .image {
		width: 275px;
		margin-top: 30px;
		padding-top: 0;
		padding-bottom: 0;
	}

	#footer .section {
		min-height: 726px;
		padding-top: 88px;
	}

	#footer .girl {
		left: 3px;
		width: 125px;
		bottom: 272px;
	}

	#footer .boy {
		width: 150px;
		right: 4px;
		bottom: 296px;
	}

	#footer .orangeFish {
		bottom: 526px;
	}

	#footer .plant.two {
		width: 155px;
	}

	#footer .plant.one {
		width: 140px;
	}

	#footer .starFish {
		right: 16.709677%;
		bottom: 48px;
		width: 83px;
	}

	#footer .seahorse {
		width: 57px;
		left: 50.177419%;
		bottom: 151px;
	}

	#footer .bubbles.one {
		bottom: 416px;
		left: 107px;
	}

	#footer .bubbles.two {
		left: auto;
		bottom: 344px;
		right: 99px;
	}
	
}

@media only screen and (max-width : 478px) { 

}

@media only screen and (max-width : 400px) { 
	
}