/*
Theme Name: Broadwell
Theme URI: http://cato.io/broadwell-theme
Author: Jamel Cato
Author URI: http://cato.io
Description: A clean single-page theme with a smooth parallax effect
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: responsive-layout, accessibility-ready, custom-colors, featured-images, post-formats, sticky-post, threaded-comments, translation-ready 
Text Domain: broadwell


Broadwell is based on Underscores http://underscores.me/  (C) 2012-2015 Automattic, Inc.

*/




/*

WARNING: MODIFYING THIS FILE IS NOT RECOMMENDED 
-----------------------------------------------------------------------------------------------

Here are the recommended ways to modify the CSS:

1. For simple changes, use the Custom CSS option in the Customizer settings;
2. For extensive changes, create a child theme with its own style.css file.

There is a free, ready-to-use child theme available at:
http://cato.io/downloads


*/















































































































/* General 
---------------------------------------------------------------------*/
body {
    overflow-x: hidden;
    font-family: "Source Sans Pro";
    font-size: 18px;
    color: #222
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-size: 180%;
    font-family: "Roboto";
    font-weight: bold;
    line-height: 1.1;
}

p {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}


/* General - Mobile Adjustments 
---------------------------------------------------------------------*/
.mobile.lt-1280 body {
    height: 100%;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
}


/* Navigation 
---------------------------------------------------------------------*/
.home .navbar {
    margin-bottom: 0;
}

.desktop #primary-menu,
.desktop .navbar {
    padding: 20px 3em 20px 2em;
    height: 80px;
    max-height: 120px;
    background-color: #fff;
    font-weight: bold;
    font-family: Roboto
}

#primary-menu li > a {
    background-color: transparent
}

.lt-768 #primary-menu {
    background-color: #fff
}

.lt-768 .navbar-collapse {
    background-color: #fff
}

.gt-768 #logo-holder > img {
    max-height: 50px;
    height: auto
}

#site-title {
    font-size: 140%;
    font-weight: bold
}


/* Navigation - Mobile Adjustments 
---------------------------------------------------------------------*/
.lt-768 #primary-menu,
.lt-768 .navbar {
    padding: 20px 0;
    height: auto;
}

.w-768 .lt-480 #logo-holder > img {
    max-height: 40px;
    height: auto;
}

.lt-480 #logo-holder > img {
    max-height: 32px;
    height: auto;
}

.lt-1280 #primary-menu,
.lt-1280 .navbar {
    padding-right: 2em
}


/* Make mobile menu collapse on tablets 
---------------------------------------------------------------------*/
@media (max-width: 1200px) {
    .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
    }
}


/* Home Page 
---------------------------------------------------------------------*/
.home .v-spacer-home {
    height: 50px;
}

.home .parallax-section,
.home .overlay-container {
    height: 450px;
    overflow: auto;
}

.home .front-overlay {
    font-size: 170%;
    font-weight: bold;
    font-family: Roboto;
    padding: 1em;
    color: #fff;
}

.gt-1680 .home .parallax-section,
.gt-1680 .home .overlay-container {
    height: 600px;
}


/* Make an **attempt** to accomodate huge monitors 
---------------------------------------------------------------------*/
.home .front-content {
    min-height: 300px;
}

.home h3 {
    font-size: 160%
}

.home .top,
.home #area1 {
    background-position: 0 50% !important
}

.home .front-recent {
    padding: 1em
}


/* Home Page - Mobile Adjustments 
---------------------------------------------------------------------*/
.lt-768 .front-overlay {
    background: rgba(0, 0, 0, 0.3);
}


/* Contact Section 
---------------------------------------------------------------------*/
.home #contact-section {
    background-color: #f4f4f4;
    padding: 1em 2em
}

.home #contact-section h1 {
    padding: 0 0 2em 1em
}

.home .contact-content {
    padding: 1em
}

.home #contact-section input[type="text"],
.home #contact-section textarea,
.home #contact-section input[type="email"] {
    width: 80%;
    padding: 7px 0;
}

