html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /******************************************************************************/ /** * Tags */ body { font-family: 'Open Sans', sans-serif; font-size: 12px; color: #4B4A54; background: #fff; background: #292929; background: e0111d ; } a:link, a:visited { color: #192D67; } a:hover, a:active { color: #E71F13 } /** * Forms */ select, textarea, input[type=text], input[type=email], input[type=password] { font-family: 'Open Sans', sans-serif; font-size: 1.2em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 40px; border-radius: 0; border: 1px solid #E0DFE0; border-bottom-width: 5px; color: #5f5f5f; margin-bottom: 1rem; padding: 0.5rem 1rem; } input.large { height: 60px; line-height: 60px; } input[type=radio], input[type=checkbox] { top: 0; } label { display: inline-block; } textarea { line-height: 150%; min-height: 150px; } legend { font-size: 1.5em; margin: 1em 0; } .button { border: 1px solid #b10d17; background: #E71F13; padding: 1px; display: block; width: 100%; margin-bottom: 2em; } .button span { background: #E71F13; width: 100%; display: block; text-transform: uppercase; color: #fff; font-size: 1.9em; height: 50px; line-height: 50px; text-shadow: 1px 1px 2px rgba(0,0,0,.6); } .g-recaptcha { margin-bottom:15px; } /** * Typography */ dl { margin-bottom: 1em; } dt { color: #2C99F2; padding-bottom: .25em; font-weight: bold; } h1, h2, h3, h4, h5, h6 { color: #353535; font-family: 'Roboto Slab', serif; margin-bottom: 0.8em; } h2 { font-size: 2.5em; padding-bottom: 1em; border-bottom: 1px solid #8f8f8f; } h3 { font-size: 1.95em; } h4 { font-size: 1.5em; } h1 { font-size: 2em; text-align: center; padding: 0; margin: 0; float: left; display: inline-block; } h1 a { width: 120px; display: block; margin: auto; text-decoration: none; } h1:hover img { opacity: .5; transition: all 200ms ease-out; } h1 img { width: 100%; } strong { font-weight: 700; } p { font-size: 1em; margin-bottom: 2em; line-height: 150%; } ul, ol { margin-bottom: 2em; padding-left: 2em; } li { margin-bottom: 1em; line-height: 150%; list-style: disc; } /** * Tables */ table { box-shadow: 1px 3px 2px 0px rgba(161, 161, 161, 0.35); border: 1px solid #E0DFE0; border-radius: 3px; width: 100%; margin-bottom: 2em; } td, th { padding: 10px 10px; text-align: left; border-right: 1px solid #E0DFE0; } td { border-top: 1px solid #E0DFE0; } th { font-size: 1.1em; font-weight: bold; } tr td:first-child, tr th:first-child { background: #EFEFEF; } /** * Structure */ .crumbtrail p, .header .inner, .footer .inner, .content .inner, .account .inner, .solo-title .inner, .powered-by .inner { max-width: 1400px; margin: 0 auto; } .content { padding-bottom: 4%; border-bottom: 5px solid #BBBDBD; } #wrap { background: #fff; overflow: auto; } .main, .full, .wide, .sidebar, .filterbar { padding: 4% 3% 0% 3%; } .content .solo-title .inner { padding: 3% 0 1.5% 0; } .solo-title h2 { border: 0; padding: 0; margin: 0; } .full { max-width: 960px; margin: 0 auto; } .main { border: 0; background: #fff; } .sidebar, .filterbar { color: #5c5c5c; } .sidebar a, .filterbar a { color: #353535; text-decoration: none; } .sidebar a:hover, .filterbar a:hover { color: #353535; text-decoration: underline; } .sidebar p, .filterbar p { margin-bottom: 1em; } .sidebar hr, .filterbar hr { background: #bbbbbb; border: 0; border-bottom: 1px solid #fff; height: 2px; width: 100%; margin: 2em 0; opacity: .5; } .sidebar h2, .sidebar h3, .sidebar h4, .sidebar h5, .filterbar h2, .filterbar h3, .filterbar h4, .filterbar h5 { color: #353535; } /** * Header */ .header { background: #232121; position: relative; } /** * Alternative header styles */ .header.alt { background: #232121; z-index: 20; position: relative; } .header.alt h1 { margin-right: 5%; width: 33%; } .header.alt h1 a:hover img, .header.alt .one-planet-logo a:hover img { opacity: 0.9; } .header.alt h1 a { width: auto; } .header.alt h1 img { transition: none; width: 100%; } .header.alt .one-planet-logo { float: left; width: 17%; } .header.alt .open-data-logo { width: 40%; } /** * Regular header styles */ .open-data-logo { float: right; margin-top: 5px; width: 120px; } .open-data-logo:hover { transition: all 200ms ease-out 200ms; opacity: .6; } .open-data { width: 100%; display: block; margin: 0 auto; } .block { padding: 2.3em 1.3em; position: relative; overflow: auto; } /** * Navigation */ .nav-menu { display: none; } /** * Mobile toggle */ .mobile .nav-menu { display: block; width: 100%; margin-bottom: 1em; position: relative; top: 1em; background-color: #5C5C5C; clear: both; font-family: Lato, sans-serif; font-size: 1.3em; text-align: center; padding: .5em; box-sizing: border-box; color: #fff; text-transform: uppercase; } @media (-webkit-min-device-pixel-ratio: 1.25) { .mobile .nav-menu { background-size: 400px 900px; background-position: -123px -285px; } } .mobile .nav-menu:hover { opacity: .8; cursor: pointer; background-color: #434343; transition: all 200ms ease-out 200ms; } .navigation { clear: both; font-family: Lato, sans-serif; margin-bottom: 0; } .navigation ul { margin: 0; width: 100%; padding: 0; position: relative; top: 1em; } .navigation li { list-style: none; margin-bottom: 0; } .navigation a { color: #fff; padding: .8em; text-transform: uppercase; font-size: 1.3em; display: block; } .navigation a:hover { text-decoration: underline; } /** * Twitter feed */ .twitter-heading a { width: 64px; height: 20px; background-image: url(../images/common/sprite.png); background-position: 0px -468px; font-size: 0.4em; float: right; margin-top: 5px; text-indent: -99px; overflow: hidden; } .twitter-heading a:hover { opacity: .8; } .twitter-item { padding-left: 70px; position: relative; margin-bottom: 2em; } .twitter-avatar { position: absolute; left: 0px; top: 20px; border-radius: 3px; border: 1px solid #CFCFCF; width: 45px; height: 45px; float: left; } .twitter-avatar:after { display: block; width: 30px; height: 30px; content: ''; border: 1px solid #CFCFCF; border-right: 0; border-bottom: 0; position: absolute; top: 7px; left: 54px; z-index: 10; border-radius: 4px; background: #F6F6F6; -ms-transform: rotate(-45deg); /* IE 9 */ -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */ transform: rotate(-45deg); } .twitter-avatar img { width: 100%; } .twitter-content { width: 100%; padding: 10px 15px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #CFCFCF; background: #F6F6F6; color: #999; border-radius: 5px; line-height: 150%; font-size: 0.95em; } .twitter-content blockquote { position: relative; z-index: 11; } /** * Contact forms */ .contact-form label { font-size: 2em; font-family: 'Roboto Slab', serif; } .contact-form .control-label { text-align: left; } .footer-contact-form { padding-right: 10px; } .footer-contact-form input { display: block; height: 32px; margin: 2px 0 10px 0; } .footer-contact-form button { display: block; height: 32px; margin: 2px 0 10px 0px; padding: 0 .5em; min-width: 80px; border: 0; color: #fff; font-size: .9em; font-weight: 400; text-transform: uppercase; } .footer-contact-form .footer-error { color: #ff191d; display: block; margin-bottom: 4px; } /** * Banner */ .index-banner { position: relative; width: 100%; max-height: 200px; overflow: hidden; background-color: #000; background-position: center center; background-size: cover; background-repeat: no-repeat; } .index-banner .inner { transition: all 250ms ease-out; } .banner-spacing { width: 100%; padding-top: 40%; display: block; } .index-banner .overlay { background-color: rgba(0,0,0,.5); transition: all 250ms ease-out; } .index-banner h2 { display: none; } .index-banner fieldset { width: 80%; position: absolute; top: 2em; right: 0; left: 0; margin: auto; } /** * Search bar */ .search-bar { width: 100%; height: 60px; position: relative; margin-bottom: 2em; } .search-bar input { border: 2px solid #E9E9E9; vertical-align: middle; padding: 10px 60px 10px 20px; height: 60px; font-size: 1em; display: block; } .search-bar input:focus { box-shadow: none !important; } .search-bar input:-moz-placeholder { color: #6B6B6B } .search-bar input::-moz-placeholder { color: #6B6B6B; } .search-bar input:-ms-input-placeholder { color: #6B6B6B } .search-bar input::-webkit-input-placeholder { color: #6B6B6B; } .search-bar button { position: absolute; top: 0; right: 0; vertical-align: middle; height: 60px; width: 60px; border: 0; display: block; overflow: hidden; color: #fff; background: #192D67; text-indent: 90px; } .search-bar button:hover { background: #122049; cursor: pointer; transition: all 200ms ease-out; } .search-bar button span { background: url(../images/common/sprite.png) -264px -498px; width: 33px; height: 33px; display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; } @media (-webkit-min-device-pixel-ratio: 1.25) { .search-bar button span { background-size: 400px 900px; background-position: -170px -241px; } } .index-banner .search-bar { margin-bottom: 0; } .index-banner .search-bar input { border: none; } /** * FAQ */ .faq { margin-bottom: 1.5em; } .faq-button { background: #E71F13; color: #fff; overflow: auto; text-trasnform: uppercase; font-size: 0.9em; position: relative; text-shadow: 1px 1px 0px rgba(0,0,0,.2); border: 1px solid #b10d17; vertical-align: top; box-shadow: 1px 3px 4px 0px rgba(0, 0, 0, 0.36); margin: 0; } .faq-button a { color: #fff; overflow: hidden; } .faq-button strong { text-transform: uppercase; display: block; vertical-align: top; line-height: 140%; padding: 8px 30px 8px 10px; width: 100%; font-family: 'Open Sans', sans-serif; -moz-box-sizing: border-box; -box-sizing: border-box; box-sizing: border-box; border: 1px solid rgb(177, 13, 23); border-right: 0; text-overflow: ellipsis; float: left; overflow: hidden; cursor: pointer; } .faq-button span { line-height: 30px; background: rgb(177, 13, 23); display: block; position: absolute; top: 0; right: 0; width: 30px; height: 100%; vertical-align: top; background-image: url('../images/common/sprite.png'); background-position: -412px -657px; } .faq-button:hover strong { background: rgb(177, 13, 23); } .faq-button:hover span { background-position: -412px -658px; cursor: pointer; } .faq-button.closed span { background-position: 5px -655px; } .faq-button.closed:hover span { background-position: 5px -654px; } .faq-content { background: #F4F4F4; padding: 3%; border: 1px solid #C8C8C8; } .faq-content *:last-child { margin-bottom: 0; } /** * Crumb trail */ .crumbtrail { background: #EEEFEF; color: #353535; text-transform: uppercase; padding: 3%; position: relative; z-index: 19; font-weight: 700; box-shadow: 0px 0px 2px rgba(0,0,0,.2); } .crumbtrail a { text-decoration: none; color: #353535; } .crumbtrail a:hover { text-decoration: underline; } .crumbtrail span { text-indent: 100px; overflow: hidden; display: inline-block; height: 11px; width: 6px; position: relative; top: 1px; margin: 0 5px 0 7px; background-image: url(../images/common/sprite.png); background-position: -702px -116px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .crumbtrail span { background-size: 400px 900px; background-position: -305px -55px; } } /** * Results */ ul.results { padding-left: 0; } .results li { padding-bottom: 2em; border-bottom: 1px solid #ddd; list-style: none; margin-bottom: 2em; } .results li:last-child { padding: 0; margin: 0; border: 0; } .results a { display: block; text-decoration: none; border-left: 7px solid #EEEFEF; padding-left: 3%; } .results a:hover { border-color: #E71F13; } .results a:hover .result-title { color: #E71F13; text-decoration: underline; } .result-title { margin-bottom: 0.25em; color: #192d67; } .result-meta { font-size: 0.9em; color: #a9a9a9; margin-bottom: 1em; } .result-description { font-size: 0.9em; color: #000; } /** * Resource */ .resource-data { margin: 2em 0; } .resource-url { display: table; border-radius: 4px; overflow: hidden; width: 100%; margin-bottom: 2em; } .resource-url label, .resource-url input { display: table-cell; color: #343434; padding: 5px; border: 0; background: #F9F9F9; margin: 0; font-size: 0.9em; border: 1px solid #cfcfcf; box-shadow: inset 0px 5px 5px 0px rgba(0,0,0,0.1) } .resource-url label { width: 6%; text-align: center; font-weight: bold; border-right: 0; box-shadow: inset 0px -5px 5px 0px rgba(0,0,0,0.1) } .resource-url span { display: block; border: 1px solid #fff; width: 100%; } .download { border: 1px solid #316089; background: #67A9E0; padding: 1px; display: table; width: 100%; margin-bottom: 2em; } a.download:hover { text-decoration: none; } .download span, .download strong { text-decoration: none; display: table-cell; border: 0; height: 50px; vertical-align: middle; } .download strong { background: #4583B7; text-transform: uppercase; font-size: 1.5em; text-align: center; text-shadow: 1px 2px 0px #255985; color: #fff; text-transform: uppercase; } .download span { width: 50px; background-image: url(../images/common/sprite.png); background-position: -205px -228px; } .download:hover span { background-position: -205px -226px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .download span { background-size: 400px 900px; background-position: -32px -102px; } .download:hover span { background-position: -32px -10px; } } /** * Topic index */ .topic-index ul, .topic-master ul { padding: 0; margin: 0; overflow: auto; clear: both; padding-left: 0; } .topic-index li, .topic-master li { width: 49%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; float: left; line-height: 100%; margin-bottom: 2%; min-height: 50px; margin-left: 2%; } .topic-index li:nth-of-type(2n+1), .topic-master li:nth-of-type(2n+1) { margin-left: 0; } .topic-index ul a, .topic-master a { font-weight: bold; font-size: 0.9em; position: relative; background: #f1f1f1; box-shadow: 1px 2px 1px 0px #d8d8d8; display: block; width: 100%; height: 120px; color: #777777; text-decoration: none; padding: 10px; text-align: center; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #e3e3e3; border-top: 5px solid transparent; } .topic-index a:hover, .topic-index li.active a { border-top-color: #E71F13; background: #fff; box-shadow: none; } .topic-master a { border-top: 5px solid #D3D3D3; } .topic-master a:hover { border: 1px solid #e3e3e3; border-top: 5px solid #E71F13; background: #fff; } .topic-index img { position: absolute; margin: auto; top: 25px; left: 0; right: 0; max-width: 50px; max-height: 50px; } .topic-index span { position: absolute; bottom: 10px; margin: auto; left: 0; right: 0; } .topic-master a { display: block; padding: 3%; display: table; } .topic-master .topic-image { background: #fff; border: 1px solid #cfcfcf; position: relative; } .topic-master .topic-image img { position: absolute; top: 0; right: 0; bottom: 0; left: 0; max-width: 50px; max-height: 50px; margin: auto; } .topic-master .topic-image:before { content: ''; width: 100%; padding-top: 55%; background: #fff; display: block; } .topic-master h3 { color: #585858; margin: 1em 0; font-size: 1.2em; font-weight: 300; min-height: 2em; } .topic-master p { color: #000; font-size: 1em; font-weight: 300; margin: 0; } /** * Transparency subtopics */ .topic-index { position: relative; overflow: hidden; width:100%; } .topic-index .transparency-topics { width:100%; position: absolute; left: 100%; top:0; background-color:#fff; z-index:15; } .transparency-topics img.alignleft { float:left; width: auto; margin: 0 10px 10px 5px; position: relative; top: 0; } .topic-index .yceo-topics { width:100%; position: absolute; left: 100%; top:0; background-color:#fff; z-index:15; } .yceo-topics img.alignleft { float:left; width: auto; margin: 0 10px 10px 5px; position: relative; top: 0; } /** * Topic/Resource list */ .resource-list:after { content: ''; width: 100%; clear: both; } ul.topic-list, ul.resource-list { margin: 0; padding-left: 0; margin-bottom: .5em; } .topic-list li, .resource-list li { margin-bottom: 0; list-style: none; } .resource-list em { font-weight: 400; } .topic-list span, .resource-list span, .topic-list strong, .resource-list strong { display: table-cell; vertical-align: middle; padding: 5px 0; } .topic-list a, .resource-list a { display: table; width: 100%; text-decoration: none; color: #192d67; } .topic-list a:hover, .resource-list a:hover { color: #EC1B27; text-decoration: underline; } .resource-list a strong { padding: 0; } .resource-list li { margin-bottom: 0; } .resource-list li:last-child a { border-bottom: 0; } .resource-list a { display: block; padding: 0 10px 0 0; /*margin-left: -10px; border-bottom: 1px solid #e6e6e6; */ } .resource-list strong { padding: 0; margin: 0; } .topic-list a:hover, .resource-list a:hover { text-decoration: none; /* background: #e9e9e9; box-shadow: -5px 0px 0px 0px #a0c8ea; */ } .topic-list span, .resource-list span { width: 23%; max-width: 80px; padding-left: 0; } .topic-list span img { width: 100%; max-width: 60px; } .topic-list strong, .resource-list strong { width: 77%; padding-left: 30px; } /** * Expander */ .expander.up h3, .expander.down h3 { position: relative; cursor: pointer; } .expander.up h3:hover, .expander.down h3:hover { color: #1C3273; } .expander.up h3:after, .expander.down h3:after { content: ''; display: block; position: absolute; top: 14px; right: 0; height: 6px; width: 12px; background-image: url(../images/common/sprite.png); background-position: 0 -576px; } .expander.up h3:after { background-position: -56px -570px; } .expander.down h3:hover:after { top: 12px; } .expander.up h3:hover:after { top: 16px; } .show-less, .show-more { display: inline-block; margin-top: 5px; cursor: pointer; border-radius: 3px; padding: 5px; text-transform: uppercase; font-weight: bold; font-size: 0.8em; margin-left: -5px; color: #989898; } .show-less:hover, .show-more:hover { background: #fff; } /** * Social list */ .social-list { padding-left: 0; } .social-list li { list-style: none; } .social-list strong { font-weight: normal; } .social-list a { color: #1C3273; } .social-list a:hover { color: #EC1B27 } .social-list li a:before { position: relative; top: 2px; content: ''; display: inline-block; margin-right: 7px; opacity: .4; height: 15px; width: 15px; background-image: url('../images/common/sprite.png'); } .social-facebook a:before { background-position: 0px -554px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .social-facebook a:before { background-size: 400px 900px; background-position: 0px -262px; } } .social-twitter a:before { background-position: -15px -554px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .social-twitter a:before { background-size: 400px 900px; background-position: -15px -262px; } } .social-google a:before { background-position: -30px -554px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .social-google a:before { background-size: 400px 900px; background-position: -30px -262px; } } .social-list li a:hover:before { opacity: .5; } /** * Order by */ .order-by { width: 100%; overflow: auto; margin-bottom: 2em; padding-bottom: 2em; border-bottom: 1px solid #8f8f8f; } .order-by label { width: 40%; margin-right: 10%; text-align: right; height: 40px; line-height: 40px; color: #353535; font-family: 'Roboto Slab', serif; font-size: 1.6em; } .order-by select { float: right; width: 50%; } /** * Resource list */ .resource { border-top: 1px solid #E0DFE0; position: relative; padding: 3% 0; list-style: none; color: #585858; clear: both; margin-bottom: 20px; } .resource h4, .resource-updated { font-size: 0.9em; padding-left: 60px; margin-left: 3%; display: block; } .resource-updated { margin-bottom: 0; } /** * Resource icon */ .resource-icon { float: left; } .resource-icon, .resource-icon span { width: 50px; height: 50px; display: block; border: 1px solid #d4d4d4; word-wrap: break-word; overflow: hidden; } .resource-icon { padding: 1px; height: 52px; width: 52px; color: #fff; margin: 0; } .resource-icon span { text-align: center; font-size: 1.4em; font-weight: bold; text-transform: uppercase; text-shadow: 1px 1px 1px rgba(0,0,0,.6); line-height: 49px; border: 1px solid rgba(255,255,255,.4); background: -moz-linear-gradient(top, rgba(0,0,0,0.15) 0%, rgba(255,255,255,0.26) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.15)), color-stop(100%,rgba(255,255,255,0.26))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); /* W3C */ } .resource-icon-small { width: 50px; height: 21px; padding: 1px; display: inline-block; margin-bottom: 4px; background: #1C3273; } .resource-icon-small:hover { background: #122049; } .resource-icon-small span { text-align: center; font-size: 0.8em; font-weight: bold; color: #fff; text-transform: uppercase; text-shadow: 1px 1px 1px rgba(0,0,0,.6); line-height: 20px; display: block; overflow: hidden; /*border: 1px solid rgba(255,255,255,.4); background: -moz-linear-gradient(top, rgba(0,0,0,0.15) 0%, rgba(255,255,255,0.26) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.15)), color-stop(100%,rgba(255,255,255,0.26))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.15) 0%,rgba(255,255,255,0.26) 100%); */ } .type-doc { background: #E44945; } .type-csv { background: #FF9900; } .type-json { background: #FFCC00; } .type-xls { background: #66FF66; } .type-pdf { background: #57a2e2; } .type-ppt { background: #993366; } .resource h4 { font-size: 1.1em; font-weight: bold; font-family: 'Open Sans', sans-serif; } .resource-explore { padding: 0; margin: 0; position: relative; height: 32px; font-size: 0.8em; display: inline-block; float: right; margin-left: 10px; z-index: 100; } .resource-explore a { color: #222; display: block; height: 30px; text-decoration: none; } .resource-explore li { height: 30px; line-height: 30px; text-transform: uppercase; font-weight: bold; } .resource-button { background: #EC1B27; color: #fff; overflow: auto; position: relative; text-shadow: 1px 1px 0px rgba(0,0,0,.3); border: 1px solid #b10d17; vertical-align: top; list-style: none; box-shadow: 1px 3px 4px 0px rgba(0, 0, 0, 0.36); } .resource-button a { color: #fff; overflow: hidden; } .resource-button strong { display: inline-block; vertical-align: top; line-height: 29px; height: 28px; padding: 0 10px; border: 1px solid #EC1B27; border-right: 0; } .resource-button span { line-height: 30px; background: #EC1B27; display: inline-block; width: 30px; height: 30px; vertical-align: top; background-image: url('../images/common/sprite.png'); background-position: 5px -658px; } .resource-button:hover span { background-position: 5px -656px; cursor: pointer; } .resource-edit, .resource-preview, .resource-download { background: #f1f1f1; display: block; position: absolute; min-width: 130px; z-index: 101; box-shadow: 1px 3px 4px 0px rgba(0, 0, 0, 0.36); } .resource-edit a, .resource-preview a, .resource-download a { padding: 0 5px; } .resource-preview:hover, .resource-download:hover { background: #e1e1e1; } .resource-preview { top: 32px; display: none; } .resource-download { top: 62px; display: none; } .resource-edit { top: 92px; display: none; } .resource-explore:hover .resource-edit, .resource-explore:hover .resource-preview, .resource-explore:hover .resource-download { display: block; } /** * Disable these if a touch event exists */ .touch .resource-explore:hover .resource-edit, .touch .resource-explore:hover .resource-preview, .touch .resource-explore:hover .resource-download { display: none; } .resource-preview a:before, .resource-download a:before { content: ''; height: 13px; width: 13px; display: inline-block; background: url('../images/common/sprite.png'); position: relative; top: 2px; margin-right: 10px; left: 5px; } .resource-preview a:before { background-position: -68px -606px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .resource-preview a:before { background-size: 400px 900px; background-position: -60px -303px; } } .resource-download a:before { height: 14px; width: 14px; top: 3px; background-position: -70px -678px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .resource-download a:before { background-size: 400px 900px; background-position: -60px -340px; } } /** * Index */ .index-heading { border-bottom: 1px solid 5c5c5c; padding-bottom: 0.6em; text-transform: uppercase; position: relative; } /* .index-heading:after { content: ''; display: block; width: 140px; height: 5px; background: #408FD2; position: absolute; bottom: -3px; } */ .latest-box { border: 1px solid #122049; border-left-width: 5px; border-right: none; overflow: auto; width: 100%; display: table; text-decoration: none; color: #353535; margin-bottom: 1.5em; position: relative; } .latest-box:hover { text-decoration: none !important; } .latest-box:hover .latest-date-image { background-color: #122049; } .latest-box:hover h3 { color: #E71F13; } .latest-box div { display: table-cell; } .latest-box h3 { font-family: 'Open Sans', sans-serif; font-weight: bold; font-size: 1.6em; } .latest-date-image { width: 112px; font-size: 2em; color: #fff; font-weight: 700; text-align: left; vertical-align: middle; position: relative; overflow: hidden; background-position: center center; background-repeat: no-repeat; } .latest-date-image span { padding-left: 20px; display: block; } .latest-information { padding: 20px 40px 20px 20px; } .latest-information p { margin-bottom: 1em; } .latest-information p:last-child { margin: 0; } .latest-box.event .latest-date-image { background-color: #1C3273; } .latest-information h3:after { content: ''; display: block; position: absolute; top: 0px; right: 0; height: 100%; width: 20px; } .latest-information:hover h3:after { border-bottom: 1px solid #122049; border-top: 1px solid #6bb0eb; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .latest-information p:after { content: ''; display: block; position: absolute; top: 0; right: 2px; bottom: 0; height: 22px; width: 14px; margin: auto; background-image: url(../images/common/sprite.png); background-position: -363px -111px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .latest-information p:after { background-size: 400px 900px; background-position: -50px -50px; } } .latest-box:hover .latest-information p:after { background-position: -491px -111px; } .latest-box:hover .latest-information p:after { background-size: 400px 900px; background-position: -114px -50px; } .latest-box:hover h3:after { background-color: #F0F0F0; } .latest-date { color: #acacac; } /** * Powered by */ .powered-by .inner { overflow: auto; } .powered-by { position: relative; top: -5px; background: #232121; width: 100%; padding: 40px 5%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .logo-group { width: 100%; display: table; margin-bottom: .2em; } .logo-group:first-child { margin-bottom: 1.5em; } .logo { display: table-cell; text-align: center; padding: 0 3%; width: 50%; vertical-align: middle; margin-bottom: 30px; } .logo a { display: block; } .logo span { font-family: 'Roboto Slab', serif; display: block; text-align: center; color: #fff; font-size: 0.9em; color: #fff; text-transform: uppercase; margin-bottom: 10px; } .logo img { margin: auto; width: 100%; max-width: 140px; } .logo img:hover { opacity: .8; } /** * Powered by, alternative layout */ .powered-by.alt, .powered-by.alt .inner { overflow: visible; text-align: center; } .powered-by.alt .inner { font-size: 0; } .powered-by.alt .logo { display: inline-block; margin: 2%; max-width: 48%; padding: 0; width: auto; } .powered-by.alt .logo img { max-width: 100%; width: auto; } /** * Footer */ .footer { background: #fff; color: #232121; } .footer-title { font-weight: bold; text-transform: uppercase; font-size: 1.1em; margin-bottom: 2em; } .footer { padding: 0 5%; } .footer .section { padding: 20px 0; } .footer .inner { display: table; } .footer .section-row { display: table-row; vertical-align: top; } .footer .section { width: 50%; float: left; } .footer a, .copyright a { color: #232121; text-decoration: underline; } .footer a:hover, .copyright a:hover { opacity: .75; } .footer-nav { margin: 0; padding: 0; } .footer-nav li { margin-bottom: 1em; list-style: none; } .footer-about { margin-bottom: 1em; line-height: 100%; } .footer-twitter, .footer-facebook { text-indent: 25px; position: relative; margin-bottom: 1em; } .footer-twitter:before, .footer-facebook:before { content: ''; display: block; height: 18px; width: 18px; background: url(../images/common/sprite.png) -72px -487px; position: absolute; top: 2px; left: 0; } .footer-twitter:before { background-position: -72px -505px; } @media (-webkit-min-device-pixel-ratio: 1.25) { .footer-facebook:before { background-size: 400px 900px; background-position: -18px -243px; } .footer-twitter:before { background-size: 400px 900px; background-position: 0px -244px; } } .footer .section p:last-child, .footer .section li:last-child { margin-bottom: 0; } p.footer-about, p.footer-address { line-height: 150%; } .footer-open-data { display: inline-block; margin-bottom: .75em; } .footer-open-data img { width: 100px; display: block; border: 0; } .footer-open-data img:hover { opacity: .9; } .copyright { color: #232121; text-transform: uppercase; background: #fff; text-align: center; padding: 15px 5%; font-size: 0.9em; } .copyright p { margin: 0; } /** * CKAN Accounts */ .account { background: #BBBDBD; } .account .inner { margin: 0 auto; overflow: auto; } .account ul { display: table; margin: 0 auto; } .account li { display: table-cell; color: #fff; padding: 5px 10px; vertical-align: middle; margin-bottom: 0; text-align: center; } .account a { vertical-align: middle; color: #fff; text-decoration: none; display: inline-block; padding: 5px 10px; } .account i { text-shadow: none; } .account a:hover { background: transparent; color: #232121; border-radius: 3px; } .account a:hover i { text-shadow: none; } .account span { vertical-align: middle; font-size: 0.8em; } .account img { vertical-align: middle; margin-right: 5px; } .account .gravatar { border-radius: 50px; border: 2px solid #fff; box-shadow: 1px 1px 3px rgba(0,0,0,.5); } /** * Generic */ .error { font-size: 0.9em; padding: 3%; border-radius: 5px; background-color: #EEDCDC; border: 1px solid #CD8F8F; color: #915454; } .back-link { float: right; margin-top: 1em; } .event-image { border: 5px solid #FFF; box-shadow: 0px 0px 3px rgba(0,0,0,.4); margin-bottom: 2em; } .event-image img { display: block; } /** * CKAN Overrides */ .dataset-title { font-size: 2.1em; line-height: 140%; } .result-title { font-size: 1.65em; line-height: 140%; } .nav-tabs { padding-left: 0; } .nav-tabs li { list-style: none; } .nav-tabs a { color: #1C3273; } .tag-list { margin-bottom: 2em; } .tag-list li { margin-bottom: .25em; } .stages { padding-left: 0; } .stages li { list-style: none; } .content h1 { display: none !important; } .button-table { padding: 0; } .button-table li { float: left; margin-left: 10px; list-style: none; } .activity li { list-style: none; } .form-horizontal { margin-bottom: 2em; } .stages li { margin-bottom: 0; } .input-append, .input-prepend { font-size: 14px !important; } .select2-container-multi .select2-choices .select2-search-field input { font-family: 'Open Sans', sans-serif; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .select2-choice, .select2-default { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .select2-container .select2-choice .select2-arrow b { background-position: 1px 4px; } .select2-container .select2-choice > .select2-chosen { line-height: 34px; } .select2-container-multi.select2-container .select2-choices { border-radius: 0; border-bottom: 5px solid #E0DFE0; } .select2-container .select2-choice { border-radius: 0; border: 1px solid #E0DFE0; height: 40px; line-height: 40px; border-bottom: 5px solid #E0DFE0; } .select2-results li { margin-bottom: 0.25em; } .select2-results .select2-highlighted { background-color: #408FD2; } .control-custom input { min-width: 50px; max-width: 150px; width: 100% } .info-image { max-width: 90px; display: block; margin: 0 auto; margin-bottom: 2em; } .info-image img { width: 100%; display: block; } .input-append, .add-on, .input-prepend .add-on { line-height: 40px; height: 40px; display: inline-block; padding: 0px 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .form-horizontal .form-actions { margin: 1em 0 2em 0; padding-left: 0; padding-right: 0; } .form-horizontal .control-label { padding-top: 10px; } .nav { margin-top: 40px; } .module-content { padding: 0 3%; } .page-header { margin-top: 0; margin-bottom: 2em; } .page-header .content_action { margin-top: 13px; } .resource-view .resource-view-filters > a { font-weight: bold; } .resource-view .resource-view-filters > a::before { font-family: FontAwesome; font-weight: normal; font-style: normal; display: inline-block; content: "\f067"; margin-right: 5px; } /** * Environment */ .env { padding: 1em; text-align: center; background: #334BB9; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5); width: 100%; display: block; text-transform: uppercase; font-weight: bold; box-sizing: border-box; } .env.development { background: #E02700; } .env.staging { background: #F26522; } /** * CKAN Stats */ .nums { display: table; width: 100%; } .nums dt { color: #4e6d87; } .nums dl { margin: 0; display: table-cell; } .nums dd { font-size: 3em; color: #2C97F2; font-weight: 700; } /** * CKAN Buttons */ .btn, .btn:hover { background: #e0111d; border: 1px solid #b10d17; border-radius: 0; text-transform: uppercase; font-family: 'Open Sans', sans-serif; padding: 15px 36px; font-size: 1.1em; font-weight: 500; text-shadow: 1px 1px 1px rgba(0,0,0,.3); color: #fff !important; } .btn:hover { opacity: .8; } .pill { border-radius: 3px; background: #1C3273; } .remove i { color: #fff; } .remove:hover i { color: #fff; text-decoration: none; opacity: .75; } /** * Home page */ .landing-intro { margin: 2em 0; } .landing-intro:after { clear: both; content: ""; display: block; } .landing-intro .column + .column { border-top: 1px solid #8e8e8e; margin-top: 2em; padding-top: 2em; } .landing-intro .image { float: right; margin: 0 0 1em 1em; max-width: 33%; } .landing-intro h3 { font-size: 2.5em; text-transform: uppercase; } .landing-intro p { margin-bottom: 1em; } .landing-logos { margin: 2em 0; } .landing-logos:after { clear: both; content: ""; display: block; } .landing-logos ul { margin: 0; padding: 0; } .landing-logos li { display: block; float: left; height: 0; overflow: hidden; padding-top: 25%; position: relative; width: 33%; } .landing-logos img { max-height: 95%; max-width: 95%; left: 50%; position: absolute; top: 50%; transform: translate(-50%, -50%); } .landing-side-more { color: #999; text-transform: uppercase; } .landing-side-more a { color: inherit; } .landing-twitter-feed { margin: 2em 0; } .landing-twitter-feed ul { margin: 2em 0; padding: 0; } .landing-twitter-feed li { display: block; margin: 10px 0; min-height: 60px; position: relative; } .landing-twitter-feed .author { position: absolute; left: 0; top: 10px; width: 60px; } .landing-twitter-feed .content { background-color: #f6f6f6; border: 1px solid #cdcdcd; border-radius: 4px; color: #999; margin-left: 85px; overflow: visible; padding: 5px 15px; position: relative; } /* arrows */ .landing-twitter-feed .content:before, .landing-twitter-feed .content:after { border-color: transparent; border-style: solid; content: ""; height: 0; position: absolute; width: 0; } .landing-twitter-feed .content:before { border-right-color: #cdcdcd; border-width: 21px; left: -42px; top: 14px; } .landing-twitter-feed .content:after { border-right-color: #f6f6f6; border-width: 20px; left: -40px; top: 15px; } .landing-twitter-feed .content a { color: #333; } .landing-twitter-feed .content p { margin: 0.5em 0; } .landing-twitter-feed .content .meta { font-weight: bold; } /** * Information and events category links */ .yod-category-links { margin-bottom: 2em; } .yod-category-links ul { margin: 0; padding: 0; } .yod-category-links li { display: block; margin: 0.5em 0; } .yod-category-links a { background: #e71f13; color: white; display: block; font-size: 1.25em; font-weight: bold; padding: 1em; text-align: center; text-transform: uppercase; } .yod-category-links a:hover { background: #e9352b; text-decoration: none; } .yod-category-links .active a { background: #eeefef; color: #333; } 

@media screen and (min-width: 400px) {

/** * Header */ .open-data-logo { margin-right: 75px; } /** * Alternative header styles */ .header.alt h1 { margin-right: 20px; width: 120px; } .header.alt .one-planet-logo { margin-right: 20px; width: 60px; } .header.alt .open-data-logo { float: left; width: 120px; } /** * Navigation */ .mobile .nav-menu { display: block; width: 48px; height: 48px; position: absolute; top: 2em; right: 1.3em; background-color: #5C5C5C; background-image:url(../images/common/sprite.png); background-position: -208px -594px; text-indent: -990px; overflow: hidden; } @media (-webkit-min-device-pixel-ratio: 1.25) { .mobile .nav-menu { background-size: 400px 900px; background-position: -123px -285px; } } .mobile .nav-menu:hover { opacity: .8; cursor: pointer; background-color: #434343; transition: all 200ms ease-out 200ms; } .index-banner fieldset { top: 2em; } /** * Powered by, alternative layout */ .powered-by.alt .logo { max-width: 32%; } 

}

@media screen and (min-width: 500px) {

/** * Tags */ h1, h1 a { width: 150px; } body { font-size: 13px; } /** * Structure */ /** * Header */ .open-data-logo{ width: 150px; } .navigation { font-size: .9em; } /** * Banner */ .banner-search { width: 90%; margin: 0 auto; } .index-banner h2 { display: block; font-size: 2em; color: #fff; text-align: center; font-family: Lato, sans-serif; font-weight: 400; text-shadow: 1px 1px rgba(0, 0, 0, 0.5), 0 0 20px rgba(0, 0, 0, 0.25); border: 0; } .index-banner { max-height: 400px; } /** * Crumbtrail */ .crumbtrail { padding: 2% 3%; } /** * Topic index */ .topic-master a { padding: 6%; text-align: left; } .topic-master h3 { margin-bottom: 0.5em; } .topic-master h3 { font-size: 1.2em; min-height: 3.5em; } .topic-index li, .topic-master li { width: 32%; margin-bottom: 2%; } .topic-index li:nth-of-type(1n), .topic-master li:nth-of-type(1n) { margin-left: 2%; } .topic-index li:nth-of-type(3n+1), .topic-master li:nth-of-type(3n+1) { margin-left: 0; }

}

@media screen and (min-width: 600px) {

 /** * Structure */ /** * Banner */ .index-banner fieldset { top: 4em; } .index-banner h2 { top: 3em; font-size: 2.5em; } /** * Navigation */ .mobile .nav-menu { right: 2.2em; } .open-data-logo { margin-right: 105px; } /** * Banner */ .index-banner { max-height: 400px; } .banner-spacing { padding-top: 60%; } /** * Order by */ .order-by label { display: inline-block; width: auto; text-align: right; float: left; margin-right: 30px; } .order-by select { float: left; width: 30%; } /** * Powered by */ .logo-group, .logo-group:first-child { float: left; width: 50%; margin-bottom: .2em; } .logo img { max-width: 200px; } /** * Footer */ .footer .section-row { display: table-cell; width: 50%; } .footer .section { display: table-cell; }

}

@media screen and (min-width: 700px) {

/** * Tags */ body { font-size: 14px; } /** * Structure */ .block { padding: 1.8em 2em; overflow: auto; } /** * Header */ h1, h1 a { width: 190px; } .open-data-logo { width: 190px; } /** * Banner */ .index-banner h2 { font-size: 2.7em; } .banner-search input { height: 60px; line-height: 60px; } .banner-search button { height: 60px; width: 60px; } /** * Crumb trail */ .crumbtrail { padding: 1% 3%; } /** * Resources */ .resource-table { overflow: visible; margin-bottom: 3%; padding-left: 0; } .resource-table:after { content: ''; height: 1px; width: 100%; clear: both; display: block; } .resource-type { position: relative; top: 3px; } .resource { width: 47%; float: left; clear: none; margin-right: 6%; margin-bottom: 0; } .resource:nth-of-type(2n) { margin-right: 0; } .resource-updated { font-size: .8em; } /** * Results */ .results a, .results { clear: both; overflow: auto; } .resource-information { padding-right: 3%; width: 80%; float: left; } .result-description { margin: 0; } .resource-types { float: right; text-align: right; width: 15%; } .resource-type-small { margin: 0 0 5px 5px; } /** * Information and events category links */ .yod-category-links { margin-left: -0.5em; margin-right: -0.5em; } .yod-category-links ul { display: table; table-layout: fixed; width: 100%; } .yod-category-links li { display: table-cell; padding: 0.5em; } 

}

@media screen and (min-width: 800px) {

 /** * Banner */ .index-banner h2 { font-size: 2.85em; } /** * Latest */ .latest-information p { font-size: 0.9em; } .topic-master h3 { font-size: 1.2em; min-height: 2em; } /** * Home page */ .landing-intro .column { float: left; width: 45%; } .landing-intro .column + .column { border-left: 1px solid #8e8e8e; border-top: 0; float: right; margin-top: 0; padding-left: 5%; padding-top: 0; } .landing-intro .image { max-width: none; } .landing-intro .image img { max-height: 5em; } .landing-intro h3 { padding-top: 1em; } 

}

@media screen and (min-width: 900px) {

/** * Tags */ /** * Banner */ .index-banner .search-bar { max-width: 70%; margin: 0 auto; } .index-banner h2 { font-size: 3em; } .index-banner fieldset { top: 4em; } /** * Header */ .open-data-logo { width: 130px; position: absolute; top: 3em; right: 2em; margin: 0; } /** * Navigation */ .navigation { clear: none; position: relative; top: 1em; float: right; right: 0; font-size: .8em; margin-right: 130px; padding-right: 2em; } .navigation ul { display: block; width: 100%; text-align: right; } .navigation li { display: inline-block; text-align: right; } .navigation a { padding: 1em 1.2em; } /** * Alternative header navigation styles */ .header.alt .navigation { float: left; margin-right: 0; top: 0; width: 480px; } .header.alt .navigation ul { text-align: center; top: 0; } .header.alt .navigation a { padding: 0.5em 1.25em; } /** * Banner */ /** * Contact form */ .contact-form { display: block; margin-bottom: 4em; } /** * Structure */ .content { padding-bottom: 0; } .content .inner { padding: 0 3% 3% 3%; } .content-background { /*background: url(../images/common/content-background.png) center center;*/ } .content, .content .inner { overflow: hidden; } .main, .sidebar, .filterbar { padding-left: 0; padding-right: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .main { float: left; width: 70%; padding-top: 3%; } .main-right { float: right; margin-bottom: -99999px; padding-bottom: 99999px; background: #fff; padding-left: 3%; } .main-left { float: left; margin-bottom: -99999px; padding-bottom: 99999px; background: #fff; padding-right: 3%; } .sidebar, .filterbar { float: right; width: 27%; margin-right: 3%; padding-top: 3%; } .sidebar { margin-left: 3%; margin-right: 0; } .filterbar { margin-bottom: -99999px; padding-bottom: 99999px; float: left; /*background: #F3F3F3;*/ } .filterbar-right { float: right; margin-right: 0; margin-left: 3%; background: #fff; } .filterbar-white { background: #fff; padding-top: 0; padding-right: 6%; margin-top: 3%; border-right: 1px solid #E0DFE0; } .filterbar-white .border { } /** * Filters */ .show-less, .show-more { margin-top: 0px; } /** * Topics */ .topic-master h3 { min-height: 3em; } /** * Topics */ .topic-master li { width: 30%; margin-bottom: 4%; } .topic-master li:nth-of-type(1n) { margin-left: 5%; } .topic-index li:nth-of-type(3n+1), .topic-master li:nth-of-type(3n+1) { margin-left: 0; } /** * Footer */ .footer-title { margin-top: 2em; position: relative; z-index: 1; } .footer-title { position: relative; } .footer .section { padding: 10px 0 30px 0; } /** * CKAN Accounts */ .account ul { float: right; } /** * "Powered by" section in YCEO landing page */ .powered-by.alt .inner { padding: 0; } 

}

@media screen and (min-width: 960px) {

 /** * Header */ .open-data-logo { width: 150px; } /** * Navigation */ .navigation { margin-right: 150px; } .topic-master h3 { min-height: 3em; } .footer-contact-form input { width: 50%; display: inline-block; } .footer-contact-form button { width: 34%; display: inline-block; min-width: 80px; } /** * Home page */ .landing-logos img { max-height: 90%; max-width: 90%; } /** * Powered by, alternative layout */ .powered-by.alt .inner { display: table; table-layout: fixed; width: 100%; } .powered-by.alt .logo { display: table-cell; margin: 0; max-width: none; padding: 0 20px; } 

}

@media screen and (min-width: 1100px) {

 /** * Header */ .open-data-logo { width: 170px; top: 2.8em; } /** * Alternative header style */ .header.alt > .inner { height: 100px; } .header.alt h1 { margin-right: 40px; width: 150px; } .header.alt .one-planet-logo { padding-top: 10px; width: 75px; } .header.alt .open-data-logo { margin-top: 10px; width: 170px; } .header.alt .navigation { margin-top: 20px; } /** * Banner */ .index-banner h2 { font-size: 3.2em; } .index-banner .search-bar { max-width: 55%; } /** * Topic index */ .topic-master h3 { min-height: 2em; } .topic-index li { width: 18%; margin-bottom: 2.5%; } .topic-index li:nth-of-type(1n) { margin-left: 2.5%; } .topic-index li:nth-of-type(5n+1) { margin-left: 0; } /** * Navigation */ .navigation { margin-right: 170px; } 

}

@media screen and (min-width: 1200px) {

/** * Alternative header styles */ .header.alt .navigation { float: right; position: absolute; right: 200px; top: 40px; width: 640px; } .header.alt .navigation ul { text-align: right; } /** * Download */ .download { max-width: 80%; } /** * Banner */ .index-banner fieldset { top: 5em; } /** * Title block */ .title-block h2 { float: left; margin: 0; width: 60%; border: 0; padding: 0; } .title-block { overflow: auto; padding-bottom: 2em; margin-bottom: 2em; border-bottom: 1px solid #ddd ; } .title-block .order-by { border: 0; margin: 0; padding: 0; } /** * Order by */ .order-by { float: right; width: 40%; overflow: auto; } .order-by select { float: right; width: 40%; } .order-by label { float: left; width: 50%; margin-right: 10%; text-align: right; } /** * Home page */ .landing-intro .image img { max-height: 7em; } .landing-logos img { max-height: 75%; max-width: 75%; } 

}

@media screen and (min-width: 1700px) {

 .env { position: absolute; top: 0; left: 0; width: 300px; z-index: 100; box-shadow: 1px 1px 5px rgba(0,0,0,.6); -ms-transform: rotate(-45deg); /* IE 9 */ -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */ transform: rotate(-45deg); left: -95px; top: 35px; } 

}