/* ------------------------------------------------------ Surrey County Council - Public website Global styles media: all updated: 2016-03-18 by M.Snaith --------------------------------------------------------- */ /* =Base --------------------------------------------------------- */ * { margin: 0; padding: 0; } html { font-size: 62.5%; background-color: #333; } body { color: #222; font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-size: 1.4rem; line-height: 1.5; min-width: 310px; } body > div { font-size: 14px; font-size: 1.4rem; } /* =Hiding --------------------------------------------------------- */ .hide, .scc-hide { display: none; } .offscreen, .scc-offscreen { /* hides elements off-screen, but still readable by text-to-speech devices */ position: absolute; left: -9999px; top: -9999px; } /* =Clearing --------------------------------------------------------- */ .clear, .clear-both, .clearboth { clear: both; min-height: 1px; /* IE7: 'have layout' */ } .clear-left { clear: left; min-height: 1px; /* IE7: 'have layout' */ } .ie8 .ie-clear-left { clear: left; } .clear-right { clear: right; min-height: 1px; /* IE7: 'have layout' */ } .clear-after:after, .scc-global-nav:after, .scc-site-nav-level-1:after, .scc-footer-links:after, .speakit-player:after, .scc-page-info ul:after, .scc-tab-box-tab-holder:after, .scc-tab-box-sub-panel-hilite:after, .scc-tab-box-panel:after, .scc-img-gallery:after { clear: both; content: "."; display: block; height: 0; overflow: hidden; visibility: hidden; } /* =Base typography --------------------------------------------------------- */ h1 { font-size: 30px; font-size: 3rem; } h2 { font-size: 18px; font-size: 1.8rem; } h3, h4, h5, h6 { font-size: 16px; font-size: 1.6rem; } strong, bold { font-weight: bold; } a { text-decoration: none; } a:hover { text-decoration: underline; } a.scc-more { white-space: nowrap; font-weight: bold !important; } a.scc-more:after { content: " »"; } a:focus, .scc-input-text:focus, input[type=text]:focus, select:focus, input.scc-btn:focus { outline: 3px solid #FFC35E; outline-offset: -1px; } body a:focus { background-color: #FFC35E; color: #000; } .ie7 a:hover, .ie8 a:hover { outline: none; } /* =Lists used for navigation etc. --------------------------------------------------------- */ /* Assign these classes to any navigation list in order to over-ride the default styles outlined in the typography section. Key: vlist = vertical list hlist = horizontal list hilist = horizontal inline list */ ul.vlist, ul.vlist li, ul.hlist, ul.hlist li, ul.hilist, ul.hilist li, ol.vlist, ol.vlist li { display: block; list-style: none; margin: 0; padding: 0; background: none; } ul.hlist li { float: left; } ul.hilist li { display: inline; float: none; } ul.hlist li.floatright { float: right; } ul.buttons li { /*** NEEDS UPDATING*/ min-width: 45px; padding: 0; margin: 2px 4px 2px 0; background: #005BAB; color: #FFF; text-align: center; } ul.buttons li.selected { font-weight: bold; background: #fff; } ul.vblist { list-style: outside url(/__data/assets/image/0003/768/bullet.gif); margin: 1em 0 1em 30px; } /* =Tables --------------------------------------------------------- */ table, table th, table td { border: 0; } table { width: 100%; margin: 15px 0; border: 1px solid #CCC; border-collapse: collapse; } table.form, table.form tr, table.form th, table.form td, div.noborder table, div.noborder table tr, div.noborder table td, table.noborder, table.noborder tr, table.noborder th, table.noborder td { border: 0; margin: 0; padding: 0; } div.twisties table table { width: auto; border: 0; margin: 0; padding: 0; } div.twisties table table td { border: 0; } table th, table td.header, table td { text-align: left; padding: 4px 5px; border: 1px solid #CCC; } table th { background-color: #DDD; font-weight: bold; } table.index td { border-top: 0; } table tr.even { background-color: #F5F5F5; } table tr.even.alert, table tr.alert { background-color: #FFF6D2 !important; } /* NOTE: Lotus Notes (used for some parts of the website) likes to add a 'p' tag in the first cell of each table. This style below removes the margin/padding from 'p' tags for all tables contained within one of the section wrappers used on WCM pages */ .sectiona table p, .sectionb table p, .sectionc table p { margin: 0; padding: 0; } /* =Forms (generic styles) --------------------------------------------------------- */ form fieldset { border: 0; margin: 0; padding: 0; } form option { padding: 0 5px; width: auto; } form input.checkbox, form input[type="checkbox"], form input.radio, form input[type="radio"] { border: 0 none; margin-right: 10px; } input { background: #FFF; border: 1px solid #B2B2B2; border-radius: 0; font-size: 100%; vertical-align: middle; } input[type="text"], input[type="email"], input[type="search"], input[type="password"], input[type="submit"], select, .scc-input-text { -webkit-appearance: none !important; height: 35px; min-width: 190px; padding: 5px; max-width: 99%; } input[type="submit"], input[type="search"] { min-width: 5px; border: 0 none; } /* input[type="text"]:focus, .scc-input-text:focus, select:focus { outline-color: #005BAB; outline-offset: -1px; outline-style: solid; outline-width: 2px; } */ input[type="submit"], .scc-btn { background: #009532 url(/__data/assets/image/0013/382/btn-arrow-bg.png) no-repeat right 4px; border: 0 none; color: #FFF !important; font-weight: bold; padding: 0 10px; padding-right: 30px; line-height: 35px; height: 35px; vertical-align: middle; } input[type="submit"]:hover, input[type="submit"]:focus .scc-btn:hover, .scc-btn:focus { background-color: #EE7600 !important; text-decoration: underline; } a.scc-btn { color: #FFF; display: inline-block; } a.scc-btn:hover { background-color: #EE7600;; } input + input[type="submit"], input + .scc-btn, select + input[type="submit"], select + .scc-btn { margin-left: 5px; } .scc-btn-back { background: url("/__data/assets/image/0013/382/btn-arrow-bg.png") no-repeat scroll left 4px rgb(0, 149, 50); background-position: 0px -37px !important; padding: 0px 10px 0px 30px !important; } .scc-btn-black { background-color: #111 !important; } .scc-btn-green { background-color: #009532 !important; } .scc-btn-grey{ background-color: #777 !important; } #sq_regen_captcha i { font-style: normal !important; } .scc-content form { margin: 15px 0; } td input[type="text"], td input[type="password"], td input[type="email"], td input[type="search"], td textarea { max-width: 100%; min-width: 1px; width: 100%; } textarea { max-width:99%; } /* =Twitter Bootstrap --------------------------------------------------------- */ .container { margin-left: auto; margin-right: auto; } /* =Skip navigation link --------------------------------------------------------- */ .scc-skipnav a { display: block; padding: 10px; position:absolute; left: -9999px; top: -9999px; font-size: 130%; margin: 0; text-align: center; font-weight: bold; text-decoration: none; } .scc-skipnav a:focus { position: static; outline: none; } /* =Masthead --------------------------------------------------------- */ .scc-masthead { background: #111; padding: 7px 0; } /* Logo */ .scc-logo { float: left; /*width: 85px;*/ margin: 0 20px 0 5px; } .scc-logo a { background: url(/__data/assets/image/0012/14601/scc-logo-white.png) no-repeat; background-size: auto 100%; display: block; margin: 0 auto; width: 54px; height: 50px; vertical-align: middle; } .scc-logo a:focus { background-color: #EE7600; } .scc-logo img { display: none; } /* Responsive controls for tablets/phones */ #speakit { float: right; } .scc-responsive-controls { text-align: right; list-style: none; padding-top: 8px; float: right; } .scc-responsive-controls li { display: none; list-style: none; } .scc-responsive-controls li.scc-listen-control { display: inline-block; } .scc-responsive-controls li { margin-left: 10px; text-align: center; } .scc-responsive-controls a { background-color: #929292; color: #FFF; display: block; min-width: 45px; height: 35px; font-weight: bold; overflow: hidden; padding: 0 5px; line-height: 35px; text-decoration: none; } /* Listen */ .scc-listen-control a { background: url(/__data/assets/image/0013/373/listen-icon.png) no-repeat center center; background-size: 25px 25px; text-indent: -999px; overflow: hidden; } .scc-responsive-controls a:hover, .scc-responsive-controls a:focus { background-color: #EE7600; } /* Global navigation */ .scc-global-nav { clear: none; line-height: 1; list-style: none; text-align: left; padding-top: 18px; } .scc-global-nav li { display: inline-block; text-align: left; } .scc-global-nav a { color: #FFF; display: block; border-left: 1px solid #A9A9A9 /*494646*/; padding: 0 10px 0 12px; } .scc-global-nav li:first-child a { border-left: 0 none; } /* Search */ .scc-site-search { float: right; text-align: right; text-align: center; padding-top: 8px; } .scc-site-search input.scc-input-text { border-color: #FFF; height: 35px; } .scc-site-search .scc-btn-search { color: #FFF; } input.scc-btn-search, .scc-search-control a { background: #005BAB url(/__data/assets/image/0014/374/search-btn-bg.png) no-repeat center center; background-size: 25px 25px; border: 0 none; font-size: 100%; font-weight: bold; height: 35px; vertical-align: top; text-indent: -999px; overflow: hidden; width: 45px; } .scc-masthead input.scc-btn-search { margin: 0; } /* =Section title/masthead --------------------------------------------------------- */ .scc-section-title { font-size: 24px; font-size: 2.4rem; font-weight: bold; margin: 20px 0 10px; } .scc-section-title h1 { margin: 0; } .scc-section-title a { color: #005BAB; display: inline-block; } .scc-section-title h1 a { color: #222; text-decoration: none; cursor: text; } /* =Section navigation --------------------------------------------------------- */ .scc-site-nav-level-1 { display: table; background: #005BAB; color: #FFF; margin: 0; list-style: none; position: relative; table-layout: auto; height: 100%; } .scc-site-nav-level-1 li { border-left: 1px solid #7AF; display: table-cell; height: 100%; /* float: left; */ } .scc-site-nav-level-1 li a { display: block; padding: 10px; color: #FFF; height: 100%; /*white-space: nowrap;*/ } .scc-site-nav-level-1 li:first-child a { border-left: 0 none; } .scc-site-nav-level-1 a:hover { text-decoration: none; } .scc-site-nav-level-1 li div, .scc-site-nav-level-1 li + li + li + li + li + li + li + li + li { display: none; } .scc-menu-item-ancestor > a, .scc-menu-item-self > a, .scc-site-nav-level-1 > li:hover > a { background-color: #073F90; border-left-color: #073F90; color: #FFF; } /* Second-level items in primary navigation drop-down */ .scc-site-nav-level-2 { display: none; width: 100%; } .scc-site-nav-level-1 li:hover .scc-site-nav-level-2 { background: #073F90; border-top: 4px solid #7AF; border-bottom: 4px solid #7AF; display: block !important; position: absolute; left: 0; z-index: 10000; } .scc-site-nav-level-2 li { float: left; padding: 0; overflow: hidden; width: 49.9%; display: block; } .scc-site-nav-level-2 a { background: none; border: 0 none; border-bottom: 1px solid #36B; line-height: 1; padding: 10px 15px; } .scc-site-nav-level-2 a:active, .scc-site-nav-level-2 a:hover, .scc-site-nav-level-2 a:focus, .scc-site-nav-level-2 a:focus:hover { text-decoration: underline; background-color: #1F1F68; } /* =Breadcrumb --------------------------------------------------------- */ .scc-breadcrumb { border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; font-size: 90%; margin-bottom: 20px; } .scc-breadcrumb:first-child { margin-top: 20px; } .scc-breadcrumb h2 { display: none; } .scc-breadcrumb ul { padding: 10px 0; margin: 0; } .scc-breadcrumb li { display: inline-block; margin: 0 5px 0 0; } .scc-breadcrumb a { display: inline-block; font-weight: bold; } .scc-breadcrumb li + li:before { content: ">"; margin-right: 8px; margin-left: -2px; display: inline-block; } .scc-section-home-page .scc-breadcrumb { display: none; } /* =Content (main content + related content) --------------------------------------------------------- */ .scc-content { margin: 20px 0; } .speakit-player + .scc-content { margin-top: 0; } /* =Main content --------------------------------------------------------- */ .scc-main-content > *:first-child { margin-top: 0; } /* =Content typography --------------------------------------------------------- */ .scc-content h1 { margin: 0 0 20px; line-height: 1; } .scc-content h2 { margin: 20px 0 15px; } .scc-content h3, .scc-content h4, .scc-content h5, .scc-content h6, .scc-content p, .scc-content ul, .scc-content ol { margin: 15px 0; } .scc-content ul, .scc-content ol, .scc-find-out-more ul { margin-left: 15px; list-style-position: outside; } .scc-content ul, .scc-find-out-more ul { list-style: outside url(/__data/assets/image/0003/768/bullet.gif); } .scc-content li, .scc-find-out-more li { margin: 5px 0; } .scc-breadcrumb a, .scc-content a, .scc-related a, .scc-page-info a { color: #005BAB; font-weight: bold; } img.scc-inline { vertical-align: text-top; } .scc-red { color: #DF0000; } a img { border: none; } a.scc-anchor { color: black; font-weight: normal; cursor: text; } a.scc-anchor:hover { text-decoration: none; background-color: transparent; } /* =Messages --------------------------------------------------------- */ .scc-notice, .scc-notification, .scc-warning, .scc-success, .scc-error, .scc-error-wrap ul, .announcement { margin: 15px 0; padding: 10px; border: 1px solid #FD0; background: #FFF6D2; } .scc-notice h2, .scc-notification h2, .scc-warning h2, .scc-success h2, .scc-error h2, .announcement h2, .scc-notice p, .scc-notification p, .scc-warning p, .scc-success p, .scc-error p, .announcement p, .scc-notice ul, .scc-notification ul, .scc-warning ul, .scc-success ul, .scc-error ul, .announcement ul { margin: 5px 0; } .scc-warning { border: 1px solid #E97629; background: #FFF6DF; } .scc-success { border: 1px solid #009F42; background: #DFFFCF; } .scc-error, .scc-error-wrap ul { border: 1px solid #DF0000; background: #FFEFEF; } /* CMS page sections --------------------------------------------------------- */ .sectiona, .sectionb, .sectionc, .sectionf { clear: both; } .sectionb img, .scc-img-left { /* Image on left */ clear: left; float: left; margin: 5px 15px 15px 0; } .sectionc img, .scc-img-right { /* Image on right */ clear: right; float: right; margin: 5px 0 15px 15px; } .scc-main-content img { /* max-width: 100%; Disabled by ME 2014-06-13 because it breaks Lotus Notes twisties */ height: auto; } /* Image gallery (thumbnails) --------------------------------------------------------- */ .scc-img-gallery { clear: both; } ul.scc-img-gallery, .scc-img-gallery ul { clear: both; list-style: none; margin: 15px 0; padding: 0; } ul.scc-img-gallery li, .scc-img-gallery ul li { float: left; margin: 5px 5px 0 0; } .scc-img-gallery a, .scc-img-gallery img { display: block; } /* ='Find out more' list --------------------------------------------------------- */ .scc-file-resources, .scc-find-out-more, .contact_centre { margin: 20px 0; } .scc-file-resources > *, .contact_centre > *, .scc-find-out-more > * { padding: 0 10px; } .scc-file-resources h2, .scc-find-out-more h2, .contact_centre h2 { background: #ebebeb; margin: 0 0 15px; padding: 5px 10px 5px; font-size: 100%; } /* =File resource/attachement list --------------------------------------------------------- */ .scc-file-resources { clear: both; } .scc-file-resources h2 { margin-bottom: 5px; } .scc-file-resources ul { list-style: none; margin: 0; } .scc-file-resources li { background: url(/__data/assets/image/0004/877/file-icon.gif) left center no-repeat; border-top: 1px solid #CCC; clear: left; margin: 0; min-height: 30px; padding: 10px 0 10px 45px; } .scc-file-resources li:first-child { border-top: 0 none; } .scc-file-resources li.scc-pdf-file { background-image: url(/__data/assets/image/0005/878/pdf_icon.png); } .scc-file-resources li.scc-mp3-file { background-image: url(/__data/assets/image/0006/879/mp3.jpg); } .scc-file-resources li.scc-doc-file { background-image: url(/__data/assets/image/0016/880/word.jpg); } .scc-file-resources li.scc-xls-file { background-image: url(/__data/assets/image/0017/881/excel.jpg); } .scc-file-resources li.scc-ppt-file { background-image: url(/__data/assets/image/0018/882/ppt.jpg); } .scc-file-resources li.scc-flv-file { background-image: url(/__data/assets/image/0019/883/flv.jpg); } .scc-file-resources li.scc-rtf-file { background-image: url(/__data/assets/image/0020/884/rtf.jpg); } .scc-file-resources li.scc-vid-file { background-image: url(/__data/assets/image/0003/885/avi.jpg); } .scc-file-resources li.scc-txt-file { background-image: url(/__data/assets/image/0004/886/text.jpg); } .scc-file-resources li.scc-zip-file { background-image: url(/__data/assets/image/0005/887/zip-icon.gif); } /* =Popular boxes (eg. Landing pages) --------------------------------------------------------- */ .scc-popular-items { border-bottom: 1px solid #CCC; margin: 0 0 20px; padding-bottom: 35px; } .scc-popular-items br { display: none; } .scc-popular-items a { background-position: center top; background-repeat: no-repeat; display: block; /*margin: 15px 0;*/ padding-top: 65px; text-align: center; } .scc-popular-items a:hover { background-position: center -160px; } .scc-popular-items .scc-item { margin-top: 20px; } .scc-popular-images .scc-odd, .scc-popular-images .scc-even { position: relative; } .scc-popular-desc { padding: 5px; opacity: 0.85; margin-top: 0; display: block; position: relative; background: #eee; bottom: 20px; width: 100%; z-index: 1000; } .scc-popular-desc p { margin: 0; } /* =Key dates box --------------------------------------------------------- */ .scc-sch-dates { background-repeat: no-repeat; background-position: 0 5px; padding: 0 40px; margin-top: 20px; } /* =Progress bar (School admissions) --------------------------------------------------------- */ .scc-sch-adm-process { background: url(/__data/assets/image/0016/1933/progress-bar-blue.png) no-repeat rgb(234, 244, 251); background-position: 50px 10px; border: 1px solid #CCC; margin: 30px 0; } .scc-sch-process { min-width: 100px; height: 10%; margin-top: 30px; padding-left: 30px; } /* =Sub-page Listing (eg. home and landing pages) --------------------------------------------------------- */ .scc-sub-page-listing { margin: 10px 0; } /* 2-column desktop listing .scc-sub-page-listing .col-md-6.scc-pos3, .scc-sub-page-listing .col-md-6.scc-pos5, .scc-sub-page-listing .col-md-6.scc-pos7, .scc-sub-page-listing .col-md-6.scc-pos9, .scc-sub-page-listing .col-md-6.scc-pos11, .scc-sub-page-listing .col-md-6.scc-pos13, .scc-sub-page-listing .col-md-6.scc-pos15, .scc-sub-page-listing .col-md-6.scc-pos17, .scc-sub-page-listing .col-md-6.scc-pos19, .scc-sub-page-listing .col-md-6.scc-pos21, .scc-sub-page-listing .col-md-6.scc-pos23, .scc-sub-page-listing .col-md-6.scc-pos25 { clear: left; } 4-column desktop listing .scc-sub-page-listing .col-md-4.scc-pos4, .scc-sub-page-listing .col-md-4.scc-pos7, .scc-sub-page-listing .col-md-4.scc-pos10, .scc-sub-page-listing .col-md-4.scc-pos13, .scc-sub-page-listing .col-md-4.scc-pos16, .scc-sub-page-listing .col-md-4.scc-pos19, .scc-sub-page-listing .col-md-4.scc-pos22, .scc-sub-page-listing .col-md-4.scc-pos25 { clear: left; } */ .scc-sub-page-listing .scc-item { padding: 15px 0; } /* .scc-sub-page-listing:first-child .scc-pos1 .scc-item, .scc-sub-page-listing:first-child .scc-pos2 .scc-item, .scc-sub-page-listing:first-child .scc-pos3 .scc-item { border-top: 0 none; padding-top: 0; } */ .scc-sub-page-listing h2 { margin: 0 0 5px; line-height: 1.1; } .scc-sub-page-listing h2 a { color: #222; } .scc-sub-page-listing ul, .scc-sub-page-listing li, .scc-sub-page-listing p { display: inline; margin-left: 0; } .scc-sub-page-listing li, .scc-sub-page-listing .scc-strapline { border-right: 1px solid #B2B2B2; padding-right: 10px; margin-right: 4px; } .scc-content .scc-sub-page-listing li a, .scc-content .scc-sub-page-listing p a { font-weight: normal; } .scc-sub-page-listing li:first-child, .scc-sub-page-listing .sub-pos1 { margin-left: 0; padding-left: 0; border-left: 0 none; } .scc-item ul { list-style: square; } .scc-item .scc-strapline { display: none; } .scc-item .scc-no-children { display: inline; } /* =Related content (right column) --------------------------------------------------------- */ .scc-related { background: #EAF4FB; border: 1px solid #ABD5EF; padding: 15px 10px; line-height: 1.25; } .scc-related .scc-box + .scc-box { margin-top: 15px; border-top: 1px solid #ABD5EF; padding-top: 15px; } .scc-related h2 { margin: 0; font-size: 100%; } .scc-related .scc-box > ul, .scc-related .scc-box-content { margin-top: 0; margin-bottom: 0; } .scc-related a { color: #222; font-weight: normal; } .scc-related li { margin: 10px 0; } .scc-related label { font-weight: bold; } .scc-related select, .scc-related input { margin: 5px 0; } .scc-related input[type="text"], .scc-related select { max-width: 130px; min-width: 100px; } .scc-related input + input[type="submit"], .scc-related select + input[type="submit"] { margin-left: 0; } .scc-related .scc-btn-search { background-color: #343434; } .scc-related hr { border-color: #bbb; } .scc-related img { max-width:100%; } .scc-related .scc-popular-images .scc-popular-desc { background: #343434; margin-top: 20px; } .scc-related .scc-popular-images .scc-popular-desc a { color: white; } form option { z-index: 9999; } /* =Page Information --------------------------------------------------------- */ .scc-page-info { background: #ebebeb; padding: 15px 0; } .scc-page-info .container { position: relative; } .scc-page-info li { display: inline; margin-right: 15px; } p.scc-top { position: absolute; top: 0; left: inherit; right: 15px; margin: 0 !important; } .scc-page-info a { font-weight: bold; } /* =A-Z Picker --------------------------------------------------------- */ .scc-atoz-picker { background: #111; font-size: 1.8rem; } .scc-atoz-picker h2 { color: #FFF; float: left; margin: 25px 0 0; font-size: 100%; } .scc-atoz-picker ul { text-align: right; } .scc-atoz-picker li { display: inline-block; } .scc-atoz-picker a, .scc-atoz-picker span { color: #FFF; display: block; padding: 25px 8px; } .scc-atoz-picker span { color: #666; } .scc-atoz-picker a:hover { background-color: #005BAB; text-decoration: none; } /* =Footer --------------------------------------------------------- */ .scc-footer { background: #333; color: #FFF; } .scc-footer h2 { font-size: 1.8rem; } .scc-footer p { margin: 20px 0; } .scc-footer ul { margin: 0; } .scc-footer li { display: inline-block; padding: 0 25px 0 0; } .scc-footer li:first-child { border-left: 0 none; padding-left: 0; } .scc-footer a { color: #FFF; } .scc-footer-info { padding: 20px 0 15px 0; } /* Hide A-Z footer link when A-Z picker is visible! */ .scc-footer .scc-atoz-link { display: none; } .scc-footer-contact-channels ul { margin-bottom: 10px; } .scc-footer .scc-social-media a { background: url(/__data/assets/image/0019/379/social-media-sprite.png) no-repeat 0px -40px; width: 210px; height: 30px; } .scc-footer .scc-social-media a:hover { background: url(/__data/assets/image/0019/379/social-media-sprite.png) no-repeat 0px -80px; } .scc-footer-contact-channels li.scc-footer-contact { background: url(/__data/assets/image/0008/54728/Call-Icon-white-19x30.png) no-repeat; padding: 0 0 15px 25px; margin-right:20px; } .scc-footer-contact-channels li.scc-footer-find { background: url(/__data/assets/image/0009/54729/Map-Icon-white-24x30.png) no-repeat; padding: 0 0 15px 30px; border: 0; } ul.scc-footer-links { margin-bottom: 15px; } .scc-footer-links li { margin-bottom: 10px; } ul.scc-footer-links-info { margin-bottom: 20px; } .scc-footer-links-info li, .scc-footer-lang-info li{ margin-bottom: 10px; } .scc-footer-languages li { display: inline; } li.lang-arabic a, li.lang-bengali a, li.lang-chinese a, li.lang-urdu a { display: inline-block; min-height: 18px; margin-right: 5px; position: relative; top: 2px; } li.lang-arabic a { width: 41px; background: url(/__data/assets/image/0004/30955/Arabic.png) no-repeat; } li.lang-bengali a { width: 44px; background: url(/__data/assets/image/0003/30954/Bengali.png) no-repeat; } li.lang-chinese a { width: 38px; background: url(/__data/assets/image/0005/30956/Chinese.png) no-repeat; } li.lang-urdu a { width: 20px; background: url(/__data/assets/image/0006/30957/Urdu.png) no-repeat; } .scc-footer-websites { background: #005BAB; padding: 15px 0; } .scc-footer-websites h2 { font-size: 100%; margin: 0 25px 0 0; float: left; } .scc-footer-websites ul { margin: 0; } .scc-footer-websites li { display: inline; border-left: none; } .scc-footer-bottom { background: #333; border-top: 0; padding: 25px 0; } .scc-footer-bottom ul, .scc-footer-bottom p { margin: 0; } .scc-footer-bottom li { border-left: none; } /* =Social media icons --------------------------------------------------------- */ .scc-social-media { list-style: none; } .scc-social-media a { background: url(/__data/assets/image/0019/379/social-media-sprite.png) 0 0 no-repeat; display: block; height: 30px; width: 210px; text-indent: -900px; overflow: hidden; } .scc-social-media a:hover { background: url(/__data/assets/image/0019/379/social-media-sprite.png) 0 -80px no-repeat; } /* =Tabs -------------------------------------------------------- */ .scc-tabs ul { margin: 10px 0; } .scc-tabs li { background-color: #ebebeb; border: 1px solid #0077CC; display: inline-block; margin: 1px; width: 19%; vertical-align: top; } .scc-tabs a { display: block; min-height: 103px; padding: 10px; text-decoration: none; vertical-align: top; } .scc-tab-selected a, .scc-tab-1.scc-no-tab-selected a, .scc-tab a:hover { background-color: #005BAB; color: #FFF; } /* =Tabbed boxes: Inactive (no-JS) --------------------------------------------------------- */ .scc-tab-box { margin-bottom: 15px; } .scc-tab-box .scc-off { display: none !important; } /* Tabs and accordian headings */ .scc-tab-box > h2 { display: none; font-size: 100%; margin: 5px 0 0; } .scc-tab-box-tab-holder + h2 { margin: 0; } /* .scc-tab-box-js > h2 { display: none; } */ .scc-tab-box h2 a { border: 1px solid #B2B2B2; display: block; font-weight: bold; padding: 10px 10px; text-decoration: none; } .scc-tab-box > h2 a { background: #005BAB url(/__data/assets/image/0009/76374/up_down_arrow_sprite.png) no-repeat 95% 16px; color: #FFF; } .scc-tab-box > h2.scc-tab-selected a { background-position: 95% -10px; } /* Tabs */ .scc-tab-box-tab-holder { position: relative; overflow-x: hidden; padding: 0 5px; } .scc-tab-box-tab-holder h2 { background: 0 none; display: block; float: left; font-size: 100%; margin: 0 !important; padding: 0; white-space: nowrap; width: 120px; } .scc-tab-box-tab-holder h2 a /*, h2.scc-tab a, h2.scc-tab-selected a */ { background: #ebebeb; border-bottom-width: 0; border-top-left-radius: 10px; border-top-right-radius: 10px; color: #222; text-align: center; } .scc-tab-box-tab-holder a:hover { background: #003769; color: #FFF; } .scc-tab-box-tab-holder .scc-tab-selected a { background: #005BAB; font-weight: bold; color: #FFF; } .ie8 .scc-tab-box-tab-holder a { border: 0 none; background: transparent url(/__data/assets/image/0013/391/ie8-tab-bg.png) left top no-repeat; } .ie8 .scc-tab-box-tab-holder a:hover { background: #FFF url(/__data/assets/image/0014/392/ie8-tab-hover-bg.png) left top no-repeat; } .ie8 .scc-tab-box-tab-holder .scc-tab-selected a { background-image: url(/__data/assets/image/0015/762/ie8-tab-selected-bg.png); } /* Tab panels */ .scc-tab-box-panel, .scc-tab-box-js.scc-tab-page-layout .scc-tab-box-panel { border: 1px solid #CCC; padding: 0 15px; position: relative; } .scc-tab-box-js .scc-tab-box-panel { padding: 0; } /* Sub-item tabs */ ul.scc-tab-box-sub-items { list-style: none; margin: 0; } ul.scc-tab-box-sub-items > li { border-top: 1px solid #D5D5D5; margin: 0; } .scc-tab-box-sub-items li:first-child + .scc-even { border-top-width: 0; } ul.scc-tab-box-sub-items > li:first-child { border-top: 0 none; } .scc-tab-box-sub-items .scc-odd, .scc-tab-box-sub-items .scc-even { float: left; width: 50%; margin: 0; } .scc-tab-box-sub-items .scc-odd { border-right: 1px solid #D5D5D5; } .scc-tab-box-sub-items > li > a { display: block; padding: 10px 10px 10px 60px; color: #222; font-weight: normal; background-repeat: no-repeat; background-position: 15px 5px; } #scc-popular-box-panel-1 .scc-tab-box-sub-items > li > a { border-right: 1px solid #D5D5D5; } #scc-popular-box-panel-1 .scc-tab-box-sub-items > li > a.scc-item-selected { border-right: none; } .scc-tab-box-sub-items > li > a:hover { color: #005BAB; } .scc-tab-box-sub-items .scc-item-selected { background-color: #EAF4FB; font-weight: bold; border-right: none; } /* Sub-item panels */ .scc-tab-box-sub-panel { background: #EAF4FB; position: absolute; top: 0; right: 0; width: 70%; height: 100%; overflow: hidden; font-size: 14px; font-size: 1.4rem; } /* Sub-item panel content */ .scc-tab-box-sub-panel-hilite { /* Light blue background highlight for key info */ background: #EAF4FB; padding: 10px 10px 0; margin-bottom: 10px; } .scc-tab-box-sub-panel-hilite > *:first-child { margin-top: 0; } .scc-tab-box-sub-panel h3 { margin-bottom: 5px; } .scc-tab-box-sub-panel form { /*margin: 5px 0;*/ } .scc-tab-box-sub-panel form p { margin: 10px 0; } .scc-tab-box-sub-panel .i-label { float: left; display: block; width: 25%; margin-right: 2px; line-height: 32px; } .scc-tab-box-sub-panel input[type="text"], .scc-tab-box-sub-panel select { min-width: auto; width: 45%; } .scc-tab-box-sub-panel-hilite + .hilist { margin-top: 0; } .scc-tab-box-sub-panel > p, .scc-tab-box-sub-panel > ul { margin-left: 10px; } .scc-tab-box-sub-panel .hilist li { border-left: 1px solid #B2B2B2; margin: 0 5px 0 0; padding-left: 10px; } .scc-tab-box-sub-panel .hilist li:first-child { border-left: 0 none; padding-left: 0; } .scc-tab-box-sub-panel .vblist li { margin-left: 15px; } /* Adjustment for tab-based page layout, rather than 'boxes' */ .scc-tab-page-layout .scc-tab-box-tab-holder h2 { /* width: auto; Removed - causes problem in IE8 because of fixed-width background */ } /* =Accordions (expanding/collapsing sections) --------------------------------------------------------- */ .scc-content .scc-accordion-item-heading, .scc-accordion-item-panel p , .scc-accordion-item-panel ul, .scc-accordion-item-panel ol { margin-top: 10px; margin-bottom: 0; } .scc-accordion-item-panel-active { border-top: 1px solid #CCC; border-bottom: 1px solid #CCC; padding-bottom: 15px; } .scc-accordion-item-panel-active + .scc-accordion-item-panel-active { border-top: 0 none; margin-top: 10px; } .scc-accordion-item-panel:last-child { border-bottom: 0 none; } .scc-accordion-inner-panel > p:first-child { margin-top: 0; } .scc-accordion-item-panel-inactive .scc-accordion-inner-panel { display: none; } /* Nested panels */ .scc-accordion-item-panel .scc-accordion-item-panel { margin-left: 20px; } .scc-accordion-item-panel-active .scc-accordion-item-panel-active { border: 0 none; padding-bottom: 5px; } /* =A-Z links/buttons (multi-purpose) eg: A-Z of council services (/a-z-of-services) (Not related to the site-wide A-Z above the footer) --------------------------------------------------------- */ #atoz { margin: 0; } .atoz ul, ul.atoz { font-size: 0; list-style: none; margin: 0 0 15px 0; min-height: 1px; /* IE7: have layout */ } .atoz li { color: #B2B2B2; font-size: 14px; font-size: 1.4rem; list-style: none; margin: 0; padding: 0; display: inline-block; list-style: none; text-align: center; } /* NOTE: To create a non-clickable A-Z link, either apply class="clean" to the LI or place a span inside the LI */ .atoz a, .atoz span, .atoz li.clean { border: 1px solid #005BAB; margin: 0 5px 5px 0; min-width: 28px; padding: 2px 0; } .atoz li.clean, .atoz span { border: 1px solid #B2B2B2; } .atoz a, .atoz span { display: block; } .atoz a:hover { background: #005BAB; color: #FFF; text-decoration: none; } .atoz ul.numerical { margin-bottom: 15px; } /* =A-Z of concil services listing ** NEEDS UPDATING (the actual list of A-Z items - not the A-Z links/buttons) --------------------------------------------------------- */ ul.atoz-service-listing { margin: 0; } .atoz-service-listing li { list-style: none; margin: 0; border-top: 1px solid #CCC; padding: 15px 0; font-weight: bold; } .atoz-service-listing li:first-child { border-top: 0 none; } .atoz-service-listing li li { list-style: outside url(/__data/assets/image/0003/768/bullet.gif); margin: 5px 0 0 30px; border: 0; padding: 0; font-weight: normal; } .atoz-service-listing.atoztowns li { display: block; float: left; font-weight: normal; width: 100%; } .atoz-service-listing.atoztowns span { border: 0 none; display: block; padding: 0; float: right; width: 35%; text-align: left; } .atoz-service-listing h3 { margin: 0; } .atoz-service-listing ul { margin: 5px 0 0; } /* =Events calendar and list --------------------------------------------------------- */ #scc-events-results-table th { min-width: 100px; width: auto; /* ID needs to be applied to the HTML paint layout - and remove inline styles */ } #evpagi { text-align: center; } /* =Widgets --------------------------------------------------------- */ .scc-youtube-embed { margin: 20px 0; } /* =SpeakIT audio functionality --------------------------------------------------------- */ #speaklink { position: static; } #speakit_player { float: left; } #speakit_player table { background: #DDD url(/__data/assets/image/0006/888/button-bg.png) repeat-x 0 0; border: 1px solid #CCC; margin: 0 0 15px; padding: 0; } #speakit_player tr, #speakit_player th, #speakit_player td { background: none !important; border: 0 none; border-collapse: collapse; line-height: 1; } /* Begin SpeakIT standard styles (provided by Insipio) */ #speakit_player td.outer { padding-top: 5px; } #speakit_player td.text { padding-left: 10px; } #speakit_player td.left { padding-left: 5px; } #speakit_player a { text-decoration: none; } .ins_invisible { position: absolute; left: -999px; } .ws_hl { background-color: #A4CBFF; } .sent_hl { background-color: #FFA4CB; } /* JPlayer */ #speakit_player .player { padding-left:3px; } #speakit_player .player a img { border:0; } #speakit_player #bars_holder { width:100px; } #speakit_player .player #sliderPlayback .ui-slider-handle { height:1.1em; width: 0.5em; margin-left:0px; } #loaderBar.ui-progressbar { height:.2em; border:0; } /* =SearchImprove --------------------------------------------------------- */ .scc-search-related { border-bottom: 0 none; padding-bottom: 1px; } #starttext { padding: 0.2em 0; } .searchimprove table { /* to remove borders on login table */ width: 300px !important; border-collapse: collapse; border: none; } .searchimprove table td { /* to remove borders on login table */ border: 0 none; } .searchimprove table tr:hover { background: none; } .searchimprove fieldset { border: 0; margin: 0; padding: 0 !important; float: left; } .searchimprove form br { display: none; } #searchfields { background: #005BAB; color: #FFF; margin-bottom: 15px; padding: 10px; } #searchfields form { margin: 0; padding: 0; position: relative; } #searchfields form:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } #searchfields p { margin: 0; background: #FFF; } #searchfields p label { display: none; } #searchfields #search{ border: 0 none; width: 80%; display: block; outline: none; } .searchimprove .choices { margin: 5px 0; } .searchimprove .choices legend { display: none; } .searchimprove .choices label { margin-right: 20px ; display: block; float: left; } .searchimprove .choices input { display: block; float: left; margin: 5px 5px 0 0; } #searchfields .button { position: absolute; top: 0; right: 0; background: #333 url(/__data/assets/image/0014/374/search-btn-bg.png) no-repeat center center; border: 0 none; font-size: 100%; font-weight: bold; height: 35px; vertical-align: top; text-indent: -999px; overflow: hidden; width: 45px; } /* SearchImprove: Results */ .searchimprove .pagelist + dl { border-top: 1px solid #CCC; } .searchimprove dt { font-weight: bold; padding-top: 15px; } .searchimprove dd { margin: 0; display: block; padding-bottom: 15px; border-bottom: 1px solid #CCC; } .searchimprove .fileformat { font-size: 0.8em; color: green; } .searchimprove img.filetypeicon { vertical-align: middle; } .searchimprove a.resulttitle { text-decoration: none; font-weight: bold; } .searchimprove a.resulttitle:hover { text-decoration: underline } .searchimprove .resultpath, .searchimprove .resultdate { font-size: 0.8em; display: block; margin: 15px 0 0; line-height: 1.4em; } .searchimprove .resultpath h1, .searchimprove .resultpath h2 { display: none; } .searchimprove .resultpath ul { margin: 0; padding: 0; list-style-type: none; text-align: left; display: inline; } .searchimprove .resultpath li { display: inline; margin: 0; } .searchimprove .resultpath li + li:before { content: ">"; margin: 0 5px 0 0; display: inline-block; } .searchimprove .resultpath li + li + li { margin-left: 5px; } .searchimprove .resultpath a { background: none; color: #222; font-weight: normal; } .searchimprove .resultsummary strong { background: #FFB; font-weight: bold; } .searchimprove .keywords { margin: 0 1.5em; font-size: 0.9em; border-bottom: 1px dashed; cursor: help; } .searchimprove .date { font-size: 0.85em; display: block; color: #666 } /* SearchImprove: Pagination */ .searchimprove .pagelist { text-align: center; } .searchimprove .pagelist_nacr { text-align: center; border: 1px solid #CCC; background: #F00000; padding: 0.1em; margin: 0.5em 0; font-size: 90%; color: #FFF; } .searchimprove .pagelist_nacr a { color: #FFF; } .searchimprove .pagelist ul { list-style-type: none; margin: 0; } .searchimprove .pagelist li { display: inline; padding: 0.2em; } .searchimprove .pagelist a { display: inline-block; padding: 5px; } .searchimprove .next { float: right; } .searchimprove .previous { float: left; } .searchimprove .next a { padding-right: 0; } .searchimprove .previous a { padding-left: 0; } /* =GovMetric --------------------------------------------------------- */ .gm_sidebar_rh { right: 0; position: fixed; top: 25%; z-index: 1001; } #gm_sidebar_popup { top: 25%; width: 250px; } /* =BRANDED HOME PAGES --------------------------------------------------------- */ .scc-banner { margin: 10px 0 30px 0 !important; padding: 15px; } .scc-srch-panel { background-color: #F6F6F6; /* for IE */ background-color: rgba(255,255,255,0.85); padding: 10px; float: left; } .scc-srch-panel h2, .scc-srch-panel-full h2 { margin: 0 !important; } .scc-srch-panel form fieldset { margin-bottom: 10px; } .scc-srch-panel-full { background-color: #EAF4FB; padding: 10px; float: left; width: 100%; margin: 10px 0 20px; border-top: 3px solid #8AC4EB; border-bottom: 1px solid #8AC4EB; } .scc-srch-banner { background: #0077CC; padding: 10px; float: left; width: 100%; margin-top: 10px; } .scc-popular-img { margin-bottom: 20px; } .scc-popular-img a { display: block; } /* ------------------------------------------------------ RESPONSIVE: Small and below --------------------------------------------------------- */ @media (max-width: 991px) { /* Masthead */ .scc-masthead { top: 0; left: 0; width: 100%; z-index: 100000; } .scc-responsive-controls { text-align: right; } .scc-responsive-controls li { display: inline-block; } .scc-responsive-controls .scc-search-control { display: none; } /* Global nav */ .scc-global-nav { clear: left; margin-bottom: 10px; padding-top: 5px; } .scc-global-nav.scc-off { display: none; } .scc-global-nav li { display: block; } .scc-global-nav .scc-more { display: none; } .scc-global-nav a { background: #005BAB; display: block; margin-bottom: 1px; border-left: 0 none; padding: 10px; } /* Search */ .scc-site-search { margin-bottom: 10px; } /* A-Z picker */ .scc-atoz-picker { font-size: 1.6rem; } .scc-atoz-picker h2 { float: none; margin-top: 2rem; text-align: center; } .scc-atoz-picker ul { text-align: center; } /* Footer */ .scc-footer li { float: left; width: 30%; border: 0 none; padding: 0; margin-bottom: 5px; } .scc-footer .sep { display: block; visibility: hidden; height: 0; } .scc-footer-contact-channels { margin-bottom: 30px; } .scc-footer .scc-footer-contact-channels li { display: block; width: auto; margin-right: 30px; } .scc-footer-websites h2, .scc-footer-languages h2 { float: none; padding-bottom: 10px; } .scc-footer-languages ul { margin-top: 5px; } .scc-footer-languages li { width: 14%; } .scc-footer p.scc-footer-social-media { margin: 0 15px 0 0; } .scc-footer .scc-footer-bottom li { display: block; width: auto; float: none; } /* Tab boxes */ .scc-tab-box-tab-holder { display: none; } .scc-tab-box h2 { display: block; } .scc-tab-box-panel { border-top-color: #FFF; } .scc-tab-box-sub-items { float: none; width: 100%; } .scc-tab-box-sub-items .scc-even, .scc-tab-box-sub-items .scc-odd { border-right: 0 none; float: none; width: 100%; } .scc-tab-box-sub-items > li:first-child + .scc-even { border-top-width: 1px; } .scc-tab-box-sub-items > li > a { color: #005BAB; font-weight: bold; } .scc-tab-box-sub-items .scc-item-selected { background-color: #FFF; } .scc-tab-box-sub-panel { display: none; } .scc-asset-8950 .scc-srch-panel { wid th: 50%; } /* Sub-page listing */ .scc-sub-page-listing .col-sm-6:nth-child(2n+1) { clear: left; } } /* ------------------------------------------------------ RESPONSIVE: Extra Small ONLY (phones and phablets) --------------------------------------------------------- */ @media (max-width: 767px) { .scc-listen-control, .speakit-player { display: none !important; } /* Fonts */ h1 { font-size: 2.2rem; } .scc-section-title { font-size: 2.0rem; } /* Masthead */ .scc-responsive-controls .scc-search-control { display: inline-block; } .scc-site-search { clear: left; float: none; padding-top: 5px; } .scc-site-search div { background: #fff; text-align: right; position: relative; } #scc-site-search-query { min-width: 100%; } .scc-site-search .scc-btn { position: absolute; right: 0; } .scc-site-search.scc-off { display: none; } /* Section navigation */ .scc-site-nav-level-1 { display: none; } /* Page info */ .scc-page-info li { display: block; } /* A-Z picker */ .scc-atoz-picker { display: none; } /* Footer */ .scc-footer li { width: 50%; } .scc-footer-websites li { width: 100%; } /* Show the A-Z footer link when A-Z picker is hidden on XS screens */ .scc-footer .scc-atoz-link { display: block; } .scc-footer-map { float: none; margin-top: 0 !important; text-align: left; } /* Sub-page listing */ .scc-sub-page-listing .col-sm-6:last-child .scc-item { padding-bottom: 10px; } .scc-sub-page-listing li { display: block; border: 0 none; margin: 5px 0; } /* .scc-sub-page-listing:first-child .scc-pos2 .scc-item { border-top: 1px solid #CCC; padding-top: 20px; } */ .scc-popular-items a { margin: 15px 0; } /* GovMetric */ body .gm_sidebar { display: none !important; } /* School Admissions */ .scc-sch-process { display: none; } .scc-tabs li { width: 100%; } .scc-tabs a { min-height: 50px; } .scc-srch-panel-full img { display: none; } } /* ------------------------------------------------------ RESPONSIVE: Small ONLY (portrait iPad or small tablet) --------------------------------------------------------- */ @media (min-width: 768px) and (max-width: 991px) { .scc-global-nav li { float: right; width: 50%; } .scc-global-nav .odd { float: left; width: 50%; border-right: 1px solid #111; } .scc-site-nav-level-1 li:first-child + li + li + li { display: none; } .scc-sub-page-listing .col-sm-6 { clear: none; } /* .scc-sub-page-listing .scc-pos3, .scc-sub-page-listing .scc-pos5, .scc-sub-page-listing .scc-pos7, .scc-sub-page-listing .scc-pos9, .scc-sub-page-listing .scc-pos11, .scc-sub-page-listing .scc-pos13, .scc-sub-page-listing .scc-pos15, .scc-sub-page-listing .scc-pos17, .scc-sub-page-listing .scc-pos19, .scc-sub-page-listing .scc-pos21, .scc-sub-page-listing .scc-pos23, .scc-sub-page-listing .scc-pos25 { clear: left; } */ /* School Admissions */ .scc-sch-process { display: none; } .scc-srch-panel-full img { display: none; } } /* ------------------------------------------------------ RESPONSIVE: Medium Desktop and above --------------------------------------------------------- */ @media (min-width: 992px) { /* Sub-page listing */ .scc-sub-page-listing .col-md-4:nth-child(3n+1) { clear: left; } } /* ------------------------------------------------------ RESPONSIVE: Large Desktop ONLY --------------------------------------------------------- */ @media (min-width: 1400px) { body, body > div, .atoz li { font-size: 16px; font-size: 1.6rem; } .scc-global-nav .hidden-md { display: inline !important; } .scc-atoz-picker a, .scc-atoz-picker span { padding-left: 10px; padding-right: 10px; } .scc-sch-adm-process { background: url(/__data/assets/image/0004/4549/progress-bar-1031px.png) no-repeat rgb(234, 244, 251); background-position: 50px 10px; } } /* ------------------------------------------------------ PRINT --------------------------------------------------------- */ @media print { /* =Base --------------------------------------------------------- */ html { background: #FFF; } body { color: #000; background: #FFF; font-family: Arial, Helvetica, Verdana, sans-serif; } /* =Base link colours and formatting --------------------------------------------------------- */ a, a:hover, a:focus, a:focus:hover, a:visited, a:active { text-decoration: underline; font-weight: normal; background: #FFF; color: #000; } /* =Hide non-printable content --------------------------------------------------------- */ .scc-site-search, .scc-responsive-controls, .scc-global-nav, .scc-related, .scc-section-title, .scc-section-nav, .scc-site-nav-level-1, .scc-breadcrumb h1, .scc-breadcrumb h2, .scc-file-resources, .scc-find-out-more, .scc-page-info h2, .scc-page-info a, .scc-page-info p, .scc-page-info .addthis_button, .scc-atoz-picker, .scc-footer, .atoz, input.button, #searchimprove #categories, body .gm_sidebar { display: none !important; } /* =Masthead --------------------------------------------------------- */ .scc-logo { float: none; } .scc-logo a { height: auto; } .scc-logo img { display: block; } /* =Breadcrumb trail --------------------------------------------------------- */ .scc-breadcrumb { border-color: #000; } /* =Page Information --------------------------------------------------------- */ .scc-page-info { background: #FFF; border-bottom: 1px solid #000; border-top: 1px solid #000; } /* =Homepage news box --------------------------------------------------------- */ #home-promo-box h2:before { content: "News: " } #home-promo-box img { float: right; } div.home-box ul { margin-left: 30px; list-style: square; } /* Keep this extra curly brace - it closes the media query */ }