.home .broadwell-map {
    position: relative;
    overflow: hidden;
    margin-top: 30px;
    height: 0;
    padding-bottom: 40%
}

.home .broadwell-map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}


/* Comments 
---------------------------------------------------------------------*/
.comment-body {
    padding: 0.5em 0 2em 0;
    border-bottom: 1px solid #ddd;
    font-size: 18px;
    line-height: 1.4em;
    font-family: Source Sans Pro
}
.comment-body a {
    color: #333
}
.comment-content {
    padding: 2em 0;
    clear: both
}
.comment-author img {
    float: left;
    margin-right: 20px;
    border: 4px solid #ccc
}
.comment-author {
    padding-top: 48px
}
.comment-reply-link {
    padding: 0.5em 1em;
}
.comment-respond {
    margin-top: 60px
}
.comment-list {
    list-style-type: none
}
.no-comments {
    font-weight: bold;
    padding: 2em 0;
    font-size: 120%
}


/* Interior Pages 
---------------------------------------------------------------------*/
.interior #content {
    max-width: 1240px;
    float: none;
    margin: 0 auto;
    min-height: 700px;
    background-color: #fff;
    padding-top: 2em
}

.interior .entry-content {
    line-height: 1.6em;
    font-size: 20px;
    color: #444;
    font-family: "Source Sans Pro"
}

.interior .entry-content p {
    margin-bottom: 1.5em
}

.interior .single .entry-content {
    min-height: 300px;
}

.interior .entry-header {
    text-align: center;
    margin-bottom: 40px;
    padding-bottom: 1em;
    border-bottom: 1px solid #ddd
}

.interior .entry-title {
    font-size: 3em;
}

.interior .entry-footer {
    margin: 2em auto;
    padding: 1em;
    background-color: #f4f4f4;
    border: 1px solid #ddd
}

.page .entry-footer {
    display: none
}

.page-header {
    text-align: center
}

.page-title {
    background-color: #f4f4f4;
    border: 1px solid #ccc;
    color: #333;
    padding: 0.5em;
    margin-bottom: 1em
}

.entry-content > .attachment > a > img {
    max-width: 100%;
    height: auto
}

.entry-footer .cat-links,
.entry-footer .tags-links {
    display: block;
    padding-bottom: 0.5em;
}

.entry-content ul,
.entry-content ol {
    margin: 1em 0
}

.caption {
    font-family: Roboto;
    font-size: 75%
}

.sticky-notice {
    margin: 0.5em;
    float: left
}

.sticky-notice span {
    background-color: #f4f4f4;
    border: 1px solid #ccc;
    color: #333;
    padding: 0.3em 1em;
    font-size: 75%;
    font-weight: bold
}

.blog article,
.archive article {
    margin-bottom: 8em
}

.interior .entry-content img {
    max-width: 100%
}


/* Interior Pages - Mobile Adjustments 
---------------------------------------------------------------------*/
.mobile #content,
.lt-1024 #content {
    padding: 0 1em
}

.lt-768 .post-password-form {
    width: 100%;
    tetx-align: center;
    padding: 0.5em
}

.lt-768 .post-password-form input {
    max-width: 90%;
    tetx-align: center;
    margin-bottom: 0.5em
}

.lt-768 #searchform button {
    display: none
}

.lt-768 .sticky-notice {
    float: none
}



/* 404 
---------------------------------------------------------------------*/
.not-found {
    text-align: center;
}

.error404 #primary {
    float: none;
    width: 99%
}

.not-found .page-title,
.error404 .page-title {
    border: none;
    background-color: transparent
}


/* fullwidth pages 
---------------------------------------------------------------------*/
.fullwidth #primary {
    float: none;
    width: 99%
}

.fullwidth #secondary {
    display: none
}


/* Post Navigation 
---------------------------------------------------------------------*/
.nav-links {
    margin: 3em 0;
}

.nav-next,
.nav-previous {
    width: 45% !important;
    padding: 1em;
    margin-bottom: 3em;
    font-size: 95%;
    height: 60px
}

