/************************************************************************************
smaller than 1240
*************************************************************************************/
@media screen and (max-width: 1240px) {

	.thewrapper, .theprimary{width: 900px;}
	
	.thescrollnav a, .thenav a{font-size: 15px;}
	
	.theupdates ul li{max-width: 22%; margin: 0 6px 14px 6px;}
	
	.thesplash a section h1{font-size: 36px;}
	.thesplash a section p{font-size: 12px;}
	.thesplash a section h2{font-size: 18px; margin-top: 32px;}
	
	.splash-front h1{margin-top: 32px;}
	.splash-front p{padding-right: 500px}

	.splash-photos h1{margin-top: 32px;}
	.splash-photos p{padding-left: 510px;}

	.splash-videos h1{margin-top: 32px;}
	.splash-videos p{padding-left: 510px;}

	.splash-candids h1{margin-top: 32px;}
	.splash-candids p{padding-left: 510px;}

	.splash-camshows h1{margin-top: 32px;}
	.splash-camshows p{padding-right: 560px;}
	
	.theschedule{width: 25%;}
	.thesamples{width: 65%;}
	.thesamples > ul{padding: 10px 0 0 0;}
	
	.thecamshows > a{width: 45%;}
	
	.thejoin > form input{font-size: 24px; padding: 10px 15px;}
	.thejoin > section > ul li footer p{height: 48px;}

}

/************************************************************************************
smaller than 920
*************************************************************************************/
@media screen and (max-width: 920px) {

	/* disable webkit text size adjust (for iPhone) */
	html {
		-webkit-text-size-adjust: none;
	}

	.m-theheader, .m-thesidemenu{display: block;}
	.theheader, .thesplash, .thescrollhead{display: none;}
	
	.thewrapper, .theprimary{width: 92%;}
	.thewrapper{margin: 64px auto 20px auto;}
	
	.theupdates{margin: 0 15px;}
	.theupdates > header{text-align: center; border-bottom: 1px solid #eae9e6; padding: 15px 0; margin-bottom: 16px;}
	.theupdates > header div{display: none;}
	.theupdates > header h1{font-size: 24px; text-align: center; padding: 0; display: block;}
	.theupdates > header > .pagebutton{font-size: 16px; line-height: 32px; padding: 0 15px; margin: 5px auto 0 auto; position: relative; top: 0; display: inline-block;}
	.themedia, .listpad{padding: 0;}
	.theupdates ul li{width: 30%; max-width: 30%;}
	.theupdates > ul li a h1, .theupdates > ul li a h2, .theupdates > ul li a p{text-align: center;}
	.theupdates > ul li a h1{overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
	
	.thefooter{padding: 15px;}
	
	.theschedule{width: 29%;}
	.thesamples{width: 61%;}
	
	.thecamshows > a{width: 100%; margin: 0 0 15px 0; display: block;}
	
	.thejoin > section > h1{font-size: 36px;}
	.thejoin > section > ul li footer h1{font-size: 16px;}
	.thejoin > section > ul li footer p{font-size: 11px;}

}

/************************************************************************************
smaller than 865
*************************************************************************************/
@media screen and (max-width: 865px) {

	.thefront{min-height: 650px;}
	.theschedule{width: 32%;}
	.thesamples{width: 58%;}
	.thesamples > ul li{width: 45%;}
	.thesamples > ul li a h1, .thesamples > ul li a p{text-align: center;}
	.thesamples > ul li a p{height: 39px;}
	.thejoin > form input{font-size: 21px;}

}

/************************************************************************************
smaller than 840
*************************************************************************************/
@media screen and (max-width: 815px) {

	.thejoin > section > ul li{width: 45%;}
	.thejoin > section > ul li footer h1{font-size: 18px;}
	.thejoin > section > ul li footer p{font-size: 13px;}

}

/************************************************************************************
smaller than 770
*************************************************************************************/
@media screen and (max-width: 770px) {

	.theupdates ul li{width: 43%; max-width: 43%;}
	.theschedule{width: 38%;}
	.thesamples{width: 50%;}
	.thesamples > header h1{text-align: center;}
	.thejoin > form{padding: 18px 0 8px 0;}
	.thejoin > form input{width: 90%; font-size: 32px; margin: 0 0 15px 0;}

}

/************************************************************************************
smaller than 690
*************************************************************************************/
@media screen and (max-width: 690px) {

	.thefront{min-height: auto; text-align: center; padding: 15px;}
	.theschedule, .thesamples{width: 100%; position: relative; top: 0; left: 0; right: 0; display: inline-block;}
	.theschedule{margin: 0 auto 15px auto;}
	.thesamples{margin: 0 auto;}
	.thejoin > section > h1{font-size: 24px;}

}

/************************************************************************************
smaller than 605
*************************************************************************************/
@media screen and (max-width: 605px) {

	.thejoin > section > ul li{width: 98%; margin: 0 auto 10px auto;}

}

/************************************************************************************
smaller than 560
*************************************************************************************/
@media screen and (max-width: 480px) {

	.theupdates ul li{width: 100%; max-width: 100%; margin: 0 0 10px 0;}
	.thesamples > ul{padding: 10px 10px 0 10px;}
	.thesamples > ul li{width: 100%; margin: 0 auto 8px auto;}
	.thejoin > form input{font-size: 20px;}
	.thejoin > section > ul{padding: 20px 0 12px 0;}

}