/* 
cores:
Azul escuro: #011140;
Lilás: #8A4BA6;
light:  #f8f9fa;
*/

/* @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css"); */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&family=Roboto:wght@300;400;700&display=swap');

html {font-size: 100%; max-width: 100%; }
body {font-size: 100%; font-family: "Roboto", sans-serif; font-weight: 400; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; -ms-hyphens: auto; -webkit-hyphens: auto; hyphens: auto;}
body::before{position: absolute; content: ""; width: 100%; height: 100vh; background-color: rgba(0,0,0,0.5); z-index: 3; transition: all 0.2s ease;}



.back-show::before{display: block;}
.back-hidden::before{display: none;}
.bg-red{background-color: #ff2d36;}
.text-red{color: #ff2d36;}
.bg-gradient-light{background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(248,249,250,1) 100%) }
.border-red{border-color: #ff2d36 !important;}
.btn{transition: all 0.3s ease;}
.btn:focus {box-shadow: none;}
.btn:hover{transform: scale(1.05); background-color: #ff2d36 !important;}
.breadcrumb .small{font-size: 0.8rem; letter-spacing: -1px;}
.accordion-button{padding-left: 70px}
.accordion-button:focus{border: none; outline: 0; box-shadow: none;}
.accordion-button:not(.collapsed)::after{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E") !important;}
.accordion-button:not(.collapsed) {color: #242424 !important; font-weight: bold !important; background-color: #f8f9fa !important;}
.accordion-button::after{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E") !important; position: absolute !important; left: 0; width:  50px; height: 50px; background-color: red; background-size: 2.5rem; background-position: center;}
.page-item.active .page-link {color: #fff; background-color: #ff2d36 !important; border-color: #ff2d36 !important;}

a.mapboxgl-ctrl-logo { display:none; }
div.mapboxgl-ctrl-attrib-inner { display:none; } 
section#map div#mapa{height: 400px;}
.marker{width: 16px; height: 16px; background-color: #d9030b; border-radius: 50%; z-index: 100;}
.effect{width: 16px; height: 16px; background-color: #d9030b; border-radius: 50%; }

header.fixed-top{height: 140px;}
header div.topmenu{height: 80px;}
header div.topmenu ul > li{position: margin: 0 15px;}
header div.categories{height: 60px;}


header.topmenu-mobile div.fixed-top{height: 50px;}
header div.sidebar{width: 85vw; transition: all 0.3s ease; z-index: 3;}
header div.sidebar.hide{transform: translateX(-100%);}
header div.sidebar.show{transform: translateX(0);}
header div.sidebar a.nav-link{margin-top: 0; color: #242424;}

main.home{margin-top: 140px;}


main.home a.card:after{position: absolute; content: ""; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%); top: 0; z-index: 0;}
main.home div.card-body{z-index: 2;}

main.home section.featured a.card:before{position: absolute; content: ""; width: 80px; height: 75px; top: 0; right: 0; margin-top: -12px; background-image: url(../images/featured.png); background-repeat: no-repeat; background-size: contain;}

main.home section.blog a.card:after{position: absolute; content: ""; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 100%); top: 0; z-index: 0;}
main.home section.blog div.text-wrapper::before{position: absolute; content: ""; width: 53px; height: 56px; top: 0; left: 0; transform: translateY(-110%); background-image: url(../images/blog.png); background-repeat: no-repeat; background-size: contain;}

main.home section.about{margin: 130px 0 100px 0;}

main.home section.special div.discount{width: 125px; height: 60px; background-image: url(../images/discount.png); background-repeat: no-repeat; background-size: contain; margin-right: -5px;}

main.interna{margin-top: 140px;}
main.interna div.produtos{padding-bottom: 90px;}
main.interna div.produto {background-image: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(248,249,250,1) 100%); }
main.interna div.item-page{margin-top: 30px;}
main.interna div.item-page.quem-somos div.banner{height: 300px;}
main.interna div.item-page.quem-somos div.box{margin-top: -250px; margin-bottom: -60px; z-index: 2;}
main.interna div.item-page.quem-somos ol.breadcrumb li a,
main.interna div.item-page.quem-somos ol.breadcrumb li span{color: #FFF;}
main.interna div.item-page.quem-somos ol.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color: #FFF !important;}

main.interna div.item-page.simulacao div.banner{height: 450px;}
main.interna div.item-page.simulacao div.box{margin-top: -435px; margin-bottom: -60px; z-index: 2;}
main.interna div.item-page.simulacao ol.breadcrumb li a,
main.interna div.item-page.simulacao ol.breadcrumb li span{color: #FFF;}
main.interna div.item-page.simulacao ol.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color: #FFF !important;}

main.interna div.item-page.contato div.banner{height: 300px;}
main.interna div.item-page.contato div.box{margin-top: -220px; margin-bottom: -60px; z-index: 2;}
main.interna div.item-page.contato ol.breadcrumb li a,
main.interna div.item-page.contato ol.breadcrumb li span{color: #FFF;}
main.interna div.item-page.contato ol.breadcrumb .breadcrumb-item+.breadcrumb-item::before{color: #FFF !important;}


main.interna div.produto::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  font-size: .875rem !important;

}
::-moz-placeholder { /* Firefox 19+ */
  font-size: .875em !important;
}
:-ms-input-placeholder { /* IE 10+ */
  font-size: .875em !important;
}
:-moz-placeholder { /* Firefox 18- */
  color: pink;
}

/* Extra Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {

  main.home{margin-top: 50px;}
  main.interna{margin-top: 45px;}


}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) { 
  
  header div.categories .nav-link{color: #FFF;}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) { 
  header div.categories .nav-link{color: #FFF;}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {

  div.topinfo div.item + div.item::before{margin: 0 0.5rem;}
  header div.categories .nav-link{color: #FFF;}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
  header div.categories .nav-link{color: #FFF;}
}


@media screen and (prefers-reduced-motion:reduce) {
  .form-control{transition: all 0.3s ease !important;}
  .form-floating > label{transition: all 0.3s ease !important;}
  .btn{transition: all 0.3s ease !important;}
  .fade{transition: all 0.3s ease !important;}
  .collapsing{transition: all 0.3s ease !important;}
  .custom-switch .custom-control-label::after{transition: all 0.3s ease !important;}
  .custom-range::-webkit-slider-thumb{-webkit-transition: all 0.3s ease !important; transition: all 0.3s ease !important;}
  .custom-range::-moz-range-thumb{-moz-transition: all 0.3s ease !important; transition: all 0.3s ease !important;}
  .custom-range::-ms-thumb{-ms-transition: all 0.3s ease !important; transition: all 0.3s ease !important;}
  .custom-control-label::before,
  .custom-file-label,
  .custom-select{transition: all 0.3s ease !important;}
  .badge{transition: all 0.3s ease !important;}
  .progress-bar{transition: all 0.3s ease !important;}
  .progress-bar-animated{-webkit-animation:none; animation:none}
  .modal.fade .modal-dialog{transition: all 0.3s ease !important;}
  .carousel-item{transition: all 0.3s ease !important;}
  .carousel-fade .active.carousel-item-left,
  .carousel-fade .active.carousel-item-right{transition: all 0.3s ease !important;}
  .carousel-control-next,
  .carousel-control-prev{transition: all 0.3s ease !important;}
  .carousel-indicators li{transition: all 0.3s ease !important;}
}