/********** MOBILE E TABLET ************/

@media (max-width:767px) {
    
    .container {
        width: auto !important;
    }
    h2{
        font-size: 1.5em;
    }
    h3{
        font-size: 1.7em;
    }
    h4{
        font-size: 1.2em;
    }
    h5{
        font-size: 1em;
        text-align: center;
    }
    h6{
        font-size: 1em;
        text-align: center;
    }
    
    .zap-web {
        display: none;
    }
    .zap-cell {
        display: block;
    }
    
    .botao {
        font-size: .9em;
        margin: 30px 0px 10px;
    }
    
    .sobre, .servicos, .porque, .oque, .clientes, .contato {
        padding-top: 30px;

    }
    .action{
        padding: 5px;
    }
    .action .botao{
    margin: 10px auto;
    }

    .action h5{
        font-size: 1.5em;
        text-align: center;
    }
    .action h2{
        text-align: center;
        font-size: 2em;
    }
    .action img{
        width: 60%;
        margin: 20px auto;
    }
    
    #img-mobile{
        display: block;
        width: auto;
        background-size: cover;
    }
    #img-desktop{
    display: none;
}

    /********** TOPO E MENU ************/
    .topo h6{
        margin-top: 10px;
        text-align: left;
    }
    .topo h6#mail{
        text-align: center;
        margin-top: 15px;
        margin-right: auto;
    }
    
    .topo h6 a span.tel {
        font-size: 1.5em;
        color: #9d0e1c;
        margin-right: 0px;
    }
    
    .logo{
        display: none;
    }
    
    .logo-mobile{
        display: block;
        width: 40%;
        margin: 10px auto 0px;
        padding: 0px;
    }
    
   
    
    .menu {
        margin-top: 5px;
    }
    .navbar {
        min-height: 5px;
        margin: auto;
        border: none;
        border-radius: 0px;
    }
    
    .navbar-toggle {
        border-radius: 0px;
        border: 0px;
        color: #9d0e1c;
        margin: -110px 0px;
        padding: 5px;
        font-size: 1.5em;
    }
    .navbar-nav li {
        display: block;
        width: 100%;
    }
    .navbar-nav .open .dropdown-menu>li>a {
        line-height: 20px;
        text-align: left;
    }
    
    
    .menu-fixo .navbar{
        min-height: 30px;
    }
    .menu-fixo .navbar-toggle {
        border-radius: 0px;
        border: 0px;
        color: #9d0e1c;
        margin: 0px;
        padding: 10px;
    }
    
    .menu-fixo .logo-menu {
        display: block;
        width: 35%;
        margin: -50px auto 5px;
        margin-left: 0px;
        padding: 6px;
        padding-left: 0px;
        transition: .6s ease-in;
        float: none;
}
    /********** CAROUSEL DE SLIDES ************/
    #carousel-principal .carousel-inner{
        margin-top: 0px;
        width: 100%;
    }
    
    .carousel-caption {
        top: 195px;
        left: 0px;
        width: 100%;
        padding: 20px;
    }
     .carousel-caption h1 {
        font-size: 2.5em;
        margin-top: 0px;
        margin-bottom: 0px;
        line-height: .95em;
        padding-left: 40px;
        padding-right: 40px;
    }
    
    .carousel-caption h5{
        display: none;
    }
     .carousel-caption p {
        text-shadow: none;
        text-align: justify;
        color: #fff;
        font-size: .8em;
    }
    
    .carousel-caption a {
        margin: 20px auto;
}
    
    
    .carousel-indicators {
        bottom: 20px;
        margin-bottom: 0px;
    }
    
    .carousel-control span {
    margin-top: 450%;
    font-size: 3em;
    color: #9d0e1c;
}
    
    .carousel-indicators li{
        margin: 1px 5px;
    }
    #carousel-servico-desktop{
        display: none;
    }
    #carousel-servico-mobile{
        display: block;
    }
    #carousel-depoimento-desktop{
        display: none;
    }
    #carousel-depoimento-mobile{
        display: block;
    }
    
    /**************SERVICOS***********/
    .servicos{
        background: url(../img/site/bg-servicos-mobile.jpg)top center repeat;
    }
    
    .servicos .thumbnail a img{
        width: 100%;
    }
    
    .porque{
        background: #dadada;
    }
    #carousel-servico-mobile .thumbnail{
        height: 420px
    }
    .porque .thumbnail{
        height: auto;
    }
    /**************DEPOIMENTO***********/
    #carousel-depoimento-desktop blockquote, #carousel-depoimento-mobile blockquote {
        margin: 10px 5px;
    }
    
    /********** CLIENTES ************/
    
    .clientes ul li{
        display: inline-block;
        float: left;
        width: 50%;
        padding: 15px;
        margin: auto;
    }
    .clientes ul li.d-mobile-none{
        display: none;
    }
    
    /********** CONTATO - AGENDE ************/
    
    .contato .botao{
        font-size: .9em;
        margin: 15px 0px 10px auto;
    }
    .contato .formtext {
        margin-top: 0em;
        text-align: center;
    }
    .formulario p,
    .formulario label {
        font-size: 1em;
    }
    
    .contato label#checkbox, .contato p legend#checkbox{
        font-size: .9em;;
        text-align: left;
    }
    .contato .formulario form {
        padding: 20px 0px 80px;
    }
    
    
    /********** RODAPE ************/
    .rodape img {
        margin: 0px auto;
        padding: 10px;
    }
    .rodape p{
        text-align: center;
    }
    .rodape h6 {
        font-size: 1em;
        margin-top: 2em;
    }
    
    .rodape .social li a span {
        margin: 0px auto;
        display: block;
        text-align: center;
    }
    
    .rodape input{
        width: 100%;
    }
    .rodape nav ul {
        padding-left: 0px;
        margin-left: 0;
    }
    
    .rodape nav ul li {
        display: block;
        margin: 0px auto;
        text-align: center;
    }

    .barra .copy img {
        display: block;
        width: 18%;
        float: none;
        margin: 5px auto;
    }
    
    .barra p{
        text-align: center;
    }
}


