body {
    font-family: 'Roboto Slab', serif;
    background-color:#1B1411;
}
p{
    font-size:18px;
        color: #737373;
        line-height:1.6
}

a:active, a:visited, a:focus{
    color:#fff;
}
 
/********************************/
/*        navbar styles         */
/********************************/
.navbar{
    min-height:80px;
}

.navbar-collapse.in {
    overflow: visible;
}

.navbar-nav{
    min-height:80px;
}

.navbar-default .navbar-nav>li>a {
    font-family: 'Antonio', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #FFFFFF;
    height: 80px;
    font-size: 1.15em;
}

.navbar-default .navbar-nav>li>a.nav-button {
    padding: 20px 60px 15px 60px;
}

@media only screen and (max-width: 768px){
    .navbar-default .navbar-nav>li>a.nav-button {
        width: 100%;
        margin-top: -20px;
    }

    .navbar-brand {
        margin-left: 30px;
    }

    .navbar-collapse {
    background-color: #353535;
    min-height: calc(80px*5);
    }
} 

.navbar-default .navbar-nav>li>a>button {
    font-family: 'Antonio', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #FFFFFF;
    font-size: 1.15em;
    margin: 0 0 10px 0;
    box-shadow: 0px 0px;
}

.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>li>a:active {
    color: #777777;
}

.navbar-default .navbar-nav>li>a:focus{
    color:#fff;
}

.navbar-default{
    background-color:#353535;
    border: none;
    box-shadow: 0px 2px 80px rgba(0, 0, 0, 0.37), 0px 0.835552px 33.4221px rgba(0, 0, 0, 0.265976), 0px 0.446726px 17.869px rgba(0, 0, 0, 0.22056), 0px 0.250431px 10.0172px rgba(0, 0, 0, 0.185), 0px 0.133002px 5.32008px rgba(0, 0, 0, 0.14944), 0px 0.0553451px 2.21381px rgba(0, 0, 0, 0.104024);
}
.navbar-brand{
    padding-top:10px;
    padding-right: 60px;  
}

.navbar-nav>li>a {
    padding: 30px 60px 15px 60px;
}

@media only screen and (max-width: 992px) and (min-width: 768px){
    .navbar-nav>li>a {
        padding: 30px 18px 15px 18px;
    }

    .navbar-default .navbar-nav>li>a {
        font-size: 1em;
    }

    .navbar-brand{
        padding-top:10px;
        padding-right:30px;  
    }
}

@media only screen and (max-width: 1200px) and (min-width: 992px){
    .navbar-nav>li>a {
        padding: 30px 40px 15px 40px;
    }

    .navbar-default .navbar-nav>li>a {
        font-size: 1.15em;
    }

    .navbar-brand{
        padding-top:10px;
        padding-right:40px;  
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    padding: 9px 10px;
    margin-top: 26px;
    margin-right: 15px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: none;
   
}
.navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover{
    background-color: #777777;
}
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header{
    border:none
}
.navbar-header{
    height:80px
}
.navbar-default .navbar-toggle .icon-bar{
     background-color: #FFFFFF;
}
.navbar-toggle .icon-bar {
	width: 25px;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
    height:3px
}
.navbar-toggle.minus.collapsed .icon-bar:nth-of-type(1) {
	transform: translate3d(0,0,0) rotate(0deg);
}

.navbar-toggle.minus.collapsed .icon-bar:nth-of-type(2) {
	transform: translate3d(0,0,0) rotate(0deg);
}

.navbar-toggle.minus.collapsed .icon-bar:nth-of-type(3) {
	transform: translate3d(0,0,0) rotate(0deg);
}

.navbar-toggle.minus .icon-bar:nth-of-type(1) {
	transform: translate3d(0,6px,0);
}

.navbar-toggle.minus .icon-bar:nth-of-type(3) {
	transform: translate3d(0,-6px,0);
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:active,
.navbar-default .navbar-nav > .active > a:visited {
  color: #ffffff;
  background-color: #777777;
}

/********************************/
/*       Fade Bs-carousel       */
/********************************/
.fade-carousel {
    position: relative;
    height: 100vh;
    max-height: 800px
}
.fade-carousel .carousel-inner .item {
    height: 100vh;
     max-height: 800px;
}
.fade-carousel .carousel-indicators > li {
    margin: 0 2px;
    background-color: #14489a;
    border-color: #14489a;
    opacity: .4;
}
.fade-carousel .carousel-indicators > li.active {
  width: 10px;
  height: 10px;
  opacity: 1;
}
.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index:2;
    background-color: rgb(8, 13, 21);
    opacity: .5;
}
/********************************/
/*          Hero Headers        */
/********************************/
.hero {
    position: absolute;
    top: 54%;
    left: 50%;
    z-index:3;
    color: rgba(255, 255, 255, 0.92);
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.00);
      -webkit-transform: translate3d(-50%,-50%,0);
         -moz-transform: translate3d(-50%,-50%,0);
          -ms-transform: translate3d(-50%,-50%,0);
           -o-transform: translate3d(-50%,-50%,0);
              transform: translate3d(-50%,-50%,0);
}
.hero h1 {
    font-family: 'Antonio', sans-serif;
    font-style: normal;
    font-size: 6em;   
    line-height: 102%;
    letter-spacing: 1.5px; 
    font-weight: normal;
    text-transform:uppercase;
    margin: 0 auto 30px auto;
    padding: 0;
    /* width: 50%; */
}
.hero h3 {
font-family: Roboto Slab;
font-style: normal;
font-weight: normal;
font-size: 1.125em;
line-height: 160%;
/* identical to box height, or 160% */

text-align: center;
    margin: 0;
    padding: 0;
}

