/* Body */
body { font-family: 'Ubuntu', sans-serif; color: #4c3c39; font-size: 13px; font-weight: 300; overflow-x: hidden; background: url(/assets/frontend/img/bg.png) no-repeat center center fixed;    }
a, a:hover, a:focus, a:active { color: #4c3c39; }
.container-banner { width: 1370px; }
.color-white { color: #FFF; }
.color-brown { color: #002959; }
h2 {font-size:28px!important;}
b{ font-weight: bold;}
.form-control, .form-control:active, .form-control:focus { font-size: 12px; outline: none; box-shadow: none;  border-radius: 0; border-color: #dadada; padding: 20px;}
.btn { border-radius: 0; padding: 15px 60px; font-size: 13px; border-color: #4c3c39; color: #4c3c39; }
.btn.btn-brown { background-color: #4c3c39;  color: #FFF; }
.btn:active, .btn:focus { box-shadow: none; outline:none;  border-color: #4c3c39; }
.embed-container { width: 770px; }

/* Header */
.navbar { padding-bottom:  40px;}
.navbar-default { background:none!important; border-bottom:0; }
.navbar-brand { height:auto; padding: 20px 15px 5px;}
.nav { padding-top: 20px; }
.navbar-default .navbar-nav > li { padding: 20px 15px; }
.navbar-default .navbar-nav > li > a { font-family: 'Montserrat', sans-serif; color: #4c3c39; font-size: 14px; font-weight: 400; line-height: 20px; padding: 0;  }
.navbar-default .navbar-nav > li > a:hover { border-bottom: 2px solid #4c3c39;  }
.navbar-default .navbar-nav > li.active > a { border-bottom: 2px solid #77b04e; color: #77b04e; background-color: transparent; }
.navbar-default .navbar-nav > li.active > a:hover { border-bottom: 2px solid #77b04e; color: #77b04e; background-color: transparent; }

/* Content */
/*#main-content { height: 620px;   }*/
#content { height: auto; }
#content { padding: 15px 0 30px; background-color:white; font-weight: 400; color: #3b2e2b; font-size: 15px; line-height: 1.8em }
#content p {margin:15px 0; }
#content #page-cover-img { margin-top: -45px; position: relative; }
#content #page-cover-img img { display: block; }
#content #page-cover-img .page-caption { position: absolute; left: 30px; top: 30px; right: 30px; bottom: 30px; }
#content #page-cover-img .page-caption h1,
#content #page-cover-img .page-caption h2,
#content #page-cover-img .page-caption h3,
#content #page-cover-img .page-caption h4,
#content #page-cover-img .page-caption h5,
#content #page-cover-img .page-caption h6 { margin:5px 0; line-height: 34px }
#content #page-cover-img .page-caption h4 { line-height: 26px  }
#content #page-cover-img .page-caption p { font-size: 18px; color: #FFF; line-height: 22px; margin-top: 100px; }

/* Banner */
#banner {height: 620px; margin-top:-40px;}
#banner  div[class^="col-md"] {padding: 0; position: relative; }
#banner div[class^="col-md"] {transition:all 500ms ease 0s }
#banner:hover div[class^="col-md"]:after {content:'';display:block; position:absolute; left:0; top:0; width: 100%; height:100%; background-color: rgba(0,0,0,.6); }
#banner div[class^="col-md"]:hover:after {content:'';display:none !important;}

/* Breadcrumb */
.breadcrumb { background-color: transparent; padding: 15px 0; }


/* Footer */
#footer { padding: 30px 0 10px; }
#footer h5 { margin:0; }
#footer #footer-contact-us { border-right: 2px solid #f5f4f4; }
#footer h5 { margin-bottom: 30px; }
#footer #footer-menu > div { margin: 5px 0; }
#footer .footer-social-icons > a { width: 50px; font-size: 22px; height: 50px; line-height: 50px; text-align: center; display: inline-block; border: solid 2px #a8a8a8; color: #a8a8a8; margin-right: 5px; }
#footer .footer-social-icons > a:last-child { margin-right: 0; }
#footer .footer-social-icons > a:hover { color: #62514e; border-color: #62514e; }
#footer #footer-left-nav, #footer #footer-contact-us, #footer #footer-social-media { margin-bottom: 30px;  }

/* Home Page */
.carousel-inner>.item>a>img, .carousel-inner>.item>img, .img-responsive, .thumbnail a>img, .thumbnail>img { width: 100%; }
.carousel-indicators { left:100px; margin-left:0; bottom: 30px; text-align: left;  }
.carousel-indicators li { width: 17px; height:17px; margin: 0; border:none; background-color: rgba(255,255,255,0.5) }
.carousel-indicators .active { width: 17px; height:17px; background-color: #77b04e; }
.carousel-caption { bottom:0; top: 40px; text-align: left; left: 14.285714285714%; right: 14.285714285714%; color: #4c3c39; text-shadow: none; }
.carousel-caption h1 { font-size: 40px; line-height: 52px; margin:0; padding: 0;color:#d61f45; }
.carousel-caption h3 { font-size: 28px; line-height: 45px; margin:0; padding: 0;color:#002959;font-weight:bold!important; }
[class^="banner-caption-"] { position: relative; width: 100%; background-size: cover; }
[class^="banner-caption-"] .caption-content { position: absolute; left:0; top:0;width:100%; height: 100%; padding: 40px; display: block; text-decoration: none !important; }
[class^="banner-caption-"] .caption-content h1,
[class^="banner-caption-"] .caption-content h2,
[class^="banner-caption-"] .caption-content h3,
[class^="banner-caption-"] .caption-content h4,
[class^="banner-caption-"] .caption-content h5,
[class^="banner-caption-"] .caption-content h6 { margin:10px 0; }
[class^="banner-caption-"] .caption-content p { font-size: 16px; }
.banner-caption-md-3 { padding-bottom: 102%;  }
.banner-caption-md-6 { padding-bottom: 51.2%; }

/* Products */
#content .product-category { display: block; text-decoration: none !important; padding: 70px; background-size: cover; color: #FFF; margin: 15px 0; }
#content .product-category h1 { margin-bottom: 30px; text-decoration: none !important; }
#content .product-category .category-img { padding: 22px; position: relative; }
#content .product-category .category-img:before { content:''; display: block; left:0; top:0; width: 100%; height: 100%; position: absolute; border: 2px solid #FFF; z-index: 9;  transition: all .2s ease-in-out;}
#content .product-category .category-img img { transition: all .2s ease-in-out; }
#content .product-category:hover .category-img img { transform: scale(1.1); }
#content .product-category:hover .category-img:before { transform: scale(.86); }
#content .product-link { display: block; margin: 15px 0; font-weight: 500; }
#content .product-link img { display: block; margin-bottom: 15px; }
#content .product-detail { font-weight: 500; font-size: 14px; }
#content .product-detail .product-detail-link { line-height: 30px; margin-top: 15px; display: block; }
#content .product-detail .product-detail-link i { margin-left: 10px; font-size: 18px; padding-top: 2px;}
#content .demo-example-gallery { display: block; margin: 15px 0; font-weight: 500; }
#content .demo-example-gallery img { display: block; margin-bottom: 15px; }
.swiper-container { overflow: inherit; }
.swiper-container .container { height: 52px;  }
.swiper-container [class^="swiper-button-"] { position: absolute; left: 92px; top: 50px; right: auto; height: 52px; width: 52px; background-color: #ffffff; background-image: none; }
.swiper-container [class^="swiper-button-"]:before { content:"\e258"; font-size: 38px; text-align: center; line-height: 52px; font-family: 'Glyphicons Halflings';  position: absolute; top: 0; left: 0; height: 52px; width: 52px; }
.swiper-container .swiper-button-prev { left: 16px;}
.swiper-container .swiper-button-prev:before { content:"\e257"; }

/* Gallery Modal */
.ekko-lightbox { padding: 0 !important; border-radius: 0; border:0; }
.ekko-lightbox .modal-header { border:0; }
.ekko-lightbox .modal-header .close { width: 50px; height: 50px; position: relative; }
.ekko-lightbox .modal-header .close span { display:block; width: 50px; height: 50px; position: absolute; left: 0; top: 0; overflow: hidden; text-indent: -999px; }
.ekko-lightbox .modal-header .close span:after  { content:''; display: block; height: 1px; background-color: white; transform: rotate(45deg); width: 50px; position: absolute; left: 0; top: 25px; }
.ekko-lightbox .modal-header .close span:before  { content:''; display: block; height: 1px; background-color: white; transform: rotate(-45deg); width: 50px; position: absolute; left: 0; top: 25px; }
.ekko-lightbox .modal-body { padding: 0 !important; }
.ekko-lightbox .modal-body img { display: block; margin: 0; }
.ekko-lightbox .modal-content { background-color: transparent; box-shadow: none !important; border: 0 !important; }
.ekko-lightbox-nav-overlay a { position: relative; }
.ekko-lightbox-nav-overlay a span { position: absolute; left: 30px; text-indent: -9999px; overflow: hidden; background-color: rgba(0,0,0,.6); width: 50px; height: 60px; display: block; flex-grow: 0; margin-left: 20px; }
.ekko-lightbox-nav-overlay a span:after { position: absolute; left:19px; top:12px; transform: rotate(-135deg); width: 35px; height: 35px; content:''; display:block; border: 1px solid #FFF; border-left: hidden; border-bottom: hidden; }
.ekko-lightbox-nav-overlay a:last-child span:after { transform: rotate(45deg); left: 4px; }
.ekko-lightbox-nav-overlay a:last-child span { text-align: left !important; left: auto; right: 30px; }

/* Product Slider */
.swiper-container {
    width: 100%;
    margin: 20px auto;
}
.swiper-slide {
    font-size: 18px;
    background: #fff;
    width: 40%;
    position: relative;
    color: #FFF;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}
.swiper-slide h3 { position: absolute; left: 45px; width: 50%; bottom: 30px; }
.swiper-slide .btn-download { position: absolute; right: 45px; bottom: 30px; border: 2px solid #FFF; color: #FFF; padding: 10px 40px; font-size: 16px; font-weight: 500; }
.swiper-slide .btn-download i { font-weight: 300; }

@media (max-width: 1400px) {
    .container-banner { width: 100%; }
    #main-content { height: auto; }
    #banner {height: auto; }
    #page-cover-img { overflow: hidden; }
    .embed-container { width: 100%; }
}

@media (max-width: 1200px) {

    .navbar-default .navbar-nav:before { content:'';display: block; clear: both; }
    .navbar-default .navbar-nav > li { padding: 20px 12px; }
    .navbar-default .navbar-nav > li > a { font-size: 13px; }

}
@media (max-width: 992px) {
    .navbar-default .navbar-nav { float:none !important; }
    #content .col-md-6.pull-right { float:none !important; }
    #content #page-cover-img img { width: 100%; }
    #content #page-cover-img p { display: none; }

    /* Product Slider */
    .swiper-slide { width: 80%; }

}
@media (max-width: 768px) {
    body { padding-top: 100px; }

    /* Header - Navbar */
    .navbar-default { position: fixed; top:0; z-index: 999; width: 100%; border:0; padding-bottom: 11px; }
    .navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > li.active > a  { text-align: center; font-weight: 600; font-size: 16px; border:0; }
    .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li.active > a:hover { border-bottom: 0 !important;  }
    .navbar-default .navbar-toggle { background-color: transparent !important; border: none; padding: 0; height: 33px; position:relative; margin-top: 35px;}
    .navbar-default .navbar-toggle .icon-bar { background-color: #62514e !important; height: 3px; width: 35px; margin-bottom: 8px; }
    .navbar-default .navbar-toggle .icon-bar:first-child { transform: rotate(45deg); position: absolute; left: 0; top:10px;  }
    .navbar-default .navbar-toggle .icon-bar:nth-child(2) { transform: rotate(135deg); position: absolute; left: 0; top:6px;  }
    .navbar-default .navbar-toggle .icon-bar:last-child { opacity: 0; }
    .navbar-default .navbar-toggle.collapsed .icon-bar:last-child { opacity: 1; }
    .navbar-default .navbar-toggle.collapsed .icon-bar:first-child { transform: rotate(0deg); position: static; left: 0; top:0;  }
    .navbar-default .navbar-toggle.collapsed .icon-bar:nth-child(2) { transform: rotate(0deg); position: static; left: 0; top:0;  }
    .navbar-collapse.in { position: fixed; left:0; top: 95px; width:100%; height: 100%; padding-bottom: 120px; background-color: white; z-index: 999; margin: 0;}

    /* Banner*/
    #banner { margin-top: 0; }
    .carousel-indicators { left: auto; right: 30px; text-align: right; }
    .carousel-indicators .active { background-color: white; }
    .carousel-caption { top: auto; left: 0; right: 0; background-color: rgba(76, 60, 57, 0.4); color: white; padding: 25px; }
    .carousel-caption h1 { font-size: 24px; line-height: 26px;}
    .carousel-caption h2 { font-size: 20px; line-height: 22px;}
    .carousel-caption h3 { font-size: 16px; line-height: 18px;}
    .caption-content p { display: none; }

    /* Content */
    #content #page-cover-img { margin-top: 0; }

    /* Product Slider */
    .swiper-slide { width: 100%; }
    .swiper-slide h3 { bottom: auto; top: 30px; left: 30px; right: 30px; }
    .swiper-slide .btn-download { bottom: 30px; left: 30px; right: auto; }{ bottom: auto; top: 30px; left: 30px; right: 30px; }
    .swiper-container .swiper-button-prev { left: 0;}
    .swiper-container .swiper-button-next { left: 77px;}

    /* Footer */
    #footer #footer-social-media { text-align: right; float: none !important; }
    #footer #footer-contact-us { border-right:0 }
}

@media (max-width: 380px) {
    /* Footer */
    #footer { padding-top: 30px; }
    #footer .col-sm-7 { float: none !important; width: 100% !important; }
    #footer #footer-social-media { text-align: center; float: none !important; padding-bottom: 30px; border-bottom: 1px solid #c1bab8 }
    #footer #footer-social-media a { color: #62514e; border-color: #62514e }
    #footer #footer-social-media h5 { display:none; }
    #footer #footer-contact-us { text-align: left; float: none !important; }
}