/*  Created on : Feb 2014 
    Author     : Adrian L*/ 
#sidr, #tabletNav, #mobileNav, .mobile, .boxMobileOnly {display:none;}

h1, h2, h3,h4, h5 { 
    font-family: 'Open Sans', arial, sans-serif;
    font-weight:400;
    color:#002e6c;
}
h6 {
    color:#6f6f6e;
}
.centred {
    text-align:center;
}
body {
    /*font-family:'Open Sans', Arial, sans-serif;*/
    font-family: 'Open Sans', Arial, Sans-serif;
    font-weight:400;
    margin-top:109px;
    color:#6f6f6e;
}
ul li {
    list-style-type:none;
}
a {
    text-decoration:none;
    color:#126FB1;
}
.container {
    max-width:1260px;
}

.mobileOnly {
    display:none;
}
/*-----------------------------Header-------------------------*/

#headerWrap {
    position:fixed;
    top:0;
    width: 100%;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
    background:white;

    z-index:101;

}
#header {
    height:103px;
    width:100%;
    max-width: 1250px;
    margin: 0 auto;
    padding: 0 20px;
    box-sizing: border-box;
}

#header #logo img {
    width:15%;
    height:auto;
    float:left;
    padding:24px 0 0 44px;
}



/*-----------------------------manNav styles-------------------------*/
#mainNav ul {
    float:right;
    padding:16px;
    margin-bottom:0;
}

#mainNav ul li {
    float:left;
    padding:0 24px;
}

#mainNav ul li a {
    font-weight:bold;
    color:#002E6D;
}

#mainNav ul li a.current,#mainNav ul li a.section, #mainNav ul li a:hover {
    color:#f5842a
}

#mainNav #contactPanel {
    width:420px;
    float:right;
    background:#f5842a;
    color:white;
    padding:16px 16px 8px;
    margin-right:36px;
    position:relative;
}
#mainNav #contactPanel a {
    color:white;
}
#mainNav #contactPanel a:hover {
    text-decoration:underline;
}
#mainNav #contactPanel img {
    float:left;
}
#mainNav #contactPanel img.emailIcon {
    padding:6px 6px 0 16px;
}
#mainNav #contactPanel img.mobileIcon {
    padding:0 8px 0 4px;
}
#mainNav #contactPanel span {
    margin:0;
    float:left;
    display:block;
    font-size:1.1em;
    padding-bottom:4px;
}
/*-------------------------main structure---------------------------------*/

/*for the content page sliders*/
#slideWrap {
    width:100%;
}

#mainSliderWrap {
    /*width:79.6%;*/
    width:79.56%;
    
    padding:0 1.3% 0 0;
    float:left;
    overflow:hidden;
}
.breadBox {
    padding:20px 25px;
    text-transform:uppercase;
}

.breadBox a {

}
/*---------------------- homepage boxes ----------------------------*/

.box{
    position: relative;
    width: 19%;	
    margin:0 1.2% 1.2% 0;
    background:grey;
    float:left;
    overflow:hidden;
    -webkit-transition: opacity .25s ease-in-out;
  -moz-transition: opacity .25s ease-in-out;
  -ms-transition: opacity .25s ease-in-out;
  -o-transition: opacity .25s ease-in-out;
  transition: opacity .25s ease-in-out;
}


.box:before{
    content: "";
    display: block;
    padding-top: 100%; 
}

.box img {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:auto;
}

.box.grey {
    background:#E6E5E3;

}
.box.brown {
    background:#B1A07B;
}
.box.brown p, .box.grey p {
    color:#002E6D;
}
.box.position-3 {
    clear:left;
}
.box.position-8,.box.position-1,.box.position-2 {
    margin-right:0;
} 
.box.black {
    background:black;
}

.box .boxWrapper {
    position:absolute;
    bottom:0%;
    left:0%;
    width:100%;
    height:24%;
    background:rgba(0,46,109,0.5);
}
.box .boxWrapper:hover {
    background:rgba(0,46,109,0.8);
    
}
.box .boxWrapper img {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:auto;
}
.box .boxWrapper p {
    font-weight:normal;
    color:white;
    top: 50%;
    transform: translateY(-50%);        
}
.box p {
    position:relative;
    z-index:99;
    /*width:30%;*/
    font-size:1.2em;
    padding:5%;
    text-align:center;
}

