:root {
   --gray: #747373;
   --grayLight: #c2c2c2;
   --black: #000000;
   --white: #ffffff;
   --primary: #ca2027;
   --secondary: #363535;
   --lightGrey: #fafafa;
}

*, *:before, *:after {
   box-sizing: border-box; 
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
}


body{
   color: var(--gray) !important;
   font-family: "Montserrat", sans-serif;
   
}

@media (min-width: 1199.98px){
   section{padding-top:50px; padding-bottom:50px;}
}

.container-fluid{max-width:1920px !important;}

/* NAVBAR
---------------------------------------------------*/
#mainNav {
   background-color: transparent !important;
   transition:ease all .4s !important;
   box-shadow: none !important;
}
#mainNav.navbarShrink {
   padding-top: 1.5rem !important;
   padding-bottom: 1.5rem !important;
   background-color: var(--secondary) !important;
   opacity: 0.95 !important;
}

#mainNav .nav-link {color:#eeeeee !important;}
#mainNav .nav-link:hover {color:#ffffff !important;}
/* end ---*/


/* Footer
----------*/
.back-top{  
   z-index: 999 !important;
   width: 50px; height: 50px;
   right: 2%;
   bottom: 5%;
   opacity: 0 ;
   background-color: var(--primary) !important;
   transition: ease all .3s;
   
}

.back-top.show {
   opacity: 1;
}
.back-top:hover{background-color:var(--secondary) !important;}


/* end ---*/


/* Home
---------------------------------------------------*/
#banner .splide__pagination {
   bottom: 1.5em;
}
#banner .splide__pagination__page {
   background: transparent;
   border: 4px solid var(--primary);
   height: 14px;
   width: 14px;
   opacity: 0.8;
   margin: 5px;
}
#banner .splide__pagination__page.is-active {
   background: var(--primary);
   transform: scale(1.4);
   border: 10px solid var(--primary);
   opacity: 1 !important;
}

.splide__arrow{
   width:40px !important; 
   height: 40px !important;
   z-index: 999; 
   opacity: 1 !important;
}
.splide__arrow--prev svg {
   transform: none !important;
}
#banner button#thumbPrev{
   width:40px !important; 
   height: 40px !important;
   z-index: 999; 
   left:15px;
}

.splide__arrow--next {
   right: 1em;
}
.splide__arrow svg {
   fill: #ffffff;
   height: 1em !important;
   width: 1em !important;
}

.splide__track--nav>.splide__list>.splide__slide.is-active {
   border:  none !important;
}




.servicesSection .serviceContainer .bgServiceContainer{
   background-color: var(--secondary);
   transition: ease all .3s;
}
.servicesSection .serviceContainer:hover .bgServiceContainer{
   background-color: var(--primary);
}
.servicesSection .serviceContainer .bgMixBlend{
   mix-blend-mode: lighten;
}
.servicesSection .serviceContainer:hover .bgMixBlend{
   mix-blend-mode: multiply !important;
}

/* end ---*/



/* contactos
---------------------------------------------------*/
#mapa
{
   filter: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="g"><feColorMatrix type="matrix" values="0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0.3 0.3 0.3 0 0 0 0 0 1 0"/></filter></svg>#g');
   -webkit-filter: grayscale(100%);
   filter: grayscale(100%);    
   filter: progid:DXImageTransform.Microsoft.BasicImage(grayScale=1);
}
/* end ---*/




/* HELPERS
---------------------------------------------------*/
.bannerPages{
   background: linear-gradient(to right, rgb(33,37,41) 0%,rgb(90, 90, 90) 100%) !important;
}
.btnHovergrow{
   width: fit-content !important;
   transition: ease all .3s;
}
.btnHovergrow div{transition: ease all .3s; width: 20px;}

.bgServiceContainer:hover .btnHovergrow div, .btnHovergrow:hover div{
   width: 100%;
}
.bgServiceContainer:hover .btnHovergrow span.transition-03, .btnHovergrow:hover span.transition-03{
   margin-right:0px !important;
   padding-right: 8px !important;
}

.btnHovergrow:hover span.position-relative{
   color:#ffffff !important;
}

@media (min-width: 1199.98px){
   .splide .h1{font-size: 3.6rem !important;}
}

.text-primary{color:var(--primary) !important;}
.text-light{color:var(--grayLight) !important;}

.ls-02{letter-spacing: 0.2px;}

.fs-7{font-size: 0.9rem !important;}
.fs-8{font-size: 0.8rem !important;}

.transition-03{transition: ease all .3s !important;}

.bg-primary{background-color: var(--primary) !important;}
.bg-secondary{background-color: var(--secondary)  !important;}
.bg-light{background-color: var(--lightGrey)  !important;}

.bg-cover {
   -webkit-background-size: cover !important;
   -moz-background-size: cover !important;
   -o-background-size: cover !important;
   background-size: cover !important;
   width: 100%;
   background-position: center center;
   position: relative;
}

.btn-primary {
   --bs-btn-color: #fff;
   --bs-btn-bg: var(--primary);
   --bs-btn-border-color: var(--primary);
   --bs-btn-hover-color: #fff;
   --bs-btn-hover-bg: rgba(202, 32, 39,0.8);
   --bs-btn-hover-border-color: rgba(202, 32, 39,0.8);
   --bs-btn-focus-shadow-rgb: 49,132,253;
   --bs-btn-active-color: #fff;
   --bs-btn-active-bg: rgba(202, 32, 39,0.8);
   --bs-btn-active-border-color: rgba(202, 32, 39,0.8);
   --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
   --bs-btn-disabled-color: #fff;
   --bs-btn-disabled-bg: var(--primary);
   --bs-btn-disabled-border-color: var(--primary)
}

.btn-secondary {
   --bs-btn-color: #fff;
   --bs-btn-bg: #6c757d;
   --bs-btn-border-color: #6c757d;
   --bs-btn-hover-color: #fff;
   --bs-btn-hover-bg: #5c636a;
   --bs-btn-hover-border-color: #565e64;
   --bs-btn-focus-shadow-rgb: 130,138,145;
   --bs-btn-active-color: #fff;
   --bs-btn-active-bg: #565e64;
   --bs-btn-active-border-color: #51585e;
   --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
   --bs-btn-disabled-color: #fff;
   --bs-btn-disabled-bg: #6c757d;
   --bs-btn-disabled-border-color: #6c757d
}

/* end ---*/