.hero a {
    width: 90%;
    margin: auto;
}

.fade-carousel .carousel-inner .item .hero {
    opacity: 0;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s; 
}
.fade-carousel .carousel-inner .item.active .hero {
    opacity: 1;
    -webkit-transition: 2s all ease-in-out .1s;
       -moz-transition: 2s all ease-in-out .1s; 
        -ms-transition: 2s all ease-in-out .1s; 
         -o-transition: 2s all ease-in-out .1s; 
            transition: 2s all ease-in-out .1s;    
}

/********************************/
/*            Overlay           */
/********************************/


/********************************/
/*          Custom Buttons      */
/********************************/
.btn-primary {
    background-color: #14489A;
    border-style: none;
    box-shadow: 0px 47px 80px rgba(0, 0, 0, 0.25), 0px 19.6355px 33.4221px rgba(0, 0, 0, 0.179714), 0px 10.4981px 17.869px rgba(0, 0, 0, 0.149027), 0px 5.88513px 10.0172px rgba(0, 0, 0, 0.125), 0px 3.12555px 5.32008px rgba(0, 0, 0, 0.100973), 0px 1.30061px 2.21381px rgba(0, 0, 0, 0.0702864);
    text-align: center;
    padding: 10px 30px;
    border-radius: 4px;
    margin: 20px auto;
    /* font-size: 0.725em; */
    letter-spacing: 2px;
    line-height: 19px;
    outline:0;
    position: relative;
    z-index: 100;
}

.btn-primary:hover{
    box-shadow: 0 0 0;
}

.btn.btn-lg {padding: 10px 30px;}
.btn.btn-hero,
.btn.btn-hero:hover,
.btn.btn-hero:focus {
    color: #f5f5f5;
    background-color:  #606060;
    padding: 10px 30px;
    border-radius: 4px;
    margin: 20px auto;
    font-size: 0.725em;
    letter-spacing: 2px;
    line-height: 19px;
    outline:0;
    position: relative;
    z-index: 100;
    box-sizing: border-box;
    box-shadow: 0px 47px 80px rgba(0, 0, 0, 0.25), 0px 19.6355px 33.4221px rgba(0, 0, 0, 0.179714), 0px 10.4981px 17.869px rgba(0, 0, 0, 0.149027), 0px 5.88513px 10.0172px rgba(0, 0, 0, 0.125), 0px 3.12555px 5.32008px rgba(0, 0, 0, 0.100973), 0px 1.30061px 2.21381px rgba(0, 0, 0, 0.0702864);
}
.btn.normal-button,
.btn.normal-button:focus{
    color: #f5f5f5;
    background-color:  #606060;
    padding: 10px 30px;
    border-radius: 4px;
    margin: 20px auto;
    font-size: 13px;
    letter-spacing: 2px;
    line-height: 19px;
    box-sizing: border-box;
    outline:0;
    box-shadow: 0px 47px 80px rgba(0, 0, 0, 0.25), 0px 19.6355px 33.4221px rgba(0, 0, 0, 0.179714), 0px 10.4981px 17.869px rgba(0, 0, 0, 0.149027), 0px 5.88513px 10.0172px rgba(0, 0, 0, 0.125), 0px 3.12555px 5.32008px rgba(0, 0, 0, 0.100973), 0px 1.30061px 2.21381px rgba(0, 0, 0, 0.0702864);

}

.btn.normal-button:hover {
    background-color: #737373;
    box-shadow: 0px 0px 0px;
}

 @media only screen and (max-width: 576px) {
  .btn.btn-lg {
    font-size: 0.7em;
  }
 }


.meet{
   color:  #14489A !important;
    background-color: #f5f5f5 !important;
}

/********************************/
/*       Slides backgrounds     */
/********************************/
.fade-carousel .slides .slide-1, 
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
  height: 100vh;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.fade-carousel .slides .slide-1 {
  background-image: url(../images/gallery/New-Construction2.jpg); 
}
.fade-carousel .slides .slide-2 {
  background-image: url(../images/stone-laying-design.jpg);
}
.fade-carousel .slides .slide-3 {
  background-image: url(../images/masonry-brick-front-of-house.jpg);
}

