
*{font-family: "Montserrat"; padding: 0; margin: 0;}


.conteudo{width: calc(100% - 40px); max-width: 1000px; margin: 0 auto; padding: 0 20px;}

#topo{background-image: url(../img/topo.png); background-repeat: no-repeat; height: 530px; width: 100%; background-size: cover; background-position: bottom center; padding-top: 25px;}

#topo .bloco-topo{height: 90px; background:#fff;}
#topo .bloco-topo h1{width: 224px; height: 64px; background-position: center; background-repeat: no-repeat; background-image: url(../img/logo.png); text-indent: -3000px; display: inline-block;}
#topo .bloco-topo ul{float: right;}
#topo .bloco-topo ul li{display: inline-block; list-style-type: none; margin-left: 20px;}
#topo .bloco-topo ul li a{text-decoration: none; line-height: 90px; color:#393939; font-size: 16px;}

#topo .geral-topo h2{font-size: 40px; font-weight: 800; color:#fff; text-align: center; padding: 65px 0 50px 0;}

#topo .geral-topo p{font-size: 20px; line-height: 36px; letter-spacing: 0.8px; padding-bottom: 65px; color:#fff; text-align: center;}


.solicitar-orcamento a{background: #ef9e01; color:#fff; font-size: 14px !important; width: 200px; text-align: center; height: 30px; border-radius: 30px;  color:#fff !important; display: inline-block; line-height: 30px !important;}

#servicos{margin-top: 40px;}

#servicos .esquerda{background:#fafafa; width: 340px; border-radius: 5px 0 0 5px; padding: 30px; min-height: 390px; -webkit-box-shadow: inset 3px 3px 15px -9px rgba(0,0,0,0.5); -moz-box-shadow: inset 3px 3px 15px -9px rgba(0,0,0,0.5); box-shadow: inset 3px 3px 15px -9px rgba(0,0,0,0.5); display: inline-block; vertical-align: top; position: relative;}

#servicos .esquerda .titulo-esquerda{color:#3a3737; font-size: 18px; font-weight: 800; padding-bottom:20px; }
#servicos .esquerda .descritivo-esquerda{color:#3a3737; font-size: 16px; font-weight: 800; line-height: 24px; font-weight: 400; letter-spacing: 0.8px;}

#servicos .direita{ width: calc(100% - 400px); display: inline-block; vertical-align: top; background:#fff; border-radius: 0 5px 5px 0; min-height: 450px; overflow: hidden; }

#servicos .direita .item-servico{width: calc(100% / 3); display: inline-block; height:150px; background-image: url(../img/base-servico.png); background-repeat: no-repeat; background-position: center; background-size: cover; filter: grayscale(100); position: relative; transition: 1s; vertical-align: top; cursor: pointer;}

#servicos .direita .item-servico p{background:#fff; color:#ef9e01; width: 100%; text-align: center; position: absolute; bottom: 10px; font-size: 14px; height: 25px; line-height: 25px; transition: 0.8s;}

#servicos .direita .item-servico:hover{filter: grayscale(0);}
#servicos .direita .item-servico:hover p{color:#fff; background:#ef9e01;}

#servicos .direita .servico-ativo{filter: grayscale(0);}
#servicos .direita .servico-ativo p{color:#fff; background:#ef9e01;}

#info-txt p{ font-size: 20px; color:#3a3737; line-height: 36px; letter-spacing: 0.8px; text-align: left; margin: 40px 0 40px 0; }
#info-txt2 p{ font-size: 20px; color:#3a3737; line-height: 36px; letter-spacing: 0.8px; text-align: left; margin: 40px 0 40px 0; }

#icones-destaque .item-destaque{ width: calc((100% / 4) - 90px); vertical-align: top; display: inline-block; padding-left: 80px; padding-right: 10px; height: 100px; background-image: url(../img/icone-destaque.png); background-position: center left; background-repeat: no-repeat; }
#icones-destaque .item-destaque p.titulo-destaque{color:#3a3737; font-weight: 800; font-size: 18px; font-style: italic; padding-top: 20px;}
#icones-destaque .item-destaque p.info-destaque{color:#3a3737; font-size: 14px; letter-spacing: 0.8px; }


.solicitar-orcamento-link{background: #ef9e01; color:#fff; font-size: 14px !important; text-align: center; height: 30px; border-radius: 30px;  color:#fff !important; display: inline-block; line-height: 30px !important; text-decoration: none; margin-top: 30px; width: calc(100% - 60px); position: absolute; bottom: 30px; left: 30px;}

#descritivo-oferta{margin-top: 35px; position: relative; margin-bottom: 50px;}
#descritivo-oferta .bg-oferta{position: absolute; width: 100%;}
#descritivo-oferta .bg-oferta .bg-oferta-parceria{background-color:#51bdc4; background-image: url(../img/bg-oferta-parceria.png); background-position: left top; background-repeat: no-repeat; width: calc((100% - 20px) / 2); height: 420px; display: inline-block;}

#descritivo-oferta .bg-oferta .bg-oferta-safe-house{background-color:#d15413; background-image: url(../img/bg-oferta-safe-house.png); background-position: right top; background-repeat: no-repeat; width: calc((100% - 20px) / 2); height: 420px; display: inline-block; margin-left: 20px;}

.info-oferta{position: relative; z-index: 2;}
.info-oferta .info-oferta-esquerda{vertical-align: top; width: calc((100% - 80px) / 2); display: inline-block; padding: 0 10px; }
.info-oferta .info-oferta-direita{vertical-align: top; width: calc((100% - 80px) / 2); margin-left: 30px; display: inline-block; padding: 0 10px; }

.info-oferta .info-oferta-esquerda span{font-style: italic; display: block; font-family: Georgia; font-style: italic; font-size: 18px; color:#013a3e; height: 60px; line-height: 60px; font-weight: bold;}
.info-oferta .info-oferta-direita span{font-style: italic; display: block; font-family: Georgia; font-style: italic; font-size: 18px; color:#fff; height: 60px; line-height: 60px; font-weight: bold;}

.txt-info-oferta{background:#fff; width: calc(100% - 70px); padding: 40px 40px; 
	-webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.5);
}


.txt-info-oferta .titulo{color:#292929;  font-family: bold; font-size: 40px; text-align: center; padding-bottom: 40px; font-weight: 800;}

.txt-info-oferta .descritivo{color:#3a3737; letter-spacing: 0.8px; line-height: 30px;}

.txt-info-oferta ul{display: block; padding: 30px 0;}
.txt-info-oferta ul li{ color:#3a3737; line-height: 30px;}

.info-oferta-esquerda ul li{ list-style-type: none; background-image: url(../img/detalhe-ul-01.png); background-repeat: no-repeat; background-position: center left 10px; padding-left: 50px; }

.info-oferta-direita ul li{ list-style-type: none; background-image: url(../img/detalhe-ul-02.png); background-repeat: no-repeat; background-position: center left 10px; padding-left: 50px; }


#servicos-celular{margin-top: 40px; display: block; border-radius: 3px 3px 0 0; width: calc(100% - 40px); min-height: 150px;}
#servicos-celular .item-servico-celular{ width: calc(100% - 20px);  padding-bottom: 20px; border-radius: 10px 10px 0 0;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
	-moz-box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
	box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
}
#servicos-celular .item-servico-celular .img-servico-celular{background-image: url(../img/base-servico.png); height: 195px; width: 100%; background-size: cover; background-position: center; border-radius: 10px 10px 0 0;}
#servicos-celular .item-servico-celular .titulo{text-align: left; background-image: url(../img/bg-txt-produto-celular.png); background-repeat: repeat-x; color:#3a3737; font-weight: 700; padding: 0 20px; margin-top: -75px; padding-top: 60px; font-size: 18px; }
#servicos-celular .item-servico-celular .descritivo{text-align: left; color:#3a3737; font-size: 15px; padding: 20px 20px 30px 20px; line-height: 20px; letter-spacing: 0.8px; height: 280px; }


#servicos-celular{  height:580px;/*150vh*/ width:100vw; overflow-x: hidden; overflow-y: hidden;}
        
/*sliding navigation between the slides*/
ul.ul-carousel { margin: 0; padding: 0; position: absolute; left:0; height:100vh; list-style-type: none; -webkit-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; }

li.ul-carousel {margin: 0; padding: 0; list-style-type: none; display: inline-block; width: 320px; height: 100%; color: #FFF; text-align: center; vertical-align: top;}




#formulario{background-image: url(../img/bg-rodape.png); background-position: bottom center; background-repeat: no-repeat; padding-bottom: 70px;}
#formulario .titulo-rodape{margin-top: 40px; color:#373737; font-size: 40px; font-weight: 800; padding: 15px 0 20px 0; text-align: center;  }
#formulario .descritivo-rodape{color:#3a3737; font-size: 20px; line-height: 36px; padding-bottom: 35px; text-align: center; }
#formulario form{ background:#fff; position: relative; 
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
}
#formulario form fieldset{border:none;}
#formulario form fieldset .item-form{display: inline-block; width: calc( (100% - 2px) / 3 ); height: 90px; border-bottom: 1px solid #efefef; border-left: 1px solid #efefef; transition: 0.8s;}
#formulario form fieldset .item-form:first-child{border-left: none;}

#formulario form fieldset .item-form-full{width: 100%; border-bottom: none;}
#formulario form fieldset .item-form-full textarea{border:none; color:#8e8e8e; width: calc(100% - 60px); margin-left: 30px; margin-top: 5px;  height: 265px; resize: none; font-size: 16px; outline: none; margin-bottom: 50px;}


#formulario form fieldset .item-form label{ color:#000; font-size: 12px; font-weight: 700; display: block; padding-left: 30px; font-style: italic; text-transform: uppercase; padding-top: 25px; transition: 0.8s;}
#formulario form fieldset .item-form input{ margin-left: 30px; font-size: 16px; color:#8e8e8e; border:none; margin-top: 5px; width: calc(100% - 60px); outline: none; background: transparent; }
#formulario form fieldset .btn-enviar{color:#fff; background:#373737; height: 80px; line-height: 80px; width: 200px; display: block; border-radius: 5px 50px 50px 5px;  font-weight: 800; padding-left: 20px; text-transform: uppercase; position: absolute; bottom: -40px; left: 30px; cursor: pointer;}

.desktop-off{display: none !important;}
.mobile-off{display: block !important;}

.txt-info-direita{}

.warning{background: #ffefef;}
.warning label{color:#b20b0b !important;}


.base-animacao{float: right; width: 80px; height: 80px; margin-right: 10px; position: relative;}

.transition {
	-webkit-transition: .5s;
	-moz-transition: .5s;
	transition: .5s;
	-webkit-transition-timing-function: cubic-bezier(.4,0,.5,1);
	-moz-transition-timing-function: cubic-bezier(.4,0,.5,1);
	transition-timing-function: cubic-bezier(.4,0,.5,1);
}

.button {
    width: 80px;
    height: 80px;
    position: absolute;
    background: rgb(55, 55, 55);
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%)translateY(50%);
    -moz-transform: translateX(-50%)translateY(50%);
    transform: translateX(-50%)translateY(50%);
    border-radius: 50%;
    overflow: hidden;
    cursor: pointer;
}


.plane {
    position: absolute;
    width: 100%;
    height: 100%;
    right: 0;
    top: 0;
    background: url(../img/plane.png) no-repeat center / 40px;
    display: block;
}

.plane.active {
	top: -100px;
	right: -100px;
}

.check {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: none;
}

.check.active {
	display: block;
}

.check:before, .check:after {
	-webkit-transition: .5s;
	-moz-transition: .5s;
	transition: .5s;
	-webkit-transition-timing-function: cubic-bezier(.4,0,.5,1);
	-moz-transition-timing-function: cubic-bezier(.4,0,.5,1);
	transition-timing-function: cubic-bezier(.4,0,.5,1);
}

.check:before {
    content: "";
    position: absolute;
    width: 0px;
    height: 8px;
    background: white;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    top: 54px;
    left: 28px;
    -webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    transform-origin: top left;
}

.check:after {
    content: "";
    position: absolute;
    width: 0px;
    height: 8px;
    background: white;
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    transform: rotate(225deg);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    top: 60px;
    left: 33px;
    -webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    transform-origin: top left;
}

.check.active:before {
	width: 40px;
}

.check.active:after {
	width: 20px;
}

#topo-banner{background: rgb(218,219,255); background: linear-gradient(90deg, rgba(218,219,255,1) 0%, rgba(218,219,255,1) 35%, rgba(248,248,248,1) 35%, rgba(248,248,248,1) 100%); height: 546px;}

#topo-banner .menu-topo-banner{padding-top: 20px;}
#topo-banner .menu-topo-banner h1{text-indent: -30000px; overflow: hidden; background: url(../img/logo.png); margin-left: calc( 35% - 193px); width: 173px; height: 85px; background-origin: center; background-repeat: no-repeat; display: block;}

#topo-banner .menu-topo-banner ul{position: absolute; left: calc(35% + 40px); top:32px;}
#topo-banner .menu-topo-banner ul li{list-style-type: none; display: inline-block; padding-right: 20px; line-height: 50px;}
#topo-banner .menu-topo-banner ul li a{color:#373737; list-style-type: none; text-decoration: none;}
#topo-banner .menu-topo-banner ul li:last-child{padding-right: 0 !important;}

#topo-banner .banner-relogio{background: url(../img/bg-banner.png); height: 440px; width: 100%; border-radius: 10px 10px 0 0; margin-top: 20px; position: relative;  background-size: cover; background-position: center top;}
#topo-banner .banner-relogio img.relogio-banner{position: absolute; right: -20px; top:-33px;}

#topo-banner .banner-relogio p.titulo-horario{ font-size: 60px; color:#fff; font-weight: 900; padding-left: 40px; padding-top: 30px; }
#topo-banner .banner-relogio p.titulo-horario span{color:#fff; font-size: 26px; font-weight: 600; display: block; padding-bottom: 20px; text-transform: uppercase;}

#topo-banner .banner-relogio p.descritivo-horario{color:#fff; font-size: 20px; font-weight: lighter; font-style: italic; letter-spacing: 0.5px; padding-left: 40px; padding-top: 20px; display: inline-block; width: 380px; clear: both;}

#topo-banner .banner-relogio a.link-topo-banner-contato{background: #ff9f00; height: 40px; padding: 0 20px;  letter-spacing: 0.9px; display: inline-block; text-align: center; line-height: 40px; border-radius: 25px; text-decoration: none; color: #fff; margin-left: 40px; margin-top: 30px; font-size: 14px;}

#topo-banner .banner-relogio p.telefone-banner{ font-size: 18px; background: #fff; color:#26298a; font-weight: 800; letter-spacing: 2px; margin-left: 40px; margin-top: 30px; padding:10px 20px; clear:both; }


#img-caminhao-pipa{ height:300px; width:100%; display:block; margin-bottom:20px; background-image:url(../img/caminhao-pipa.png); background-repeat:no-repeat; background-position:center; background-size:contain; }

@media (max-width: 960px){

    .txt-info-direita{padding-bottom: 0px !important;}

    .desktop-off{display: unset !important;}
    .mobile-off{display: none !important;}

    #topo{height: unset; padding-bottom: 100px;}

    #topo .bloco-topo h1{width: calc(100%); display: block;}
    #topo .bloco-topo ul{display: none;}

    #topo .geral-topo h2{text-align: left;}

    #topo .geral-topo p{text-align: left;}

    #topo .geral-topo h2{font-size: 36px;}


    #icones-destaque .item-destaque{ width: calc((100%) - 90px); vertical-align: top; display: inline-block; padding-left: 80px; padding-right: 10px; height: 100px; background-image: url(../img/icone-destaque.png); background-position: center left; background-repeat: no-repeat; }
    #icones-destaque .item-destaque p.titulo-destaque{color:#3a3737; font-weight: 800; font-size: 18px; font-style: italic; padding-top: 20px;}
    #icones-destaque .item-destaque p.info-destaque{color:#3a3737; font-size: 14px; letter-spacing: 0.8px; }

    .base-destaques{padding: 0 20px; width: calc(100% - 40px);}

    #descritivo-oferta .bg-oferta{display: none;}

    .info-oferta{position: relative; z-index: 2;}
    .info-oferta .info-oferta-esquerda{ width: calc((100% - 20px));  display: inline-block; padding: 0 10px; }
    .info-oferta .info-oferta-direita{ width: calc((100% - 20px)); margin-left: 0px !important; display: inline-block; padding: 0 10px; }


    #formulario form fieldset .item-form{width: 100% !important; border-left: none !important;}
    #formulario form fieldset .item-form-full textarea{margin-bottom: 50px !important;}


    #topo-banner{background: rgba(218,219,255,1); height: unset;}
    #topo-banner .relogio-banner{display: none;}


    #topo-banner .banner-relogio{height: unset;padding-bottom: 30px;}
    #topo-banner .banner-relogio p.descritivo-horario{padding-left: 20px; width: calc(100% - 40px); }

    #topo-banner .menu-topo-banner h1{background-repeat: no-repeat; background-position: center; width: 100%; margin-left: 0;}
    #topo-banner .menu-topo-banner ul{position: unset; margin-top: 20px; text-align: center;}
    #topo-banner .menu-topo-banner ul li a{color:#272727;}

    #topo-banner .banner-relogio p.titulo-horario{padding-left: 0; text-align: center; padding-top: 40px; font-size: 50px; }
    #topo-banner .banner-relogio p.titulo-horario span{font-size: 20px; }

    #topo-banner .banner-relogio a.link-topo-banner-contato{margin-left: 0; padding: 0; width: 100%; border-radius: 0;}

    #topo-banner .banner-relogio p.telefone-banner{ font-size: 15px; font-weight: 100; text-align: center; margin-left: 0;}

    #formulario .titulo-rodape{padding-top: 40px;}

    #servicos-celular{position: unset; margin-top: 40px; display: block; border-radius: 3px 3px 0 0; width: calc(100% - 40px); min-height: 150px;}
    #servicos-celular .item-servico-celular{ width: calc(100% - 20px);  padding-bottom: 20px;
        -webkit-box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
        -moz-box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
        box-shadow: 0px 0px 5px 0px rgba(196,196,196,1);
        vertical-align: top;
    }
    #servicos-celular .item-servico-celular .img-servico-celular{background-image: url(../img/base-servico.png); height: 195px; width: 100%; background-size: cover; background-position: center; border-radius: 10px 10px 0 0;}
    #servicos-celular .item-servico-celular .titulo{text-align: left; background-image: url(../img/bg-txt-produto-celular.png); background-repeat: repeat-x; color:#3a3737; font-weight: 700; padding: 0 20px; margin-top: -75px; padding-top: 60px; font-size: 18px; }
    #servicos-celular .item-servico-celular .descritivo{text-align: left; color:#3a3737; font-size: 15px; padding: 20px 20px 30px 20px; line-height: 20px; letter-spacing: 0.8px; height: 280px; }


    #servicos-celular{ position:absolute; height:580px;/*150vh*/ width:100vw; overflow-x: hidden; overflow-y: hidden;}
        
    /*sliding navigation between the slides*/
    ul.ul-carousel { margin: 0; padding: 0; position: absolute; left:0; height:100vh; list-style-type: none; -webkit-transform-style: preserve-3d; -ms-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; }

    li.ul-carousel {margin: 0; padding: 0; list-style-type: none; float: left; width: calc(100vw - 60px); height: 100%; color: #FFF; text-align: center;}


}

