@import url('normalize.css');

/* ----------------------------------------------------------
    Francis Bryant Construction CSS
    Version 1.0

    TABLE OF CONTENTS

    01 - BASE STYLES
    02 - DO NOT DISPLAY
    03 - BUTTONS
    04 - LAYOUT
    05 - HEADER STYLES
    06 - NAVIGATION STYLES
    07 - ROTATOR STYLES
    08 - CONTENT STYLES
    09 - SIDEBAR STYLES
    10 - FOOTER STYLES
    
---------------------------------------------------------- */

/* 01 = BASE STYLES
---------------------------------------------------------- */
* {
    margin: 0;
    padding: 0;
}
.format {
    font-family: adobe-caslon-pro, serif;;
    line-height: 1.2em;
    font-weight: 400;
}

.format h1,
.format h2,
.format h3,
.format h4,
.format h5,
.format h6 {
    text-transform: uppercase;
    font-weight: 400;
    line-height: 1.3em;
}

ul,
ol {
    padding-left: 15px;
}

p {
    line-height: 20px;
    margin: 10px 0;
}

.right,
.align-right {float: right;}

.left,
.align-left {float: left;}

.print {display: block !important;}
.screen {display: none;}

.clear {clear: both;}
/* 03 = DO NOT DISPLAY
---------------------------------------------------------- */
.enter-site,
.watch-vid,
.footer-share,
.menu-share,
.menu,
.menu-button,
.main-logo-link,
.main-scrolldown,
body.home .backstretch,
.big-video-wrap,
.video-seal,
.fbc-preload,
.craftsmanship-gallery,
.sub-footer .footer-right a
{
    display:none !important;
}
body{
    padding:0 50px;
    -webkit-print-color-adjust:exact;

}

/* REMOVE THESE INSTRUCTIONS -- From here on out, setup your
styles with a "top-down" structure approach that sets styles 
as they appear in the source code. */

/* 05 = HEADER STYLES
---------------------------------------------------------- */
.post-vid {
    opacity: 1 !important;
    visibility: visible !important;
}
.main-header {
    height:200px!important;
    width:100%;
    padding:15px 0;
}
.main-logo{
    display: block;
    background:url('../images/FBLogo-CleanSimple-black.png');
    height:170px;
    background-repeat:no-repeat;
    background-size:auto 100%;
    background-position:center center;
}
/* 08 = CONTENT STYLES
---------------------------------------------------------- */

.main-section {
    width: 100%;
    line-height:normal!important;
    min-height:auto!important;
}
.main-section-title {
    text-transform: uppercase;
    margin-bottom: 20px;
}

.main-section-container {
    margin: 0 auto;
    text-align: left;
}

#instagram.main-section {
    text-align: center;
    padding: 50px 0;
}


.instagram-gallery {
    margin: 20px;
    white-space: nowrap;
    overflow: hidden;
}

.instagram-image {
    display:none;
}

.gallery-image{
    height:350px;
    width:350px;
    overflow: hidden;
    float:left;
    margin:10px 5px;
}
.gallery-image h4 {text-align: center;}
.gallery-image img{
    width:100%;
    height:auto;
}
.logo-round{
    display:inline-block;
    vertical-align: middle;
    line-height: normal;
}
.gallery-title{
    display:inline-block;
    margin:0;
    vertical-align: middle;
    line-height: normal;
    padding-left:20px;
}
.gallery-section-container{
    overflow:hidden;
}
.gallery-header{
    line-height:100px;
    display: block !important;
}

.gallery-lightbox .gallery-header {display: none !important;}


.publication {
    margin: 40px 0;
}

.publication-text-wrap {
    margin-top: 20px;
}

/* 09 = FULL IMAGE GALLERY STYLES
---------------------------------------------------------- */
.bx-controls {display: none;}

.bx-viewport,
.bxslider {
    height: auto !important;
    width: 100% !important;
}

.bxslider {transform: translate3d(-15px, 0px, 0px) !important;}

li.gallery-full-image {
    float: none !important;
    width: 100% !important;
}

li.gallery-full-image > a,
li.gallery-full-image > span {
    display: none;
}

.backstretch {
    height: auto !important;
    margin: 5px 0 !important;
    position: relative !important;
    width: 100% !important;
    z-index: 1 !important;
}

.backstretch img {
    display: block !important;
    height: auto !important;
    position: relative !important;
    top: 0 !important;
    width: 100% !important;
    z-index: 1 !important;
}

.backstretch::after {
    bottom: 10px;
    content: url(../images/print-watermark.svg);
    display: block !important;
    height: 100px;
    position: absolute;
    right: 10px;
    width: 100px;
    z-index: 5;
}

/* 10 = FOOTER STYLES
---------------------------------------------------------- */
.contact-subtitle {
    display: block;
    margin: 20px 0 15px;
}

.contact-phone,
.contact-address {
    margin-right: 60px;
    margin-bottom: 10px;
}

.contact-phone p,
.contact-address p {
    margin-bottom: 10px;
}

.footer-right {
    display: inline-block;
}

.copyright {
    font-size: 10px;
}

.sub-footer {margin: 10px 0;}

.sub-footer p {line-height: 30px;}