.box img.boxBackground:hover {
    opacity:0.5;
}

.box.grey:hover, .box.brown:hover {
    background:grey;
}
.box img.boxIcon {
    width:56%;
    height:auto;
    padding:14% 0 0 22%;
}
.box p.withIcon {
    position:absolute;
    bottom:26px;
    padding:0;
    margin:0;
    width:100%;
}
/*------------------------The sections --------------------------*/
#sectionsWrap {
    clear:left;
    margin:30px 0
}
#barBackground, #contactBackground{
    width:100%;
    background:#e0dfd7;
    margin-bottom:30px;
}
#barBackground.blogBackground {
    background:white;
}
.sectionPanel {
    width:25%;
    padding:0 4.1%;
    float:left;
    text-align:center;
    border-right:1px solid silver;
    margin:30px 0
}
.blog .sectionPanel {
    padding:0 1.5%;
    width:30%;
    border-right:0;
}
#blogHolder .sectionPanelWrap {
    padding-bottom:0;
}
#blogHolder .blog .sectionPanel {
    margin:0 0 20px 0;
}
.blog .sectionPanelWrap {
    background:#e0dfd7;
}
.sectionPanel.last {
    border-right:0;
}
.barSection p {
    clear:left;
    color:#ababab;
}
a.pageButton {
    display:block;
    width:160px;
    padding:12px;
    background:#b0a07e;
    margin:0 auto;
    color:white;
    border-radius:5px;
}
 a.pageButton:hover {
    color:silver;
}
a.pageButton.blue {
    background:#156db5;
}
a.pageButton.darker {
    background:#1b3661;;
}
.Modulus-2 a.pageButton {
    background:#156db5;
}
.Modulus-0 a.pageButton {
    background:#1b3661;
}
.sectionPanel h2 {
    color:#002E6D;
    font-size:1.3em;
    font-weight:400;
}

.blog .sectionPanel .blogTitleWrap {
    width:80%;
    padding:30px 0 20px 10%;  
    min-height:55px;
}
.blog .sectionPanel .blogIntroWrap {
    min-height:50px;
}


.blog .sectionPanel h2 {
    line-height:1.2;
    color:#707173;
    margin-bottom:0;
    
}
.blog .sectionPanel p {
    width:60%;
    padding-left:20%;
    color:#707173;  
    margin-bottom:12px;
}
.blog .sectionPanelWrap {
    min-height:354px;
    padding-bottom:30px;
    box-shadow: -2px 2px 5px silver;
}
/*--------------------------override padding for the blogholder page---------------------------*/
#blogHolder .blog .sectionPanel .blogTitleWrap {
    padding:20px 0 20px 10%;
    min-height:90px;
}
#blogHolder .blog .sectionPanelWrap {
     min-height:375px;
}
#blogHolder .blog .sectionPanel {
    padding:0 1.5%;
    width:22%;
    border-right:0;
}
body.StaffHolderPage #blogHolder .blog .sectionPanel .blogTitleWrap {
    min-height:55px;
    padding:14px 0 14px 10%;
}
body.StaffHolderPage #blogHolder .blog .sectionPanel .blogIntroWrap {
    min-height:24px;}
.staffSocial {
    text-align:center;
}
.blog .sectionPanel .staffSocial img {
    width:12%;
    height:auto;
}
a.staffLink {
    display:block;
    padding:10px 0;
}
#blogHolder .sectionPanelWrap.staff {
    height:424px;
    overflow:hidden;
}
.sectionPanel img {
    width:30%;
    height:auto;
    /*padding:0 1% 10px 1%;*/
    /*display:block;*/
    padding:0 0 10px 0;
}
.blog .sectionPanel img {
    width:100%;
}
#sectionIntro {
    text-align:center;
    width:50%;
    margin:0 auto;
    padding:50px 0 0 0;
    font-size:1.4em;
}
.StaffHolderPage #sectionIntro {
    width:72%;
}
.StaffHolderPage #blogHolder .blog .sectionPanel {
    margin-bottom:30px;
}
.sectionContact {
    margin:30px 0;
}
.sectionContact h2 {
    color: #002E6D;
    font-size: 1.8em;
    text-align:center;
    margin-bottom:30px;
}
.contact {
    width:15%;
    padding:0 1%;
    float:left;
    text-align:center;
}
.contact.first {
    padding-left:17%;
}
.contact p {
    margin-top:5px;
}
.contact p span {
    color:#84a5cf;
    display:block;
}
.contact img {
    width:60%;
    height:auto;
}
/*--------------------------------landing page-----------------------------------------------*/