.nav-next a,
.nav-previous a {
    color: #fff
}

.nav-links i {
    color: #fff
}

.nav-previous i {
    margin-right: 12px
}

.nav-next i {
    margin-left: 12px
}

.page-links {
    clear: both;
    margin: 2em 0
}

.page-links a {
    background-color: #eee;
    border: 1px solid #ccc;
    padding: 0.5em;
    margin: 0 0.5em
}


/* Post Navigation - Mobile Adjustments  
---------------------------------------------------------------------*/
.lt-768 .nav-previous,
.lt-768 .nav-next {
    width: 100% !important;
    height: auto
}


/* Featured Iamges 
---------------------------------------------------------------------*/
.post-thumbnail {
    display: block;
    margin-bottom: 2.4em;
}

.post-thumbnail img {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    height: auto
}

a.post-thumbnail:hover,
a.post-thumbnail:focus {
    opacity: 0.85;
}

.blog .has-post-thumbnail .post-thumbnail,
.archive .has-post-thumbnail .post-thumbnail {
    max-height: 600px;
    overflow: hidden
}

.entry-content .thumbnail {
    padding: 1em
}


/* Gallery 
---------------------------------------------------------------------*/
.gallery {
    margin: 2.5em 0;
    float: left;
}

.gallery figure {
    margin: 0 0;
}

.gallery-item {
    display: inline-block;
    text-align: center;
    vertical-align: top;
    width: 100%;
}

.gallery-columns-2 .gallery-item {
    max-width: 50%
}

.gallery-columns-3 .gallery-item {
    max-width: 33.33%
}

.gallery-columns-4 .gallery-item {
    max-width: 25%
}

.gallery-columns-5 .gallery-item {
    max-width: 20%
}

.gallery-columns-6 .gallery-item {
    max-width: 16.66%
}

.gallery-columns-7 .gallery-item {
    max-width: 14.28%
}

.gallery-columns-8 .gallery-item {
    max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
    max-width: 11.11%;
}

.gallery-caption {
    display: block;
    font-size: 75%;
    line-height: 1.3em;
    padding-top: 0.5em;
    font-family: Roboto;
}


/* Sidebar 
---------------------------------------------------------------------*/
.interior #secondary {
    padding-top: 30px
}

.interior #secondary .widget-title {
    padding-bottom: 0.3em;
    margin-bottom: 0.5em;
    border-bottom: 1px dotted #ccc
}

.interior #secondary .widget {
    margin-bottom: 2em;
    padding-bottom: 2em;
}

.interior #secondary .widget:first-child {
    border-bottom: none
}

#secondary .widget li {
    list-style-type: square
}

#searchform {
    font-family: Roboto;
    cursor: pointer
}


/* Sidebar - Mobile Adjustments 
---------------------------------------------------------------------*/
.lt-1024 #secondary {
    display: none
}


/* Footer 
---------------------------------------------------------------------*/
.site-footer {
    margin-top: 30px;
    min-height: 120px
}

footer .site-info {
    max-width: 1240px;
    float: none;
    margin: 0 auto;
    padding: 30px 0.5em;
    color: #f4f4f4;
    line-height: 1.5em
}

.site-info a {
    color: #ddd;
    text-decoration: none
}

.site-info a:hover {
    color: #fff
}

footer #footer-left a {
    border-bottom: 1px dotted #fff
}

footer #footer-left a:hover {
    text-decoration: none
}

/* Footer - Mobile Adjustments  */
.mobile .site-footer,
.lt-1024 .site-footer {
    text-align: center;
    padding-bottom: 2em
}

.mobile #footer-left,
.lt-1024 #footer-left {
    margin-bottom: 3em
}

/* Required Wordpress Classes 
---------------------------------------------------------------------*/
.wp-caption {} .wp-caption-text {} .sticky {} .gallery-caption {} .bypostauthor {}


/* A precaution in case I accidentally included something 
   from my development or demo environments. 
---------------------------------------------------------------------*/
.dev-only,
.demo-only,
.dev-marker {
    display: none
}