/* FONTES */
@font-face {
    font-family: 'CalibriLight';
    src: url('../fonts/Calibri-Light.woff2') format('woff2'),
        url('../fonts/Calibri-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Calibri';
    src: url('../fonts/Calibri.woff2') format('woff2'),
        url('../fonts/Calibri.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

/* CLEAR */
html, ul, li, p, h2, h3, button{margin:0px; padding: 0px;}
body{margin:0px; padding: 0px; font-family: 'Calibri', 'Arial'; font-size: 1.8em; color: #423f40;}
img, button {max-width:100%;}

/* FLEX*/ 

.container{position:relative; width:100%; max-width:1136px; margin: 0 auto; padding: 0px; box-sizing:border-box;}
.row{display: flex; flex-wrap: nowrap; flex-direction:row; justify-content: space-between;}
.meio{flex:50%;}

/* TOPO */

#topo{padding:20px 0 18px 0; position:fixed; background-color: #ffffff; width: 100%; z-index: 99999;}
#topo .container{position:relative; width:100%; max-width:1136px; margin: 0 auto;}

/* MENU */

nav{display:flex; flex-direction: row-reverse; height: 88px; line-height: 88px;}
nav .main_menu{padding: 0px; margin: 0px; font-size: 0.6em !important; display: block !important;}
nav .main_menu li{padding: 0px; margin: 0px 26px 0px 0px; display: inline-block; float: left; font-weight: bold;}
nav .main_menu li:last-child{margin: 0px;}
nav .main_menu li a{color:#000000; text-decoration: none; display: block; letter-spacing:1.0px;}
nav .main_menu li a:hover, nav .main_menu li a.ativo{color:#00b098;}

.slicknav_menu:first-child{display:none;}

/* WEBDOOR */

#webdoor{margin-bottom:30px; padding-top: 136px; width:100%;}
#slider_wd{height: 814px;}
#slider_wd li{height: 814px; color: #ffffff; font-weight: bold; font-size:2.4rem; display: flex; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; text-align: center;}
#slider_wd li p{margin-top:686px;}

/* SOBRE */

#sobre-texto{flex:50%; height: 578px;}
#sobre-texto h2{margin:50px 0px 20px 0px; color: #00b098; font-weight: bold; font-size:1.4em;}
#sobre-texto h2:first-child{margin-top: 0px;}
#sobre-texto div{padding-right:50px;}
#sobre-texto p{text-align: justify; font-size:0.7em; line-height: 24px;}

#sobre-imagem{flex:50%; height: 578px; background: url(../images/sobre.jpg); color: #FFFFFF; font-weight: bold; font-size: 0.95em; text-align: center; position: relative;}
#sobre-imagem p{display: block; width: 100%; height: 93px; line-height: 93px; position: absolute; bottom: 0; background-color:rgba(66, 63, 64, 0.87);}

/* PORQUE */

#porque-texto{flex:50%; height: 578px;}
#porque-texto h2{margin:56px 0px 26px 50px; color: #00b098; font-weight: bold; font-size:1.4em;}
#porque-texto ul{padding:0px 50px 0px 50px;}
#porque-texto li{font-size:0.7em; line-height: 24px; list-style-position: inside; margin-bottom: 28px;}

#porque-imagem{flex:50%; height: 578px;}

/* SETORES */

#setores{background-color: #423f40; padding:60px 0px 50px 0px; margin-top: 36px;}

#setores-atuacao{text-align: center; color: #ffffff; flex: 50%; padding-top: 84px;}
#setores-atuacao h3{font-weight: bold; font-size: 1.4em;}
#setores-atuacao button{background-color: #00b098; font-family: 'Calibri', 'Arial'; font-size: 1.0em; color: #ffffff; border: 0px; -webkit-border-radius: 10px; border-radius: 10px; padding: 10px; width: 198px; height: 60px; margin: 22px 0px 50px 0px;}
#setores-atuacao botoes:first-child{margin-right: 18px;}
#setores-atuacao p{font-family: 'CalibriLight', 'Arial'; font-size: 1.2em;}

#setores-lista{text-align: center; color: #00b098; flex: 50%;}
#setores-lista p{margin: 0px 0px 20px 0px; font-size: 0.9em;}
#setores-lista button{width: 494px; height: 44px; font-size: 0.7em; color: #ffffff; border: 0px; -webkit-border-radius: 10px; border-radius: 10px; background-color: #423f40; border:1px solid #727272; margin-bottom:7px;}

/* TRANSFORMACAO */

#transformacao{background-color: #00b098; font-family: 'Calibri', 'Arial'; font-size: 1.3em; font-weight: bold; color: #ffffff; text-align: center; height: 130px; line-height: 130px;}

/* VANTAGENS */

#vantagens{border-bottom: 50px solid #00b098; padding: 56px 0px 60px 0px; color: #423f40; margin-bottom: 88px;}
#vantagens-texto{text-align: center; margin-bottom: 44px; font-weight: bold;}
#vantagens-texto h3{font-size: 1.4em;}
#vantagens li{padding: 0px; margin: 0px; display: inline-block; float: left; list-style: none; text-align: center;}

/* SERVICOS */

#servicos-texto{text-align: center; margin-bottom: 22px; font-weight: bold;font-size: 1.4em;}
#servicos #consultoria{background: #e9e9e9; text-align: center; padding: 44px 0px 38px 0px;}
#servicos h4{font-size: 0.8em;}
#servicos p{font-size: 0.7em;}

#servicos .servico{text-align: center;background: #e9e9e9; margin: 0px; flex: 0 34%; text-align: center; height: 364px;}
#servicos .claro{background: #f1f1f1;}
#servicos .row{display: flex; flex-wrap: nowrap; flex-direction:row; justify-content: flex-start;}

/* SOLUCOES */

#solucoes{text-align: center; margin-bottom: 36px;}
#solucoes-texto{margin-top: 92px; margin-bottom: 54px; font-weight: bold; font-size: 1.4em;}
/*#solucao-1{background: url(../images/ecm-ged.jpg) left no-repeat;;}
#solucao-2{background: url(../images/bpms.jpg) right no-repeat;}*/
#solucao-1, #solucao-2{height: 502px;}
#solucoes h5{color: #00b098; font-weight: bold; font-size: 1.9em; margin: 0px;}
#solucoes h6{color: #00b098; font-weight: normal; font-size: 0.5em; margin: 4px 0px 22px 0px;}
#solucoes .subtitulo{font-weight: bold; font-size: 0.65em; line-height: 1.4em; margin:0px;}
#solucoes button{text-align: center; font-size: 0.7em; margin: 34px 0px 34px 0px; background-color: #00b098; color: #ffffff; border: 0px; -webkit-border-radius: 10px; border-radius: 10px; width: 212px; height: 36px;}
#solucoes .vantagens{font-size: 0.7em; line-height:1.6em;}

#notebook{-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-image: url(../images/notebook.jpg); height: 527px;}

/* SOFTWARES */

#softwares{background: #001743; color: #ffffff; padding: 86px 0px 100px 0px; text-align: center;}
#softwares h3{text-align: center; margin-bottom: 88px;}
#softwares h4{color: #00b098; text-transform: uppercase; font-weight: normal; font-size: 0.8em; line-height:1.2em;}
#softwares p{font-size: 0.6em; line-height:1.6em; margin-top: -10px;}
#softwares p span{color: #00b098; font-weight: bold; font-size: 1.2em;}
#softwares .funcionalidades{display: flex; flex-wrap: nowrap; flex-direction:row; justify-content: space-around;}
#softwares .funcionalidade{text-align: center;}
#softwares .funcionalidade figure{margin: 36px 0px 18px 0px;}
#softwares .funcionalidade p{font-size: 0.5em; margin: 0px;}
#softwares .bordabranca{border-right: 1px solid #ffffff;}

/* SOLUCAO INTEGRADA */

#integrada{margin-top: 66px; margin-bottom: 88px; text-align: center;}
#integrada h3{text-align: center; margin: 0px; color: #423f40;}
#integrada h4{background-color: #57585a; color: #ffffff; font-size: 0.75em; font-weight: normal; height: 48px; line-height: 48px; margin: 10px 0px 54px 0px;}
#integrada figure{margin: 0px;}

/* CONTATO */

#contato{background-color: #00b098; padding: 62px 0px 70px 0px; color: #423f40;}
#contato h3{text-align: center; font-weight: bold; font-size: 1.4em; margin-bottom: 35px;}
#contato figure{margin: 0px 0px 30px 0px;}
#contato p{font-size: 0.75em;}
#contato a{color: #423f40;}
#contato a:hover{color: #ffffff;}
#contato iframe{border: 0px; margin:28px 0px 0px 0px;}
#contato .cinquenta{padding-left: 50px; margin-top: 21px;}
#contato label{font-size:0.5em; padding: 0px; margin: 0px 0px 6px 0px;}
#contato input{display: block; border: 1px solid #423f40; width: 100%; height: 43px; line-height: 43px; font-family: 'Calibri', 'Arial'; font-size: 0.7em; color: #423f40;}
#contato textarea{display: block; border: 1px solid #423f40; width: 100%; height: 194px; line-height: 43px; font-family: 'Calibri', 'Arial'; font-size: 0.7em; color: #423f40;}
#contato #enviar{height: 68px; line-height: 68px; display: block; color: #ffffff; text-align: center; text-decoration: none; -webkit-border-radius: 10px; border-radius: 10px; background: url(../images/enviar.png) repeat-x; margin-top: 14px;}

/* FOOTER */

footer{background-color: #423f40; padding: 84px 0px 60px 0px; text-align: center; color: #ffffff;}
footer figure{margin: 0px;}
footer a{color: #ffffff; text-decoration: none;}
footer a:hover{color: #00b098;}
footer p{font-size: 0.6em; margin: 38px 0px 34px 0px;}
footer #copy{color: #8d8d8d; font-size: 0.5em;}
 
/* MOBILE */

@media screen and (max-width: 520px){

	.esconde{display: none !important;}
    .margemesquerda{margin-left: 20px;}
    .margemdireita{margin-right: 20px;}
    .realinha{flex-direction: column !important;}
    .block{display: block;}
    
     nav .main_menu{display: none !important;}

	.slicknav_menu{display:block !important; z-index: 100000; padding: 10px !important; position: fixed; top: 60px; right: 20px; background: #00b098 !important; font-size: 16px; box-sizing: border-box; color: #ffffff;}
    .slicknav_menu a{font-weight: bold; color: #ffffff; text-decoration: none; font-size: 16px;}
    
    .slicknav_btn{background: #00b098 !important;}
	.slicknav_nav{background: #00b098 !important;}
    .slicknav_nav li{list-style: none; padding: 8px 0px 8px 0px;}
    .slicknav_nav li a{color: #ffffff; font-size: 1.0rem;}

    #topo{padding:20px 0 18px 0; background-color: #ffffff; width: 100%; position: fixed; z-index: 99999;}
    #topo .container{margin: 0 auto;}
    
    #webdoor{margin-bottom:30px;}
    #slider_wd{height: 414px;}
    #slider_wd li{height: 414px; font-size:1.4rem;}
    #slider_wd li p{margin-top:300px;}
    
    #vantagens{border-bottom: 0px; margin-bottom: 0px;}
    
    #sobre-texto{height: auto;}
    #porque-texto{padding: 0px 20px 0px 0px;}
    #porque-texto h2{margin:36px 0px 26px 0px;}
    #porque-texto ul{padding:0px;}
    #porque-imagem{height: auto; margin-top: 36px;}
    
    #setores, #solucoes{padding: 0px 20px 20px 20px;}
    #setores-atuacao p{font-size: 1.0em; margin-bottom: 20px;}
    #solucao-1, #solucao-2{height: auto;}
    
    #transformacao {font-size: 1.0em; height: 100px; line-height: 50px;}
    
    #notebook{-webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-image: url(../images/notebook.jpg); width: 100%; height: 111px;}
    
    #softwares{padding: 20px;}
    #softwares h3{margin-bottom: 0px;}
    #softwares .bordabranca{border-right: 0px;}
    
    #integrada h4{font-size: 0.6em;height: 90px; line-height: 30px;}
    
    #contato .cinquenta{padding-left: 0px; margin: 20px 20px 0px 20px;}
    .servico{padding-bottom: 20px;}
}