/* GERAL */
    h1 { text-align: center; font-size: 4em; text-transform: uppercase; }
    h2 { text-align: center; font-size: 3.6em; }
    body { 
        font-family: 'Oswald', sans-serif !important;
     }

   h1,h2,h3,h4,h5,h6{font-family: 'Oswald', sans-serif;}

   p,a,li{font-family: 'Oswald', sans-serif;}
    
    /*ANIMAÇÃO MENU SERVIÇOS*/
        .menu-in { transform:rotate(90deg); }

    /* HELPERS */
        .img-100 img { width: 100%; }
        .img-center { text-align: center; }
        .z-index-dest { z-index: 99999; }
        .sombra { box-shadow: 15px 10px 50px 0px rgba(0, 0, 0, 0.50); }
        .paragrafo-indent p{ text-indent: 60px; }
        .list-none { list-style: none; padding: 0; }
        .remove-decoration { text-decoration: none; color: inherit; }
        .remove-decoration-a * { text-decoration: none; color: inherit; }
        .no-padding { padding: 0; }
        .no-padding-right { padding-right: 0 !important; }
        .no-padding-left { padding-left: 0 !important; }
        .sublinhado-tit { border-bottom: 1px solid #CCCCCC; color: #000000; padding-right: 30rem; }        
        .images-middle {align-items: center; display: flex;}

        /*RESOLVE CASOS DO BACKGROUND NÃO SEGUIR CONTEUDO DAS DIVS*/
        .fluid:after { content: ''; display: table; clear: both; }
        
        /*BOTOES*/
            .btn-reset { background-color: transparent; border: none; }

            /* a.btn{ color: #993033; font-size: 17px; transition: .3s all ease; }
            a.btn:hover{ color: white; background-color: #993033; border: 1px solid #993033; } */
            
            a.btn.btn-yellow{ color: black; font-size: 17px; transition: .3s all ease; }
            a.btn.btn-yellow:hover{ color: #f8ad1c; background-color: black; border: 1px solid black; }

            a.btn.btn-green-invert{ color: #7db63e; font-size: 17px; transition: .3s all ease; }
            a.btn.btn-green-invert:hover{ color: white; background-color: #7db63e; border: 1px solid #7db63e; }
            
            a.btn.btn-green, button.btn.btn-green{ color: black; font-size: .7em; transition: .3s all ease; background-color: #7db63e; font-weight: bold; border-radius: 20px; }
            a.btn.btn-green:hover, button.btn.btn-green:hover{ color: white !important; background-color: black; }

            a.btn.btn-blue{ color: #0c98d7; font-size: 17px; transition: .3s all ease; }
            a.btn.btn-blue:hover{ color: white; background-color: #0c98d7; border: 1px solid #0c98d7; }
            
            a.btn.btn-form{ color: #7f7f7f; background-color: #ddddde; font-size: 20px; transition: .3s all ease; border-radius: 15px; }
            a.btn.btn-form:hover{ color: #ddddde; background-color: #7f7f7f; border: 1px solid #7f7f7f; }
        
        /*BACKGROUNDS*/
            .bg-dark { background-color: black; }
            .bg-green { background-color: #5AB62D; }
            .bg-white { background-color: white; }
            .bg-clean { background-color: rgba(230, 243, 245, 0.46); }
            .bg-clean-topo { background-color: rgba(230, 243, 245, 0.46); box-shadow: 1px 1px 30px 5px rgba(109, 107, 107, 0.65); }
            .bg-grey {background-color: #9a9a9a;}
            .bg-grey2 {background-color: #616161;}
            .bg-blue2 { background-color: #00659f; }
            .bg-blue3 {background-color: #01AFEE;}
        /*TOPO*/    

            .faixa-topo {
                background-color: #e0e0e0;
                height: 34px;
            }

            .faixa-topo p {
                color: #056BA0;
                font-family: 'Oswald',sans-serif;
                font-weight: 400;
                font-size: 0.9em;
                margin-left: 7em;
            }

            .faixa-topo img{
                width: 32px;
            }

            .faixa-topo .rede-social img{
                margin-right: 15px;
            }

            .faixa-topo .rede-social a{
                text-decoration: none;
            }

            .navbar {
                position: relative;
                padding: 0.5rem 31% !important;
                background-color: #056BA0 !important;
                border-radius: 0rem !important;

            }

            .logo {
                /*padding-bottom: 143px;*/
            }

            .logo .img-responsive {
                display: block;
                margin: 0 auto;
                padding-top: 15px;
            }

            .fundo {
                padding-bottom: 55px;
                padding-top: 55px;
                color: black;
            }

            .home h1 {
                font-family: 'Oswald',sans-serif;
                color: #056BA0;
                padding-top: 25px;
                padding-bottom: 25px;
            }            

            .home .produtos {
                margin-left: 20px;
                margin-bottom: 20px;
                
                text-decoration: none;  
            }

            .home .produtos p {
                color: black ;
                font-size: 1em;
                text-decoration: none;
                text-align: center;
            }

/* HOVER PRODUTOS */
            .home .produtos a:link {

                border: 7px solid white !important; 
                display: block;
                text-decoration: none;
                /* padding: 8px; */
                margin-right: -55px;
            }
            
            .home .produtos a:hover {
                border: 7px solid #01afee !important;
                display: block;
                margin-right: -58px;
                text-decoration: none;
                padding-right: 3px;
                height: 457px;
            }

            .home .produtos img{
                padding: 4px 8px 11px 4px;
            }

            .home a {
                color: rgb(255,255,255) !important;
            }

            .fund-paralax {
                background-image: url("../../site/img/banner-paralax.jpg");
                background-repeat: no-repeat;
                height: 30em;
            }

            .esp-right {
                margin-right: 40px;
            }

            .navbar-light .navbar-nav .nav-link {
                color: #FFFFFF !important;
                font-family: "Oswald", sans-serif;
                font-size: 22px;
            }

            .navbar-light .navbar-nav .nav-link:hover {
                border-bottom: 2px solid #FFFFFF;
                padding-bottom: 0px;
            }

            .navbar-light .navbar-nav .nav-link.loc{
                width: 150px;
            }
            /*.esp-top {
                padding-top: 8rem;
                position: relative;
            }*/


            .rodapeban h1 {
                font-weight: 600;
                font-size: 46px;
                color: white;
                text-align: center;
                padding-top: 1rem;
                background-color: rgba(1, 175, 238,0.80);
                width: 18em;
                height: 4em;
                margin-top: 3.5em;
                margin-left: 22rem;
            }

            .rodape {
                padding-top: 25px;
                padding-left: 25px;
                position: relative;
                padding-bottom: 5px;
            }

            .rodape img{
                padding-top: 25px;
            }
            .rodape p{
                margin-left: 14em;
                font-size: 13px;
                
            }

            .assinatura-rodape {
                
                font-weight: 300;
                color: white;
                text-align: center;
                /* background-color: #616162; */
                text-decoration: none;
                font-size: 14px;
                padding-top: 5px;
            }

            .assinatura-rodape a{
                color: white;
                text-decoration: none;
            }




            /* CARROSSEL DE PARCEIROS */

            .parceiros h2 {
                
                text-transform: uppercase;
                color: #056BA0;
                padding-top: 50px;
                padding-bottom: 50px;
            }

            .carousel {
                margin-bottom: 0;
                padding: 0 40px 0px 40px;
            }

            .carousel-parceiros {
                padding-bottom: 30px ;
            }

            .carousel.banner {
                padding: 0px 0px 0px 0px;
            }

            /* The controlsy */
            .carousel-control {
                /*left: -12px;*/
                height: 40px;
                width: 40px !important;
                background: none repeat scroll 0 0 #222222;
                border: 4px solid #FFFFFF;
                border-radius: 23px 23px 23px 23px;
                margin-top: 90px;            
                position: absolute;
                top: 0;
                bottom: 0;
                left: -12px;
                /* width: 15%; */
                font-size: 20px;
                color: #fff;
                text-align: center;
                text-shadow: 0 1px 2px rgba(0,0,0,.6);
                opacity: .5;
            }


/* CONTROLE DO CAROUSEL DE BANNERS ------------------------------ */
            .carousel-control.right.ban {
                right: 45px;
                visibility: hidden;
            }

            .carousel-control.left.ban {
                visibility: hidden;
            }
/* ----------------------------------------------------------------- */
            /* The indicators */
            .carousel-indicators {
                right: 50%;
                top: auto;
                bottom: -10px;
                margin-right: -19px;
            }
            /* The colour of the indicators */
            .carousel-indicators li {
                background: #cecece;
            }
            .carousel-indicators .active {
            background: #428bca;
            }

            .banner .carousel-indicators li{
                width: 22px;
                height: 22px;
                background-color: white;
            }

            .banner .carousel-indicators li.active{
                background-color: #01AFEE;
                border-color: #01AFEE;
                width: 22px !important;
                height: 22px !important;
            }

            /* POSICAO DAS SETA DO CARROSEL DE PARCEIROS */
            .parc.carousel-control.right{
                top: -7em;
                right: 2em;
            }

            .parc.carousel-control.left{
                top: -7em;
                left: 49.5em;
            }

            /* POSIÇAO DAS SETAS DO CAROUSEL PRINCIPAL */



/* AJUSTANDO RESPONSIVOS */

/*==========  REPONSIVO - Non-Mobile First Method  ==========*/

/*  Dispositivos muito pequenos (smartphones em formato paisagem, e abaixo de 576px) */
@media (max-width: 575px) { 

}

/* Dispositivos pequenos (smartphones em formato retrato, e abaixo de 768px) */
@media (max-width: 767px) { 
    /*ÍNICIO TOPO TELEFONE RESP*/
    .faixa-topo {
        background-color: #e0e0e0;
        height: 34px;
    }

    .faixa-topo p {
        color: #056BA0;
        font-family: 'Oswald',sans-serif;
        font-weight: 400;
        font-size: 14px;
        margin-left: -1em;
    }

    .faixa-topo img{
        width: 32px;
        margin-left: 6px !important;
    }
    /*FIM TOPO TELEFONE RESP*/

    /*ÍNICIO LOGO RESP*/
    .logo img {
        width: 100%;
    }
    /*FIM LOGO RESP*/

    /*ÍNICIO BANNER*/
    .banner .carousel-indicators li.active {
        background-color: #01AFEE;
        border-color: #01AFEE;
        width: 7px !important;
        height: 7px !important;
    }

    .banner .carousel-indicators li {
        width: 7px;
        height: 7px;
        background-color: white;
    }

    .carousel-indicators {
        bottom: -18px !important;
    }
        

    /*FIM BANNER*/

    /*ÍNICIO DA SECTION ABRASINOX ABAIXO DO BANNER*/
    .fundo h2 {
        font-size: 1.2rem;
    }
    /*FIM DA SECTION ABRASINOX ABAIXO DO BANNER*/

    /* ÍNICIO SECTION PRODUTOS */
    .produtos img {
        width: 100%;
    }

    .home .produtos p {        
        font-size: .7em;        
    }

    .esp-right {
        margin-right: 19px;
    }

/* HOVER DE HOME-PRODUTOS */
    /* não exibe a cor azul */
    .home .produtos a:hover {
        border: 7px solid #fff !important;
        display: block;
        margin-right: -57px;
        text-decoration: none;
        padding-right: 3px;
        height: 82px;
    }   

    /* FIM SECTION PRODUTOS */

    /* ÍNICIO SECTION ENTRE PRODUTOS E PARCEIROS */
    .fund-paralax {
        /*background-image: url("../../site/img/banner-paralax.jpg");*/
        background-repeat: no-repeat;
        height: 0em;
    }

    .rodapeban h1 {
        font-weight: 600;
        font-size: 26px;
        color: white;
        text-align: center;
        padding-top: rem;
        background-color: rgba(1, 175, 238,0.80);
        width: 13em;
        height: 5em;
        margin-top: 0.5em;
        margin-bottom: 3em;
        margin-left: -1rem;
    }

    /* FIM SECTION ENTRE PRODUTOS E PARCEIROS */
    
    /* ÍNICIO PARCEIROS */

    .parceiros h2 {
        text-transform: uppercase;
        color: #056BA0;
        padding-top: 141px;
        padding-bottom: 50px;
    }

    /* FIM PARCEIROS */

    /* ÍNICIO RODAPE */
        
    .rodape img {
        /* padding-top: 25px; */
        width: 100%;
    }    

    .rodape p {
        margin-left: 3em;
        font-size: 11px;
        font-weight: 600;
    }
    /* FIM RODAPE */

    /* ÍNICIO TELA DE ORÇAMENTOS */

    .img-carrinho figure {
        margin: 0 -27px 2rem;
    }    

        /* ajusta o tamanho do campo de quantidade na lista de orçamento */
    #info-carrinho select {
        width: 240%;
        margin-left: -25px;
    }

    /* FIM TELA DE ORÇAMENTOS*/
}

/* Dispositivos médios (tablets, e abaixo de 992px) */
@media (max-width: 991px){ 
    .navbar-toggleable-md .navbar-nav .nav-item {
        float: none;
        margin-left: -1;
    }

    .navbar-toggleable-md { padding: 59px 24px !important; } 

}    

/* Dispositivos grandes (desktops, e abaixo de 1200px) */
@media (max-width: 1199px) { 

    .navbar-toggleable-md { padding: 63px 24px !important; }
    
}

/* -================================================================= MENU ===============================================================- */


/* ÍNICIO SUBMENU */
    .dropdown-submenu{position:relative;}
    .dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
    /*.dropdown-submenu:hover>.dropdown-menu{display:block;}*/
    .dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#03AEF3;margin-top:5px;margin-right:9px;}
    .color-sub-menu{color: #000 !important;}
    .color-sub-sub a{color: #CCC !important;}
    .dropdown-submenu:hover>a:after{border-left-color:#ffffff;}
    .dropdown-submenu.pull-left{float:none;}
    .dropdown-submenu.pull-left>.dropdown-menu{left:-100%;margin-left:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}
/* FIM SUBMENU */


/* ÍNICIO DO CSS PARA ABRIR E FECHAR HAMBURGUINHO*/

.nav-item a {
    color:#FFF;
}

/* .navbar-toggleable-md {
    padding: 59px 24px !important;
 }   */ 

.openss {

    position: relative;    
    /*top: 126px;*/
    top: 0px;
    right: 100px;
    width: 50px;
    height: 50px;
    display: block;
    cursor: pointer;
    transition: opacity 0.2s linear;    
    &:hover{
        opacity: 0.8;
    }
}

span{
    display: block;
    float: left;
    clear: both;
    height: 4px;
    width: 40px;
    border-radius: 40px;
    background-color: #0000FF;
    position: absolute;
    right: 3px;
    top: 3px;
    overflow: hidden;
    transition: all 0.4s ease;

}

span:nth-child(1){
    margin-top: 0px;
    z-index: 9;
    background-color: #056BA0;
}

span:nth-child(2){
    margin-top: 17px;
    background-color: #03AEF3;
}

span:nth-child(3){
    margin-top: 35px;
    background-color: #056BA0;
}



.oppenned{
    
    li{
        margin-right: 168px;
    }
}

.oppenned span:nth-child(2){
    overflow: visible;
}
.oppenned span:nth-child(1), .oppenned span:nth-child(3){
    z-index: 100;
    transform: rotate(45deg);
}
.oppenned span:nth-child(1){
    transform: rotate(45deg) translateY(12px) translateX(12px);
}
.oppenned span:nth-child(2){
    z-index: -1;
    height: 400px;
    width: 400px;
    right: -160px;
    top: -160px;
    border-radius: 50%;
    background-color: rgba(38, 84, 133, .00);
}
.oppenned span:nth-child(3){            
    transform: rotate(-45deg) translateY(-10px) translateX(10px);
}


/* FIM DO CSS PARA ABRIR E FECHAR HAMBURGUINHO*/

#flashContent { width:100%; height:100%;}
#mask {position:absolute; left:0; top:0; z-index:9000; background-color:#000; display:none;}
#boxes .window {position:fixed; left:0; top:0; width:600px; height:600px; display:none; z-index:9999; padding:15px 0 0 0;}
#boxes #dialog2 {background:transparent; width:600px;}
.close{width:22px; height:22px; position:absolute; line-height:15px; display:block; border:none;  color:#FFF; font-weight:bold; cursor:pointer; top:-15px; left:576px; background:#c51228; z-index:9999;}