/********************************/
/*          Media Queries       */
/********************************/
@media screen and (min-width: 980px){
    .hero { width: 980px; }  
    .btn.btn-hero{
        display:none;
    }  
    
}
@media screen and (max-width: 640px){
    .hero h1 { font-size: 4em; }    
}

/********************************/
/*              body            */
/********************************/
.copy{
    text-align: justify;
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: normal;
    font-size: 1.1em;
    line-height: 29px;
/* or 206% */
    color: #CCCCCC;
}

.copy-right {
    text-align: right;
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: normal;
    font-size: 1.1em;
    line-height: 29px;
/* or 206% */
    color: #CCCCCC;
}

.sub-copy {
    color: rgba(204, 204, 204, 1);
    width: 70%;
    text-align: center;
    font-size: 1.25em;
    margin: 30px auto 0 auto;
}

#free-brick-laying-quote .copy {
    font-size: 1.25em;
    text-align: left;
}

.card {
    padding: 0 30px;
    margin: 30px 0 0 0;
}

.brick-work-body{
    padding-top:40px;
    padding-bottom:50px;
}

/* .overlay-with-logo {
    background-image: url('../images/complimentary-brick-transparent.png');
    background-repeat:no-repeat;
    background-position-y:bottom
} */

.blue-background {
    width: 100%;
    height: 100%;
    background-color: #001E33;
}

.dark-background {
    width: 100%;
    height: 100%;
    background-color: #1D1D1D;
}

.section-titles{
    font-family: Antonio;
    font-style: normal;
    font-weight: normal;
    font-size: 3em;
    line-height: 110%;
    margin-bottom: 25px;
    letter-spacing: 1.5px;
    color: #ffffff;
}

.section-titles-right {
    text-align: right;
    font-family: Antonio;
    font-style: normal;
    font-weight: normal;
    font-size: 3em;
    line-height: 110%;
    margin-bottom: 25px;
    letter-spacing: 1.5px;
    color: #ffffff;
}

.sub-title {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: normal;
    font-size: 1.5em;
    line-height: 110%;
    text-align: center;
    letter-spacing: 1.5px;
    color: #FFFFFF;   
}

.sub-title-gallery {
    font-family: Roboto Slab;
    font-style: normal;
    font-weight: normal;
    font-size: 1.5em;
    line-height: 110%;
    text-align: left;
    letter-spacing: 1.5px;
    color: rgba(204, 204, 204, 1); 
}

.text-danger {
    color: #FF3C21;
}

.quality-brick-layers {
    background-image: url('../images/quality-brick-job-background.jpg');
    background-size: cover;
    text-align: center;
    padding-top: 65px;
    padding-bottom: 65px;
    padding-left: 25px;
    padding-right: 25px;
    min-height: 340px;
}
@media screen and (max-width: 860px){
    .quality-brick-layers {
    min-height:70vh;
}
}

.dad{
    text-align:center;
}
.color-white{
    color:rgba(255, 255, 255, 0.89)
}
.thumb{
    margin-top:15px
}
a.thumbnail.active, a.thumbnail:focus, a.thumbnail:hover {
    border-color: rgba(51, 122, 183, 0.00);
    
}
.bricking{
    background-color:#ffffff
}

/* .contact-brick-layers {
    padding-top: 70px;
    padding-bottom: 50px;
    background-image: url('../images/stonework-hardhats.jpg');
    background-size:cover;
    position:relative;
    background-position:center
} */

.runwhite{
    margin-top: 6px;
    margin-left: 2px;
    width: 45px;
    margin-bottom: 35px;
    text-align: left;
    border: 0;
    border-top: 1px solid #ffffff;
}

.runwhite-right {
    margin-top: 6px;
    margin-right: 16px;
    width: 45px;
    margin-bottom: 35px;
    text-align: right;
    border: 0;
    border-top: 1px solid #ffffff;
}

.footer{
    background-color: #737373;
    padding-top:15px;
    padding-bottom:25px

}

.footer-logo{
    margin-top: 26px;
    width: 130px;
}

@media screen and (max-width: 990px){
    .footer-logo{
        display: none;
    }
}


.fix-mobile{
    margin-left:13px
}
@media screen and (max-width: 860px){
    .fix-mobile{
    margin-left:0px
}
}
.social-icon{
    color: rgba(255, 255, 255, 0.64);
    font-size: 20px !important;
    display: inline-block;
}

.social-icon:hover {
    color: #ffffff;
}

