﻿body {
    background:#2f2f2f url('../img/site_bg.gif');
    padding:0;
    margin-bottom:0;
    font-size:14px/24px;
}

a,a:hover {color:#991616;}

.navbar {display:none;}

h1, h2, h3, h4, h5 {
font-weight: bold;
color: #383B3F;
-webkit-font-smoothing: subpixel-antialiased;
/*font-family: "Helvetica Neue",helvetica,arial,sans;*/
font-family: 'Open Sans Condensed', sans-serif;
}

h2 {margin-bottom:25px !important;}

a.thumbnail:hover {border-color:rgba(219,9,10,.8);-webkit-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(219,9,10,.6);-moz-box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(219,9,10,.6);box-shadow:inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(219,9,10,.6);}

.home h3 {font-size:36px;line-height:40px;}

.thumbnail {background:#fff;}

ul.services {list-style-type:none;margin:10px 0 10px 0; list-style-position:outside;}
ul.services li {line-height: 28px;margin-left:16px;}
ul.services li i {margin-right:4px;}

header {background:url('../img/header-bg.png');}

header .logo img {
    max-width:240px;
    margin:0;       
}

header .nav {text-align:right;float:right;margin:58px 20px 0 0;}
header .nav > li {
    display: block;
    float: left;
}
header .nav > li > a {
    display:block;
    float: none;
    padding: 10px 16px 11px;
    line-height: 19px;
    color: #999;
    text-decoration: none;
    text-shadow: 0 1px 0 rgba(0, 0, 0, .8);
    font-size: 1.2em;
    font-weight: bold;
    margin-bottom: 12px;
    line-height: 1.4em;
    color: #fff;
    -webkit-font-smoothing: subpixel-antialiased;
    font-family: "Helvetica Neue",helvetica,arial,sans;
}


header .nav > li > a:hover {background:#000; background:rgba(0,0,0,.75)}
header .nav > li > a.active  {background:#991616; background:rgba(153,22,22,.75)}

.copyright .container {background:0;}
.center {
    text-align:center;
}
#main
{
    margin:0 auto;
    background: #e2e2e2 url(../img/home_bottom_bg.jpg);
    -webkit-box-shadow: 0px -9px 9px #000000;
    -moz-box-shadow: 0px -9px 9px #000000;
    box-shadow: 0px -9px 9px #000000;
    overflow: hidden;
}

.hero {
    /*background: url('../img/hero-hdr.jpg') no-repeat bottom center;*/
    background: url('../img/PreferredSB-11.jpg') no-repeat bottom center;
    background-size: cover;
    background-position: 0% 40%;
    min-height:580px;
    position:relative;
}
    .hero.services {
        background: url('../img/PreferredSB-01.jpg') no-repeat bottom center;
    }
    .hero.about {
        background: url('../img/PreferredSB-03.jpg') no-repeat bottom center;
    }
    .hero.contact {
        background: url('../img/PreferredSB-14.jpg') no-repeat bottom center;
    }

.hero .container, .hero header {position:relative;}

.home-img
{
    position: relative;
    width: 410px;
    height: 250px;
    border: 5px solid white;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: -1px -1px 3px #dfdfdf;
    -moz-box-shadow: -1px -1px 3px #dfdfdf;
    box-shadow: -1px -1px 3px #dfdfdf;
    z-index: 1000;    
}

.inside h1 {margin-bottom:40px;}

img 
{
    max-width: 100%;
    height: auto;
    border: 0;
    -ms-interpolation-mode: bicubic;    
    }

.call 
{
    background:#fff;
    /*height:108px;*/
    height:10px;
}

.intro {
    display:none;
}
.hero .container {padding:110px 0 0 0 !important;color:#fff;}
.hero .container h1 {font-size:60px;text-transform:uppercase;/*background:url('../img/header-bg.png');*/}
.hero .container h3 {max-width:100%;}
.hero p {color:#fff;font-size:16px;background:url('../img/header-bg.png');padding:0px 25px 20px 35px; width:50% !important;}

h1.super {
color: #FFF;
font-size: 100px;
line-height: 100px;
}
.extra-bold { font-weight: 800 !important;}
.hightlight{background:url('../img/header-bg.png');background:rgba(22,22,22,.75);padding: 5px 20px 6px 20px;}
.line-height{margin-top: 8px;}
.line-height.first-line {margin-top:0;}
span.desktop-highlight {
    padding: 5px 26px;
    background:url('../img/header-bg.png');
    background:rgba(22,22,22,.75);
    color: #FFF;
    font-size: 22px;
}


.hero .container {padding:160px 0 80px 0;}

.hero.sub {min-height:268px !important;background-position:0px 33%;}
.hero.sub .container {padding:0 !important;}
.hero.sub .container a {color:/*#991616*/ #fff !important;}
.hero.sub .container h3 {text-transform:uppercase; font-size:24px;float:right;margin-top:30px;}

.hero.sub .container h3 span {padding: 10px 26px 12px;
    background:rgba(153,22,22,.5);
    color: #FFF;
    font-size: 18px;}

.primary.container h1 {font-size:44px; line-height:48px;}
.primary.container {padding-bottom:80px;}
    .primary.container.about {
        padding-top:80px;
        padding-bottom:80px;
    }

.bg-section {
   
    background-size: cover;
    background-position: 0% 40%;
    position:relative;
    padding-top:20px;
    padding-bottom:20px;
    position:relative;
}

    .bg-section.about {
         background: url('../img/hero-hdr.jpg') no-repeat bottom center;
    }

    .bg-section.services {
         background: #555 url('../img/PreferredSB-13.jpg') no-repeat bottom center;
    }

    .bg-section .overlay {
        background: url("../img/header-bg.png");
        height:100%;
        width:100%;
       position:absolute;
       top:0;
    }

    .bg-section .container {
        position:relative;
    }

.bg-section h1, .bg-section, .bg-section p, .bg-section li {
    color:#fff;
}

/*.noise {display:none;}*/
.stripes {display:none;}

a {color:#222;}

.button {background:#991616;color:#fff;}
.button:hover {background:#991616;color:#fff;}

.button.small 
{
    font-size: 11px;
    padding: 0 28px;
    line-height: 36px;
}

footer {background:#222;min-height:240px;color:#fff;margin:0;padding:0;}
footer p {font-size:18px;line-height:26px; color:#666; width:90%;}
footer a {color:#fff;}
footer h3 {line-height:26px;margin-top:40px;}
footer .thumbnails li a {background:#fff;}
footer .thumbnails {margin-top:60px;}

.carousel-control 
{
    margin-top:0px !important;
    border: 1px solid white;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;               
}


/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */

@media only screen and (max-width: 479px) {
    #main {width:100%;}
    .primary.container {padding:0 20px 60px !important;}
    .primary.container h1 {font-size:26px; line-height:34px;}
    ul.thumbnails {display:none;}
    header {position:relative;text-align:center;}
    header .logo img {
        max-width:260px;
        margin: 0 auto;
        padding-top:5%;   
    }
    header .nav {display:none;}
    .navbar {display:block;}
    .hero,.hero header {min-height:235px;height:235px;margin-top:-18px;}
    .hero h1, .hero .line-height {display:none;}
    footer{min-height:80px;}
    .home-img {width:100%;height:auto;}
    .primary.container {
        padding: 30px 20px 60px !important;
    }
    
    .control-group{display:block;float:none !important;}
    input[type="text"],textarea,select 
    {
        width:280px!important; 
        min-height:40px;   
    }
    .span8 br {display:none;}
    
    #map_canvas{display:none;}
    .hero.sub .container {
        display:none;
    }
    .hero.sub {min-height:inherit !important;}
    input[type="button"], input[type="reset"], input[type="submit"] {
        width: 100%;
        height: auto;
        margin-top:30px;
    }
    .button 
    {
        width: 212px;
        text-align: center;
    }
    
    .primary.container.about.inside .thumbnail img {width:100%;max-width:100%;}
    .primary.container.about.inside .thumbnail {float:none;margin:0 0 30px 0 !important;}
    
    .primary.container.services {padding-left:50px !important;}
    .primary.container.services .row .span6 div {margin-left:-34px !important;}

}


/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */

@media only screen and (min-width: 480px) and (max-width: 767px) 
{
    #main {width:480px;}
    .primary.container {padding:0 20px 60px !important;}
    .primary.container h1 {font-size:26px; line-height:34px;}
    ul.thumbnails {display:none;}
    header .logo img {
        max-width: 340px;
        margin: 4px 0 20px 70px;   
    }
    header .nav {display:none;}
    .navbar {display:block;}
    .hero,.hero header {min-height:235px !important;height:235px !important;margin-top:-18px;}
    .hero h1, .hero .line-height {display:none;}
    footer{min-height:80px;}
    .home-img {margin-left:10px;}
    .primary.container {
        padding: 30px 20px 60px !important;
    }
    
    
    .control-group{display:block;float:none !important;}
    input[type="text"],textarea,select 
    {
        width:430px!important;    
    }
    .span8 br {display:none;}
    
    #map_canvas{width:430px;}
    .hero.sub .container {
        display:none;
    }
    .hero.sub {min-height:inherit !important;}
    input[type="button"], input[type="reset"], input[type="submit"] {
        width: 100%;
        height: auto;
    }
    .button 
    {
        width: 85%;
        text-align: center;
    }
    
    .primary.container.about.inside .thumbnail img {width:100%;max-width:100%;}
    .primary.container.about.inside .thumbnail {float:none;margin:0 0 30px 0 !important;}
}
 
/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {
    #main {width:768px;}
    .primary.container h1 {font-size:34px; line-height:38px;}
    .navbar {display:none;}
    .hero .container {
        padding: 130px 0 80px 0;
    } 
    .hero h1, .hero .line-height
    {margin-left:19px;}
    .home-img {width:340px;height:207px;margin-top:4px;}
    
    .primary.container.about.inside .thumbnail img {max-width:290px;}
    .primary.container.about.inside .thumbnail {margin-top:70px;}
    .primary.container.about.inside .thumbnail.pull-left {float:right;margin-left:30px;margin-right:0 !important;}
    .control-group{display:block;float:none !important;}
    input[type="text"],textarea,select 
    {
        width:468px!important;    
    }
    .span8 br {display:none;}
}

.thumbnails > li.span2 {
    max-width: 12% !important;
}
 
/*Large desktop*/
@media only screen and (min-width: 1200px) 
{
    #main {width:1080px;} 
    .navbar {display:none;}  
}

/*
#Tablet (Portrait)
#Mobile (Portrait)
#Mobile (Landscape)
*/

