body{
font-family: "Roboto";
overflow-x: hidden;
font-display: swap;
}
section{
margin: 30px 0;
width: 100%;
padding: 0 30px;
}
img{
width: 100%;
height: 100%;
}
header .header-nav-menu{
background-color: var(--secondary-color);
border-bottom: 5px solid var(--primary-color);
}
header .header-nav-menu .logo{
height: 40px;
width: auto;
}
header .header-nav-menu .nav-menu-collapse{
justify-content: end;
margin: -0.5rem -1rem;
padding: 0 1rem;
text-align: end;
background-color: var(--secondary-color);
}
header .header-nav-menu .navbar-toggler{
color: white;
}
header .header-nav-menu .nav-link{
color: white !important;
}
header .header-banner{
display: block;
position: relative;
height: calc(100vh - 60px);
background-image: url(//carangopneus.com/wp-content/themes/Carango/assets/_images/banner_mobile.webp);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
@media (min-width: 576px) { 
header .header-banner{
background-image: url(//carangopneus.com/wp-content/themes/Carango/assets/_images/banner_desktop.webp);
}
}
.title-left, .title-left img{
height: 19px;
}
.title-center{
font-weight: bolder;
font-style: italic;
font-size: 1.5rem;
margin: 0 10px;
}
.title-right{
height: 40px;
}
.title-right img{
height: 30px;
margin-bottom: 10px;
}
.title-left img, .title-right img{
display: block;
}
@media (min-width: 576px) { 
.title-center{
font-size: 1.75rem !important;
}
.title-right img{
width: auto;
}
}
.row_bat-esc{
display: none;
}
.carousel_bat-esc{
display: block;
}
@media (min-width: 768px) { 
.row_bat-esc{
display: flex;
}
.carousel_bat-esc{
display: none;
}
}
.accordion-servicos .card-header{
background-color: var(--ternary-color);
padding: 0;
}
.accordion-servicos .card button{
color: white;
font-size: 1rem;
width: 100%;
background: transparent;
text-align: initial;
padding: 0.3rem 1.25rem;
}
.carousel-indicators{
position: relative;
margin-top: 1rem;
bottom: 0;
}
.carousel-indicators li{
background-color: var(--ternary-color);
cursor: pointer;
}
.carousel-indicators li.active{
background-color: var(--primary-color);
} .link_social{
position: absolute;
overflow: hidden;
right: 0;
transform: translateY(-50%);
width: 50px;
height: 50px;
border-radius: 10px 0 0 10px;
padding: .5rem;
transition: all .3s ease;
z-index: 999;
}
.link_social_network, .link_top{
background-color: var(--ternary-color);
color: white;
}
.link_social_network:hover{
width: 160px;
}
.link_whatsapp{
background-color: #25D366;
position: fixed;
color: white;
bottom: 30px;
animation: whats 4s infinite;
}
.link_whatsapp:hover{
width: 160px;
animation: none;
}
.link_instagram{
bottom: 195px;
}
.link_phone{
bottom: 140px;
}
.link_mail{
bottom: 85px;
}
.link_top{
bottom: 85px;
position: fixed;
cursor: pointer;
z-index: 998;
}
.link_top i{
-moz-transform: scaleX(-1);
-o-transform: scaleX(-1);
-webkit-transform: scaleX(-1);
transform: scaleX(-1);
}
.link_top:hover{
height: 70px;
}
.modal_telefone input {
border: 0;
padding: 0;
width: 120px;
}
@keyframes whats {
0%   {width: 50px;}
5%   {width: 100px;}
10%  {width: 100px;}
15%  {width: 100px;}
20%  {width: 50px;}
25%  {width: 55px;}
30%  {width: 50px;}
35%  {width: 55px;}
40%  {width: 50px;}
45%  {width: 55px;}
50%  {width: 50px;}
55%  {width: 55px;}
60%  {width: 50px;}
65%  {width: 55px;}
70%  {width: 50px;}
75%  {width: 55px;}
80%  {width: 50px;}
85%  {width: 55px;}
90%  {width: 50px;}
95%  {width: 55px;}
100% {width: 50px;}
}:root {
--primary-color: #EE1D23;
--primary-hover-color: #b5181d;
--secondary-color: #000000;
--secondary-hover-color: #262626;
--ternary-color: #262626;
--ternary-hover-color: #000000;
}
.bg-primary{
background-color: var(--primary-color)!important;
}
.bg-secondary{   
background-color: var(--secondary-color)!important;
}
.bg-ternary{
background-color: var(--ternary-color)!important;
}
.bg-whitesmoke{
background-color: whitesmoke;
}
.text-primary{
color: var(--primary-color)!important;
}
.text-secondary{   
color: var(--secondary-color)!important;
}
.text-ternary{
color: var(--ternary-color)!important;
}
.text-aqua{
color: aqua !important;
}
.text-aqua:hover{
color: aquamarine !important;
}
.btn-primary{
background-color: var(--primary-color)!important;
color: white;
}
.btn-primary:hover{
background-color: var(--primary-hover-color)!important;
color: whitesmoke;
}
.btn-secondary{   
background-color: var(--secondary-color)!important;
color: white;
}
.btn-green{
background-color: #25D366 !important;
color: white;
}
.btn-blue{
background-color: #2b4170 !important;
color: white;
}
.btn-secondary:hover{   
background-color: var(--secondary-hover-color)!important;
color: whitesmoke;
}
.btn-outline-primary{
background-color: var(--primary-color)!important;
color: white;
border: solid 2px var(--secondary-color)!important;
}
.btn-outline-primary:hover{
background-color: var(--primary-hover-color)!important;
color: whitesmoke;
border: solid 2px var(--secondary-hover-color)!important;
}
.btn-outline-secondary{   
background-color: var(--secondary-color)!important;
color: white;
border: solid 2px var(--primary-color)!important;
}
.btn-outline-secondary:hover{   
background-color: var(--secondary-hover-color)!important;
color: whitesmoke;
border: solid 2px var(--primary-hover-color)!important;
}
.border-primary{
border: solid 2px  var(--primary-color)!important;
}
.border-secondary{
border: solid 2px var(--secondary-color)!important;
}
.border-ternary{
border: solid 2px  var(--ternary-color-color)!important;
}
.border-top-primary{
border-top: solid 3px var(--primary-color)!important;
}
.border-top-secondary{
border-top: solid 3px var(--secondary-color)!important;
}
.shadow-primary{
box-shadow: 5px .5rem 1rem  var(--primary-color)!important;
}
.shadow-secondary{
box-shadow: 5px .5rem 1rem  var(--secondary-color-color)!important;
}.text-small{
font-size: .7rem;
}
a.text-decoration-none{
text-decoration: none;
}
.h-80{
height: 80%;
}
.h-20{
height: 20%;
}
.top{
top: 10px;
}
.right{
right: 10px;
}
.bottom{
bottom: 10px;
}
.left{
left: 10px;
}
.top-0{
top: 0;
}
.right-0{
right: 0;
}
.bottom-0{
bottom: 0;
}
.left-0{
left: 0;
}
.top-50{
top: 50%;
}
.right-50{
right: 50%;
}
.bottom-50{
bottom: 50%;
}
.left-50{
left: 50%;
}
.top-50, .bottom-50{
transform: translateY(-50%);
}
.right-50, .left-50{
transform: translateX(-50%);
}  
.img-cover{
object-fit: cover;
}
.img-cover-top{
object-position: top;
}
.img-cover-bottom{
object-position: bottom;
}
.img-cover-center{
object-position: center;
}
.img-cover-bottom{
object-position: right;
}
.img-cover-bottom{
object-position: left;
}
.z-1{
z-index: 1;
}
.z-2{
z-index: 2;
}
.z-3{
z-index: 3;
}
.z-4{
z-index: 4;
}
.z-5{
z-index: 99;
}
@media (min-width: 576px) { 
.top-xs-50, .bottom-xs-50 {
transform: translateY(-50%);
}
.right-xs-50, .left-xs-50{
transform: translateX(-50%);
}  
.top-xs-0{
top: 0;
}
.right-xs-0{
right: 0;
}
.bottom-xs-0{
bottom: 0;
}
.left-xs-0{
left: 0;
} 
.top-xs-50{
top: 50%;
}
.right-xs-50{
right: 50%;
}
.bottom-xs-50{
bottom: 50%;
}
.left-xs-50{
left: 50%;
} 
.position-xs-absolute{
position: absolute;
}
}
@media (min-width: 768px) { 
.top-sm-50, .bottom-sm-50{
transform: translateY(-50%);
}
.right-sm-50, .left-sm-50{
transform: translateX(-50%);
}  
.top-sm-0{
top: 0;
}
.right-sm-0{
right: 0;
}
.bottom-sm-0{
bottom: 0;
}
.left-sm-0{
left: 0;
} 
.top-sm-50{
top: 50%;
}
.right-sm-50{
right: 50%;
}
.bottom-sm-50{
bottom: 50%;
}
.left-sm-50{
left: 50%;
} 
.position-sm-absolute{
position: absolute;
}
}
@media (min-width: 992px) { 
.top-md-50, .bottom-md-50{
transform: translateY(-50%);
}
.right-md-50, .left-md-50{
transform: translateX(-50%);
}  
.top-md-0{
top: 0;
}
.right-md-0{
right: 0;
}
.bottom-md-0{
bottom: 0;
}
.left-md-0{
left: 0;
} 
.top-md-50{
top: 50%;
}
.right-md-50{
right: 50%;
}
.bottom-md-50{
bottom: 50%;
}
.left-md-50{
left: 50%;
}
.position-md-absolute{
position: absolute;
}
}
@media (min-width: 1200px) { 
.top-lg-50, .bottom-lg-50{
transform: translateY(-50%);
}
.right-lg-50, .left-lg-50{
transform: translateX(-50%);
}  
.top-lg-0{
top: 0;
}
.right-lg-0{
right: 0;
}
.bottom-lg-0{
bottom: 0;
}
.left-lg-0{
left: 0;
} 
.top-lg-50{
top: 50%;
}
.right-lg-50{
right: 50%;
}
.bottom-lg-50{
bottom: 50%;
}
.left-lg-50{
left: 50%;
}
.position-lg-absolute{
position: absolute;
}
}
@media (min-width: 1400px) { 
.top-xl-50, .bottom-xl-50{
transform: translateY(-50%);
}
.right-xl-50, .left-xl-50{
transform: translateX(-50%);
}  
.top-xl-0{
top: 0;
}
.right-xl-0{
right: 0;
}
.bottom-xl-0{
bottom: 0;
}
.left-xl-0{
left: 0;
} 
.top-xl-50{
top: 50%;
}
.right-xl-50{
right: 50%;
}
.bottom-xl-50{
bottom: 50%;
}
.left-xl-50{
left: 50%;
}
.position-xl-absolute{
position: absolute;
}
}@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Regular.ttf);
font-display: swap;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Bold.ttf);
font-display: swap;
font-weight: bold;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Black.ttf);
font-display: swap;
font-weight: bolder;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Medium.ttf);
font-display: swap;
font-weight: 500;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Light.ttf);
font-display: swap;
font-weight: 300;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Thin.ttf);
font-display: swap;
font-weight: 100;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-Italic.ttf);
font-display: swap;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-BoldItalic.ttf);
font-display: swap;
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-BlackItalic.ttf);
font-display: swap;
font-weight: bolder;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-MediumItalic.ttf);
font-display: swap;
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-LightItalic.ttf);
font-display: swap;
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: local(Roboto), url(//carangopneus.com/wp-content/themes/Carango/assets/_fonts/Roboto-ThinItalic.ttf);
font-display: swap;
font-weight: 100;
font-style: italic;
}
.font-Roboto {
font-family: 'Roboto';
}