@charset "utf-8"; /* -------------------------------------------------------------------- Base Styles Author: Netmatter Ltd Author URI: http://www.netmatter.co.uk/ :: Typography, body font 100%/16px :: font rem for root level em of body :: font px as a fall back for old browsers :: em for fluid margin, padding & line-height -------------------------------------------------------------------- */ /* html5doctor.com Reset Stylesheet v1.6.1 http://html5doctor.com/html-5-reset-stylesheet/ Richard Clark http://richclarkdesign.com http://cssreset.com */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, a, blockquote, pre, address, cite, code, em, img, q, small, strong, sub, sup, b, i, dl, dt, dd, ol, ul, li, hr, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figcaption, figure, footer, header, main, menu, nav, section, time, mark, video { margin:0; padding:0; border:0; outline:0; font-size:100%; /*font-weight:normal;*/ font-style: normal; background:transparent; } article, aside, figcaption, footer, header, main, menu, nav, section { display:block; } figure { display:block; } img { display:inline-block; } body { line-height:1; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } /* ----------------------------------------------- :: Root ----------------------------------------------- */ :lang(en) { /* set british english language quotation marks change language (...) depending on html declaration 2018 - left single (high 6) 2019 - right single (high 9) 201C - left double (high 9s) 201D - right double (high 9s) ASCII if desired 0022 - double 0027 - single */ quotes:"\2018" "\2019" "\201C" "\201D"; } *, *:before, *:after { /* fix the box model - http://www.paulirish.com/2012/box-sizing-border-box-ftw/ IE8 - requires browser to be in IE8 Standards mode - use this tag in the head */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { /* By default, iOS enlarges the text size so it reads more comfortably. Disable the adjustment */ -webkit-text-size-adjust:none; /* keep long text and urls wrapped in content */ word-wrap: break-word; } /* ----------------------------------------------- ::Grid row & column - margin and pad ------------------------------------------------- */ /* margin rows and cls, (but not .row .row) */ .space-15 { margin:1em auto 1em auto !important; } .spacet-15 { margin-top:1em !important; } .spaceb-15 { margin-bottom:1em !important; } .space-25 { margin:1.5em auto 1.5em auto !important; } .spacet-25 { margin-top:1.5em !important; } .spaceb-25 { margin-bottom:1.5em !important; } .space-30 { margin:2em auto 2em auto !important; } .spacet-30 { margin-top:2em !important; } .spaceb-30 { margin-bottom:2em !important; } .space-50 { margin:3em auto 3em auto !important; } .spacet-50 { margin-top:3em !important; } .spaceb-50 { margin-bottom:3em !important; } .space-75 { margin:4.5em auto 4.5em auto !important; } .spacet-75 { margin-top:4.5em !important; } .spaceb-75 { margin-bottom:4.5em !important; } .space-100 { margin:6em auto 6em auto !important; } .spacet-100 { margin:6em auto 0 auto !important; } .spaceb-100 { margin:0 auto 6em auto !important; } /* pad rows only */ .pad-10 { padding:0.75em 0; } .padt-10 { padding:0.75em 0 0 0; } .padb-10 { padding:0 0 0.75em 0; } .pad-15 { padding:1em 0; } .padt-15 { padding:1em 0 0 0; } .padb-15 { padding:0 0 1em 0; } .pad-25 { padding:1.5em 0; } .padt-25 { padding:1.5em 0 0 0; } .padb-25 { padding:0 0 1.5em 0; } .pad-30 { padding:2em 0; } .padt-30 { padding:2em 0 0 0; } .padb-30 { padding:0 0 2em 0; } .pad-50 { padding:3em 0; } .padt-50 { padding:3em 0 0 0; } .padb-50 { padding:0 0 3em 0; } .pad-75 { padding:4.5em 0; } .padt-75 { padding:4.5em 0 0 0; } .padb-75 { padding:0 0 4.5em 0; } .pad-100 { padding:6em 0; } .padt-100 { padding:6em 0 0 0; } .padb-100 { padding:0 0 6em 0; } /* pad cls only */ .padc-20 { padding-top:1.25em; padding-right:0.75em; padding-left:0.75em; padding-bottom:1.25em; } .padct-20 { padding-top:1.25em; padding-right:0.75em; padding-left:0.75em; } .padcb-20 { padding-right:0.75em; padding-left:0.75em; padding-bottom:1.25em; } .padc-50 { padding-top:3em; padding-right:0.75em; padding-left:0.75em; padding-bottom:3em; } .padct-50 { padding-top:3em; padding-right:0.75em; padding-left:0.75em; } .padcb-50 { padding-right:0.75em; padding-left:0.75em; padding-bottom:3em; } .padc-75 { padding-top:4.5em; padding-right:0.75em; padding-left:0.75em; padding-bottom:4.5em; } .padct-75 { padding-top:4.5em; padding-right:0.75em; padding-left:0.75em; } .padcb-75 { padding-right:0.75em; padding-left:0.75em; padding-bottom:4.5em; } .padc-100 { padding-top:6em; padding-right:0.75em; padding-left:0.75em; padding-bottom:6em; } .padct-100 { padding-top:6em; padding-right:0.75em; padding-left:0.75em; } .padcb-100 { padding-right:0.75em; padding-left:0.75em; padding-bottom:6em; } /* ----------------------------------------------- ::Float clearing -------------------------------------------------- */ * html .row, * html .collapse, * html .cf, * html .clearfix { overflow:visible; } *+html .row, *+html .collapse, *+html .cf, *+html .clearfix { min-height:1%; } .row:after, .collapse:after, .cf:after, .clearfix:after { clear:both; content:""; display:block; height:0; visibility:hidden; font-size:0; } /* ----------------------------------------------- ::Grid -------------------------------------------------- */ .hide, .show-480, .show-600, .show-768, .show-800, .show-1024 { display:none; } .row { margin:0 auto 0 auto; width:100%; min-width:20em; max-width:37.5em /* 600px; */ } .row .row { margin-bottom:0; margin-left:-0.75em; margin-right:-0.75em; width:auto; min-width:0; max-width:none; *zoom:1; } .row .row.collapse { width:auto; margin:0; max-width:none; } .maxw-600 { margin: 0 auto 5em auto !important; max-width: 600px !important; } .maxw-800 { margin: 0 auto 5em auto !important; max-width: 800px !important; } .maxw-1024 { margin: 0 auto 5em auto !important; max-width: 1024px !important; } .maxw-1200 { margin: 0 auto 5em auto !important; max-width: 1200px !important; } .maxw-1400 { margin: 0 auto 5em auto !important; max-width: 1400px !important; } .maxw-1600 { margin: 0 auto 5em auto !important; max-width: 1600px !important; } .cls { position:relative; float:left; width:100%; padding-right:0.75em; padding-left:0.75em; } .row.collapse .cls { position:relative; padding-left:0; padding-right:0; float:left; } @media only screen { .cls { position:relative; float:left; padding-right:0.75em; padding-left:0.75em; } .w320-1 { width:8.33333%; } .w320-2 { width:16.66667%; } .w320-25 { width:20%; } .w320-3 { width:25%; } .w320-4 { width:33.33333%; } .w320-5 { width:41.66667%; } .w320-6 { width:50%; } .w320-7 { width:58.33333%; } .w320-8 { width:66.66667%; } .w320-9 { width:75%; } .w320-95 { width:80%; } .w320-10 { width:83.33333%; } .w320-11 { width:91.66667%; } .w320-12 { width:100%; } } @media only screen and (min-width:22.5em) { /* min-width:360px; */ .w360-1 { width:8.33333%; } .w360-2 { width:16.66667%; } .w360-3 { width:25%; } .w360-35 { width:30%; } .w360-4 { width:33.33333%; } .w360-5 { width:41.66667%; } .w360-6 { width:50%; } .w360-7 { width:58.33333%; } .w360-8 { width:66.66667%; } .w360-85 { width:70%; } .w360-9 { width:75%; } .w360-10 { width:83.33333%; } .w360-11 { width:91.66667%; } .w360-12 { width:100%; } } @media only screen and (min-width:30em) { /* min-width:480px; */ .w480-1 { width:8.33333%; } .w480-2 { width:16.66667%; } .w480-3 { width:25%; } .w480-35 { width:30%; } .w480-4 { width:33.33333%; } .w480-5 { width:41.66667%; } .w480-6 { width:50%; } .w480-7 { width:58.33333%; } .w480-8 { width:66.66667%; } .w480-85 { width:70%; } .w480-9 { width:75%; } .w480-10 { width:83.33333%; } .w480-11 { width:91.66667%; } .w480-12 { width:100%; } .w480push-1 { left:8.33333%; right:auto; } .w480pull-1 { right:8.33333%; left:auto; } .w480push-2 { left:16.66667%; right:auto; } .w480pull-2 { right:16.66667%; left:auto; } .w480push-3 { left:25%; right:auto; } .w480pull-3 { right:25%; left:auto; } .w480push-35 { left:30%; right:auto; } .w480pull-35 { right:30%; left:auto; } .w480push-4 { left:33.33333%; right:auto; } .w480pull-4 { right:33.33333%; left:auto; } .w480push-45 { left:37%; right:auto; } .w480pull-45 { right:37%; left:auto; } .w480push-5 { left:41.66667%; right:auto; } .w480pull-5 { right:41.66667%; left:auto; } .w480push-6 { left:50%; right:auto; } .w480pull-6 { right:50%; left:auto; } .w480push-7 { left:58.33333%; right:auto; } .w480pull-7 { right:58.33333%; left:auto; } .w480push-75 { left:63%; right:auto; } .w480pull-75 { right:63%; left:auto; } .w480push-8 { left:66.66667%; right:auto; } .w480pull-8 { right:66.66667%; left:auto; } .w480push-85 { left:70%; right:auto; } .w480pull-85 { right:70%; left:auto; } .w480push-9 { left:75%; right:auto; } .w480pull-9 { right:75%; left:auto; } .w480push-10 { left:83.33333%; right:auto; } .w480pull-10 { right:83.33333%; left:auto; } .w480push-11 { left:91.66667%; right:auto; } .w480pull-11 { right:91.66667%; left:auto; } .show-480 { display: block; } } @media only screen and (min-width:33.75em) { /* min-width:540px; */ .w540-1 { width:8.33333%; } .w540-2 { width:16.66667%; } .w540-3 { width:25%; } .w540-35 { width:30%; } .w540-4 { width:33.33333%; } .w540-5 { width:41.66667%; } .w540-6 { width:50%; } .w540-7 { width:58.33333%; } .w540-8 { width:66.66667%; } .w540-85 { width:70%; } .w540-9 { width:75%; } .w540-10 { width:83.33333%; } .w540-11 { width:91.66667%; } .w540-12 { width:100%; } } @media only screen and (min-width:37.5em) { /* min-width:600px; */ .row { max-width:50em; } .w600-1 { width:8.33333%; } .w600-2 { width:16.66667%; } .w600-3 { width:25%; } .w600-35 { width:30%; } .w600-4 { width:33.33333%; } .w600-5 { width:41.66667%; } .w600-6 { width:50%; } .w600-7 { width:58.33333%; } .w600-8 { width:66.66667%; } .w600-85 { width:70%; } .w600-9 { width:75%; } .w600-10 { width:83.33333%; } .w600-11 { width:91.66667%; } .w600-12 { width:100%; } .w480push-1 { left:8.33333%; right:auto; } .w600pull-1 { right:8.33333%; left:auto; } .w600push-2 { left:16.66667%; right:auto; } .w600pull-2 { right:16.66667%; left:auto; } .w600push-3 { left:25%; right:auto; } .w600pull-3 { right:25%; left:auto; } .w600push-35 { left:30%; right:auto; } .w600pull-35 { right:30%; left:auto; } .w600push-4 { left:33.33333%; right:auto; } .w600pull-4 { right:33.33333%; left:auto; } .w600push-45 { left:37%; right:auto; } .w600pull-45 { right:37%; left:auto; } .w600push-5 { left:41.66667%; right:auto; } .w600pull-5 { right:41.66667%; left:auto; } .w600push-6 { left:50%; right:auto; } .w600pull-6 { right:50%; left:auto; } .w600push-7 { left:58.33333%; right:auto; } .w600pull-7 { right:58.33333%; left:auto; } .w600push-75 { left:63%; right:auto; } .w600pull-75 { right:63%; left:auto; } .w600push-8 { left:66.66667%; right:auto; } .w600pull-8 { right:66.66667%; left:auto; } .w600push-85 { left:70%; right:auto; } .w600pull-85 { right:70%; left:auto; } .w600push-9 { left:75%; right:auto; } .w600pull-9 { right:75%; left:auto; } .w600push-10 { left:83.33333%; right:auto; } .w600pull-10 { right:83.33333%; left:auto; } .w600push-11 { left:91.66667%; right:auto; } .w600pull-11 { right:91.66667%; left:auto; } .hide-600 { display:none !important; } .show-600 { display:block !important; } } @media only screen and (min-width:48em) { /* min-width:768px; */ .w768-1 { width:8.33333%; } .w768-2 { width:16.66667%; } .w768-25 { width:20%; } .w768-3 { width:25%; } .w768-35 { width:30%; } .w768-4 { width:33.33333%; } .w768-5 { width:41.66667%; } .w768-6 { width:50%; } .w768-7 { width:58.33333%; } .w768-8 { width:66.66667%; } .w768-85 { width:70%; } .w768-9 { width:75%; } .w768-95 { width:80%; } .w768-10 { width:83.33333%; } .w768-11 { width:91.66667%; } .w768-12 { width:100%; } .w768push-1 { left:8.33333%; right:auto; } .w768pull-1 { right:8.33333%; left:auto; } .w768push-2 { left:16.66667%; right:auto; } .w768pull-2 { right:16.66667%; left:auto; } .w768push-3 { left:25%; right:auto; } .w768pull-3 { right:25%; left:auto; } .w768push-35 { left:30%; right:auto; } .w768pull-35 { right:30%; left:auto; } .w768push-4 { left:33.33333%; right:auto; } .w768pull-4 { right:33.33333%; left:auto; } .w768push-45 { left:37%; right:auto; } .w768pull-45 { right:37%; left:auto; } .w768push-5 { left:41.66667%; right:auto; } .w768pull-5 { right:41.66667%; left:auto; } .w768push-6 { left:50%; right:auto; } .w768pull-6 { right:50%; left:auto; } .w768push-7 { left:58.33333%; right:auto; } .w768pull-7 { right:58.33333%; left:auto; } .w768push-75 { left:63%; right:auto; } .w768pull-75 { right:63%; left:auto; } .w768push-8 { left:66.66667%; right:auto; } .w768pull-8 { right:66.66667%; left:auto; } .w768push-85 { left:70%; right:auto; } .w768pull-85 { right:70%; left:auto; } .w768push-9 { left:75%; right:auto; } .w768pull-9 { right:75%; left:auto; } .w768push-10 { left:83.33333%; right:auto; } .w768pull-10 { right:83.33333%; left:auto; } .w768push-11 { left:91.66667%; right:auto; } .w768pull-11 { right:91.66667%; left:auto; } [class*="cls"] + [class*="cls"]:last-child { float:left; } .inline-list { margin-left:-1.25em; } .inline-list > li { float:left; margin-left:1.25em; } .hide-768 { display:none !important; } .show-768 { display:block !important; } /* eof */ } @media only screen and (min-width:50em) { /* min-width:800px; */ .w800-1 { width:8.33333%; } .w800-2 { width:16.66667%; } .w800-25 { width:20%; } .w800-3 { width:25%; } .w800-35 { width:30%; } .w800-4 { width:33.33333%; } .w800-5 { width:41.66667%; } .w800-6 { width:50%; } .w800-7 { width:58.33333%; } .w800-8 { width:66.66667%; } .w800-85 { width:70%; } .w800-9 { width:75%; } .w800-95 { width:80%; } .w800-10 { width:83.33333%; } .w800-11 { width:91.66667%; } .w800-12 { width:100%; } .show-800 { display: block; } } @media only screen and (min-width:64em) { /* min-width:1024px; */ .row { max-width: 75em; } .w1024-1 { width:8.33333%; } .w1024-2 { width:16.66667%; } .w1024-25 { width:20%; } .w1024-3 { width:25%; } .w1024-35 { width:30%; } .w1024-4 { width:33.33333%; } .w1024-45 { width:37%; } .w1024-5 { width:41.66667%; } .w1024-6 { width:50%; } .w1024-7 { width:58.33333%; } .w1024-75 { width:63%; } .w1024-8 { width:66.66667%; } .w1024-85 { width:70%; } .w1024-9 { width:75%; } .w1024-95 { width:80%; } .w1024-10 { width:83.33333%; } .w1024-11 { width:91.66667%; } .w1024-12 { width:100%; } .w1024push-1 { left:8.33333%; right:auto; } .w1024pull-1 { right:8.33333%; left:auto; } .w1024push-2 { left:16.66667%; right:auto; } .w1024pull-2 { right:16.66667%; left:auto; } .w1024push-20 { left:20%; right:auto; } .w1024pull-20 { right:20%; left:auto; } .w1024push-3 { left:25%; right:auto; } .w1024pull-3 { right:25%; left:auto; } .w1024push-35 { left:30%; right:auto; } .w1024pull-35 { right:30%; left:auto; } .w1024push-4 { left:33.33333%; right:auto; } .w1024pull-4 { right:33.33333%; left:auto; } .w1024push-45 { left:37%; right:auto; } .w1024pull-45 { right:37%; left:auto; } .w1024push-40 { left:40%; right:auto; } .w1024pull-40 { right:40%; left:auto; } .w1024push-5 { left:41.66667%; right:auto; } .w1024pull-5 { right:41.66667%; left:auto; } .w1024push-6 { left:50%; right:auto; } .w1024pull-6 { right:50%; left:auto; } .w1024push-7 { left:58.33333%; right:auto; } .w1024pull-7 { right:58.33333%; left:auto; } .w1024push-60 { left:60%; right:auto; } .w1024pull-60 { right:60%; left:auto; } .w1024push-75 { left:63%; right:auto; } .w1024pull-75 { right:63%; left:auto; } .w1024push-8 { left:66.66667%; right:auto; } .w1024pull-8 { right:66.66667%; left:auto; } .w1024push-85 { left:70%; right:auto; } .w1024pull-85 { right:70%; left:auto; } .w1024push-9 { left:75%; right:auto; } .w1024pull-9 { right:75%; left:auto; } .w1024push-80 { left:80%; right:auto; } .w1024pull-80 { right:80%; left:auto; } .w1024push-10 { left:83.33333%; right:auto; } .w1024pull-10 { right:83.33333%; left:auto; } .w1024push-11 { left:91.66667%; right:auto; } .w1024pull-11 { right:91.66667%; left:auto; } .narrow { padding-right:6em; padding-left:0.75em; padding-bottom:0; } .hide-1024 { display:none; } .show-1024 { display:block; } } @media only screen and (min-width:68.75em) { /* min-width 1100px */ .w1100-1 { width:8.33333%; } .w1100-2 { width:16.66667%; } .w1100-25 { width:20%; } .w1100-3 { width:25%; } .w1100-35 { width:30%; } .w1100-4 { width:33.33333%; } .w1100-5 { width:41.66667%; } .w1100-6 { width:50%; } .w1100-7 { width:58.33333%; } .w1100-8 { width:66.66667%; } .w1100-85 { width:70%; } .w1100-9 { width:75%; } .w1100-95 { width:80%; } .w1100-10 { width:83.33333%; } .w1100-11 { width:91.66667%; } .w1100-12 { width:100%; } } @media only screen and (min-width:73.75em) { /* min-width 1180px */ .w1180-1 { width:8.33333%; } .w1180-2 { width:16.66667%; } .w1180-25 { width:20%; } .w1180-3 { width:25%; } .w1180-35 { width:30%; } .w1180-4 { width:33.33333%; } .w1180-5 { width:41.66667%; } .w1180-6 { width:50%; } .w1180-7 { width:58.33333%; } .w1180-8 { width:66.66667%; } .w1180-85 { width:70%; } .w1180-9 { width:75%; } .w1180-95 { width:80%; } .w1180-10 { width:83.33333%; } .w1180-11 { width:91.66667%; } .w1180-12 { width:100%; } } @media only screen and (min-width:76.5em) { /* min-width 1224px */ .w1224-1 { width:8.33333%; } .w1224-2 { width:16.66667%; } .w1224-25 { width:20%; } .w1224-3 { width:25%; } .w1224-4 { width:33.33333%; } .w1224-5 { width:41.66667%; } .w1224-6 { width:50%; } .w1224-7 { width:58.33333%; } .w1224-8 { width:66.66667%; } .w1224-9 { width:75%; } .w1224-95 { width:80%; } .w1224-10 { width:83.33333%; } .w1224-11 { width:91.66667%; } .w1224-12 { width:100%; } } @media only screen and (min-width:80em) { /* min-width 1280px */ .w1280-1 { width:8.33333%; } .w1280-2 { width:16.66667%; } .w1280-25 { width:20%; } .w1280-3 { width:25%; } .w1280-4 { width:33.33333%; } .w1280-5 { width:41.66667%; } .w1280-6 { width:50%; } .w1280-7 { width:58.33333%; } .w1280-8 { width:66.66667%; } .w1280-9 { width:75%; } .w1280-95 { width:80%; } .w1280-10 { width:83.33333%; } .w1280-11 { width:91.66667%; } .w1280-12 { width:100%; } .w1280push-1 { left:8.33333%; right:auto; } .w1280pull-1 { right:8.33333%; left:auto; } .w1280push-2 { left:16.66667%; right:auto; } .w1280pull-2 { right:16.66667%; left:auto; } .w1280push-3 { left:25%; right:auto; } .w1280pull-3 { right:25%; left:auto; } .w1280push-35 { left:30%; right:auto; } .w1280pull-35 { right:30%; left:auto; } .w1280push-4 { left:33.33333%; right:auto; } .w1280pull-4 { right:33.33333%; left:auto; } .w1280push-45 { left:37%; right:auto; } .w1280pull-45 { right:37%; left:auto; } .w1280push-5 { left:41.66667%; right:auto; } .w1280pull-5 { right:41.66667%; left:auto; } .w1280push-6 { left:50%; right:auto; } .w1280pull-6 { right:50%; left:auto; } .w1280push-7 { left:58.33333%; right:auto; } .w1280pull-7 { right:58.33333%; left:auto; } .w1280push-75 { left:63%; right:auto; } .w1280pull-75 { right:63%; left:auto; } .w1280push-8 { left:66.66667%; right:auto; } .w1280pull-8 { right:66.66667%; left:auto; } .w1280push-85 { left:70%; right:auto; } .w1280pull-85 { right:70%; left:auto; } .w1280push-9 { left:75%; right:auto; } .w1280pull-9 { right:75%; left:auto; } .w1280push-10 { left:83.33333%; right:auto; } .w1280pull-10 { right:83.33333%; left:auto; } .w1280push-11 { left:91.66667%; right:auto; } .w1280pull-11 { right:91.66667%; left:auto; } } @media only screen and (min-width: 89em) { /* min-width 1424px */ }