html {
    scroll-behavior: smooth; /*Comenta esta l�nea (o dale el valor 'auto' a scroll behavior ) para probar la diferencia con y sin scroll suavizado*/
}

@media (min-width: 750px) {
    header {
        text-align: left;
    }
}

ul {
    list-style: none;
}
/* 
.cotizador {
    position: absolute;
} */
/* Removes the default 20px margin and creates some padding space for the indicators and controls */
.carousel {
    margin-bottom: 0;
	padding: 0 40px 30px 40px;
}
/* Reposition the controls slightly */
.carousel-control {
	left: -12px;
}
.carousel-control.right {
	right: -12px;
}
/* Changes the position of the indicators */
.carousel-indicators {
	right: 50%;
	top: auto;
	bottom: 0px;
	margin-right: -19px;
}
/* Changes the colour of the indicators */
.carousel-indicators li {
	background: #c0c0c0;
}
.carousel-indicators .active {
background: #333333;
}
.cotizador #carrito {
    display: none;
}

.cotizador:hover #carrito {
    display: block;
    position: absolute;
    z-index: 10000;
    right: 0;
    color: rgb(70, 68, 68);
    top: 100%;
    padding: 20px;
    min-height: 400px;
    min-width: 300px;
    background-color: darkgray;
}

.vacio {
    padding: 10px;
    background-color: crimson;
    text-align: center;
    border-radius: 10px;
    color:white
}

.contenido-hero {
    padding-top: 120px;
    margin-top: 80px;
    color: white;
}

.contenido-hero form {
    position: relative;
    margin-bottom: 0;
}

.contenido-hero form #buscador {
    height: 50px;
    margin-bottom: 0;
}

.agregar-carrito {
    margin: 10px 0;
}
.solicitarCotizacion{
    align-items: center;
    text-align: center;
    height: 25px;
    width: 300px;
    background-color: #1e8006;
    margin: auto;
}
.vaciar-carro{
    align-items: center;
    text-align: center;
    height: 25px;
    width: 300px;
    background-color: rgba(168, 1, 1, 0.746);
}
.circle{
    border-radius: 2px;
    border: 0.5px;
}

.buscar{
    width: 50%;
}
#cotizadorMobil {
    display: none;
}
submenu:hover #cotizadorMobil{
    display: block;
    position: absolute;
    z-index: 10000;
    right: 0;
    color: rgb(70, 68, 68);
    top: 100%;
    padding: 20px;
    min-height: 400px;
    min-width: 300px;
    background-color: darkgray;
}
.main-header .main-menu ul ul.submenu2{
    position:absolute;
    width:250px;
    background:#fff;
    left:0;top:120%;
    visibility:hidden;
    opacity:0;
    box-shadow:0 0 10px 3px rgba(0,0,0,0.05);
    padding:17px 0;
    border-top:5px solid #014b85;
    -webkit-transition:.3s;
    -moz-transition:.3s;
    -o-transition:.3s;
    transition:.3s
}
.main-header .main-menu ul ul.submenu2>li{
    margin-left:7px;
    display:block
}
.main-header .main-menu ul ul.submenu2>li>a{
    padding:6px 10px !important;
    font-size:14px;
    color:#0b1c39;
    text-transform:capitalize
}
.main-header .main-menu ul ul.submenu2>li>a:hover{
    color:#014b85;
    background:none
}

.title{
    align-items: center;
    text-align: center;
}
.btnImg{
    cursor: pointer;
    transition: all 300ms;
}
.btnImg :hover{
    transform:scale(1.25);
}
/* #modalImg{
    text-align: center;
    background: #333333;
    padding: 15px 15px;
    color: white;
    border-radius: 3.5px;
}
.modalX{
    position: fixed;
    top: -100vh;
    left: 0;
    z-index: 999999999;
    background: rgba(0,0,0,0.75);
    width: 100vw;
    height: 100vh;
    opacity: 0;
    transition: opacity 0.35s ease;
}

.modalX .imgZoom{
    width: 100%;
    max-width: 500px;
    position: fixed;
    left: 50%;
    top: -100vh;
    transition: top 0.35s ease;
    margin-left: -250px;
    background: white;
    box-shadow: 0 1px 2px rgba(0,0,0,0.1);
    border-radius: 2px;
    z-index: 999999999;
}

.close-modalX{
    color:#e74c3c;
    position: absolute;
    top:0.2em;
    right: 0.375em;
    margin: 0;
    padding: 5px;
}

.modalX:target{
    opacity: 1;
    top: 0;
}

.modalX .close-modalX{
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 999999999;
}
.modalX:target .imgZoom{
    top: 50px;
    transition: top 0.35s ease;
}

.modal-container {
    display: flex;
    background-color: rgba(0, 0, 0, 0.3);
    align-items: center;
    justify-content: center;
    position: fixed;
    pointer-events: none;
    opacity: 0;  
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    transition: opacity 0.3s ease;
  } */
.modal-containerX {
    display: flex;
    background-color: rgba(0, 0, 0, 0.3);
    align-items: center;
    justify-content: center;
    position: fixed;
    pointer-events: none;
    opacity: 0;  
    top: 0;
    left: 0;
    height: 100vh;
    width: 100vw;
    transition: opacity 0.3s ease;
    }
.showX {
    pointer-events: auto;
    opacity: 1;
    }

.modalX {
    background-color: #fff;
    width: 600px;
    max-width: 100%;
    padding: 30px 50px;
    border-radius: 5px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    text-align: center;
    }

.modalX h1 {
    margin: 0;
    }

.modalX p {
    opacity: 0.7;
    font-size: 14px;
    }