/*!
 * Start Bootstrap - Modern Business HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

/* Global Styles */

html,
body {
    height: 100%;
}


/* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
/* Right now there are 2 nav bars: navbar-fixed top (50px) plus gray navbar-fixed (30px) below, total 80px */
body {
    padding-top: 90px; 
}

.img-portfolio {
    margin-bottom: 30px;
}

.img-hover:hover {
    opacity: 0.8;
}

/* Home Page Carousel */

header.carousel {
    height: 50%;
}

header.carousel .item,
header.carousel .item.active,
header.carousel .carousel-inner {
    height: 100%;
}

header.carousel .fill {
    width: 100%;
    height: 100%;
    background-position: center;
    background-size: cover;
}

/* 404 Page Styles */

.error-404 {
    font-size: 100px;
}

/* Pricing Page Styles */

.price {
    display: block;
    font-size: 50px;
    line-height: 50px;
}

.price sup {
    top: -20px;
    left: 2px;
    font-size: 20px;
}

.period {
    display: block;
    font-style: italic;
}

/* Footer Styles */

footer {
    margin: 50px 0;
}

/* Responsive Styles */

@media(max-width:991px) {
    .customer-img,
    .img-related {
        margin-bottom: 30px;
    }
}

@media(max-width:767px) {
    .img-portfolio {
        margin-bottom: 15px;
    }

    header.carousel .carousel {
        height: 70%;
    }
}


/* BEGIN: BOOTSTRAP 3 menu custom css */

/* Menu display - add this class to the ul that holds the menu items to make it display in 2 columns when the callapsed menu is opened with toggle button */
/* NOTE: this is  not a bootstrap 3 class. This is custom class */
/* .two-col-menu {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
} */

/* The following are bootstrap 3 classes */
/* This is to make sure the menu stays collapsed i.e show the hamburger button */
@media (max-width: 5000px) {
    .navbar-header {
        float: none;
    }
    .navbar-left,.navbar-right {
        float: none !important;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-fixed-top {
        top: 0;
        border-width: 0 0 1px;
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin-top: 7.5px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;   
        padding-bottom: 10px;
    }
    .collapse.in{
        display:block !important;
    }
}

/* This is to make sure the collapsed menu when opened shows the scroll bar when overflowing with menu items for larger devices */
@media (min-width: 768px) {
    .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse { 
        overflow-y: scroll!important;
        overflow-x: hidden!important;
        
    }
} 

/* this is to make sure that the menu is still visible for bigger phones in landscape view */
@media (max-device-width: 640px) and (orientation: landscape) {
  .navbar-fixed-top .navbar-collapse,
  .navbar-fixed-bottom .navbar-collapse {
    max-height: 200px;
  }
}

/* drop down menu styles */
.navbar-right .dropdown-menu {
    right: 0px;
    left: 0px;
}

.navbar-nav .open .dropdown-menu {
    position: static;
    float: none;
    width: auto;
    margin-top: 0px;
    /* background-color: transparent; */
    background-color: #333333;
    border: 0px none;
    box-shadow: none;
}

.navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
    color: #FFF;
}

.navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
   color: #9D9D9D;
   background-color: transparent;
}

/* main menu styles */
.navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
    color: #FFF;
    background-color: transparent;
}
.navbar-inverse .navbar-nav > li > a {
    color: #9D9D9D; 
}

/* toggle (menu) button styles */
/* The menu by default is on the right, this makes the button black and puts it on the left */
.navbar-toggle {
    float: left;
    background-color: #222222;
    border: none;
    
}
/* END: BOOTSTRAP 3 menu custom css */


/* BEGIN: classes for custom menu with clickable parent links */

.parent-link {
    display: inline-block;
    /* width: 200px;*/
    padding: 10px 0px 10px 15px;
}

/* This overrides the bootstrap 3 class to make the caret bigger */
.caret {
    display: inline-block;
    vertical-align: middle;
    margin-left: 0px;
    width: 0px;
    height: 0px;
    border-top: 7px solid;
    border-right: 7px solid transparent;
    border-left: 7px solid transparent;
}

/* style to change the caret upside down when a drop down menu is open */
.nav .dropdown.open .caret{
    border-top: none;
    border-bottom: 7px solid #E5E5E5;
}    

.dropdown > .open > a, .dropdown > .open > a:hover, .dropdown > .open > a:focus {
    color: #fff;
    background-color: #080808; 
}                           
                
