@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap');
/*
1. - # RESET - (Reset de CSS)
1.1 - ## NAV -
1.1.1 - ### NAV MOBILE -
2. - # GLOBAL - (CSS Global do site, vai ser usado na maioria das páginas)
3. - # HEADER -
4. - # FOOTER -
*/

/*--------------------------------------------------------------
1. # RESET
--------------------------------------------------------------*/

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section {
display: block;
}

body {
overflow-x: hidden;
margin: 0px;
padding: 0px;
font-family: "Roboto";
}

p {
line-height: 20px;
margin-top: 15px;
margin-bottom: 15px;
}

a {
text-decoration: none;
}

ul {
padding: 0;
}

ul, li {
list-style: none;
}

hgroup > h1,h2 {

}

.assistive-text {
display: none;
}

/*--------------------------------------------------------------
1.1 ## NAV
--------------------------------------------------------------*/
.site-content nav {
clear: both;
line-height: 2;
overflow: hidden;
}
.main-navigation {
background: #333333;
}
.main-navigation li {
margin-top: 24px;
font-size: 12px;
}
.main-navigation a {
color: #fff;
}
.main-navigation a:hover,
.main-navigation a:focus {
color: #21759b;
}
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: none;
}
.main-navigation ul.nav-menu.toggled-on,
.menu-toggle {
display: inline-block;
}

/*--------------------------------------------------------------
1.1.1 ### NAV MOBILE
--------------------------------------------------------------*/