.align-left{
    text-align:left
}
.sub-footer{
    padding-top:20px;
    padding-bottom:20px;
    color:rgba(255, 255, 255, 0.64);
     background-color: #606060;
}
.footer-link{
    color:rgba(255, 255, 255, 0.64);
    display: inline-block;
    margin-right: 15px;
    font-size: 14px;
    line-height: 1.42857143;
}

.footer-link:hover {
    text-decoration: none;
    color: #ffffff;
}

p.footer-link:hover{
    color:rgba(255, 255, 255, 0.64);
    cursor: default;
}

.footer-link:active {
    color:#fff;
}

.footer-contact-icon{
    font-size:20px !important
}

.wrap-bit-brownie-web-development{
    display:inline;
    float:right
}
@media screen and (max-width: 767px){
      .mobile-fix-top{
          margin-top:30px
      }
      .contact-brick-layers {
       background-position: left;
      }
      .footer{
          padding-top:35px
      }
}
.-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    max-height: 281px;
}
@media screen and (max-width: 991px) {
    .padding-links{
    padding-left:15px
}
    .fix-brick-services-margin{
        margin-top:30px;
        margin-bottom:30px;
    }
}

.footer-margin-bottom{
    margin-bottom:5px
}
@media screen and (max-width:525px) {
    .sub-footer{
        text-align:center
    }
    .wrap-bit-brownie-web-development{
    display:block;
    float:none
}
    .footer-margin-bottom{
    margin-bottom:5px
}
}

/* carousel */
#quote-carousel 
{
  padding: 0 10px 30px 10px;
  margin-top: 30px;
}

/* Control buttons  */
#quote-carousel .carousel-control
{
  background: none;
  color: #222;
  font-size: 2.3em;
  text-shadow: none;
  margin-top: 30px;
}
/* Previous button  */
#quote-carousel .carousel-control.left 
{
  left: -12px;
}
/* Next button  */
#quote-carousel .carousel-control.right 
{
  right: -12px !important;
}
/* Changes the position of the indicators */
#quote-carousel .carousel-indicators 
{
  right: 50%;
  top: auto;
  bottom: 0px;
  margin-right: -19px;
}
/* Changes the color of the indicators */
#quote-carousel .carousel-indicators li 
{
  background: #c0c0c0;
}
#quote-carousel .carousel-indicators .active 
{
  background: #333333;
}
#quote-carousel img
{
  width: 250px;
  height: 100px
}
/* End carousel */

.item blockquote {
    border-left: none; 
    margin: 0;
}

.item blockquote img {
    margin-bottom: 10px;
}

.item blockquote p:before {
    content: "\f10d";
    font-family: 'Fontawesome';
    float: left;
    margin-right: 10px;
}



/**
  MEDIA QUERIES
*/

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    #quote-carousel 
    {
      margin-bottom: 0;
      padding: 0 40px 30px 40px;
    }
    
}

.page-hero{
    background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)),
 url(../images/masonry-heading-2.jpg);
    background-size: cover;
    padding-top: 150px;
    padding-bottom: 65px;
    padding-left: 25px;
    padding-right: 25px;
    min-height: 340px;
}
.page-hero h1{
    font-size:55px
}
.page-gallery-hero{
    background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)),
 url(../images/masonry-background.jpg);
    background-size: cover;
    padding-top: 150px;
    padding-bottom: 65px;
    padding-left: 25px;
    padding-right: 25px;
    min-height: 340px;
}
.page-gallery-hero h1{
    font-size:55px
}

.page-about-hero{
    background: linear-gradient(rgba(0,0,0,.5), rgba(0,0,0,.5)),
 url(../images/cinder-brick-job.jpg);
    background-size: cover;
    padding-top: 150px;
    padding-bottom: 65px;
    padding-left: 25px;
    padding-right: 25px;
    min-height: 340px;
}
.page-about-hero h1{
    font-size:55px
}

.bricking-services{
    padding-top:40px;
    padding-bottom:70px
}
.brick-work-gallery{
    padding-top:65px;
    padding-bottom:40px
}

.residential-bricking-services-list li{
    margin-top:25px
}

.imgWrapper {
    overflow: hidden;
    max-height: 202px;
    border-radius:3px
}
.modal-content{
    border:none
}
.btn-default{
    border: none;
    color: rgba(255, 255, 255, 0.68);
    background-color: #14489A;
}

.btn-default:hover{
    background-color: #26539b;
    color: rgba(255, 255, 255, 0.68);
}


@media screen and (max-width: 714px){
    .filter-button{
        margin-bottom:10px
    }
}
.filter-button, .filter-button:hover, .filter-button:focus{
     border: none;
    color: rgba(255, 255, 255, 0.68);
    background-color: #26539b;
    outline:0
}
.filter-button:active{
    background-color: #234d8f!important;
    outline:0 !important;
     color: rgba(255, 255, 255, 0.68) !important;
}
.bricking-service-link:hover{
    cursor:pointer;
    text-decoration:none
}