/*! HTML5 Boilerplate v5.0.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

ul, li { list-style: none; padding: 0; margin: 0}
a, a:hover, a:focus, a:active, input, input:focus, input:active { text-decoration: none; outline: none !important}
h1, h2, h3, h4 { margin: 0; font-weight: 100}
body, .sidebar, .container-fluid{height: 100%}
body{font-family: 'Open Sans', sans-serif; font-weight: 100}
/*body{font-family: 'Lobster', cursive;}*/
.nopadding{ padding: 0 !important;}
* { transition: all 0.3s linear; -webkit-transition: all 0.3s linear;}
i{font-family: 'FontAwesome';}

.headerMain > .container{ position: relative; z-index: 99;}
.navbar-default { position: absolute; left: 0; top: 0; padding-top: 10px}

.intro{ /* background: url(../img/intro.jpg) 0 0/cover no-repeat;*/ min-height: 430px; position: relative; text-align: center;}
.footer{ background:url(../img/footer_bg.png) 0 bottom repeat-x #111523; padding-bottom:70px; padding-top: 100px; color: #fff}
.content{ position: relative; background: #f7f7f7; padding-top: 70px; padding-bottom: 40px} .content:after, .content:before{ content: ""; width: 100%; height: 68px; position: absolute;}
.content:before{background: url(../img/content_top.png) center top repeat-x; margin-top: -68px; top: 0}
.content:after{background: url(../img/content_bottom.png) center top repeat-x; margin-bottom: -68px; bottom: 0}
.slider{ padding-top: 100px} 
.slider h2, .slider p, .slider a { opacity: 0; animation-duration: 1s; animation-timing-function: linear; animation-delay: 0s; }
.slider h2{ font-weight: bold; color: #fff; padding-bottom: 10px; font-size: 32px} 
.slider p{ color: #fff; padding-bottom: 10px; font-size: 26px} 
.slider a{ display: block; font-size: 14px; line-height: 36px; display: block !important; margin: 0 auto; width: 100px; border-radius:3px; color: #663300;
background: #ffb819; /* Old browsers */
background: -moz-linear-gradient(top,  #ffb819 0%, #ffc92f 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb819), color-stop(100%,#ffc92f)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffb819 0%,#ffc92f 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb819', endColorstr='#ffc92f',GradientType=0 ); /* IE6-9 */
}
.item *{ visibility: hidden;} .item.active * { visibility: visible;}
.slider .item.active h2{ font-weight: bold; color: #fff; padding-bottom: 10px; opacity: 1; -webkit-animation-name: vanishIn; animation-name: vanishIn;} 
.slider .item.active p{ color: #fff; padding-bottom: 10px; opacity: 1;-webkit-animation-name: vanishIn; animation-name: vanishIn; animation-delay: .3s;} 
.slider .item.active a{ display: block; opacity: 1;-webkit-animation-name: boingInUp; animation-name: boingInUp;animation-delay: .7s;}
section.module.parallax-1 {background-image: url(../img/intro.jpg); background-position: 0 0; padding: 100px 0; display: block; height: 100%}
#myCarousel{ min-height: 200px}
.welcomeText h2{ padding-bottom: 20px}
.readmore { width: 100px; line-height: 36px; display: block; border-radius: 3px; color: #663300; text-align: center;

background: #ffb819; /* Old browsers */
background: -moz-linear-gradient(top,  #ffb819 0%, #ffc92f 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffb819), color-stop(100%,#ffc92f)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #ffb819 0%,#ffc92f 100%); /* IE10+ */
background: linear-gradient(to bottom,  #ffb819 0%,#ffc92f 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffb819', endColorstr='#ffc92f',GradientType=0 ); /* IE6-9 */
}

@-webkit-keyframes vanishIn {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(2, 2);
    -webkit-filter: blur(90px);
  }

  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 50%;
    -webkit-transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}
@keyframes vanishIn {
  0% {
    opacity: 0;
    transform-origin: 50% 50%;
    transform: scale(2, 2);
    -webkit-filter: blur(90px);
  }

  100% {
    opacity: 1;
    transform-origin: 50% 50%;
    transform: scale(1, 1);
    -webkit-filter: blur(0px);
  }
}



@-webkit-keyframes boingInUp {
  0% {
    opacity: 0;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(-90deg);
  }
  
  50% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(50deg);
  }

  100% {
    opacity: 1;
    -webkit-transform-origin: 50% 0%;
    -webkit-transform: perspective(800px) rotateX(0deg);
  }
}
@keyframes boingInUp {
  0% {
    opacity: 0;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(-90deg);
  }
  
  50% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(50deg);
  }

  100% {
    opacity: 1;
    transform-origin: 50% 0%;
    transform: perspective(800px) rotateX(0deg);
  }
}
p { font-size: 16px; line-height: 28px; padding-bottom: 20px;}
.carousel.slide, .intro > .container { position:static;}
.carousel-control i{ width: 36px; height: 36px; display: inline-block; vertical-align: middle; margin-top: -20px; top: 50%; position: absolute;}
.carousel-control.left i{ background:  url(../img/intro_prev.png) 0 0 no-repeat;}
.carousel-control.right i{ background:  url(../img/intro_next.png) 0 0 no-repeat;}
.carousel-indicators{ bottom: 40px; z-index: 999}
img{ width: 100%; height: auto;}
.gallery{ float: left; display: block; clear: both; margin: 30px 0}
#carousel li img{ width: auto; height: auto;}
.navbar-default{ background: none; border: 0 none;}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus{ background: none; color: #fff}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{ color: #ccc}
.navbar-default .navbar-nav > li > a{ color: #fff}
.navbar-default .navbar-nav > li.active a { color: #ffbf36}
.navbar-brand{ padding: 0; width: 200px} .navbar-brand > img{ width: 100%; height: auto;}
.iso{ position: absolute; z-index: 9; right: 0; top: 10px; color: #fff; padding-top: 10px; color: #99ccff} .iso > strong{ display: block;font-size: 16.6px;line-height: 9px;} .iso > small{}
.nav.navbar-nav { float: right; padding-right: calc(0 + 200px); margin-right: 144px}
.innerpage .intro{background: url(../img/intro.jpg) 0 0 /cover no-repeat #333; min-height: 180px;} .innerpage h2 { font-size: 40px; padding-bottom: 30px}

.map{ background: url(../img/map.jpg) right top no-repeat; background-size: 60%}
.map h3{ padding-bottom: 10px;}address{ margin-bottom: 40px} .map address p{ margin-bottom: 5px; padding-bottom: 0!important} .map address { padding-bottom: 30px} address p{ margin-bottom: 0; padding-bottom: 0!important}
.divisionsList li{ margin-left: 20px; list-style: circle; padding-bottom: 15px}
.company{ padding: 10px 0 20px}  .company h3{ padding-bottom: 10px} .company ul li{ list-style: decimal; margin-left: 30px; padding-bottom: 5px} 
.welcomeText > div > span{ display: none;}
.social + p, .social + p + p{ padding-bottom: 0 !important; margin: 0 !important; font-size: 14px}
address h3 { padding-bottom: 15px;}

.social { width: 100%; float: left; padding-bottom: 80px; padding-top: 40px}
.social li { float: left;}
.social li a{ display: block; width: 24px; height: 24px; background: url(../img/social.png) 0 0 no-repeat;}
.social li a:hover{ }
.social li.fb a{ background-position: 4px 0}
.social li.twitter a{background-position: -20px 0}
.social li.gplus a{background-position: -42px 0}
.social li.linkedin a{background-position: -66px 0}
.social li.fb a:hover{ background-position: 4px -26px}
.social li.twitter a:hover{background-position: -20px -26px}
.social li.gplus a:hover{background-position: -42px -26px}
.social li.linkedin a:hover{background-position: -66px -26px}


.list_carousel {
                clear: both; background: #fff; position: relative;

            }
            .list_carousel ul {
                margin: 0;
                padding: 0;
                list-style: none;
                display: block;
            }
            .list_carousel li {
                font-size: 40px;
                color: #999;
                text-align: center;
                width: 140px;
                height: 140px;
                padding: 0;
                margin: 20px;
                display: block;
                float: left;
                background: #fff;
                vertical-align: middle;
                line-height: 130px;
            }
            .list_carousel li img{ vertical-align: middle;}
            .list_carousel.responsive {
                width: auto; margin:40px 0; overflow: hidden;  float: left; width: 100%;
            } .list_carousel.responsive > div{ margin: 0 0 0 10% !important}
            .clearfix {
                float: none;
                clear: both;
            }
            .prev {
                float: left;
                margin-left: 10px;
                 background: url(../img/cslide_prev.png) right top no-repeat; width: 40px; height: 40px; position: absolute; z-index: 9; left: 0; top: 50%; margin-top: -20px;
            }
            .next {
                float: right;
                margin-right: 10px;
                 background: url(../img/cslide_next.png) left top no-repeat; width: 40px; height: 40px; position: absolute; z-index: 9; right: 0; top: 50%; margin-top: -20px;
            }
            .pager {
                float: left;
                width: 300px;
                text-align: center;
            }
            .pager a {
                margin: 0 5px;
                text-decoration: none;
            }
            .pager a.selected {
                text-decoration: underline;
            }
            .timer {
                background-color: #999;
                height: 6px;
                width: 0px;
            }

@media only screen and (min-width: 991px) {
     .intro section.module.parallax-1{ min-height: 530px}
}

@media only screen and (max-width: 1000px) {
     .nav.navbar-nav {margin-right: 100px;}
     .nav > li > a, .navbar-nav > li > a { padding-right: 10px !important; padding-left: 10px !important; }
}

@media only screen and (max-width: 768px) {
     .navbar-default { padding: 0 10px; width: 100% } .iso { right: 100px}
     .nav.navbar-nav{ margin: 0; width: 100%;}
     .collapse.in { background: rgba(0,0,0,0.7); margin: 0 -30px 0 -30px }
.navbar-collapse.collapse { border:0 none;}
}
@media only screen and (max-width: 480px) {
            .navbar-default .navbar-brand { width: 33px; overflow: hidden; padding-top: 10px} .navbar-default .navbar-brand img { width: auto; height: 33px}

}




/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Hide visually and from screen readers:
 * http://juicystudio.com/article/screen-readers-display-none.php
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screen readers:
 * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element
 * to be focusable when navigated to via the keyboard:
 * https://www.drupal.org/node/897638
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}



@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   http://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
    *,
    *:before,
    *:after {
        background: transparent !important;
        color: #000 !important; /* Black prints faster:
                                   http://www.sanbeiji.com/archives/953 */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links that are fragment identifiers,
     * or use the `javascript:` pseudo protocol
     */

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    /*
     * Printing Tables:
     * http://css-discuss.incutio.com/wiki/Printing_Tables
     */

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}





@keyframes animatedBackground {
    0% { background-position: 0 bottom; }
    100% { background-position: -300px bottom; }
}
@-moz-keyframes animatedBackground {
    0% { background-position: 0 bottom; }
    100% { background-position: -300px bottom; }
}
@-webkit-keyframes animatedBackground {
    0% { background-position: 0 bottom; }
    100% { background-position: -300px bottom; }
}
@-ms-keyframes animatedBackground {
    0% { background-position: 0 bottom; }
    100% { background-position: -300px bottom; }
}
@-o-keyframes animatedBackground {
    0% { background-position: 0 bottom; }
    100% { background-position: -300px bottom; }
}

.footer { 
    width: 100%; 
    background-color:  #111523; 
    background-image: url(../img/footer_bg.png);
    background-position: 0 bottom;

    animation: animatedBackground 10s linear infinite;
    -moz-animation: animatedBackground 10s linear infinite;
    -webkit-animation: animatedBackground 10s linear infinite;
    -ms-animation: animatedBackground 10s linear infinite;
    -o-animation: animatedBackground 10s linear infinite;
}