@media screen and (min-width: 600px) {
.main-navigation ul.nav-menu,
.main-navigation div.nav-menu > ul {
display: inline-block !important;
text-align: left;
width: 100%;
}
.main-navigation ul {
margin: 0;
text-indent: 0;
}
.main-navigation li a,
.main-navigation li {
display: inline-block;
text-decoration: none;
}
.main-navigation li a {
border-bottom: 0;
color: #fff;
line-height: 3.692307692;
text-transform: uppercase;
white-space: nowrap;
}
.main-navigation li a:hover,
.main-navigation li a:focus {
color: #4DA6FF;
}
.main-navigation li {
margin: 0 25px 0 0;
position: relative;
}
.main-navigation li ul {
margin: 0;
padding: 0;
position: absolute;
top: 100%;
z-index: 1;
height: 1px;
width: 1px;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
}
.main-navigation li ul ul {
top: 0;
left: 100%;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li:focus > ul,
.main-navigation .focus > ul {
border-left: 0;
clip: inherit;
overflow: inherit;
height: inherit;
width: inherit;
}
.main-navigation li ul li a {
background: #efefef;
border-bottom: 1px solid #ededed;
display: block;
font-size: 11px;
line-height: 2.181818182;
padding: 8px 10px;
width: 180px;
white-space: normal;
}
.main-navigation li ul li a:hover,
.main-navigation li ul li a:focus {
background: #e3e3e3;
color: #444;
}
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a,
.main-navigation .current_page_item > a,
.main-navigation .current_page_ancestor > a {
color: #4DA6FF;
font-weight: bold;
}
.menu-toggle {
display: none;
}
}

/*--------------------------------------------------------------
# GLOBAL CSS
--------------------------------------------------------------*/
.col10 {
width: 10%;
}

.col15 {
width: 15%;
}

.col20 {
width: 20%;
}

.col30 {
width: 30%;
}

.col33 {
width: 33.33%;
}

.col40 {
width: 40%;
}

.col50 {
width: 50%;
}

.col55 {
width: 55%;
}

.col60 {
width: 60%;
}

.col65 {
width: 65%;
}

.col70 {
width: 70%;
}
.col80 {
width: 80%;
}

.col90 {
width: 90%;
}

.col100 {
width: 100%;
}

.left {
float: left;
}

.right {
float: right;
}

.clearfix {
clear: both;
}

.m-auto {
margin: auto;
}

.lock {
width: 1020px;
margin: auto;
}

.space {
height: 50px;
}

.t-right {
text-align: right;
}

.t-left {
text-align: left;
}

.t-center {
text-align: center;
}

/*--------------------------------------------------------------
# HEADER
--------------------------------------------------------------*/
.titulo-topo{
	color: #6b6b6b;
	font-size: 14px;
	font-weight: 400;
	letter-spacing: 2px;
	text-transform: uppercase;
	font-family: 'Roboto', sans-serif;
	padding-top: 30px;
}
.infos-topo span a{
	text-decoration: none;
	color: #6b6b6b;
	font-family: 'Roboto', sans-serif;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 2px;
}
.infos-topo span a:hover{
	color: #ffde00;
}
.logo{
	padding-bottom: 25px;
}
/*--------------------------------------------------------------
# CORPO
--------------------------------------------------------------*/
.banner .titulo-banner h1, .banner .titulo-banner h2{
	color: white;
	text-align: center;
	font-family: 'Roboto', sans-serif !important;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 32px;
	letter-spacing: 2px;
}
.banner .titulo-banner h1 span, .banner .titulo-banner h2 span{
	text-transform: none;
	font-size: 28px;
	font-weight: 300;
}
.banner .texto-banner{
	color: white;
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	font-style: italic;
	letter-spacing: 2px;
	text-align: center;
	line-height: 1.5;
}
.formulario{
	background: #f7f7f7;
	padding-top: 25px;
}
.formulario h2{
	text-transform: uppercase;
	font-family: 'Roboto', sans-serif;
	color: #333333;
	font-size: 18px;
	letter-spacing: 2px;
	font-weight: 300;
}
.formulario h2 i{
	color: #004890;
	padding-right: 10px;
}
.formulario input[type="text"], .formulario input[type="email"], .formulario input[type="tel"], .formulario textarea{
	width: 100%;
	border: 1px solid #333333;
	border-radius: 30px;
	background: none;
	font-size: 12px;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	padding-left: 8px;
	margin-bottom: 6px;
	letter-spacing: 2px;
} 
.formulario textarea{
	height: 27px;
	resize: none;
}
::-webkit-input-placeholder{ 
	color:#333333; 
}
input:-moz-placeholder{ 
	color:#333333; 
}
textarea:-moz-placeholder{ 
	color:#333333; 
}
.formulario input[type="submit"]{
	background: #ffde00;
	border-radius: 30px;
	color: white;
	font-family: 'Roboto', sans-serif;
	border: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	padding: 5px 30px;
	cursor: pointer;
}
.formulario input[type="submit"]:hover{
	background: #004890;
}
.video{
	margin-top: 60px;
	margin-bottom: 60px;
}
.titulos h2{
	color: #333333;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	font-size: 18px;
	text-transform: uppercase;
}
.titulos h2 .subtitulo{
	font-weight: 700;
	display: block;
	letter-spacing: 2px;
}
.servicos{
	padding-top: 25px;
}
.servicos ul li{
	display: inline-flex;
	margin-bottom: 35px;
}
.servicos ul li figure{
	padding: 0 10px;
}
.servicos h3, .produtos h3{
	color: #0c5095;
	font-family: 'Roboto', sans-serif;
	font-size: 15px;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 2px;
}
.servicos span{
	color: #333333;
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	font-style: italic;
	letter-spacing: 2px;
	text-align: center;
	line-height:0;
}
.pneu img{
	padding-top: 55px;
	padding-left: 15px;
}
 a.botao-produto {
 	line-height: 35px;
	background: #004890;
	border-radius: 30px;
	color: white;
	font-family: 'Roboto', sans-serif;
	border: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	padding-left: 30px;
	padding-right: 30px;
	text-decoration: none;
	display: inline-block;
}
.botao-produto2 a{
	background: #004890;
	border-radius: 30px;
	color: white;
	font-family: 'Roboto', sans-serif;
	border: 0;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 2px;
	padding: 10px 30px;
	text-decoration: none;
	display: inline-block;
	margin-top: 25px;
	margin-bottom: 25px;
}
a.botao-produto-wpp {
	width: 35px;
	line-height: 35px;
	background: #368e00;
	border-radius: 50%;
	color: white;
	font-size: 16px;
	text-decoration: none;
	text-align: center;
	display: inline-block;
}
a.botao-produto:hover, .botao-produto2 a:hover{
	background: #fbe20b;	
}
.produtos h3{
	margin-bottom: 25px;
}
.produtos ul li{
	margin-bottom: 35px;
}
.produtos h2{
	padding-bottom: 25px;
}
.sobre span, .obrigado, .video span{
	font-weight: 300;
	font-size: 13px;
	font-family: 'Roboto', sans-serif;
	color: #333333;
	text-align: justify;
}
.video span{
	margin-bottom: 20px;
	display: block;
}
.video h2{
	padding-top: 15px;
}
.trava-interna{
	width: 700px;
	float: right;
}
.sobre img{
	width: 100%;
	height: auto;
}
.sobre{
	 background: #f7f7f7;
}
.sobre h2{
	margin-top: 25px;
}
.caminhao img{
	padding-top: 45px;
}
.video-yt{
	padding-top: 45px;
}
.video-yt iframe{
	padding-top: 25px;
}
/*--------------------------------------------------------------
# FOOTER
--------------------------------------------------------------*/
footer{
	padding-top: 15px;
}
.infos-footer h4{
	font-size: 13px;
	font-family: 'Roboto', sans-serif;
	font-style: italic;
	text-transform: uppercase;
	padding-top: 25px;
}
.infos-footer span, .infos-footer span a, .infos-footer a{
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	color: #333333;
	text-decoration: none;
}
.infos-footer a:hover{
	color: #fbe20b;
}
.redes i{
	font-size: 18px;
	border-radius: 30px;
	width: 35px;
	height: 35px;
	border: 1px solid #b5b5b5;
	padding: 8px;
    text-align: center;
}
.redes i:hover{
	background: #b5b5b5;
	color: #333333;
}
.frase-footer span{
	font-weight: 700;
	display: block;
    padding-top: 25px; 
}
.direitos{
	font-family: 'Roboto', sans-serif;
	font-size: 12px;
	color: #333333;
	font-weight: 300;
	padding-top: 25px;
}
.cc-color-override--760967211 .cc-btn:hover{
	text-decoration: none !important;
}
/*--------------------------------------------------------------
# WHATSAPP
--------------------------------------------------------------*/
.calbuttons{
    position: fixed;
    right: 0;
    top: 8%;
    z-index: 999;
}
.calbuttons ul li a{
	width: 50px;
    height: 50px;
    line-height: 50px;
    display: block;
    text-align: center;
    color: #fff;
    background: #2e8006;
    margin-bottom: 1px;
    font-size: 18px;
    transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
	border-top-left-radius: 15px;
	border-bottom-left-radius: 15px;
}
.calbuttons ul li a:hover{
    background: #236203;
    transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
}
.fa{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.fa-whatsapp:before{
content: "\f232";
}
/*--------------------------------------------------------------
# VERSÃO RESPONSIVA
--------------------------------------------------------------*/
@media only screen and (max-device-width: 1024px){
	.trava-interna{
		width: 100%;
	}
	.sobre img{
		display: none;
	}
	.pneu img, .servicos img{
		width: 100%;
		height: auto;
	}
	.servicos ul li{
		display: block;
	}
	.servicos ul li img{
		display: none;
	}
	.logo img{
		width: 100%;
		height: auto;
	}
	.produtos img{
		width: 100%;
		height: auto;
	}
	.botao-produto a{
		display: block;
	}
	.video iframe{
		width: 100%;
		height: auto;
	}
}
/*WhatsApp*/
a.tel-header {
	width: 400px;
	/* float: left; */
	position: fixed;
	right: -247px;
	top: 42px;
	background-color: #368e00;
	z-index: 999999;   
	transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
}
a.tel-header img {
	float: left;
}
a.tel-header:hover{
	margin-right: 247px;
	transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
}
span.tel-header-hover {
	position: relative;
	width: 245px;
	line-height: 79px;
	background-color: #368e00;
	border-left: 1px solid #FFF;
	color: #fff;
	font-weight: bold;
	font-size: 30px;
	text-align: center;
	float: left;
}