.LandingPage #contentWrap {
    width:70%;
    padding-left:15%;
}
.panel {
        background:#e0dfd7;
        margin-bottom:15px;
}
.panel h1 {
    color:#002E6D;
    font-size:1.8em;
}
.landingPanel {
    position:relative;
    background:#e0dfd7;
    width:26%;
    float:left;
    padding:6%;
}
.even .landingPanel {
    
}
.landingPanel a {
    text-align:center;
    position:absolute;
    left:15%;
    bottom:0%;
}
.panel img {
    width:60%;
    height:auto;
    display:block;
    float:left;
    border-right:15px solid white;
}
.even img {
    float:right;
    border-left:15px solid white;
    border-right:0;
}
/*--------------------------------------content page--------------------------------*/
.content-position-1,.content-position-8{
    width:59.5%;
}
.box.content-position-1:before,.box.content-position-8:before {
    content: "";
    display: block;
    padding-top: 65.5%; 
//        padding-top: 56.9%; 

}
.box.content-position-1 .roundWrapper,.box.content-position-8 .roundWrapper  {
    width:30%;
    left:35%;
}
.box.content-position-1 p, .box.content-position-2 p, .box.content-position-8 p, .box.content-position-9 p{
    padding:35% 18%;
    font-size:1.8em;
    line-height:1.2;
}
.box.content-position-2,.box.content-position-9  {
    width:39%;
}
.box.content-position-2:before, .box.content-position-9:before{

}
.box.content-position-2 .roundWrapper,.box.content-position-9 .roundWrapper  {
    width:45%;
    left:27.5%;
}
.content-position-7,.content-position-2,.content-position-9,.content-position-14,.content-position-19,.content-position-24,.content-position-29,.content-position-34 {
    margin-right:0;
}
#contentIntro {
    /*text-align:center;*/
    width:75%;
    margin:0 auto;
    padding:60px 0 0 0;
    /*font-size:1.4em;*/
}
.biggerText {
    /*matches the style in the Tiny MCE dropdown*/
    font-size:1.2em;
}
.normalText {
    font-size:1em;
}
/*.twelve.columns {background:pink;}*/
/*------------- and the content-------------------*/
#contentWrap {
    clear:left;
    margin-top:60px;
}
#contentWrap.sliderPresent {
    margin-top:10px;
}
#contentWrap h1 {
    font-size:2em;
}
#contentWrap h2 {
    font-size:1.8em;
}
#contentWrap h3 {
    font-size:1.6em;
}
#contentWrap ul,#contentIntro ul {
    margin:0 0 20px 30px;
}
#contentWrap ul li,#contentIntro ul li{
    list-style-type:disc;
    list-style-position: outside;
}
#subSliderWrap {
    width:60%;
    padding-left:15%;
}
#barBackground.quotesBackground {
    background:white;
}
#barBackground.quotesBackground #sectionIntro p {
    color:#002E6D;
    font-size:1.4em;
    margin-bottom:0;
}
/*----------------------------sideBar------------------------------*/
.sideBar {
    padding-top:58px;
}
/*--------------------------------------subnav-----------------------*/
#subNav ul {
    margin-left:2px;
}
#contentWrap #subNav li {
    padding:4px 0 6px;
    margin:0; 
    list-style-type:none;
}
#subNav ul li a.current {
    color:#f5842a
}

#subNav ul li ul {
    margin:5px 0 0px 16px;
}
/*---------------------- blog stuff-------------------------*/

