/*
Theme Name: menabarreto
Theme URI: https://menabarreto423.com.br/
Author: JHSF
Auhtor URI: https://jhsf.com.br/
Description: Tema criado para Mena Barreto
Version1.0
*/

/*HELPER CLASSES*/
*{font-family: 'Lato', sans-serif; outline: none !important; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; -webkit-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; -moz-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; -o-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease}

@font-face {
    font-family: 'regular';
    src: url(./fonts/glyphicons-halflings-regular.ttf) format('truetype'); 
}

img{image-rendering: optimizeQuality !important}
h1, h2, h3, h4, h5, h6, b, strong{font-family: 'Lato', sans-serif; font-weight: normal}

.no-transition{transition: none 0s ease !important; -webkit-transition: none 0s ease !important; -moz-transition: none 0s ease !important; -o-transition: none 0s ease !important}
.no-select{-webkit-touch-callout: none !important; -webkit-user-select: none !important; -khtml-user-select: none !important; -moz-user-select: none !important; -ms-user-select: none !important; user-select: none !important}
.no-break{overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important}
.no-shadow{-webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important}
.no-radius{-webkit-border-radius: 0px !important; -moz-border-radius: 0px !important; border-radius: 0px !important}

.cursor-default{cursor: text !important}

.shadow_1{-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.1); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.1)}
.shadow_2{-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.2)}
.shadow_4{-webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.4); box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.4)}

.radius_5{-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px}
.radius_10{-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px}

.glyphicon{font-family: 'Glyphicons Halflings', sans-serif !important}

