/* Theme Name: Theme URI: http://agentecria.com/ Author: A Gente cria */ @charset "utf-8"; /* CSS Document */ /*RESET*/ html, 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;veratical-align: baseline;} ul{list-style-type:none} p, li, a, button, input, textarea, option, label, span{font-family: 'Basic', sans-serif;outline: none;} h1, h2, h3, h4, h5, h6{font-family: 'Basic', sans-serif;font-size:18px} /* HTML5 display-role reset for older browsers */ html{font-size:15px} body{width: 100%;background:#fff} .grid-container{max-width:1200px} .texto-branco{color: #fff;} .texto-preto{color: #000;} .texto-cinza{color: #656866;} a{color: #005f96;transition: all 0.2s;outline: none;} a:hover{color: #445361;transition: all 0.2s;} a:visited{color: #005f96;} a:visited:hover{color: #445361;} a:focus{color:inherit} noscript span{margin:5rem auto;padding:3rem;display:block;font-size: 1rem;text-align: center;font-weight:bold;color: #e10b0b;border:1px solid #e10b0b;background:rgba(255,11,11,0.5)} noscript span a{font-size: 1rem;font-weight: 700;} noscript span a:hover{color:orange !important} hr{border-top:1px solid #b2afaf;border-bottom: 1px solid #fff} /* ------------- header ------------- */ header{width:100%;z-index:9;} header h1 a{display: inline-block;} .txtFone{background: transparent url(imagens/icon_phone.svg) 15px center no-repeat;background-size:21px;color:#fff;padding:4px 15px 5px 50px;margin:7px 15px 0 10px;font-size:15px;display: none;height:25px;filter: brightness(70%);} header .menu{float:right;;z-index: 8} header .menu li{display: inline-block;} header .menu a{color:#445361;margin:0 10px;padding:15px 5px;font-size:1rem;font-weight: 400;} header .menu a:hover{color: #005f96} header a.is-active{color:#005f96;border-bottom:5px solid #005f96;} header .menu li:nth-last-child(2){} header .menu li:last-child{padding-left: 10px} header .menu li:last-child *{float: left;} header .menu li:last-child .txtFone{border-right: 1px solid #efefef;border-left: 1px solid #efefef;display: inline-block;} header .menu li:last-child a{color:#fff;padding:5px;margin:5px 0px 0 0;display: inline-block;text-indent: 5000px;overflow: hidden;width:30px;height:25px;filter: brightness(70%);} header .menu li:last-child a:hover{filter: brightness(50%);} header .menu li:last-child a:nth-of-type(1){background: transparent url(imagens/icon_facebook.svg) left center no-repeat;background-size:25px;} header .menu li:last-child a:nth-of-type(2){background: transparent url(imagens/icon_instagram.svg) left center no-repeat;background-size:35px;} .large{position:fixed;background: rgba(255,255,255,0.5);transition: all 0.5s;height: 100px} .large h1 img{width: 160px;transition: all 0.5s;padding:25px 0 0 0;} .large .menu{padding-top: 30px;transition: all 0.5s} .small{position:fixed;background: rgba(255,255,255,0.95);box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);transition: all 0.5s;height: 80px} .small h1 img{width: 130px;transition: all 0.5s;padding: 15px 0 0 0;} .small .menu{padding-top: 25px;transition: all 0.5s} /* ------------- conteudo ------------- */ main.strech{overflow:hidden} /* home */ #boxDestaques{height:465px;overflow:hidden;position:relative;border-bottom: 5px solid #f6f5f5;margin-top: 100px} #boxDestaques li{background-position:center top;background-repeat:no-repeat;height:465px;} #boxDestaques .cell:first-child p:first-child{font-size:1.5rem;color:#f6f5f5;font-weight: 500;margin-top: 8rem;padding: 10px 65px;-webkit-animation-delay: 0.5s; -moz-animation-delay: 0.5s; -o-animation-delay: 0.5s; animation-delay: 0.5s;line-height: 130%} #boxDestaques .cell:first-child p:first-child strong{font-size:2.5rem;font-weight: 700} #boxDestaques .cell:first-child p:last-child{font-size:2.1rem;color:#fff;font-weight: 500;padding: 5px 65px;-webkit-animation-delay: 0.8s; -moz-animation-delay: 0.8s; -o-animation-delay: 0.8s; animation-delay: 0.8s;line-height: 110%} #boxDestaques .cell:first-child p:last-child strong{font-size:3.1rem;font-weight: 700} #boxDestaques .cell p{-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;-visibility:hidden;} #boxDestaques figure{margin-top: 4.5rem;text-align:center;} #boxDestaques img{mix-blend-mode: multiply;} #boxDestaques ul button{outline:none;cursor:pointer;opacity: 0.2; } #boxDestaques ul button:hover{opacity: 0.8; } #boxDestaques .orbit-previous{background:transparent url(imagens/icon_dot_prev.svg) center no-repeat;height:20px;left:2%; background-size: 15px;box-sizing: none} #boxDestaques .orbit-next{background:transparent url(imagens/icon_dot_next.svg) center no-repeat;height:20px;right:2%; background-size: 15px} #boxDestaques .orbit-bullets{z-index:8;margin-top:-2rem;} #boxDestaques .orbit-bullets button{ background-color:transparent;border:1px solid rgba(0,0,0,0.2);width:0.8rem;height:0.85rem;cursor:pointer;} #boxDestaques .orbit-bullets button.is-active { background-color: #DA251D;opacity: 0.5} @-webkit-keyframes fadeInLeft { from { opacity:0; -webkit-transform: translatex(-10px); -moz-transform: translatex(-10px); -o-transform: translatex(-10px); transform: translatex(-10px); } to { opacity:1; -webkit-transform: translatex(0); -moz-transform: translatex(0); -o-transform: translatex(0); transform: translatex(0); } } @-moz-keyframes fadeInLeft { from { opacity:0; -webkit-transform: translatex(-10px); -moz-transform: translatex(-10px); -o-transform: translatex(-10px); transform: translatex(-10px); } to { opacity:1; -webkit-transform: translatex(0); -moz-transform: translatex(0); -o-transform: translatex(0); transform: translatex(0); } } @keyframes fadeInLeft { from { opacity:0; -webkit-transform: translatex(-100px); -moz-transform: translatex(-100px); -o-transform: translatex(-100px); transform: translatex(-100px); } to { opacity:1; -webkit-transform: translatex(0); -moz-transform: translatex(0); -o-transform: translatex(0); transform: translatex(0); } } #boxDestaques .cell p{ -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 1s; -moz-animation-delay: 1s; -o-animation-duration:1s; animation-delay: 1s; } /* compartilhado na home e na interna */ main section:not(#boxDestaques){padding:4rem 0;} main section h1{font-weight:400;color:#365170;font-size:2.35rem;margin:30px auto 50px auto;border-bottom:1px solid #ccc;width: 50%} main section h2{font-weight:600;} main section h3{font-weight:700;font-size:30px;line-height: 35px} main section h4{font-weight:700;font-size:25px;line-height: 35px} main section p{color:#365170;line-height: 20px;padding:30px 0;} .separator-center::after { position: relative !important;width: 5rem;border-bottom: 4px solid #005f96;margin: 1rem auto 0;} .btLink{color:#fff !important;background:#006699;padding:0.8rem 2.5rem;display:table;margin:10px auto;font-weight:700;border-radius:5px;font-size:0.9rem} .btLink:hover{background:#dc3439;} #boxServicos{background: #efeeee} #boxServicos h2{text-align: center;color:#405e6f;padding:20px 30px 0 30px;} #boxServicos p{text-align: center;padding: 10px 0} #boxServicos figure{text-align: center;margin-top: 25px;position: relative;} #boxServicos figure img{width: 100px} #boxServicos figure:after{content:' ';position: absolute;right: -30px;border:1px solid #ccc;height: 260px} #boxServicos .cell:last-child(5) figure:after{border:none} #boxEmpresa{background: #e9f1fc} #boxEmpresa h1{border-color: #fff} #boxEmpresa h3{padding:10px 20px 10px 0;color:#666;} #boxEmpresa p{padding:10px 20px 10px 0;} #boxEmpresa h4{padding:50px 0 0 0;color:#666; text-align: center} #boxEmpresa h4 + p{padding:10px 20px; text-align: center} #boxEmpresa figure{text-align: right;} #boxEmpresa figure img{border:5px solid #fff;box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);max-height: 500px} #boxSuporte{background:#2c5996;} #boxSuporte h2{color:#fff;font-size:35px;line-height: 55px;padding:15px 0;} #boxSuporte p{color:#fff;padding:0;line-height: 22px;font-size:18px;} #boxSuporte a{font-size:22px;padding:25px 55px 25px 95px;border-radius: 5px;display:table;margin:15px auto;color:#fff !important;position: relative;background-color:#dc3439} #boxSuporte a:after{content:'';filter:brightness(700%);background:transparent url(imagens/icon_download.svg) 0 0 no-repeat;background-size: 35px;width:35px;height:40px;position:absolute;left:35px;top:20px;} #boxSuporte a:hover:after{filter:brightness(100%)} #boxSuporte a:hover{background-color:#ffff;color:#dc3439 !important; } #boxSuporte figure{text-align: right;} #boxSuporte img{width: 200px} #boxAutorizada{text-align: center;} #boxAutorizada figure{display: inline-block;padding:0 25px;} #boxAutorizada figure img{width: 400px} #boxNews{background: #21435f} #boxNews h2{color:#fff;font-size:35px;line-height: 35px} #boxNews p{color:#fff;padding:0;} #boxNews form{text-align: right;} #boxNews form input{display: inline-block;width: 100%;margin: 5px;} #boxNews form .button{display: block !important;float: right;margin:5px;} #boxNews .g-recaptcha{float: right;} #boxNovidades{background: #f6f5f5} #blog #boxNovidades{padding-top: 100px !important} #boxNovidades .card{margin:15px 0;} #boxNovidades h2{padding:15px 15px 10px 15px;border-bottom: 1px solid #efefef} #boxNovidades p{padding:15px;font-size:13px;} #boxNovidades a:hover img{filter:brightness(80%);transition: all 0.2s} .videoWrapper {position: relative; padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px; height: 0; } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%;} #boxSingle{} #boxSingle h1{font-weight:400;color:#365170;font-size:2.35rem;margin:80px 0 20px 0;border-bottom:1px solid #ccc;width: 100%} #boxSingle h5{margin:20px 0 50px;display: inline-block;} #boxSingle .sharebts{display: inline-block;padding:10px;vertical-align: sub} #boxSingle a{color:#fff;padding:5px;margin:5px 0px 0 0;display: inline-block;text-indent: 5000px;overflow: hidden;width:30px;height:25px;filter: brightness(70%);} #boxSingle a:hover{filter: brightness(50%);} #boxSingle a.btFacebook{background: transparent url(imagens/icon_facebook.svg) left center no-repeat;background-size:25px;} #boxSingle a.btTwitter{background: transparent url(imagens/icon_twitter.svg) left center no-repeat;background-size:25px;} #boxSingle a.btLinkedin{background: transparent url(imagens/icon_linkedin.svg) left center no-repeat;background-size:25px;} #boxSingle a.btGoogleplus{background: transparent url(imagens/icon_googleplus.svg) left center no-repeat;background-size:25px;} #boxSingle p strong{font-weight: bold} #boxSingle ul{list-style-type: disc;color:#365170;margin-left: 30px} #boxSingle ol{color:#365170;margin-left: 30px} #boxSingle article a{color:#365170;text-decoration: underline;display: inline;} #boxPaginacao{padding:40px 0;text-align: center;} #boxPaginacao h2{display: none;text-align: center;} ul.nav-links{text-align: center;margin-bottom: 20px;text-align:center;} .nav-links *{display:inline-block !important;position: relative;width:30px;height:30px;font-size: 14px} .nav-links .page-numbers{color:#7A707B;font-weight: 300} .nav-links .page-numbers:hover{background-color:transparent;color:#009EDF} .nav-links .current{background: transparent;color:#7A707B !important;font-weight: 700} .nav-links .dots{color:#7A707B;} .nav-links .prev{} .nav-links .prev:hover{opacity: 0.5;} .nav-links .next{} .nav-links .next:hover{opacity: 0.5;} #boxContato{background:#2c5996;} #boxContato h1{color:#fff;border-color:#ccc;} #boxContato .separator-center::after { border-bottom: 4px solid #efefef;} #boxContato h5{color:#fff;font-weight: 600;padding:5px 35px;font-size: 20px} #boxContato p{color:#fff;padding:5px 0 5px 35px;} #boxContato p:nth-of-type(1){background: transparent url(imagens/icon_local.svg) left center no-repeat;background-size:20px;} #boxContato p:nth-of-type(2){background: transparent url(imagens/icon_phone.svg) left center no-repeat;background-size:20px;} #boxContato p:nth-of-type(3){background: transparent url(imagens/icon_whatsapp.svg) left center no-repeat;background-size:20px;} #boxContato a{color:#fff;padding:5px 0 5px 35px;margin:10px 20px 10px 0;display: inline-block;} #boxContato a:nth-of-type(1){background: transparent url(imagens/icon_facebook.svg) left center no-repeat;background-size:25px;} #boxContato a:nth-of-type(2){background: transparent url(imagens/icon_instagram.svg) left center no-repeat;background-size:35px;} #gmap{width: 100%;height:310px;opacity: 0.9;border-radius: 8px;margin-bottom: 30px} /* formularios */ .form input, .form textarea{border:none;background:rgba(255,255,255,0.8);color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem;border-radius: 8px;} .form select{border-radius: 8px;height:40px;color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem;padding:0.5rem;} .form select{-webkit-appearance: none;-moz-appearance: none;appearance: none;background:rgba(255,255,255,0.8) url(imagens/icon_select_form.svg) 98% center no-repeat;background-size: 15px} .form input::-webkit-input-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form input::-moz-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form input:-ms-input-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form input::placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form textarea::-webkit-input-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form textarea::-moz-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form textarea:-ms-input-placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form textarea::placeholder{color: #21435f;font-family: 'Basic', sans-serif;font-size:1rem} .form .button{background:rgba(234,185,0,1);color:#21435f;font-size:1rem;padding:0.7rem 1.5rem;font-weight:700;text-transform: uppercase;cursor:pointer !important;border-radius:8px;border:none;font-family: 'Roboto', sans-serif;} .form .button:hover{background:rgba(234,185,0,0.7);} form div.callout{clear:both;-webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);margin:0.5rem !important;text-align: left !important} form div.callout span{margin:0;padding: 2px !important;font-size: 0.95em;color: #999;text-transform:uppercase} form div.callout button.close-button span{margin:0;font-size:2rem;color:#999;} /* ------------- footer ------------- */ footer{border-bottom:50px solid #21435f;} #btTopo{display: block;position:fixed;right:45px;bottom:115px;width:45px;height:45px;border-radius: 50%;background:#fff url(imagens/icon_up.svg) center center no-repeat;background-size:20px;box-shadow:4px 0px 6px 0px rgba(0,0,0,0.16);text-indent: -5000rem;overflow: hidden;z-index: 9} #btTopo:hover{filter:grayscale(1);box-shadow:0 4px 6px 0 rgba(0,0,0,0.16);} #btWhats{display: block;position:fixed;right:45px;bottom:45px;width:210px;height:65px;color:#069309;border:1px solid #b3ceb3;font-size:16px;font-weight:700;line-height:120%;border-radius: 50px;padding:12px 65px 5px 25px;background:#fff url(imagens/icon_whatsapp_color.svg) 150px center no-repeat;background-size:50px;box-shadow:4px 0px 6px 0px rgba(0,0,0,0.16);z-index: 9} #btWhats:hover{filter:grayscale(1);box-shadow:0 4px 6px 0 rgba(0,0,0,0.16);} @media screen and (max-width : 1024px){ header .menu li:last-child{text-align: center;padding: 0} header .menu li:last-child *{float: none} header .menu li:last-child a{filter: brightness(100%);margin:10px 5px;} header .menu li:last-child span{display: none} header .txtFone{display: block;position: absolute;right:4rem;text-align: right;background-position: 45px center } header.large .txtFone{top:1.8rem;transition: all 0.4s} header.small .txtFone{top:1.0rem;transition: all 0.4s} /*INI config do menu mobile*/ .nav {font-weight: 900;left:0rem;width: 100%} /* menu */ .menu{display: none;position:absolute;background-color:rgba(0,95,150,0.8);width:100%;position: absolute !important} .large .menu.nav-active {top:6.5rem;} .small .menu.nav-active {top:5.2rem;} .menu.nav-active {display: block;padding:1rem;left:0;} .menu.nav-active li{display: block;text-align: center} .menu.nav-active a{display:inline-block;color:#fff;font-size:20px;text-align: center;padding:0.1rem;margin:1rem;} .menu.nav-active a:hover{color:#fff;opacity: 0.5} header a.is-active{border-bottom:5px solid #fff;} header ul.menu .txtFone{display: none !important} /*botao menu*/ .large .nav-mobile{top: 2.5rem;transition: all 0.4s;height: 4rem;} .small .nav-mobile{top: 1.5rem;transition: all 0.4s;height: 3.7rem;} .nav-mobile{cursor: pointer;position: absolute;right: 1.5rem;width: 3.2rem;border-radius: 5px;z-index:90;display: block; z-index: 11;} .nav-mobile .line{width: 35px;height: 4px;background-color: #005f96;display: block;margin: 5px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out; } .nav-mobile:hover{cursor: pointer;} .nav-mobile-open{border-radius: 0.5rem 0.5rem 0 0;margin-bottom: 1rem;background: rgba(0,95,150,0.8) !important;} .large .nav-mobile-open{padding:0.25rem 0.5rem 1rem 0.5rem;} .small .nav-mobile-open{padding:0.25rem 0.5rem 0.0rem 0.5rem;} .nav-mobile-open .line{background-color: #fff} .nav-mobile.is-active .line:nth-child(2){opacity: 0; } .nav-mobile.is-active .line:nth-child(1){ -webkit-transform: translateY(13px) rotate(45deg);-ms-transform: translateY(13px) rotate(45deg); -o-transform: translateY(13px) rotate(45deg);transform: translateY(13px) rotate(45deg); } .nav-mobile.is-active .line:nth-child(3){ -webkit-transform: translateY(-5px) rotate(-45deg);-ms-transform: translateY(-5px) rotate(-45deg); -o-transform: translateY(-5px) rotate(-45deg);transform: translateY(-5px) rotate(-45deg);} /*FIM config do menu mobile*/ #boxNews form input{display: inline-block;width: 100%;margin:5px;} } @media screen and (max-width : 840px){ #boxDestaques .cell:first-child p:first-child{font-size:1.2rem;margin-top: 6rem;padding:10px 0 5px 30px;line-height: 130%} #boxDestaques .cell:first-child p:first-child strong{font-size:2.3rem;} #boxDestaques .cell:first-child p:last-child{font-size:1.8rem;color:#fff;padding: 5px 0 5px 30px;line-height: 110%} #boxDestaques .cell:first-child p:last-child strong{font-size:2.8rem;} } @media screen and (max-width : 640px){ main section:not(#boxDestaques){padding:2rem 0;} main section h1{line-height: 100%;width: 80%;margin: 30px auto 30px auto;} #boxDestaques .cell:first-child p:first-child{font-size:1.2rem;margin-top: 2rem;padding:10px 0 5px 20px;line-height: 130%} #boxDestaques .cell:first-child p:first-child strong{font-size:2.3rem;} #boxDestaques .cell:first-child p:last-child{font-size:1.8rem;color:#fff;padding: 5px 0 5px 20px;line-height: 110%} #boxDestaques .cell:first-child p:last-child strong{font-size:2.8rem;} #boxDestaques figure{margin-top: 0.5rem;text-align:center;} #boxEmpresa p{padding:10px 10px 10px 0;} #boxSuporte h2{text-align: center;} #boxSuporte p{text-align: center;} #boxSuporte figure{text-align: center;} #boxNews h2{text-align: center;padding-bottom: 10px} #boxNews p{text-align: center;} #boxNews form{margin-top: 15px} #boxNews form .button{display: table;float: none;margin:5px auto;} #boxNovidades .card img{width: 100%} #btTopo{right: 10px;bottom:80px;} #btWhats{right:10px;bottom:20px;height:45px;width:45px;padding:12px 15px 5px 15px;background:#fff url(imagens/icon_whatsapp_color.svg) center center no-repeat;background-size:40px;} #btWhats span{display: none} }