@charset "utf-8";
@import url("classes.css");
@import url("bootstrap.css");
@import url("menu.css");
@import url("banner.css");

@import url("owlcarousel.css");
@import url("owltheme.css");

@media only screen and (max-device-width: 479px) {
    html { background-image:url(ai-cookie.php?maxwidth=479); } }
@media only screen and (min-device-width: 480px) and (max-device-width: 767px) {
    html { background-image:url(ai-cookie.php?maxwidth=767); } }
@media only screen and (min-device-width: 768px) and (max-device-width: 991px) {
    html { background-image:url(ai-cookie.php?maxwidth=991); } }
@media only screen and (min-device-width: 992px) and (max-device-width: 1381px) {
    html { background-image:url(ai-cookie.php?maxwidth=1381); } }
@media only screen and (min-device-width: 1382px) {
    html { background-image:url(ai-cookie.php?maxwidth=unknown); } }

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 26, 2015 */

@font-face {
    font-family: 'daxcompact-mediummedium';
    src: url('/templates/fonts/daxcompm-webfont.eot');
    src: url('/templates/fonts/daxcompm-webfont.eot?#iefix') format('embedded-opentype'),
         url('/templates/fonts/daxcompm-webfont.woff2') format('woff2'),
         url('/templates/fonts/daxcompm-webfont.woff') format('woff'),
         url('/templates/fonts/daxcompm-webfont.ttf') format('truetype'),
         url('/templates/fonts/daxcompm-webfont.svg#daxcompact-mediummedium') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'dented_brkregular';
    src: url('/templates/fonts/dented-webfont.eot');
    src: url('/templates/fonts/dented-webfont.eot?#iefix') format('embedded-opentype'),
         url('/templates/fonts/dented-webfont.woff2') format('woff2'),
         url('/templates/fonts/dented-webfont.woff') format('woff'),
         url('/templates/fonts/dented-webfont.ttf') format('truetype'),
         url('/templates/fonts/dented-webfont.svg#dented_brkregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* ----------------------------------------- Geral ----------------------------------------- */

    .den {
        font-family: 'dented_brkregular' !important;
    }
    *{ 
        margin: 0; 
        padding: 0; 
        border: 0; 
        text-decoration: none; 
        font-family: 'daxcompact-mediummedium'; 

        outline: none; 
        -webkit-box-sizing: border-box; 
        -moz-box-sizing: border-box; 
        box-sizing: border-box; 
    }
    a   { 
        text-decoration: none !important; 
    }
    a:hover { 
        text-decoration: none !important; 
    }
    body, html{ 
        width:100%; 
        height:100%; 
    }
    h1, h2, h3, h4, h5{ 
        margin: 0; 
        padding: 0; 
    }

/* ----------------------------------------- Header ----------------------------------------- */

    header    { 
        width: 100%; 
        float: left; 
        min-height: 107px; 
        background-color: #B33131;
        position: fixed;
        z-index: 3;
        -webkit-box-shadow: 0px 15px 30px 0px rgba(50, 50, 50, 0.6);
    -moz-box-shadow:    0px 15px 30px 0px rgba(50, 50, 50, 0.6);
    box-shadow:         0px 15px 30px 0px rgba(50, 50, 50, 0.6);
    }
    .header1{
        height: 150px;
    }
    .logo    { 
        width: 122px; 
        height: 85px;  
        display: block; 
        margin-top: 11px;
        margin-bottom: 11px;
    }


/* ----------------------------------------- barra de rolagem ----------------------------------------- */
    #ascrail2000{
        z-index: 999 !important;
    }

/* ----------------------------------------- menu ----------------------------------------- */

    .stroke{
        height: 107px;
    }
    nav ul {
      list-style: none;
      text-align: right;

    }
    nav ul li {
      display: inline-block;
      margin-top: 19px;
    }
    nav ul li a {
      display: block;
      padding: 15px;
      text-decoration: none;
      color: #FFF;
      
      text-transform: uppercase;
      margin: 0 10px;
    }
    nav ul li a,
    nav ul li a:after,
    nav ul li a:before {
      transition: all .5s;
    }
    nav ul li a:hover {
      color: #FFF;
    }
    /* stroke */
    nav.stroke ul li a,
    nav.fill ul li a {
      position: relative;
    }
    nav.stroke ul li a:after,
    nav.fill ul li a:after {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto;
      width: 0%;
      content: '.';
      color: transparent;
      background: #FFF;
      height: 1px;
    }
    nav.stroke ul li a:hover:after {
      width: 100%;
    }

    nav.fill ul li a {
      transition: all 2s;
    }

    nav.fill ul li a:after {
      text-align: left;
      content: '.';
      margin: 0;
      opacity: 0;
    }
    nav.fill ul li a:hover {
      color: #fff;
      z-index: 1;
    }
    nav.fill ul li a:hover:after {
      z-index: -10;
      animation: fill 1s forwards;
      -webkit-animation: fill 1s forwards;
      -moz-animation: fill 1s forwards;
      opacity: 1;
    }
    .selected{
        color: #555;
        border-bottom: 1px solid #FFF;
    }

/* ----------------------------------------- content home ----------------------------------------- */
    
    .conteudo{
        width: 100%;
        height: 800px;
        background-color: #FFF;
    }
    .seta_baixo {
        text-align: center;
        position: relative;
        z-index: 2;
    }
    .seta_baixo img{
        margin-top: -30px;
    }
    .modo_de_usar{
        height: auto;
        float: left;
    }
    .line{
        width: 100%;
        height: 1px;
        border-bottom: 1px #C2C2C2 dotted;
        margin-top: 62px;
        margin-bottom: 55px;
        float: left;
    }
    .beneficios ul{
        list-style-image: url(/templates/images/icon_list.png);
    }
    .teste{
        width: 100%;
        height: 107px;
        float: left;
    }
    .empresa{
        min-height: 755px;
        background-image: url(/templates/images/gato.jpg);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .contato{
        min-height: 800px;
        background-image: url(/templates/images/gato2.png);
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        margin-bottom: 50px;
    }
    .conteudo_etapa_01{
        top: 232px;
        left: 94px;
    }
    .conteudo_etapa_02{
        top: 217px;
        left: 92px;  
    }
    .conteudo_etapa_03{
        top: 209px;
        left: 92px;  
    }
    .etapas{
        min-height: 281px;
    }
    .imagem_mobile{
        display: none;
    }
    .produto_mobile{
        display: none;
    }
    .box_contato{
        margin-top: 100px; 
    }

/* ----------------------------------------- Form ----------------------------------------- */
    .input_contato{
        border: 2px solid #736252;
        height: 40px;
        padding: 10px;
        width: 80%;
    }
    .textarea{
        min-height: 100px;
        resize: none; 
    }
    .botao_form{
        width: 93px;
        height: 41px;
        background-color: #736252;
        border-radius: 3px;
        -webkit-transition: all 0.2s ease-out; 
        -moz-transition: all 0.2s ease-out; 
        -ms-transition: all 0.2s ease-out; 
        -o-transition: all 0.2s ease-out; 
        transition: all 0.2s ease-out;      
    }
    .botao_form:hover{
        background-color: #736252;
        -webkit-transition: all 0.2s ease-out; 
        -moz-transition: all 0.2s ease-out; 
        -ms-transition: all 0.2s ease-out; 
        -o-transition: all 0.2s ease-out; 
        transition: all 0.2s ease-out;     
    }
    .tel{
        vertical-align: initial;
    }/*
    input:invalid { border: 2px solid #939835; }
    input:valid { border: 2px solid #647911; }
    textarea:invalid { border: 2px solid #939835; }
    textarea:valid { border: 2px solid #647911; }*/

    .feedback-sim{
        width:80%;
        min-height:50px;
        line-height: 50px;
        color:#FFF;
        background:  #939835;
        padding-left:15px;
        padding-right:15px; 
        margin-bottom: 20px;
        margin-top: 20px;
    }

    .feedback-nao{
        width:80%;
        min-height:50px;
        line-height: 50px;
        color:#FFF;
        background:  #af923b;
        padding-left:15px;
        padding-right:15px; 
        margin-bottom: 20px;
        margin-top: 20px;
    }

/* ----------------------------------------- footer ----------------------------------------- */

    footer     { 
        width: 100%; 
        float: left; 
        min-height: 80px;
        line-height:  80px;
        background-color:#B33131;
    }
    .copy{
        float: left;
        text-align: left;
        }
    .visu{
        float: right;
        text-align: right;
    }

/* ----------------------------------------- media 1199 ----------------------------------------- */

@media (max-width: 1199px) {
    .etapa01{
        width: 50% !important;
    }
    .etapa02{
        width: 50% !important;
    }
    .etapa03{
        width: 100% !important;
    }
    .conteudo_etapa_01{
        top: 229px;
        left: 113px;
    }
    .conteudo_etapa_02{
        left: 110px; 
    }
    .conteudo_etapa_03{
        top: 201px;
        left: 114px;  
    }
}

/* ----------------------------------------- media 991 ----------------------------------------- */

@media (max-width: 991px) {
    .produto_mobile{
        display: block;
        background-image: url(/templates/images/banner/background_banner.jpg);
        padding-bottom: 30px;
    }
    .box_image img{

        margin-top: 30px;
    }
    .box_contato{
        margin-top: 20px; 
    }
    .stroke {
    height: 30px;
}
    .menu_desk{
        display: none;
    }
    .feedback-sim{
        width: 100%;
    }
    .feedback-nao{
        width: 100%;
    }
    .conteudo_etapa_03{
        top: 201px;
        left: 280px;
        width: 150px;
    }
    .beneficios{
        margin-bottom: 50px;
    }
    .conteudo_empresa{
        width: 100%;
    }
    .empresa{
        background-image: url(/templates/images/fundo_empresa_mobile.jpg); 
        background-position: top;
        min-height: auto;
        padding-bottom: 70px;
    }
    .input_contato{
        width: 100% !important;
    }
    .box_botao{
        width: 100%;
    }
    .conteudo_etapa_01{
        top: 229px;
        left: 100px;
    }
    .conteudo_etapa_02{
        left: 100px; 
    }
    .conteudo_etapa_03{
        top: 201px;
        left: 286px; 
    }
}

@media (max-width: 605px) {
    .box_image img{
        width: 100%;
        height: auto;
        margin-top: 30px;
    }
}

/* ----------------------------------------- media 767 ----------------------------------------- */

@media (max-width: 767px) {
    .etapas{
        width: 366px;
        margin: 0 auto;
        height: auto;
    }
    .conteudo_etapa_03{
        left: 113px; 
    }
}

/* ----------------------------------------- media 500 ----------------------------------------- */

@media (max-width: 500px) {
    .copy{
        text-align: center;
        width: 100%;
    }
    .visu{
        text-align: center;
        width: 100%; 
    }
    footer{
        text-align: center;
        line-height: 50px;
    }   
}

/* ----------------------------------------- media 350 ----------------------------------------- */

@media (max-width: 396px) {
    footer{
        min-height: 100px;
        text-align: center;
    }
    .etapas{
        width: 100%;
        height: auto;
    }
    .etapas img{
        width: 100%;
        height: auto;
    }
    .imagem_desk{
        display: none;
    }
    .imagem_mobile{
        display: block;
        float: left;
    }
    .conteudo_etapa_01{
        position: relative;
        top:0;
        left: 0;
        width: 100%;
        float: left;
    }
    .conteudo_etapa_02{
        position: relative;
        top:0;
        left: 0;
        width: 100%;
        float: left;
    }
    .conteudo_etapa_03{
        position: relative;
        top:0;
        left: 0;
        width: 100%;
        float: left;
    }
    .input_contato{
        width: 100%;
    }
}