_sass/_site-responsive.scss (243 lines of code) (raw):

#menu ul li.toc-categories { display:none; } #menu ul li.menu-break { display:none; } .mobile-break { display: none; } @media (min-width: 1025px) { #menu ul li.expand-menu { display: none; } } @media (max-width: 1024px) { table.intro { width: 940px; } .mw { min-width: 0px; } .breadcrumbs li:first-of-type { margin-left: 8px; } #menu ul li.logo { padding-left: 30px; } #menu ul li.expand-menu { display: none; } #menu ul li, #menu ul li.d{ display: none; } .home_txt p { width: auto; } .int_title { text-align: left; width: auto; margin: 80px 20px 0px 20px; } .int_title:after { left: 0px; } .int_text { width: auto; margin: 20px 10px 100px 20px; } #menu.force-expand ul li, #menu.force-expand ul li.d { display:inline-block; } #menu.force-expand ul li.toc-categories { display: none; } #menu.force-expand ul li ul li{ display:block; } #menu.force-expand ul li.nav, #menu.force-expand ul li#twitter-menu-item { clear:both; margin: 0 auto; } #menu ul li.logo { display: block; } #menu ul li.expand-menu { display: inline-block; float: right; } #menu ul br.menu-break { display: block; } #menu ul li.expand-menu, #menu ul li.expand-menu a { height: 50px; width: 110px; } #menu ul li.expand-menu span.expand-icon{ font-size: 24px; } #menu ul li.expand-menu span.menu-text{ margin-right:7px; position: relative; bottom: 3px; } #menu ul li.pull-right { float: right; margin-right: 10px; } /* Blog Posts */ div.post.int_text { margin: 40px 20px 20px 20px; } div.post .post-header .int_title { margin-left: 0px; } div.home-row{ padding: 0px 20px 0px 0px; } div.home-row:nth-child(odd) div.small{ width:300px; } div.home-row:nth-child(odd) div.description{ margin-left:20px; width:auto; } div.home-row:nth-child(even) div.description{ margin-left:20px; width:auto; } div.home-row:nth-child(even) div.small{ margin:0 0 15px 0; width:300px; } div.home-row div.big{ display:none; } div.home-row div.small{ display:inline-block; } table.intro { width: 100%; background: none; } } @media (max-width: 768px) { #menu.force-expand ul li.nav { clear:both; margin: 0 auto; } #menu.force-expand ul li.search-bar { clear:both; } /* Responsive Homepage 768 max width */ div.headlines.tc { margin-left: 35px; } img { max-width: 100%; } /* Search page */ div.int_search { width: 100%; } /* Fixing header slider height/width relative issues */ .headlines.tc { padding: 0px 30px; } #header .scroller .item { height: auto !important; } #header { height: auto !important; } #header .scroller, #header .scroller .item, #header .scroller .item div.headlines.tc { max-width: 100% !important; width: auto; } div#video-slider { float: none !important; margin: 60px auto 40px auto; } } @media (max-width: 570px) { br.mobile-break { display: block; } /* Responsive Menu 570 max width */ #menu.force-expand ul li.nav, #menu.force-expand ul li#twitter-menu-item { clear: both; width: 100%; margin: auto; } #menu.force-expand ul li { display:block; } #menu ul li.clear-float{ clear:both; width: 0px; display:block; } #menu ul li.search-bar { margin: 0 11px 0 20px; float: right; } #menu ul li.d { margin: 10px; clear: both; float: right; } #menu.force-expand { position: fixed; } /* Responsive Homepage 570 max width */ #header .scroller .item .tc h1{ font-size: 40px; } #header .scroller .item .tc h2 { font-size: 24px; line-height: 32px; } div.headlines a.download-headline { font-size: .7em; } #header .scroller .item div.headlines .btn { font-size: 16px; } div.alertbar { text-align: left; padding:0 25px; } div.alertbar div { display: block; padding:10px 0; } div.alertbar div:nth-child(1){ border-right:none; border-bottom:solid 1px #cc9; } div.alertbar div:nth-child(2){ border-right:none; border-bottom:solid 1px #cc9; } table.intro { width: 100%; background: none; } table.intro td { display: block; padding: 25px 0 5px 0; } table.intro td h1 { font-size: 24px; text-align: left; padding-left: 60px; } table.intro td.ag, table.intro td.fl, table.intro td.fam { background-position: 20px 23%; } table.intro p { font-size: 16px; line-height: 24px; padding: 2px 25px 15px 20px; text-align: left; } table.intro span { position: relative; bottom: 10px; padding-left: 20px; text-align: left; } }