/*Resolucion inicial 
min 1024px
max 1500px 
para computadoras pequeñas y monitores medianos o normales
*/
/*-----Seccion de paneles iniciales-----*/
*{
    --texto-blanco:#FBFBFB;
    --color-oscuro:#282828;
    --botones:#2E76EF;
}
.panel{
    height: 800px;
    width: 100%;
}
.panel-img{
    object-fit:cover;
    width:100%;
    height: 800px;
    object-position: top;
}
/*-----Fin de Seccion Paneles Iniciales-----*/
/*Seccion quienes Somos (Nosotros)*/
.Nosotros{
    width: 100%;
    height: auto;
    background-color: var(--color-oscuro);
    padding: 18px 76px 30px 76px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-top:61px ;
}
.Nosotros__contenedor{
    max-width: 1500px;
    display: flex;
    gap: 104px;
}
.Nosotros__quienes-somos{
    max-width:639px;
    min-width: 430px;
    display: flex;
    flex-direction: column;
}
.quienes-somos__titulo{
    color: var(--texto-blanco);
    margin: 0;
    font-size: 46.982px;
}

.quienes-somos__barra{
    width: 43%;
    background-color:var(--texto-blanco);
    height: 6px;
    margin-top: 10px;
}

.quienes-somos__parrafo{
    text-align: justify;
    max-height: 174px;
    min-height: 168px;
    margin-bottom:25px;
    font-size: 16.589px;
    color: var(--texto-blanco);
}

.quienes-somos__boton{
    background-color: var(--botones);
    color: var(--texto-blanco);
    padding: 8px 10px;
    text-decoration: none;
    box-sizing: border-box;
    border-radius: 6px;
    text-align: center;
    
}
.Nosotros__contenedor-img{
    max-width: 526px;
    min-width:450px;
    height: auto;
}
.contenedor-img-eagle-class{
    object-fit:cover;
    width: 100%;
    height: auto;
}

/*-----Seccion servicios que Ofrecemos-----*/
.servicios{
    width: 100%;
    height: auto;
    background-color: var(--color-oscuro);
    padding: 18px 50px 37px 76px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-top:61px;
    box-sizing: border-box;
}
.servicios__contenedor{
    max-width: 1500px;
    display: flex;
    flex-direction: column;
    align-items: left;
}
.contenedor__titulo{
    width: 500px;
    height: 100px;
}
.servicios__titulo{
    color: var(--texto-blanco);
    font-size: 39.145px;
    margin: 0;
}
.servicios__barra{
    width: 63%;
    height: 6px;
    background-color: var(--texto-blanco);
    margin-top: 10px;
}

.servicios__contenedor-total{
    width: 100%;
    height: 340px;
    display: flex;
    flex-direction: row;
    gap: 40px;
}
.servicios__totales{
    max-width: 289px;
    min-width: 100px;
    max-height: 264px;
    min-height: 100px;
}
.servicios-titulo{
    font-size: 32.626px;
    margin: 0;
    margin-top: 5px;
    color: var(--texto-blanco);
    text-align: center;
}
.servicios-parrafo{
    color: var(--texto-blanco);
    text-align: justify;
}
.servicios__img{
    height: 143px;
    border-radius: 4.88px;
    background-position: center;
}
.ejecutivo--img{
    background-image: url('/img/imagenes/viaje-ejecutivo.webp');
}
.privado--img{
    background-image: url('/img/imagenes/viaje-privado.webp');
}
.eventos--img{
    background-image: url('/img/imagenes/viaje-eventos.webp');
}
.vacacional--img{
    background-image: url('/img/imagenes/viaje-vacacional.webp');
}
/*Boton de Mas Informacion*/
.servicios__contenedor-enlace{
    margin-top: 50px;
    display: flex;
    justify-content: center;
}
.servicios-enlace{
    width: 658px;
    text-align: center;
    text-decoration: none;
    padding: 8px 10px;
    border-radius: 6px;
    color: var(--texto-blanco);
    background-color: var(--botones);
}
/*-----Fin de Seccion quienes Somos (Nosotros)-----*/

/*-----Inicio de Seccion Renta de Automoviles-----*/
.renta{
    width: 100%;
    height: auto;
    background-color: var(--color-oscuro);
    padding: 18px 76px 30px 76px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-top:61px ;
}
.renta__contenedor{
    max-width: 1500px;
    display: flex;
    gap: 104px;
}
.renta__contenedor-texto{
    max-width:639px;
    min-width: 430px;
    display: flex;
    flex-direction: column;
}
.renta__titulo{
    color: var(--texto-blanco);
    margin: 0;
    font-size: 46.982px;
}

.renta__barra{
    width: 43%;
    background-color:var(--texto-blanco);
    height: 6px;
    margin-top: 10px;
}

.renta__parrafo{
    text-align: justify;
    max-height: 174px;
    min-height: 168px;
    margin-bottom:25px;
    font-size: 16.589px;
    color: var(--texto-blanco);
}

.renta__boton{
    background-color: var(--botones);
    color: var(--texto-blanco);
    padding: 8px 10px;
    text-decoration: none;
    box-sizing: border-box;
    border-radius: 6px;
    text-align: center;
    
}
.renta__contenedor-img{
    max-width: 526px;
    min-width:450px;
    height: 354px;
}
.contenedor-img-renta-automoviles{
    object-fit:cover;
    width: 100%;
    height: 354px;
}

/*-----Seccion Unidades con las que contamos-----*/
.unidades{
    width: 100%;
    height: 560px;
    background-color: var(--color-oscuro);
    padding: 18px 76px 30px 76px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    margin-top:61px ;
    background-color: #C7C7C7;
}
.unidades__contenedor{
    max-width: 1500px;
    display: flex;
    flex-direction: column;
    align-items: left;
}
.contenedor__unidades-titulo{
    width: 700px;
    height: auto;
    display: flex;
    flex-direction: column;
}
.unidades__titulo{
    font-size: 39px;
    margin: 0;
    margin-bottom: 15px;
}
.unidades__barra{
    width: 70%;
    height: 11px;
    background-color:var(--color-oscuro);
}
.relleno__unidades{
    width: 100%;
    height: 200px;
    width: 100%;
    height: 340px;
    display: flex;
    flex-direction: row;
    gap: 40px;
}
.container{
    width: 1000px;
}

/*-----Estilos de carrusel-de-automoviles-----*/
.gallery{
    width: 100%;
}
.gallery-container{
    align-items: center;
    display: flex;
    height: 400px;
    margin: 0px auto;
    max-width: 1000px;
    position: relative;
}
.gallery-item{
    height: 200px;
    opacity: 0;
    position: absolute;
    transition: all 0.3s ease-in-out;
    width: 330px;
    z-index: 0;
    border-radius: 15px;
    background-size: contain;
}
.gallery-item-1{
    left: 15%;
    opacity: .4;
    transform: translateX(-50%);
}
.gallery-item-2 .gallery-item-4{
    height: 250px;
    opacity: 0.8;
    width: 380px;
    z-index: 1;
}
.gallery-item-2{
    left: 30%;
    transform: translateX(-50%);
}
.gallery-item-3{
    box-shadow: -2px 5px 33px 6px #00000059;
    height: 300px;
    opacity: 1;
    left: 50%;
    transform: translateX(-50%);
    width: 430px;
    z-index: 2;
}

.gallery-item-4{
    left: 85%;
    opacity: .4;
    transform: translateX(-50%);
}
.gallery-item-5{
    left: 85%;
    opacity: .4;
    transform: translateX(-50%);
}