.blogArticle img {
    width:100%;
    height:auto;
    display:block;
    margin-bottom:40px;
}
.BlogArticle .widgetContent ul li, .BlogArticle .widget h3 {
    text-align:center;
}
#paginationWrap {
    display:table;
    height:48px;
    margin:0 auto;
    padding-top:22px;
}
ul.pagination li {
    float:left;
    padding:0 8px;
}




/*-----------------------------widgets per se--------------------------*/
.widget {margin-bottom:20px;}


/* TagWidget
 * ------------------------------------- */

#tagWidget a{ line-height:25px; }
#tagWidget .not-popular { font-size: 1em; }
#tagWidget .not-very-popular { font-size: 1.2em; }
#tagWidget .somewhat-popular { font-size: 1.3em; }
#tagWidget .popular { font-size: 1.4em; font-weight:bold;}
#tagWidget .very-popular { font-size: 1.6em; font-weight:bold;}
#tagWidget .ultra-popular { font-size: 1.8em; font-weight:bold;}
/*----------------------------- footer stuff-------------------------*/

#footerTop {
    background-color:#f5842a;
    padding:18px 0 4px 0;
    margin-top:30px;
}
#footerTop h3 {
    font-weight:400;
    color:white;
    font-size:1.6em;
    text-align:center;
}
#footer {
    background-color:#002E6D;
    color:white;
    min-height:120px;
    padding:20px 0 30px 0;
    
}




#footer span.emailLink {
    clear:left;
    padding-top:5px;
    display:block;
}
#footer a.mapLink img{
    display:block;
    float:left;
    padding-right:14px;
    margin-top:3px;
}
#footer span.emailLink img{
    display:block;
    float:left;
    padding-right:10px;
    margin-top:6px;
}
.footerLogo {
    min-height:320px;
    border-right:1px solid grey;

}
.footerLogo img {
    width:80%;
    height:auto;
    padding:3px 0 0 30px; 
}

#footer .social {
    float:right;
}

#footer a {
    text-decoration:none;
    color:white;
    
}
#footer a:hover {
    text-decoration:underline;
}
#footer #upperBar h3 {
    width:40%;
    float:left;
    color:white;
    padding:12px 0 12px 20px;
    font-weight:400;
    font-size:1.6em;
}
#socialIcons {
    float:right;
}
#socialIcons img {
    padding-left:5px;
}

#socialIcons img:hover {
    opacity:0.7;
}

#showroomWrap {
    padding-left:20px;
    width:70%;
    float:left;
}

#showroomWrap a {
    color:white;
}

#showroomWrap a:hover, #showroomWrap img:hover {
    opacity:0.8
}
#footer .office {
    width:231px;
    float:left;
}
#footer .office.first {
    padding:0 3% 0 0;
}

#contact {
    clear:both;
    float:right;
    text-align:right;
    margin-top:0;
    font-size:0.8em;
}
/*-----------------------contact page stuff--------------------------------*/
#mapWrap {
    width:45%;
    padding-left:5%;
    float:right;
}
#mapWrap iframe {
    max-width:100%;
}
#contentWrap fieldset ul li {
    list-style-type:none;
}
#formWrap {
   width:45%;
   float:left;
}

.UserDefinedForm input[type="email"], .UserDefinedForm input[type="text"],.UserDefinedForm textarea {
    width:100%;
    border-radius:0;
    border-color:black;
}
.UserDefinedForm textarea {
    min-height:300px;
}
label.required {color:red;font-weight:bold;font-size:1.6em;padding:12px 0 18px}

@media (max-width: 1460px) {
    .container {width:95%;}
    
}

