/* Running Squiz Matrix Developed by Squiz - http://www.squiz.net Squiz, Squiz Matrix, MySource, MySource Matrix and Squiz.net are registered Trademarks of Squiz Pty Ltd Page generated: 21 September 2015 08:38:30 */ /* 2015-09-21 */ @media all and (max-width: 800px) { .main-content, .article-page .main-content { width: 65%; } .article-page .main-content p{ max-width: 100%; } nav#main-nav .top-nav li{ float: left; } nav#main-nav .top-nav li a{ height: 58px; } .sub-nav-wrapper{ width: 33%; } #top-content{ background-color: #eeeeee; margin-bottom: 1em; } #top-content div[class*="module"]{ border: none; margin:0 1% 1em; width: 48%; min-height: 0; } .main-content div[class*="module"].module-3-3{ width: 100%; } .main-content div[class*="module"].intro-box, .main-content div[class*="module"].featured-module, .main-content #top-story[class*="sub-module"]{ width: 100%; } .main-content div[class*="module"].intro-box { width: 100%; } .main-content div[class*="module"]{ margin:1 .9% 1em; width: 48%; } div[class*="sub-module"] > div{ float: left; } .index-list-divider{ display: none; } #top-content #top-story{ border-bottom: 1px solid #e2e2e2; width: 98% } #top-content #top-story > *{ display: block; float: left; margin-right: 2%; width: 48% } #top-content #top-story img{ clear: left; } #footer-featured .module-1-6{ height: auto; min-height:auto; width: 33.333%; } #contact-us.footer-box{ width: 25% } #contact-us.footer-box h3{ margin-left: 0; } #contact-us.footer-box img{ float: none; } #contact-us.footer-box p{ float: none; margin: 0; } #utilities{ display: none; } .main-content .featured-publication.height-185, .main-content div[class*="module"].searchbar{ height: auto; width: 100%; } } @media all and (max-width: 560px) { body, #page-wrap, header{ margin: 0; padding: 0; width: 100% } nav#main-nav .top-nav li a{ font-size: 1.6em; padding: 0px 1.2em; } #breadcrumb{ display: none; } img{ height: auto; width: 100% !important; } #top-content #top-story *{ float: none; width: 100%; } #content, .main-content, .article-page .main-content{ border-left: none; padding: 10px; width: 100% } #logo{ float: none; top:auto; background-size: 70% auto; } #header-searchbar{ float: none; margin:0; padding: 0; } #header-searchbar p{ margin: 0; } #searchbar-icon{ background:transparent url('http://www.euro.who.int/__data/assets/image/0010/200206/search-icon.png?v=0.1.1') center center no-repeat; display: block; height: 31px; position: absolute; right: 0; top:-2.8em; text-indent: -999em; width: 31px; } #header-searchbar { width: 95%; margin: 0 1em; } #header-searchbar form{ display: none; padding-bottom: 1em; } #header-searchbar input{ margin: 0; } #header-searchbar input[type="text"]{ height: 34px; width: 70% } #header-searchbar input[type="submit"]{ height: 34px; width: 30%; } #languagebar{ float: none; margin: 0; position: absolute; right: 1em;top:1em; text-align: center; width: 100px; z-index:941; } #languagebar ul, #languagebar li{ float: none; padding: 0; margin: 0; } #languagebar li{ display: none; list-style:none; } #languagebar li.current-language{ display: block; } #languagebar a{ background-color: #e2e2e2; border: 1px solid #cdcdcd; display: block; padding: 5px 0; text-decoration: none; } #languagebar li.current-language a{ background-color: #fff; font-weight: normal; text-decoration: none; } nav#main-nav .top-nav li{ border-bottom: 1px solid #f0f0f0; border-right: none; float: none; margin: 0; width: 100% } nav#main-nav .top-nav li a{ padding: 15px; } nav#main-nav .top-nav li a:after{ display: none; } header .partners{ display: none; } footer .partners a{ width:12%; } .share{ display: none; } /* * SUB-NAV */ .sub-nav-wrapper{ width: 100%; } .sub-nav li a{ display: block; font-size: 16px; padding:5px; } .sub-nav ul, .sub-nav ul ul{ padding-left: 0; } div[class*="module"] .sub-nav ul ul{ background-color: #e2e2e2; text-indent: 0; } .sub-nav ul ul ul{ background-color: #C9C9C9; text-indent: 0em; } div[class*="module"] .sub-nav ul ul li a { padding-left: 1em; } .grid-layout-3 li{ min-height: 180px; padding: 0 1%; width: 50%; } .article-content figure{ float: none; height: auto; width: 100%; } .article-content .quote, .article-content .article-aside{ border-bottom: 1px solid #e2e2e2; border-left:none; margin:0 5% 1em; padding-bottom: 1em; max-width: 90%; width:90%; } /* * Footer */ #footer-featured .module-1-6{ border-right:none; float: left; height: auto; min-height:auto; width: 50%; } .footer-box{ border-right: none; float: none; min-height:1px; padding: 0; width: 100%; } .footer-box h3{ padding: 0 10px 10px 1em; position: relative; } .footer-box li{ font-size: 16px; } .footer-box .toggle-footer-box{ color: #EBF2F7; display: block; position: absolute; right:10px; top:0; z-index: 1; /* Place on top of h3 */ } .footer-box h3 .active{ transform: rotate(180deg); -ms-transform: rotate(180deg); /* IE 9 */ -webkit-transform: rotate(180deg); /* Safari and Chrome */ } .footer-box-content{ background-color:#09436B; box-shadow:inset 0 0 5px rgba(0,0,0,.2); display: none; padding: 1em; } .footer-box-content *{ margin: 0; padding: 0; } #top-content div[class*="module"]{ border-bottom: 1px solid #ccc; border-right: none; min-height: auto; height: auto; margin:0 0 1em 0; width:100%; } .topic-site #top-content div[class*="module"]{ min-height: auto; } .main-content div[class*="module"], div[class*="module"]{ border: none; border-bottom:1px solid #e2e2e2; float: none; margin: 0; width: 100%; } #data-and-evidence div{ border-bottom: 1px solid #e2e2e2; border-right: none; float: none; margin-right: 0; margin-bottom: 1em; width: 100% } #top-story.featured-publication img{ max-width: 20%; } #latest-publications li{ clear: both; } #latest-publications li img, #latest-publications li div{ display: block; float: left; } #latest-publications li img{ max-width: 22% !important; } .main-content div.sub-module-2 > div{ padding-top: 1em; } .sub-module-2.intro-box .sub-module-first{ width: 100%; } .sub-module-2.intro-box .sub-module-last{ width: 100%; } #latest-publications li div{ margin-left: 3%; vertical-align: top; width: 70% } #footer-featured .module-1-4{ border-right: none; border-bottom: 4px solid #fff; float: none; width: 100% } .more{ font-size: 0.9em; text-align: right; } .sub-nav li.has-children:after { content: '▶'; position: absolute; right: 1em; top: 0.5em; } .sub-nav li.has-children span { position: absolute; background: none; top: 0; right: 0; height: 24px; width: 40px; left: auto; } .index-list{ background:rgba(255,255,255,.7); border:1px solid #333 !important; float: none !important; right:0 !important; padding-bottom: 0 !important; padding-top: 0 !important; position: absolute !important; width: 2em !important; z-index: 1000; } .index-list a{ border-bottom:1px solid #333; display: block; margin: 0; padding:5px 0; text-align: center; } .index-list a:last-child{ border-bottom: none; } }