/********** MOBILE LANDSCAPE ************/

@media (min-width:481px) and (max-width:767px) and (orientation:landscape) {}


/********** NOTEBOOKS ************/

@media (min-width:768px) and (max-width:991px) {
    
    .container {
        width: auto !important;
    }
    
    h2{
        font-size: 1.5em;
    }
    h3{
        font-size: 1.7em;
    }
    h4{
        font-size: 1.2em;
    }
    h5{
        font-size: 1em;
        text-align: center;
    }
    
    h6{
        font-size: .7em;
        text-align: left;
    }
     .botao {
        font-size: .9em;
        margin: 30px 0px 10px;
    }
    
    .action{
        padding: 25px;
    }
    .action .botao{
    margin: 10px 0px;
    }

    .action h5{
        margin-top: 10px;
        text-align: left;
    }
    .action h2{
        text-align: left;
        font-size: 1.8em;
    }
    .action img{
        width: 80%;
        margin: 10px auto;
    }

    /********** TOPO E MENU ************/
    
    .topo h6 {
        margin: 30px 0px 5px 0px;
    }
    .topo p {
        font-size: .7em;
        line-height: .9em;
        margin-bottom: 5px;
    }
    
    .topo h6#mail {
        text-transform: none;
        margin-top: 40px;
        margin-right: -30px;
    }

    .logo{
        display: block;
        width: 80%;
        margin: 10px 0px;
        padding: 0px;
    }
    .menu-fixo .logo{
        display: none;
    }
    .menu-fixo .logo-menu{
        display: block;
        width: 10%;
        margin: 5px 10px 5px 0px;
    }
    .menu-fixo .navbar-nav {
        width: 90%;
        margin: 10px auto 0px;
    }
    .menu-fixo .navbar-nav li a {
        padding: 10px 15px;
        line-height: 1em;
    }
    
/********** CAROUSEL DE SLIDES ************/
    
    .carousel-caption {
        background: rgba(71, 96, 60, 0.8);
        top: 0%;
        width: 40%;
        height: 100%;
        right: 25%;
        left: 10%;
        padding: 20px;
    }
     
    .carousel-caption h1 {
        font-size: 2em;
    }
    
   
    .carousel-caption p {
        font-size: .8em;
    }
    .carousel-inner {
        height: auto;
    }
    
    
    .carousel-indicators{
        left: 80%;
        bottom: 0px;
    }
    .servicos{
        background: url(../img/site/bg-servicos.jpg)top left repeat;
    }
    .servicos .thumbnail{
       height: 412px;
    }
    .servicos h2 {
        font-size: 1.3em;
    }
    .porque{
        background: #dadada;
    }
    .porque .thumbnail{
       height: auto;
    }
    
    .barra .copy img {
        float: right;
        margin: -35px 0px;
        width: 8%;
    }
}


/********** NOTEBOOKS WIDSCREEM************/

@media (min-width:992px) and (max-width:1199px) {
    
}


/********** I MACS 4K E TVS************/

@media (min-width:1960px) {
    .carousel-inner {
        height: 900px;
    }
    
    .carousel-caption {
        top: 10%;
        right: 12%;
        left: 17%;
    }
    
}