h1 {
    font-family: Roboto, sans-serif;
    font-weight: 700;
    font-size: 35px;
    line-height: 42px;
    color: #f44336;
}

p {
    font-family: Roboto, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 18px;
    color: #909090;
}

body, html {
    margin: 0;
    padding: 0;
    height: 100%; /* Asegura que el body y html ocupen toda la altura de la ventana */
}

.contenedor-principal {
    background-image: url('https://arbcolombia.com/terminos-y-condiciones/ima/ima.jpg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    height: auto; /* Establece la altura del contenedor principal */
    display: flex;
    align-items: center; /* Centrado vertical */
    justify-content: center; /* Centrado horizontal */
    flex-direction: column;

}


.contenido {
    width: 1000px;
    background-color: #fff;
    padding: 50px;
    margin: 20px 0 20px 0 ; /* Para centrar el div si es necesario */
    /* Otros estilos que necesites */
    border-radius: 16px;
}


.contenedor-imagen img {
    width: 100%;
    height: auto;
    display: block;
}




.boton-home {
    background-color: red; /* Color de fondo */
    color: #ffffff;         /* Color de letra */
    padding: 10px 20px;   /* Espaciado interno */
    border: none;         /* Sin borde */
    border-radius: 5px;   /* Bordes redondeados */
    font-size: 16px;      /* Tamaño de letra */
    cursor: pointer;  
      /* Cursor en forma de mano al pasar el ratón */
}

.boton-home:hover {
    background-color: #cc0000; /* Color de fondo al pasar el ratón */
}



/*Aqui empieza todo para mobile*/

@media(max-width: 767px) {
    .contenedor-principal {
        display: none;
    }
}

@media(min-width: 767px) {
    .contenedor-principal-mobile {
        display: none;
    }
}

.contenedor-imagen-movil {
    display: block;
    max-width: 100%; /* Ajusta el ancho máximo */
    height: auto; /* Altura automática para mantener la relación de aspecto */
}

.contenedor-imagen-movil img {
    width: 100%;
    height: auto; /* Mantiene la relación de aspecto */
    object-fit: contain; 
}

.contenido-mobile {
    width: 100%;
    box-sizing: border-box; /* Incluye padding y bordes dentro del ancho */
    padding: 20px; 
}

@media (max-width: 767px) {
    .contenido-mobile h1 {
        font-size: 28px;
    }

    .contenido-mobile p {
        font-size: 14px;
    }

    .contenido-mobile {
        margin: 10px;
        padding: 15px;
    }

    .boton-home {
        padding: 8px 16px;
        font-size: 14px;
    }
}