﻿/* ==========================================================================
   HTML5 display definitions
   ========================================================================== */
   
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {display:block;}
audio, canvas, video {display:inline-block; width:100%;}
audio:not([controls]) {display:none; height:0;}
[hidden] {display: none;}

/* ==========================================================================
   Base
   ========================================================================== */
   
html {font-family:'Open Sans', sans-serif; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; overflow-y:auto; margin:0; padding:0; height:100%;}
body {margin:0; padding:0; height:100%;}

/* ==========================================================================
   Links
   ========================================================================== */

a:focus {outline:0;}
a:active, a:hover {outline:0;}

/* ==========================================================================
   Typography
   ========================================================================== */

h1 {font-size:2em;}
abbr[title] {border-bottom:1px dotted;}
b, strong {font-weight:bold;}
dfn {font-style:italic;}
mark {background:#ff0; color:#000;}
code, kbd, pre, samp {font-family:monospace, serif; font-size:1em;}
pre {white-space:pre; white-space:pre-wrap; word-wrap:break-word;}
q {quotes: "\201C" "\201D" "\2018" "\2019";}
small {font-size:80%;}
sub, sup {font-size:75%; line-height:0; position:relative; vertical-align:baseline;}
sup {top: -0.5em;}
sub {bottom: -0.25em;}
dt {margin:0px 0px 10px 0px;}
dd {margin:10px 0px 10px 0px;}

/* ==========================================================================
   Embedded content
   ========================================================================== */
img {border:0; height:auto; vertical-align:middle; -ms-interpolation-mode:bicubic;}
svg:not(:root) {overflow:hidden;}
#map_canvas img, .google-maps img {max-width:none;}
#map_canvas {margin:0; padding:0; height:400px;}

/* ==========================================================================
   Figures
   ========================================================================== */

figure {margin:0;}

/* ==========================================================================
   Forms
   ========================================================================== */

fieldset {border:0 ;margin:0; padding:0;}
legend {border:0; padding:0;}
button, input, select, textarea {font-family:inherit; font-size:100%; margin:0; vertical-align:middle;}
button, input {line-height:normal; overflow:visible;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], input[disabled] {cursor:default;}
input[type="checkbox"], input[type="radio"] {box-sizing:border-box; padding:0;}
input[type="search"] {-webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing:content-box; box-sizing:content-box;}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {-webkit-appearance: none;}
button::-moz-focus-inner, input::-moz-focus-inner {border:0; padding:0;}
textarea {overflow:auto; vertical-align:top; resize:vertical;}
label, select, button, input[type="button"], input[type="reset"], input[type="submit"], input[type="radio"], input[type="checkbox"] {cursor:pointer;}

/* ==========================================================================
   Tables
   ========================================================================== */

table {border-collapse:collapse; border-spacing:0;}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.nocallout {-webkit-touch-callout:none;}
.pressed {background-color: rgba(0, 0, 0, 0.7);}
textarea[contenteditable] {-webkit-appearance:none;}
.hidden {display:none !important; visibility:hidden;}
.visuallyhidden {border:0; clip: rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px;}
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip:auto; height:auto; margin:0; overflow:visible; position:static; width:auto;}
.invisible {visibility:hidden;}
.cf:before, .cf:after {content:""; display:table;}
.cf:after {clear:both;}
.cf {}

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html, button, input, select, textarea {color:#333;}
body {font-size:0.9em; line-height:1.4; background-color:#e4003b;}

h1 {font-size:2.0em; margin:0 0 1em 0; padding:0px; color:#444; font-weight:800; line-height:1.1em;}
h2 {font-size:1.8em; margin:0 0 15px 0; padding:0px; color:#444; font-weight:800; line-height:1.1em;}
h3 {font-size:1.2em; margin:0 0 5px 0; padding:0px; color:#444; font-weight:800;}


a {color:#e4003b; text-decoration:none;}
a:hover {color:#7c56a0; text-decoration:underline;}
a:hover, a:active {outline:0;}

#access {position:absolute; top:0px; left:0px; width:1px;}

.link {color:#099b7e; width:170px; padding:8px 0 8px 0; cursor:pointer; text-align:center; font-size:0.9em; font-weight:600; display:inline-block; border:1px solid #099b7e; text-transform:uppercase; letter-spacing:0.1em;}
a:hover.link {text-decoration:none; color:#fff; background-color:#099b7e;}

.imglink {overflow:hidden; width:1px; height:1px;}

.rrClipRegion{border:none !important;}

label {color:#333;}
input {color:#099b7e; border:#099b7e 1px solid; background-color:#fff; font-size:1.2em; padding:5px;}
select {color:#099b7e; border:#099b7e 1px solid; background-color:#fff; font-size:1.2em; padding:5px;}
textarea {color:#099b7e; border:#099b7e 1px solid; background-color:#fff; font-size:1.2em; padding:5px;}
input[type="checkbox"], input[type="radio"], input[type="image"] {border:none;}
input:focus {border:#ead59d 1px solid; background-color:#fdf7e7; color:#bd8301;} 
textarea:focus {border:#ead59d 1px solid; background-color:#fdf7e7; color:#bd8301;} 

.formsbutton {color:#fff; background-color:#099b7e; cursor:pointer; text-align:center; font-size:0.9em; font-weight:600; width:170px; padding:8px 0 8px 0; border:1px solid #099b7e; text-transform:uppercase; letter-spacing:0.1em;}
.button a {color:#fff; background-color:#099b7e; cursor:pointer; text-align:center; font-size:0.9em; font-weight:600; width:170px; padding:8px 0 8px 0; border:1px solid #099b7e; text-transform:uppercase; letter-spacing:0.1em;}

input[type="checkbox"] {margin-right:8px;}

.cutoff {padding:20px 0px 10px 0px; border-bottom:1px dashed #cbdce6;}
.warning {background-color:#de1c1c; color:#ffffff; width:400px; font-size:1.2em; margin-bottom:10px; padding:15px 15px 15px 50px; background-image:url(../cmsimages/warning_icon.gif); background-position:10px 10px; background-repeat:no-repeat;}

/* ==========================================================================
   Responsive Navigation
   ========================================================================== */

/*
nav, ul, li, a  {margin:0; padding:0;}
.toggleMenu {display:inline-block;}
.toggleSearch {display:inline-block;}

#nav {display:none;}
.menuback {position:fixed; width:100%; top:0; right:0; height:100%; background-color:#e4003b; z-index:1;}
.nav{position:absolute; padding:0; margin:0; top:0; right:0; width:100%; height:100%; z-index:2;}

#toolbar {clear:both;}

.navbox {padding:80px 20px 20px 20px;}
.navbox ul {list-style:none;}
.navbox li {display:block; text-align:center;}
.navbox li a {display:block; padding:10px; font-size:1.1em; letter-spacing:2px; color:#fff;}
.navbox li a:hover {color:#e4003b; text-decoration:none; background-color:#fff;}

 selected toolbar   
.nav > li .toolsel {color:#74bad1;} 

.closebut {position:absolute; top:20px; right:5%; display:block; border:none; z-index:3;}
.closebut a {text-decoration:none; font-size:4em; color:#fff;}
.closebut a:hover {background-color:transparent;}
.closebut.toggleMenu {text-decoration:none;}

 
.menuright {float:right;}
.setright {float:right; text-align:right; width:100%;}

.nav li #searchbox {}
#searchbox {position:relative; padding:0; margin-top:20px; height:40px;}
.searchcontain {position:relative; left:0; top:0; width:100%;}
.searchfield {width:80%; height:40px; padding:5px 20% 5px 0;}
.searchfield input {color:#000; width:100%; padding:16px 0% 16px 5%; margin:0; border:0; font-size:1.2em; z-index:2;}
.searchfield input:focus {border:0px; color:#000; background-color:#fff;} 
.searchbut {position:absolute; top:5px; width:20%; left:80%; z-index:3; background-color:#fff;}
.searchbut a {padding:0; color:#fff;}
*/

#toolbar {clear:both;}
.toggleMenu {display:inline-block;}
.toggleSearch {display:inline-block;}
nav, ul, li, a  {margin:0; padding:0;}

#nav{position:fixed; padding:0; margin:0; top:0; left:0; width:100%; height:100%; z-index:1; background-color:#e4003b;}

#nav {display:none;}
.nav {list-style:none;}

.nav:before, .nav:after {content:" "; display:table;}
.nav:after {clear:both;}

.nav ul {padding:0; list-style-type:none; display:block; width:100%;}
.nav a {padding:10px 20px 10px 20px; color:#fff; font-size:1.3em;}
.nav a.navparent {}
.nav a:hover {background-color:#fff; color:#e4003b; text-decoration:none;}
.nav li {position:relative;  margin:0; padding:0;}
.nav > li {float:none; text-align:center;}
.nav > li > a {display:block;}


/* selected toolbar */   
.nav > li .toolsel {color:#b51010;} 

#closebut {display:none;}
.nav li.closenav {margin:0; border-bottom:none; font-size:4em; padding:10px 10px 0 0; color:#fff;}
.nav li.closenav a:hover {background-color:transparent; color:#fff;}
.nav > li.closenav {border-top:none;}


 
.menuright {float:right;}
.setright {float:right; text-align:right; width:100%;}

.nav li #searchbox {}
#searchbox {position:relative; padding:0; margin-top:20px; height:40px;}
.searchcontain {position:relative; left:0; top:0; width:100%;}
.searchfield {width:100%; height:40px; padding:5px 20% 5px 0;}
.searchfield input {border:0; color:#000; width:60%; padding:15px 20% 15px 5%; margin:0px; font-size:1.2em; background-color:#fff; z-index:2;}
.searchfield input:focus {border:0px; color:#000; background-color:#fff;} 
.searchbut {position:absolute; top:15px; left:80%; z-index:3;}
.searchbut a {padding:0; color:#fff;}

.searchclosebox {float:left; width:0; top:0; display:none; color:#c23641;}
.searchclosebox a {color:#c23641;}
.searchclosebox a:hover {color:#c23641;}


/* ------------------------------------------------------- 
  Level 2 naviagtion
------------------------------------------------------- */

.menubox {width:100%; margin-top:20px;}
.menubox a {text-decoration:underline;}
#menutitle {color:#596774; font-size:1.2em; padding:10px 0 10px 5px;}

#level2 {padding:0;}
#level2 ul {list-style:none;}
#level2 li {display:block;}
#level2 a {color:#444; display:block; padding:15px 0 15px 5px; text-decoration:none; margin:0px; border-top:solid 1px #444;}
#level2 a:hover {color:#e4003b; text-decoration:underline;}


#menu2 a {color:#e4003b;}
#menu2 a:hover {color:#e4003b; text-decoration:none;}


/* ------------------------------------------------------- 
  record paging
------------------------------------------------------- */

.directorypageof {font-size:0.9em; color:#333; margin-bottom:30px;}

.pagingnav {position:relative; font-size:1.1em;}
.pagingnav ul{margin:0; padding:0; list-style:none;}
.pagingnav li {display:inline; margin:0; padding:0;}
.pagingnav li a {color:#333; text-decoration:none; padding:3px 5px 3px 5px; margin-right:5px;}
.pagingnav li a:hover {text-decoration:underline;}
.pagingnav li.pagingon {color:#e4003b; border-bottom:1px solid #e4003b; padding:3px 5px 3px 5px; margin-right:5px;}

/* ------------------------------------------------------- 
  other   	                                    
------------------------------------------------------- */

iframe {border:0; width:100%; max-width:100%;}
.caption {background-color:#f7f7f7; color:#178dcd; padding:10px; max-width:355px;}


/* ==========================================================================
   horizontal full screen backgrounds
   ========================================================================== */

.fullwidth {position:relative; width:100%;}
.white {background-color:#fff;}
.red {background-color:#e4003b;}
.blue {background-color:#2687a7;}
.lightblue {background-color:#33bfd4;}
.grey {background-color:#f3f4f4;}
.lightgrey {background-color:#f9f9fb;}

/* ==========================================================================
   Grid
   ========================================================================== */
   
.container {max-width:1400px; width:100%; margin:0px auto; position:relative;}
.row {display:block; width:100%; min-height:20px;  -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; float:left; clear:both;}
.row div[class*='col'], .row aside[class*='col'], .row article[class*='col'] {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; display:block;}

.setright {float:right; text-align:right; width:100%;}
.right {float:right;}
#content ul {}
#content li {margin-left:15px; padding-left:5px;}

/* ==========================================================================
   Mobile First Default Layout
   ========================================================================== */
    
    .container {width:94%; padding:0 3% 0 3%;}
    .navcontainer {width:94%; padding:0 3% 0 3%; margin:0px auto; position:relative;}

    /* ------------------------------------------------------- 
     vectors                             
    ------------------------------------------------------- */

    .vector {position:relative; width:100%; height:100%;}

    .labouricon {width:100px; height:100px;}
    .menuicon {width:40px; height:25px; fill:#e4003b;}
    .hbrlogo {width:60px; height:35px; fill:#ee6085;}
    .searchicon {width:30px; height:30px; fill:#12516f;}
    .searchicon2 {width:30px; height:30px; fill:#fff;}
    .facebookicon {width:30px; height:30px; fill:#2b7191; padding:0 30px 0 10px;}
    .twittericon {width:30px; height:30px; fill:#2b7191; padding-right:30px;}
    .googleicon {width:47px; height:30px; fill:#2b7191;}

    .facebookicon2 {width:30px; height:30px; fill:#fff; padding:0 20px 30px 0;}
    .twittericon2 {width:30px; height:30px; fill:#fff; padding-right:20px;}
    .instagramicon {width:30px; height:30px; fill:#fff; padding-right:20px;}
    .youtubeicon {width:133px; height:30px; fill:#fff;}

    .facebookicon3 {width:20px; height:20px; fill:#fff; padding:0 20px 0;}
    .twittericon3 {width:20px; height:20px; fill:#fff; padding-right:20px;}
    .instagramicon3 {width:20px; height:20px; fill:#fff; padding-right:20px;}
    .youtubeicon3 {width:89px; height:20px; fill:#fff; padding-right:20px;}

    .twittericon3 a, .twittericon2 a {fill:#fff;}

    /* ------------------------------------------------------- 
        Cookie Policy                  
    ------------------------------------------------------- */

    .cookiecontainer {background-color:#323232; padding:20px; font-size:1.2em; margin-bottom:20px;}
    .col_cookietitle {float:none; color:#ffffff; font-size:1.4em; font-weight:300;}
    .col_cookietext {float:none; color:#bebebe;}
    .col_cookietext a {font-weight:bold;}
    .col_cookieoptions {float:none; padding-top:10px;}
    .col_cookieoptions input {cursor:pointer; background-color:Transparent; color:#ffffff; border:none; font-weight:bold; padding:0px;}

    /* ------------------------------------------------------- 
     header
    ------------------------------------------------------- */

    .col_labour {float:left; width:0;}
    .labouricon {width:0; height:0;}
    .col_logo {float:left; width:70%; padding-top:35px;}
    .col_logo a {color:#e4003b;}
    .col_logo a:hover {text-decoration:none;}
    .header {font-weight:800;}

    .col_menu {float:left; width:30%; padding:45px 0 20px 0;}
    .col_menu a {color:#12516f;}
    .col_menu a:hover {text-decoration:none;}
    .col_search {float:left; width:0;}
    
    .toggleSearch {display:none;}

    #access {width:1px; height:1px; overflow:hidden;}

    .socialbox2 {padding:10px 0 10px 0;}
    .social2 {float:right;}

     /* ------------------------------------------------------- 
     footer
    ------------------------------------------------------- */

    .col_copyright {float:none; width:100%; margin:0px; line-height:1.6em; font-size:1em; color:#fff; padding-top:60px;}
    .col_copyright h3 {color:#fff;}
    .col_copyright a {color:#fff; text-decoration:none; font-size:1.2em;}
    .col_copyright a:hover {color:#f7c5d2; text-decoration:underline;}

    .footersites {padding:40px 0 40px 0;}
    .footsite {float:left; margin:0 10px 10px 0;}
    .footsite .link {color:#e4003b; border:1px solid #fff; background-color:#fff; width:160px; font-size:0.9em;}
    .footsite a:hover {text-decoration:none; color:#fff; background-color:#e4003b;}

    .hbr {float:right; padding:0 4% 4% 0;}
    .socialcontainer {width:180px; margin:100px auto; position:relative; text-align:center;}
    .socialbox {padding:20px 0 0 0;}
    .social {float:left;}

    /* ------------------------------------------------------- 
     Page
    ------------------------------------------------------- */

    .pagepad {padding:50px 0 50px 0; font-size:1.2em; line-height:1.6em; font-weight:300; margin:0px auto;}
    .pagepad img {width:100%;}

    .homepad {font-size:1.2em; line-height:1.6em; font-weight:300;}

    .pagesingle {width:90%;}
    .pagefull {width:90%;}

    .col50, .col33, .col66 {float:none; width:100%; margin:0px; border-top:1px solid #444; padding:20px 0 80px 0;}
    .col33b {float:none; width:100%; margin:0px; padding:0 0 80px 0;}
    .col33b img {width:100%; max-width:500px;}
    .col33c {float:none; width:100%; margin:0px; padding:40px 0 40px 0;}

    .pagingnav {padding:20px 0 20px 0;}
  
    .contactimg {padding:5% 5% 0 0;}
  
    /* ------------------------------------------------------- 
     search results
    ------------------------------------------------------- */

    .searchitem {position:relative; top:0px; left:0px; background-color:transparent; border-bottom:1px solid #c7d0d8; padding:15px 15px 25px 0px; line-height:1.6em;}
    .searchitem a {display:block; text-decoration:none; font-size:1.4em; color:#e4003b; font-weight:600;}
    .searchitem a:hover {color:#2b7191;}

    .searchtitle {position:relative; left:0px; top:0px; font-size:1.4em; margin-bottom:15px;}
    .searchtitle a {font-weight:normal;}


    /* ------------------------------------------------------- 
     forms
    ------------------------------------------------------- */
    .col_right textarea, .col_right input[type="text"] {width:90%;}
    .col_right select {width:93%;}

    .formelement {position:relative; left:0px; top:0; margin-bottom:10px; width:100%;}
    .formlabel {float:none; position:relative; left:0; top:0;}
    .forminput {float:none; position:relative; left:0; top:0;}
    .formcheckbox input {background-color:transparent; border:none;}

    /* photos */
    .putleft {float:none; padding:0px 0px 20px 0px;}
    .putright {float:none; padding:0px 0px 20px 0px;}
    .photo {position:relative; float:none;}
    .photoleft {float:left; padding:0px 20px 20px 0px;}
    .photoright {float:right; padding:0px 0px 20px 20px;}


    /* ------------------------------------------------------- 
     homepage
    ------------------------------------------------------- */

    .socialfeed {margin-top:10px;}
    .sociallink {margin-top:10px;}

    .newscont {float:none; width:100%; margin:0px;}
    .newsitem {border-top:1px solid #444; padding:10px 0 20px 0; margin-top:40px;}
    .newsitem a {color:#333;}
    .newsitem a:hover {color:#e4003b; text-decoration:none;}
    .newsdate {margin-bottom:15px;}

    /* ------------------------------------------------------- 
      banner
    ------------------------------------------------------- */

    div#slider {width:100%; overflow:hidden;}
    div#sliderbox {position:relative; width:300%; margin:0; padding:0; text-align:left; animation:30s slidy ease-in infinite ;}
    .bannerimg img {width:100%; display:block;}
    .banner {position:relative; z-index:1; width:33.33%; height:auto; float:left;}
    .bannerimg {width:100%; z-index:1; position:relative;}
    .bannertxt {position:absolute; width:100%; height:100%; top:0; z-index:99; color:#fff; font-size:1.4em; font-weight:300; text-align:center;
     display:-webkit-box; display:-webkit-flex; display:-ms-flexbox;
     display:flex; -webkit-box-flex:1; -webkit-flex:1; -ms-flex:1; flex:1;
     -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-align: center; -webkit-align-items: center;
     -ms-flex-align:center; align-items:center; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center;
     }

    /*@keyframes slidy {
        0% {left:0%;}
        27% {left:0%;}
        33% {left:-100%;}
        60% {left:-100%;}
        66% {left:-200%;}
        93% {left:-200%;}
        100% {left:0%;} 
        } */

    @keyframes slidy {
         0% {left:0%; opacity:0;}
         10% {left:0%; opacity:1;}
        32.9% {left:0%; opacity:1; }
        
        33% {left:-100%; opacity:0;}
        43% {left:-100%; opacity:1;}
        65.9% {left:-100%; opacity:1;}

        66% {left:-200%; opacity:0;}
        76% {left:-200%; opacity:1;}
        100% {left:-200%; opacity:1;}
      
        } 


/* ==========================================================================
   Tablet Portrait
   ========================================================================== */

@media screen and (min-width:360px) {
  
    .container {width:320px; padding:0;}
    .navcontainer {width:320px; padding:0;}

    .col_logo {width:250px;}
    .header {font-size:1.2em;}
    .col_menu {width:70px;}
}

@media screen and (min-width:400px) {
  
    .container {width:360px; padding:0;}
    .navcontainer {width:360px; padding:0;}

    .col_logo {width:290px;}
    .header {font-size:1.2em;}
    .col_menu {width:70px;}
   

    /* forms */
    .col_right textarea, .col_right input[type="text"] {width:70%;}
    .col_right select {width:72%;}
    .formlabel {float:left; width:30%; margin-right:5%;}
    .forminput {float:left; width:65%;}

    /* photos */
    .putleft {float:left; padding:0px 20px 20px 0px;}
    .putright {float:right; padding:0px 0px 20px 20px;}
    .photoleft {float:left; padding:0px 20px 20px 0px;}
    .photoright {float:right; padding:0px 0px 20px 20px;}

    iframe {height:600px;}
}


@media screen and (min-width:640px) {

    .container {width:600px;}
    .navcontainer {width:600px; padding:0;}

    .col_labour {width:160px; padding:20px 0 40px 0;}
    .labouricon {width:120px; height:120px;}
    .col_logo {width:370px; padding-top:45px;}
    .header {font-size:1.3em;}
    .col_menu {width:70px;}

    .footsite {margin:0 20px 0 0;}
    .footsite .link {width:170px;}

    .pagingnav {font-size:1.2em;}
    .pagingnav li a {padding:3px 8px 3px 8px; margin-right:7px;}
    .pagingnav li.pagingon {padding:3px 8px 3px 8px; margin-right:7px;}

     h1 {font-size:2.6em; margin:0 0 1em 0;}
    .pagepad {padding:100px 0 100px 0; font-size:1.2em; line-height:1.6em; font-weight:300; margin:0px auto;}
    .homepad {font-size:1.2em; line-height:1.6em;}

    .pagesingle {width:500px;}
    .pagefull {width:100%;}
    .contactimg {padding:5% 50% 0 0;}
}

/* ==========================================================================
   Desktop layout
   ========================================================================== */

@media screen and (min-width:781px) {

    .container {width:740px;}
    .navcontainer {width:740px;}
    
    /* ------------------------------------------------------- 
     header
    ------------------------------------------------------- */

    .col_labour {width:160px;}
    .labouricon {width:120px; height:120px;}
    .header {font-size:1.5em;}
    .col_logo {width:510px; padding-top:45px;}
    
    .col_copyright {padding-top:80px;}
    .footersites {padding-bottom:60px;}
  
    .pagepad {padding:100px 0 100px 0; font-size:1.3em; line-height:1.6em;}
    .homepad {font-size:1.3em; line-height:1.6em;}
    .pagesingle {width:600px;}

     /* ------------------------------------------------------- 
     banner
    ------------------------------------------------------- */
    .bannertxt {font-size:1.8em;}
 
}

@media screen and (min-width:1000px) {
    
    .container {width:960px;}
    #access {width:2px;}

    .col_labour {width:180px; padding-bottom:10px;}
    .labouricon {width:140px; height:140px;}
    .col_logo {width:710px; padding-top:45px; font-size:1.2em;}
    .header {font-size:1.6em;}
   
    .col_menu {float:none; width:0px; padding:0px;}
    .col_search {width:70px; padding:45px 0 0 10px;}

     .toggleSearch {display:block;}

     #searchbox {position:absolute; top:-105px; left:300px; width:350px;}
    .searchfield {width:250px; height:40px; padding:0 40px 0 0;}
    .searchfield input {width:240px; padding:15px 50px 15px 15px; background-color:#f9f9fb; border-bottom:1px solid #444;}
    .searchfield input:focus {background-color:#f9f9fb; border-bottom:1px solid #e4003b;} 
    .searchbut {position:absolute; width:40px; left:260px; top:10px;}
    .searchbut a {line-height:40px; margin:0; padding:0;}
    .searchclosebox {position:absolute; left:300px; display:block; width:50px; height:45px; padding:0 0 0 20px; font-size:2.6em; background-color:#f9f9fb;}
    .searchclosebox a {line-height:40px; margin:0; padding:0;}

    .socialbox2 {padding:15px 0 15px 0;}

     /* ------------------------------------------------------- 
     navigation
    ------------------------------------------------------- */

     #navbox {position:relative; top:0; left:0; z-index:2; padding-bottom:10px;}
     #toolbar {margin-top:0%; display:block; float:right;}
    .col_tool {margin:0px; padding-left:10px;}

    .toggleMenu {display:none;}

    #nav {display:block; position:relative; padding:0; width:100%; margin:0; background-color:#f9f9fb;}

    .nav {position:relative; padding:0; width:100%; margin:0; text-align:right; background-color:#f9f9fb;}
    .nav li {margin:0;}
    .nav a {padding:10px 28px 10px 0; font-size:1.2em; color:#12516f;}
    .nav a:hover {background-color:transparent;}
    .nav a.navparent .menuright {padding-left:15px;}
    .nav > li {float:left; border-top:none; position:static;}
    .nav > li .toolsel {color:#e4003b; font-weight:600;} 
    .nav ul {list-style:none; z-index:999;}

    .pagepad {padding:100px 0 100px 0; font-size:1.4em;}
    .homepad {font-size:1.4em;}
    .homepad h2 {font-size:1.4em;}
    .pagefull {width:100%;}

    h1 {font-size:2.6em;}
    h2 {font-size:2.0em;}
   
   .col33b {float:left; width:30%; margin-right:3%;}
   .col33c {float:left; width:30%; margin-right:3%;}
   .col33 {float:left; width:30%; margin-right:3%;}
   .col50 {float:left; width:42%; margin-right:8%;}
   .col66 {float:left; width:60%; margin-right:3%;}
    
   .socialfeed {height:200px;}

   .newscont {float:left; width:30%; margin-right:3%;}
   .newsitem {height:140px;}

   .bannertxt {font-size:2.0em;}
   .contactimg {padding:5% 5% 0 0;}
}

@media screen and (min-width:1240px) {
 
   .container {width:1200px;}
   .col_logo {width:945px; padding-top:35px;}
   .header {font-size:2.2em;}

}


    