.alter_img{position: relative; float: left; padding: 13px}
.alter_img div a{display: block}
.alter_img div img{width: 200px; border: 1px solid #ccc; cursor: pointer}
.alter_close{position: absolute; top: 0; left: 0; z-index: 50}

.mfp-fade.mfp-bg {opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; transition: all 0.15s ease-out}
.mfp-fade.mfp-bg.mfp-ready {opacity: 0.8}
.mfp-fade.mfp-bg.mfp-removing {opacity: 0}
.mfp-fade.mfp-wrap .mfp-content {opacity: 0; -webkit-transition: all 0.15s ease-out; -moz-transition: all 0.15s ease-out; transition: all 0.15s ease-out; transform: scale(0.8)}
.mfp-fade.mfp-wrap.mfp-ready .mfp-content {opacity: 1; transform: scale(1)}
.mfp-fade.mfp-wrap.mfp-removing .mfp-content {opacity: 0; transform: scale(0.8)}

.mfp-bg{z-index: 3000; background: #fff}
.mfp-wrap{z-index: 3100}
.mfp-close{color: #fff}
.mfp-img{padding-bottom: 60px !important}
.mfp-title{padding-right: 0; text-align: center; color: #3D2A18; font-size: 14px; padding-top: 5px; font-family: 'Lato', sans-serif}
.mfp-figure:after{bottom: 60px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); -o-box-shadow: 0 0 5px rgba(0, 0, 0, 0.7); -ms-box-shadow: 0 0 5px rgba(0, 0, 0, 0.7)}
.mfp-bottom-bar{margin-top: -56px}

.mfp-ready .mfp-figure {opacity: 0}
.mfp-zoom-in .mfp-figure {opacity: 0; transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out; transform: scale(0.9); -moz-transform: scale(0.9); -webkit-transform: scale(0.9); -o-transform: scale(0.9); -ms-transform: scale(0.9)}
.mfp-zoom-in.mfp-bg, .mfp-zoom-in .mfp-preloader {opacity: 0; transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -ms-transition: all 0.2s ease-out}
.mfp-zoom-in.mfp-image-loaded .mfp-figure {opacity: 1; transform: scale(1); -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1)}
.mfp-zoom-in.mfp-ready.mfp-bg, .mfp-zoom-in.mfp-ready .mfp-preloader {opacity: 0.8}
.mfp-zoom-in.mfp-removing .mfp-figure {transform: scale(0.9); -moz-transform: scale(0.9); -webkit-transform: scale(0.9); -o-transform: scale(0.9); -ms-transform: scale(0.9); opacity: 0}
.mfp-zoom-in.mfp-removing.mfp-bg, .mfp-zoom-in.mfp-removing .mfp-preloader {opacity: 0}
.mfp-preloader {width: 80px; height: 80px; margin: -40px auto 0; background-color: #777; color: #777; overflow: hidden; border-radius: 100%; -webkit-animation: sk-scaleout 1.0s infinite ease-in-out; animation: sk-scaleout 1.0s infinite ease-in-out}
.mfp-preloader a{color: #777}

.mfp-arrow{width: 60px !important; height: 90px !important}
.mfp-arrow:before, .mfp-arrow:after{display: none !important; opacity: 0 !important}
.mfp-arrow-left{background: rgba(255, 255, 255, 0.7) url(../img/left.png) no-repeat center !important}
.mfp-arrow-right{background: rgba(255, 255, 255, 0.7) url(../img/right.png) no-repeat center !important}

@-webkit-keyframes sk-scaleout {0% {-webkit-transform: scale(0)} 100% {-webkit-transform: scale(1.0); opacity: 0}}
@keyframes sk-scaleout {0% {-webkit-transform: scale(0); transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); -ms-transform: scale(0)} 100% {-webkit-transform: scale(1.0); transform: scale(1.0); -moz-transform: scale(1.0); -o-transform: scale(1.0); -ms-transform: scale(1.0); opacity: 0}}

/*TOP BAR*/
.wrap-bar{background-color: #F2F2F2; color: #333; padding: 13px 0 10px; overflow: hidden; text-align: center; position: relative; z-index: 10}
.wrap-bar *{font-family: 'Lato', sans-serif; text-transform: uppercase; font-size: 13px; vertical-align: middle}
.wrap-bar a{color: #333; text-decoration: none; display: inline-block}
.bar-hover{cursor: pointer}
.bar-hover:hover{color: #777}

.wrap-bar .col-xs-6{line-height: 100%}
.wrap-bar .bar-left{border-right: 1px solid #333}
.wrap-bar .bar-right a{border-bottom: 1px solid #333; padding-bottom: 1px}
.wrap-bar .bar-right a:hover{border-bottom-color: #777}

/*BANNER*/
.wrap-banner{overflow: hidden; position: relative; padding-top: 70px}

.wrap-logo{width: 100%; position: absolute; top: 0; left: 0}
.wrap-logo a{background-color: #fff}
.wrap-logo img{width: 100%}

.banner-img{width: 100%}

.banner-caption{font-family: 'lato', sans-serif; color: #fff; text-transform: uppercase; text-align: center; padding-top: 90px}
.banner-caption h3{line-height: 130%; font-weight: 600; text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -moz-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -webkit-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -ms-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -o-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1)}
.banner-caption strong{font-family: 'regular', sans-serif; font-weight: 900}

.banner-link{text-align: center; position: absolute; bottom: 0; width: 100%; padding-bottom: 25px}
.banner-link a{font-size: 20px; font-weight: 700; text-transform: uppercase; text-decoration: none !important; cursor: pointer; color: #fff; display: inline-block; border-bottom: 2px solid #fff; text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -moz-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -webkit-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -ms-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -o-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1)}

.banner-sub{text-align: left; position: absolute; bottom: 0; padding-bottom: 10px}
.banner-sub span{font-size: 16px; padding-left: 30px; font-weight: 700; text-transform: uppercase; text-decoration: none !important; color: #fff; display: inline-block; text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -moz-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -webkit-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -ms-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1); -o-text-shadow: 0px 1px 30px rgba(65, 76, 108, 1)}

/*GALLERY*/
.wrap-gallery{padding: 50px 0; text-align: center; background-color: #F2F2F2}

.inner-gallery h3{font-size: 20px; text-transform: uppercase; color: #000; font-weight: 700; margin: 0 0 25px}
.inner-gallery p{font-size: 15px; color: #000; margin: 0}

#carousel-gallery{padding-top: 20px}
#carousel-gallery .col-xs-12{margin-top: 15px}
#carousel-gallery .col-xs-12 div{overflow: hidden}
#carousel-gallery a{display: block; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s}
#carousel-gallery a:hover{opacity: 0.8}
#carousel-gallery img{width: 100%; transition: all 0.2s; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s}
#carousel-gallery a:hover img{transform: scale(1.1); -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1)}

.gallery-caption p{text-transform: uppercase; font-size: 13px}

/*BLUEPRINT*/
.wrap-blueprint{padding: 50px 0; text-align: center; background-color: #fff}
.wrap-blueprint img{width: 100%; margin-top: 33px}

.blueprint-text h3{font-size: 20px; text-transform: uppercase; color: #000; font-weight: 700; margin: 0 0 25px}
.blueprint-text p{font-size: 15px; color: #000; margin: 0}

/*INFOS*/
.wrap-infos{background-color: #f2f2f2 !important}
.wrap-infos strong{font-size: 17px; font-weight: 700; display: inline-block; margin-bottom: 10px}

/*NEWSLETTER*/
.wrap-newsletter{background-color: #fff; padding: 50px 0 60px; text-align: center}
.wrap-newsletter .col-sm-6{padding-right: 0}

.wrap-newsletter h3{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; padding-bottom: 20px; line-height: 150%; margin: 0; text-align: center}
.wrap-newsletter p{font-size: 15px; color: #000; margin: 0}

.wrap-newsletter input[type=text]{font-family: 'Lato', sans-serif; width: 100%; text-align: left; height: auto; background-color: transparent; border: 1px solid #9C9C9C; color: #000; padding: 11px 15px; font-size: 15px}
.wrap-newsletter button{display: block; height: auto; border: 1px solid #000; text-transform: uppercase; text-decoration: none !important; background-color: #000; color: #fff; font-size: 15px; padding: 11px 15px; width: 100%}
.wrap-newsletter button:hover{background-color: #444; border: 1px solid #444}

.news-caption{padding-bottom: 30px}

/*LOCATION*/
.wrap-location{background-color: #F2F2F2; padding: 50px 0}
.wrap-location td{width: 50% !important}
.wrap-location img{max-width: 100%}
.wrap-location h3{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; padding-bottom: 20px; line-height: 150%; margin: 0;}
.wrap-location p{font-size: 15px; color: #000; margin: 0}

/*FORM*/
.wrap-form{background-color: #fff; color: #000; padding: 50px 0 55px}
.wrap-form .row{margin-left: -7px; margin-right: -7px}
.wrap-form h3{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; padding-bottom: 30px; margin: 0; text-align: center}

.form-contato .col-xs-12{padding-left: 7px; padding-right: 7px}
.form-contato input, .form-contato textarea{margin-bottom: 14px; font-family: 'Lato', sans-serif; font-size: 15px; color: #777; height: auto; padding: 11px; background-color: transparent !important; border: 1px solid #9c9c9c}
.form-contato textarea{width: 100%; max-width: 100%; min-width: 100%; min-height: 90px}
.form-contato input:focus, .form-contato textarea:focus{border: 1px solid #9c9c9c}

.form-caption{font-family: sans-serif; color: #777; font-size: 15px; margin-top: 15px; display: none}

.botao{display: block; height: auto; border: 1px solid #000; text-transform: uppercase; text-decoration: none !important; background-color: #000; color: #fff; font-size: 15px; padding: 11px 15px; width: 100%}
.botao:hover{background-color: #444; border: 1px solid #444}

/*FOOTER*/
.wrap-footer{text-align: center; background-color: #f2f2f2; padding: 25px 0}
.wrap-footer .col-xs-6 div{font-size: 15px; color: #383232 !important; width: 100%; max-width: 200px; display: inline-block; text-align: left}
.wrap-footer a{font-size: 15px; color: #383232 !important; text-decoration: none !important}
.wrap-footer img{width: 100%; max-width: 200px; margin-top: 7px}
.wrap-footer span{display: inline-block; width: 100%; font-size: 18px; text-align: center; padding-top: 5px}

.footer-text{padding-top: 25px}
.footer-text p{margin-bottom: 0}

/*MODAL*/
.modal-form-title h3{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; margin: 0; padding-bottom: 15px; padding-top: 10px; text-align: center;}
#modal .modal-body{padding: 10px 10px 20px}
#modal .modal-content{border: 0 !important; -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4); box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4)}
#modal .close{opacity: 1; padding-right: 6px}
#modal .close:hover{opacity: 0.7}

#modal .form-contato input, .form-contato textarea{padding: 8px 11px; margin-bottom: 12px}

.modal-backdrop{background-color: #d8d8d8 !important}

/*MODAL MESSAGES*/
#modals .modal-header h4{font-size: 20px; font-weight: 700; text-transform: uppercase; color: #000; margin: 0; padding: 0}
#modals .modal-body{text-align: center;}
#modals .modal-body p{padding: 15px; margin: 0; font-size: 15px}
#modals .modal-content{border: 0 !important; -webkit-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4); box-shadow: 0px 0px 9px 0px rgba(0,0,0,0.4)}
#modals .modal-footer .botao{float: right; width: auto;}

/* modal */
.btn-positon {
    text-align: center !important;
    position: absolute !important; 
    bottom: 0;
    right: 0% !important; 
    width: 100%;
    padding-bottom: 25px !important;
}

.a-primary {
    font-size: 32px !important;
    font-weight: 600!important;
    color: #fff;
}
.a-primary:hover {
    color: #fff !important;;
}



/*MEDIA QUERIES*/
@media all and (max-width: 767px) { /* xs */  
    .wrap-logo{text-align: center; background: transparent url(../img/top.png) repeat-x center top}
    .wrap-logo a{display: inline-block; background-color: #fff; padding: 30px 40px}
    .wrap-logo img{width: 100%; max-width: 130px}

    .banner-caption{padding-top: 20px}
    .banner-caption h3{font-size: 20px}

    .wrap-newsletter button{float: right; width: auto; padding: 11px 25px}

    .wrap-footer .col-xs-6 div{max-width: 150px}
    .wrap-footer img{max-width: 150px}
}

@media all and (min-width: 768px) { /* sm */  
    .wrap-logo a{display: block; padding: 30px 40px}

    .banner-link{padding-bottom: 50px}
    .banner-link a{font-size: 27px; border-bottom: 3px solid #fff}

    .wrap-gallery{padding: 60px 0}
    .inner-gallery h3{font-size: 27px}

    #carousel-gallery .row{margin-left: -7px; margin-right: -7px}
    #carousel-gallery .col-xs-12{padding-left: 7px; padding-right: 7px}

    .wrap-blueprint{padding: 60px 0}
    .blueprint-text h3{font-size: 27px}

    .wrap-newsletter{padding: 60px 0 70px}
    .wrap-newsletter h3{font-size: 27px}
    .wrap-newsletter .col-xs-2{padding-left: 7px}

    .wrap-location{padding: 60px 0}
    .wrap-location h3{font-size: 27px}

    .wrap-form{padding: 65px 0}
    .wrap-form h3{font-size: 27px}
    .botao{width: auto; float: right}

    .modal-form-title h3{font-size: 27px; margin-bottom: 15px}
    .modal-dialog{margin: 40px auto}
    #modal .botao{display: inline-block; float: none; padding-left: 40px; padding-right: 40px}
}

@media all and (min-width: 992px) { /* md */    
    .wrap-logo a{display: inline-block; padding: 40px 50px}
    .wrap-logo img{max-width: 160px}

    .banner-caption{padding-left: 0; padding-right: 0; padding-top: 100px}
    .banner-caption h3{line-height: 150%}

    .banner-link a{font-size: 32px}

    .wrap-gallery{padding: 80px 0; }
    .inner-gallery h3{margin-bottom: 40px}
    .gallery-text{line-height: 200%}

    #carousel-gallery{padding-top: 35px}

    .wrap-blueprint{padding: 80px 0}
    .blueprint-text{line-height: 200%}
    .blueprint-text h3{margin-bottom: 40px}

    #carousel-blueprint{padding-top: 15px}

    .wrap-newsletter{padding: 70px 0 80px}
    .wrap-newsletter h3{margin-bottom: 17px}

    .wrap-location{padding: 70px 0 80px}
    .location-text{padding-left: 30px; line-height: 200%}
    .location-text h3{padding-bottom: 35px}

    .wrap-form{padding: 80px 0}
}

@media all and (min-width: 1200px) { /* lg */
    .banner-caption{padding-top: 10em}
    .banner-caption h3{font-size: 28px}

}

/*SPECIAL QUERIES*/
@media all and (max-width: 415px) {
    .wrap-bar .col-xs-6{width: 100%}
    .wrap-bar .bar-left{border-right: 0}
    .wrap-bar .bar-right{padding-top: 7px; padding-bottom: 4px}
}

@media all and (max-width: 510px) {
    .wrap-newsletter .col-xs-10, .wrap-newsletter .col-xs-2{width: 100%}
    .wrap-newsletter .col-sm-6{padding-right: 15px}
    .wrap-newsletter button{margin-top: 7px; width: 100%}
}

@media all and (max-width: 768px) and (min-width: 416px) {
    .banner-caption h3{font-size: 23px}

    .banner-img{margin-top: -10%}
}

@media all and (max-width: 768px) and (min-width: 500px) {
    .banner-caption h3{font-size: 25px}

    .banner-img{margin-top: -20%}
}

@media all and (max-width: 768px) and (min-width: 650px) {
    .banner-img{margin-top: -30%}
}

@media all and (max-width: 991px) {
    .wrap-location{text-align: center}
    .wrap-location img{margin-top: 40px}
    .wrap-location table td{width: 100% !important; display: block;}
}

.form-contato.loading,
.form-newsletter.loading {
    position: relative;
}

.form-contato.loading::before,
.form-newsletter.loading::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8;
}
.form-contato.loading::after,
.form-newsletter.loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    background-color: transparent;
    background-image: url('../img/loading.gif');
    background-size: cover;
    background-position: center center;
    width: 100px;
    height: 100px;
    margin-top: -50px;
    margin-left: -50px;
    z-index: 9;
}