@media (max-width: 1026px) {
    
    .tablet {display:block;}
    #mainNav ul {display:none;}
    #mainNav #contactPanel {margin-top:20px;}
    #tabletNav {display:block;position:absolute;left:20px;top:35px;} 
    #header #logo img {height:50px;width:auto;}
    #mainSliderWrap {width:100%;}
  
    .box{width: 23.8%;margin:0 0.6% 1.2% 0.6%}
    .box.position-3 {clear:none;float:left;}
    .box.position-7,.box.position-1,.box.position-2 {margin-right:0.6%;} 
    .three.columns.footerLogo {padding-right:20px;}
    
    .box.content-position-2, .box.content-position-9 {width:23.8%;}
    .box.content-position-1:before, .box.content-position-8:before {padding-top:100%;}

    #blogHolder .blog .sectionPanel {width:47%;}
    #blogHolder .blog .sectionPanelWrap {height:450px;}    
    
    #blogHolder .blog .sectionPanel .blogTitleWrap {min-height:60px;}
    body.StaffHolderPage #blogHolder .blog .sectionPanel {width:30%;}
    body.StaffHolderPage #blogHolder .blog .sectionPanel .blogTitleWrap {min-height:36px;}
    .landingPanel p {display:none;}
    #subSliderWrap {padding-left:0%;}
    .boxMobileOnly {display:block;}
    #imageGallery .box.first img {height:100%;width:auto;}
  
    
}

@media (max-width: 830px) {
    #mainSliderWrap {display:none;}
    #mainNav {display:none;}

    .box{width: 48.6%;margin:0 0.6% 1.2% 0.6%}
    .box.mobile-position-0 {margin-right:0;}
    #barBackground {background:white;}
    .sectionPanel {width:90%;border-right:0;}
    .blog .sectionPanel {width:45%;}
    .StaffHolderPage #blogHolder .blog .sectionPanel {width:46%;}
    .StaffHolderPage #blogHolder .blog .sectionPanelWrap {height:370px;min-height:370px;}
    .landingPanel a {left:26%;bottom:-20px;display:block;}

    #blogHolder .blog .sectionPanel {width:47%;}
    .panel {position:relative;}
    .panel img {width:48.9%;}
    .box, .box.content-position-2, .box.content-position-9 {width:48.6%;}
    .box.content-position-1:before, .box.content-position-8:before  {padding-top:100%;}    
    #mapWrap,#formWrap {width:100%;}
    #sectionIntro,#barBackground.quotesBackground {display:none;}
    #blogHolder .blog .sectionPanel .blogTitleWrap {min-height:0px;}
    body.StaffHolderPage #blogHolder .blog .sectionPanel .blogTitleWrap {padding: 4px 0 4px 10%}
    

}

@media (max-width: 660px) {
    .deskTopTablet {display:none;}
    .mobileOnly {display:block;}
    .mobileLogo {width:60%;padding:20px 20%;text-align:center}
    .mobileLogo img {width:100%;padding:5px 0 20px 0;}
    .container {padding:0;}
    .box .boxWrapper p {font-size:1em;}
    #header {height:80px;}
    body {margin-top:82px;}
    .mobile {display:block;}
    a.moby {background:orange; font-weight:bold;font-size:1.4em;display:block; padding:12px 0;color:white;float:right;width:45%; margin-left:1%;text-align:center;}
    #mobileNav {display:block;position:absolute;left:20px;top:14px;width:92%;overflow:hidden;} 
    #mobileNav a.menuButton {width:6%;float:left;padding:12px .5% 0 0;}
    #tabletNav, #logo {display:none;}
    img.sliderReplacement {width:100%; height:auto;}
    .blog .sectionPanel, #blogHolder .blog .sectionPanel {width:97%;}  
    .barSection p {display:none;}
    .StaffHolderPage .barSection p {display:block;font-size:1em;margin-bottom:6px;}
    .sectionContact {display:none;}
    .three.columns.footerLogo {display:none;}
    #contact {text-align:center;width:100%;}
    #footerTop h3 {display:none;}
    .StaffHolderPage #blogHolder .blog .sectionPanelWrap {height:340px;min-height:30px;}
    .panel img {width:48.4%;}
    .landingPanel {height:100%;}
    .panel h1 {font-size:1.2em;line-height:1;}
    a.pageButton {width:65%;}
    #socialIcons {float:left;width:100%;padding-left:14px;}
    .LandingPage #contentWrap {width:96%;padding-left:2%;}
    .landingPanel .mobileOnly a {top:20px;left:7%;}

    


      
}

@media (max-width: 560px) {
    
}