@media only screen 
and (min-width : 200px)
and (max-width : 767px){
	#parent{ padding: 10px; }
	#flexbox{ flex-direction: column; -webkit-flex-direction: column; -webkit-box-orient: vertical; padding: 0; }
	#header{ position: relative; width: 100%; height: 170px; overflow: hidden; }
		#header #logo{ float: left; }
		#header p.contact{ float: right; }
		#header #mainnav{ position: absolute; left: 0; top: 125px; display: block; width: 100%; overflow: hidden; }
			#header #mainnav li{ float: left; width: 33%; margin: 0; text-align: center; }
	#projectthumbs{ width: 100%; height: auto; }
		#projectthumbs>p{ width: 100%; }
		#projectthumbs>div{ height: 310px; }
			#projectthumbs>div a{ width: 95px; height: 95px; margin: 0 5px 5px 0; }
	#projectpane div.content div.left{ float: none; display: block; width: 100%; height: auto; }
	#projectpane div.content div.right{ display: none; }
		#projectpane div.content div.left div.projectslider.mediumslides{ display: none !important; }
		#projectpane div.content div.left div.projectslider.mobileslides{ display: block !important; }
			#projectpane div.content div.left div.projectslider>div{ padding-top: 80px; }
			#projectpane div.content div.left div.projectslider>p.top{ position: absolute; left: 0; top: 35px; z-index: 1000; }
	#peoplepane div.content div.left{ float: none; display: block; width: 100%; height: auto; }
	#peoplepane div.content div.right{ display: none; }
		#peoplepane div.content div.left div.peopleslider.mediumslides{ display: none !important; }
		#peoplepane div.content div.left div.peopleslider.mobileslides{ display: block !important; }
			#peoplepane div.content div.left div.peopleslider>div{ padding-top: 80px; }
			#peoplepane div.content div.left div.peopleslider>p.top{ position: absolute; left: 0; top: 35px; z-index: 1000; }
	#footercntr{ position: relative; left: auto; bottom: auto; display: block; width: 100% !important; margin: 60px auto 0 !important; padding: 0; }
		#footercntr #footer{ padding: 0; }
}
@media only screen 
and (min-width : 768px)
and (max-width : 1024px) 
and (orientation : portrait) {
	#header{ width: 180px; }
	#projectpane div.content div.left div.projectslider>p span{ width: 20px; height: 20px; margin: 0 8px; }
}
@media only screen 
and (min-width : 768px)
and (max-width : 1024px) 
and (orientation : landscape) {
	#projectpane div.content div.left div.projectslider>p span{ width: 20px; height: 20px; margin: 0 8px; }
}


