/************************************************************************************ smaller than 980 *************************************************************************************/ @media screen and (max-width: 980px) { /* pagewrap */ #pagewrap { width: 95%; } /* content */ #content { width: 60%; padding: 3% 4%; } /* sidebar */ #sidebar { width: 30%; } #sidebar .widget { padding: 8% 7%; margin-bottom: 10px; } /* embedded videos */ .video embed, .video object, .video iframe { width: 100%; height: auto; min-height: 300px; } } /************************************************************************************ smaller than 650 *************************************************************************************/ @media screen and (max-width: 650px) { /* header */ #header { height: auto; } /* search form */ #searchform { position: absolute; top: 5px; right: 0; z-index: 100; height: 40px; } #searchform #s { width: 40px; } #searchform #s:focus { width: 150px; } /* main nav */ #main-nav { position: static; } /* site logo */ #site-logo { margin: 15px 100px 5px 0; position: static; } /* site description */ #site-description { margin: 0 0 15px; position: static; } /* content */ #content { width: auto; float: none; margin: 20px 0; } /* sidebar */ #sidebar { width: 100%; margin: 0; float: none; } #sidebar .widget { padding: 3% 4%; margin: 0 0 10px; } /* embedded videos */ .video embed, .video object, .video iframe { min-height: 250px; } #footer { display:none; } } /************************************************************************************ smaller than 560 *************************************************************************************/ @media screen and (max-width: 480px) { /* disable webkit text size adjust (for iPhone) */ html { -webkit-text-size-adjust: none; } /* main nav */ #main-nav a { font-size: 90%; padding: 10px 8px; } #footer { display:none; } }