/* ==|== media queries ====================================================== */

@media only screen and (max-width: 1020px) {
	header			{ font-size: .925em; }
	header nav a	{ margin-left: 15px; }
	
	
	
	.welcome-banner-text p 	{ font-size: 13px; }
}

@media only screen and (max-width: 950px) {	
	.welcome-banner-text p:first-child	{ display: none; }

	header			{ font-size: 1em; }
	header nav 		{ margin-top: 18px; }
	header nav a	{ margin-left: 20px; }
	
	header .phone	{ top: 75px; width: 100%; margin: 0 -20px; text-align: center; padding: 8px 20px; line-height: 1em; left: 0; right: auto; background: #5D7E95; color: #fff !important; box-shadow: 0px 2px 3px #555; }
	header .phone span,
	header .phone .blue-text	{ color: #fff !important; }
	header a[href^=tel]			{ color: #fff !important; text-decoration: none; }
	
	header .request-appointment-button { background: #fff; color: #5D7E95; border: solid 1px #fff !important; padding: 6px 8px; }
	header .request-appointment-button:hover { background: transparent; }
	
	.banners	{ margin-top:18px; }
	
	.mid-main-menu		{ display: block; position: absolute; top: 42px; right: 0; }
	.mid-main-menu a	{ margin-left: 9px; font-size: .85em; color: #666666; }
	
	.large-screen-only 	{ display: none; }

	.feature				{ width: 50%; }
	.feature:nth-child(3)	{ clear: both; }
	
	.column					{ width: 90% !important; margin-left: 5% !important; margin-right: 5% !important; margin-bottom: 12px; }
	.column.two-column		{ width: 95% !important; margin-left: 2.5% !important; margin-right: 2.5% !important; margin-bottom: 12px; }
	.contact-columns			{ width: 100% !important; padding: 0; max-width: 100000px; }
	.contact-columns .column	{ width: 40% !important; }
	
	.medication-list-column	{ width: 40% !important;  }
	
	.doctors, 
	.patient-info-links	{ width: 90%; }
}

@media only screen and (max-width: 900px) {
	.welcome-banner-text	{ top: 44%; }
	.welcome-banner-text p	{ display: none; }
	.welcome-banner-text p.mobile	{ display: block !important; }
}

@media only screen and (max-width: 720px) {
	.column.two-column		{ width: 90% !important; margin-left: 5% !important; margin-right: 5% !important; margin-bottom: 12px; }
	.contact-columns			{ width: 100% !important; padding: 0; max-width: 100000px; }
	.contact-columns .column	{ width: 40% !important;  }
	
	.doctors, 
	.patient-info-links							{ width: 100%; }
	.doctors .doctor,
	.patient-info-links .patient-info-link		{ width: 30%; margin-right: 1%; margin-left: 2%; }
	.doctors .doctor:nth-child(4n+5)			{ clear: none; }
	.doctors .doctor:nth-child(3n+4)			{ clear: both; }
	.patient-info-links .patient-info-link(4n)	{ clear: both; }
	
	footer .fixed-width	{ margin-top: 20px; }
}

@media only screen and (max-width: 630px) {
	header .request-appointment-button { display: block; width: 100%; box-sizing: border-box; margin: 5px 0 3px; }
	
	.banners  { margin-top: 55px; }
}

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

	.main-menu,
	.mid-main-menu			{ display: none; }
	
	.feature	{ clear: both; width: 90%; margin-left: 10%; }	
	
	.small-screen-only			{ display: block !important; }	
	.small-screen-menu			{ display: block; }
	.small-screen-menu li		{ position: relative;	}
	.small-screen-menu a		{ font-size: 1.5em; padding-bottom: 10px; padding-left: 30px; }
	.small-screen-menu li .small-screen-menu-content		{ display: none; }
	.small-screen-menu li:hover .small-screen-menu-content	{ display: block; }
	
	.small-screen-menu-content		{ width: 165px; position: absolute; top: left; right: -5px; top: 35px; z-index: 25; border: 4px solid #8CA3B3; background: #fff; box-shadow: 0px 3px 5px #444; }
	.small-screen-menu-content li	{ text-align: right; margin: 0; padding: 0; float: none; font-size: .9em; }
	.small-screen-menu-content a	{ font-size: 1.15em; padding: 5px 15px; display: block; border-bottom: 1px solid #8CA3B3; margin-left: 0; background: #FAFAFA; }
	.small-screen-menu-content a.last	{ border-bottom: none; 	}
}

@media only screen and (max-width: 560px) {
	.doctors .doctor,
	.patient-info-links .patient-info-link			{ width: 45%; margin-left: 2.5%; margin-right: 2.5%; }
	.doctors .doctor:nth-child(3n+4)				{ clear: none; }
	.patient-info-links .patient-info-link(4n)		{ clear: none; 	}
	.doctors .doctor:nth-child(2n+1)				{ clear: both !important;	}
	.patient-info-links .patient-info-link(2n+1)	{ clear: both !important;	}
	
	.contact-columns			{ width: 90% !important; padding: 0; max-width: 100000px; }
	.contact-columns .column	{ width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
	.contact-columns .column:nth-child(2)	{ margin-top: 25px; }
	
	.medication-list-column	{ width: 90% !important;  }
	
	ul.file-list				{ width:100%; margin:0 auto; padding: 0; }
	ul.file-list li				{ width: 100%; margin-left: 0; margin-right: 0; }
	
	
	.welcome-banner-text p.mobile	{ display: none !important; }
	.welcome-banner-text p.mobile-only	{ display: block !important; }
}


@media only screen and (max-width: 450px) {
	header .phone .divider { display: block !important; width: 100%; text-indent: -10000px; overflow: hidden; font-size: 0; height: 4px; }
	.banners	{ margin-top:75px; }
}

@media only screen and (max-width: 400px) {
	.small-screen-menu a		{ padding-left: 0; }
	
	header nav		{ clear: both; margin: 0; width: 100%; float: none; }
	header nav li	{ float: none; margin: 0; 	}
	.small-screen-menu		{ width: 100%; 	}
	.small-screen-menu a	{ display: block; float: none; text-align: center; margin: 0 0 0 !important; 	}
	header .phone	{ top: 95px; }
	header h1		{ margin: 10px auto 0; float: none; }
}

@media only screen and (max-width: 355px) {
	
	
	
	.small-screen-menu-content		{ left: 0; width: 100%; }
	.small-screen-menu-content a	{ padding-left: 15px; }

	.feature		{ margin-left: 5%; 	}
	.feature .feature-content,
	.feature img	{ width: 100%; }
	.feature .feature-content	{ margin: 0 0 12px; }
	.feature img				{ margin-bottom: 12px; }
	
	
}