tml, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed,  figure, figcaption, footer, header, hgroup,  menu, nav, output, ruby, section, summary, time, mark, audio, video {margin: 0;padding: 0;border: 0;font-size: 100%;font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure,  footer, header, hgroup, menu, nav, section {display: block; } body {line-height: 1; padding: 0;} ol, ul {list-style: none; } blockquote, q {quotes: none; } blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none; } table {border-collapse: collapse; border-spacing: 0; }
html {box-sizing: border-box;}
*, *:before, *:after {box-sizing: inherit;}
a{text-decoration: none}
p{margin-bottom: 15px}
strong{font-weight: bold}

@font-face {
    font-family: 'aileronbold';
    src: url('../fonts/aileron-bold-webfont.eot');
    src: url('../fonts/aileron-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/aileron-bold-webfont.woff2') format('woff2'),
         url('../fonts/aileron-bold-webfont.woff') format('woff'),
         url('../fonts/aileron-bold-webfont.ttf') format('truetype'),
         url('../fonts/aileron-bold-webfont.svg#aileronbold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'aileronlight';
    src: url('../fonts/aileron-light-webfont.eot');
    src: url('../fonts/aileron-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/aileron-light-webfont.woff2') format('woff2'),
         url('../fonts/aileron-light-webfont.woff') format('woff'),
         url('../fonts/aileron-light-webfont.ttf') format('truetype'),
         url('../fonts/aileron-light-webfont.svg#aileronlight') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'mohaveregular';
    src: url('../fonts/mohave-webfont.eot');
    src: url('../fonts/mohave-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/mohave-webfont.woff2') format('woff2'),
         url('../fonts/mohave-webfont.woff') format('woff'),
         url('../fonts/mohave-webfont.ttf') format('truetype'),
         url('../fonts/mohave-webfont.svg#mohaveregular') format('svg');
    font-weight: normal;
    font-style: normal;

}



.for-mobile{display: none!important;}
.for-desktop{display: block!important;}

.wrapper{overflow: hidden; font: normal 16px "aileronlight", Arial, Helvetica, sans-serif; margin: 0 auto;}
p{line-height: 26px; font-size:18px;}
.full-wrapper{max-width: 100%}
.container{min-width: 320px;  max-width: 1200px; clear: both; position: relative; padding: 0 15px; margin: 0 auto;}
.container:before,
.container:after {content: " "; display: table;}
.container:after {clear: both;}
.container {*zoom: 1;}



.headercontainer{height: 115px; background: #015872; position: fixed; width: 100%; top: 0; z-index: 1000; 
transition: all 0.3s ease;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
}
.headercontainer .logo{position: absolute; left: auto; bottom: 12px; width: 180px; cursor: pointer;
transition: all 0.3s ease;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
} 
.headercontainer .container {height: 100%;}
.headercontainer nav{float:right; display:block; width:71%; z-index: 2; margin: 70px 0 0 0; text-align: right; font-family: 'mohaveregular'; font-size: 19px;
transition: all 0.3s ease;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
}
.headercontainer nav a{display: inline-block; margin-right: 40px; color: #fff;}

.headercontainer-small{height: 80px;}
.headercontainer-small .logo{width: 120px;}
.headercontainer-small nav{ margin-top: 43px; font-size: 18px;}



.page-title{border-left:3px solid #011c44;font-size: 41px; width: 530px; color: #011c44; margin: 40px 0; text-indent: 5px; float: left; clear: both; position: relative; font-family: 'mohaveregular';}
.page-title:after{ content:" " ; display: block; width: 100%; height: 3px; background: #011c44}
.page-title span{margin: 0 0 4px 20px; display: block;}
.page-title span:after{content: ""; position: absolute; width: 15px;height: 15px; border-radius:20px; border: 3px solid #011c44; right: -15px;bottom: -6px;}

.page:before, .page:after{content: " "; display: table;}
.page:after {clear: both;}
.page {*zoom: 1;}
.page{min-height: 952px;padding-bottom: 70px;}
.page p{}

.box-promo{max-width:590px; border: 3px solid #fff; padding: 35px 70px; margin: 0 auto; color:#fff; font-family:'mohaveregular'; font-size:50px;}

.text-item{width: 97%; max-width: 100%; padding: 20px; margin-bottom: -20px; line-height: 1.5; position: relative}

.text-primary{background:#86b71d; color: #fff; }
.text-secondary{ background:#e9e9e9; color:#343432;}

.swiper-container{width: 100%; height: 525px; position: relative;  clear:both; overflow: hidden; top: 60px;}

.swiper-control{position: absolute; top: 50%; margin-top: -30px; width: 48px; height: 106px; z-index: 10;}
.swiper-slide{color:#343432; font-size: 18px; background: #fff; float:left; padding: 0 2%; width: 100%; height:100%;}
.swiper-prev{left: 30px; background: url('../img/arrow-left.png') no-repeat center; cursor: pointer;}
.swiper-next{right: 30px; background: url('../img/arrow-right.png') no-repeat center; cursor: pointer;}

.slider-title{font-size: 40px; text-transform: uppercase; color: #86b71d; margin-bottom: 18px}
.slider-resume{font-size: 20px;}

.page-home{min-height:812px; background: url('../img/splash-home.jpg') no-repeat center 100% / cover;}
.page-home .box-promo{position: absolute; width: 590px; left: calc(50% - 295px); top: calc(50% - 168px);}

.page-sobre .page-title{margin-top:0px;padding-top:38px;}
.page-sobre{background: #ebecec;min-height: 0; color:#474747;}
.page-sobre .content{float: right; width: 50%; clear:both;}

.page-autocom{background: url('../img/splash-autocom.jpg') no-repeat center 100%/cover; color:#fff; min-height: 0}
.page-autocom .autocom-logo{margin-top:30px;}
.page-autocom .content{margin-top: 40px; -webkit-column-count: 3; -moz-column-count: 3; column-count: 3;-webkit-column-gap:40px; -moz-column-gap:40px; column-gap:40px;}
.page-autocom .indicado-para{ border-color:#fff; border-bottom:0; border-top: 3px solid #fff; padding: 20px 20px 0; position: absolute; right: 50px; bottom: -70px;}


form >*::-webkit-input-placeholder {color: rgba(255,255,255,0.8);}
form >*:-moz-placeholder {color: rgba(255,255,255,0.8);}
form >*::-moz-placeholder {color: rgba(255,255,255,0.8);}
form >*:-ms-input-placeholder {color: rgba(255,255,255,0.8);}

form input, form textarea{font-family: 'aileronlight'}

.page-funcionalidades{background: #fff; }
.page-funcionalidades .indicado-para{right: 50px;  top: 0; float: none; position: absolute;}

.page-funcionalidades .page-title{margin-top: -1px; padding-top: 220px;}
.page-funcionalidades .content{clear:both;}
.page-funcionalidades ul{width: 33.33333333333%; padding: 20px; float: left; font-size:19px; color: #474747}
.page-funcionalidades ul li{margin-bottom: 8px;}

.page-parceiros{min-height: 780px}
.page-parceiros ul{color: #011c44;position: relative;margin-bottom: 35px;padding-left: 150px; min-height: 107px;}
.page-parceiros ul li{margin-bottom: 10px}
.page-parceiros ul li.since-header {position: absolute;left: -20px;text-align: right;width: 119px;}
.page-parceiros .page-title{margin-top: 0; padding-top: 30px}

.since-header h2 {font: normal 70px 'mohaveregular';}
.since-header h4 {font: normal 25px 'mohaveregular';margin-bottom: -11px;text-align: left;}

.indicado-para{border: 3px solid #011c44; float: right; border-top: 0; width: 340px; font: normal 32px 'mohaveregular'; color:#fff;}
.indicado-para ul{width: 100%; font-size: 32px; color:#011c44;}

.page-suporte{background: #2bbdcc; color: #fff}
.page-suporte .box-promo{position: relative; top: 130px; width: 280px; text-align: center; padding: 30px; border-width: 8px;}
.page-suporte .content-col{width: 50%; padding: 99px 30px 0; float: left;}
.splash-suporte{background: url('../img/splash-features.jpg') no-repeat center 100%/cover; min-height: 580px}

.page-faleconosco{background: url('../img/splash-faleconosco.jpg') no-repeat center 100%/cover; min-height: 730px}
.page-faleconosco .page-title{border-color: #fff; color:#fff; padding-top: 30px; margin-top: 0px}
.page-faleconosco .page-title:after{background:#fff;}
.page-faleconosco .page-title span:after{border-color:#fff;}
.page-faleconosco label.error{margin: 0; padding:0; position: relative; top:-25px; color:rgba(255,255,255, 0.5); font-size:12px;}
.page-faleconosco form{max-width: 550px;  width: 100%; float: left; margin-top: 90px; clear: left}
.page-faleconosco input, textarea, button{width:100%; margin-bottom: 30px; padding: 5px 15px; color:#fff; background:none; border: 3px solid #fff; font-size: 19px}
.page-faleconosco textarea{height: 150px;}
.page-faleconosco button[type=submit]{float: right; width: 150px; background: #023c60; border: 0; font-family: 'mohaveregular'; font-size: 23px}
.page-faleconosco address{float: right; color:#fff; text-align: right; margin-top: 302px; font-size: 19px; line-height: 24px; position: relative;}
.page-faleconosco address:before{content: ""; display: block; position: absolute; left: 40px; top: -30px;width: 60px; height: 60px; background: url('../img/pin.png') no-repeat center;}
.page-faleconosco address a{color:#fff;}



@media screen and (max-width: 1023px){

    .page p{font-size: 15px}

    .container{max-width:768px; width: 100%;}
    .headercontainer nav a{margin-right: 30px;}

    .page-autocom .indicado-para{padding-bottom: 10px;}

    .page-title{font-size: 35px; width: 390px;}

    .page-funcionalidades li{font-size: 15px;}
    .container .page-funcionalidades ul{font-size: 15px}
    
    .indicado-para{width: 290px; font-size: 27px;}
    .container .indicado-para ul {margin-top: -13px;}
    .container .indicado-para ul li{font-size: 27px; margin-top: 0;}
    
    .page-suporte .content-col{padding-right:0;}

    .page-parceiros ul li.since-header{left: 5px;}
    .since-header h4{font-size: 18px}
    .since-header h2{text-align: left; font-size: 50px}
    .page-sobre .content{width: 70%;}

}


@media screen and (max-width: 767px){

    .for-mobile{display: block!important;}
    .for-desktop{display: none!important;}

    .headercontainer{height: 50px;}
    .headercontainer .logo{width: 90px; bottom: 3px;}

    .menu-wrapper {
        padding: 6px 10px 0 10px;
        position: absolute;
        right: 0;
        top: 9px;  
    }

    .menu-wrapper a {color: #fff;}
    .menu-wrapper .icon {float: right; width: 30px; margin: -2px 0 9px 8px;}
    .menu-wrapper .icon span {display: block; width: 100%; height: 4px; margin-bottom: 5px; background: #fff; border-radius:4px;}
    
    .headercontainer nav {
        position: fixed;
        bottom: 0;
        left: 0;
        right: auto;
        width: 100%;
        z-index: 10;
        float: none;
        padding: 10px;
        margin-left: 0;
        text-align: center;
        background: rgba(2, 60, 96, 0.94);
        -webkit-transform: translateY(100%);
        -moz-transform: translateY(100%);
        -ie-transform: translateY(100%);
        -o-transform: translateY(100%);
        transform: translateY(100%);
        -webkit-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;
    }

    .headercontainer nav.clicked{
        -webkit-transform: translateY(0); 
        -moz-transform: translateY(0); 
        -ie-transform: translateY(0); 
        -o-transform: translateY(0); 
        transform: translateY(0);  
    }

    .headercontainer nav a {display: block; padding: 5px; margin: 0; margin-bottom: 3px; padding-bottom: 1px;}
    .headercontainer nav a:after {
        content: "";
        width: 100%;
        height: 1px;
        background: #000;
        display: block;
        margin-bottom: 0px;
        margin-top: 10px;
        background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 1%, rgba(255,255,255,1) 45%, rgba(255,255,255,1) 52%, rgba(255,255,255,1) 53%, rgba(255,255,255,1) 62%, rgba(255,255,255,0) 100%);
        background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 45%,rgba(255,255,255,1) 52%,rgba(255,255,255,1) 53%,rgba(255,255,255,1) 62%,rgba(255,255,255,0) 100%);
        background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0) 1%,rgba(255,255,255,1) 45%,rgba(255,255,255,1) 52%,rgba(255,255,255,1) 53%,rgba(255,255,255,1) 62%,rgba(255,255,255,0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00848484', endColorstr='#00848484',GradientType=1 );
    }
    
    .container{max-width:500px;}
    .page-home .box-promo {width: 280px; left: calc(50% - 140px); top: calc(50% - 88px); font-size: 35px; line-height: 1.6; padding: 20px 30px;}
    .page-sobre .content{width: 100%;}
    .page-autocom .content{column-count: 1; -webkit-column-count: 1; -moz-column-count: 1;}
    .page-autocom .autocom-logo{width: 200px; margin:30px auto 0 }

    .indicado-para{display: none;}

    .page-funcionalidades .page-title{padding-top: 30px;}
    .page-funcionalidades ul{padding: 0;}

    .page-suporte .box-promo{ border-width: 5px; line-height: 1.6; width: 230px; font-size: 30px;}
    .page-suporte .content-col{width: 100%; padding-top: 20px;}
    .page-parceiros ul{width: 100%; padding: 5px; font-size: 12px; margin-bottom: 5px;}
    .page-parceiros ul li{margin-bottom: 4px;}
    .page-parceiros ul li.since-header{position: static; margin-bottom:5px;}


    .swiper-prev {left: 5px; background: url('../img/arrow-left.png') no-repeat center 100%/100%; width: 24px;}
    .swiper-next {right: 5px; background: url('../img/arrow-right.png') no-repeat center 100%/100%; width: 24px;}

    .since-header h4 {font-size: 12px; margin-bottom: -4px;}
    .since-header h2 {text-align: left; font-size: 30px;}
    .page-parceiros .swiper-container{ top: -20px; }

    .page-faleconosco address{margin-top: 32px;}

}

@media screen and (max-width: 500px){
    .container{max-width:320px;}
    .page-title {font-size: 25px; width: 250px;}