.dropdown > a:hover, .dropdown > a:focus {
    color: #FFF;
    background-color: transparent;
    text-decoration: none;
}

.dropdown > a {
    color: #9d9d9d !important;
    line-height: 20px;
    padding-top:10px;
    padding-bottom:10px;
    padding-left: 20px;
}

.nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
    background-color: transparent;
}
    
.dropdown-menu {
    padding: 0px 0px;
}
   
.dropdown-menu .divider {
    height: 1px;
    margin: 0px 0px;
    overflow: hidden;
    background-color: #E5E5E5;
}
    
.menu-divider {
    height: 1px;
    margin: 0px 0px;
    overflow: hidden;
    background-color: #E5E5E5;
}

.nav > li > a {
     padding: 10px 60px;
}

/* END: classes for custom menu with clickable parent links */


/* BEGIN: Css for second nav bar under the main one */
.second-navbar{
  top:50px;
  z-index:1000;
  min-height: 40px;
  background:#E6E6E6;
  border-bottom: 1px solid #666;
  line-height: 40px;  
}

.second-navbar a {
    color: #666 !important;
    display: inline;
    text-decoration: none;
    font-family: Arial,sans-serif;
    font-size: 11px;
    text-transform: uppercase;
   padding: 0px 5px 0px 0px;
}
.second-navbar a:hover {
    color: #222222;
}
.second-navbar a:focus {
    color: #222222;
}
.navbar-weather {
    font-family: Belizio,Georgia,Arial, sans-serif;
    font-weight: 700;
    color: #666;
    font-size: 14px;
    display: inline;
    vertical-align: middle;
    float: right;
    height:40px;
}

/* Breaking news notifier class */
.notifier{
    color: black !important;
    font-weight: 700;
 }
    
.notifier:hover{
    color: #666 !important;
 }    

/* END: Css for second nav bar under the main one */

/* ***** BEGIN: Bottom Menu Styles ****** */

.bottom-menu {
    color: #CCC;
}

.bottom-menu ul{
    line-height: 2.0em;
    padding-left: 5px;
    padding-top: 10px;
}

.bottom-menu-sublink {
    padding-left: 10px;
}

.bottom-menu-sublink a {
    font: 400 13px "Source Sans Pro",sans-serif;
    color: #CCC !important;
    display: inline-block; 
    /* vertical-align: top; */
}

.bottom-menu-sublink a:hover, .bottom-menu-sublink a:focus,.bottom-menu-link a:hover,.bottom-menu-link a:focus {  
    color: #FFF;
    text-decoration: none;
}

.bottom-menu-link.highlighted:hover {
  background: url(http://media.bclocalnews.com/designimages/arrowOn.png) no-repeat 0 50%;
}

.bottom-menu-link,.bottom-menu-link a {
    font: 400 12px "Oswald",sans-serif;
    color: #CCC !important;
    text-transform: uppercase;
    text-align: left;
}

.bottom-menu-link {
    padding: 2px 0px 2px 8px;
    display: inline-block; 
    background: transparent url("http://media.bclocalnews.com/designimages/arrowOff.png") no-repeat scroll 0px 50%;
}

a.brandLogo:hover {
    text-decoration: none;
    color: #FFF;
}

a.brandLogo {
     color: #CCC;
    font-family: "Palatino Linotype","Book Antiqua",Palatino,serif;
}

.brand {
    text-align: center;
    /*float: right;*/
    margin: 0;
    padding: 0;
    display: block;
}

.brand .logo {
    display: block;
    background-image: url(http://media.bclocalnews.com/designimages/bp_logo_mobile.png);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    height: 47px; 
    min-width: 255px;
    margin: 0 0 6px 0;
}

ul.footerLinks {
    padding: 0px;
    height: 24px;
    width: auto;
}

ul.footerLinks li {
    list-style-type: none;
    display: inline;
    margin: 0px 10px 0px 0px;
    padding: 0px;
    font-size: 12px;
}   

.footerLinks a {
    font: 400 12px "Oswald",sans-serif;
    color: #CCC !important;
    text-align: left;
} 

.footerLinks a:hover, .footerLinks a:focus {  
    color: #FFF;
    text-decoration: none;
}

/* move brand to the right for tablet devices and above. */
@media (min-width: 768px) {
    .brand {
        float: right;
    }
    
}
/* ***** END: Bottom Menu Styles ****** */
