/* Estilos contacto.html */

.DatosPaginaContacto {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;

    padding-left: 30vw;
    padding-right: 30vw;

    margin-top: 90px;
    margin-bottom: 100px;

    opacity: 0;

    animation-name: appear;
    animation-duration: 2s;
    animation-fill-mode: forwards;
}

.DatosPaginaContacto h2 {
    margin-bottom: 20px;

    font-family: var(--textFont);
    font-weight: var(--font-weight-big);
    font-size: var(--font-big);

    color: var(--primaryColor);
}

.DatosPaginaContacto p {
    font-family: var(--textFont);
    font-weight: var(--font-weight-small);
    font-size: var(--font-normal);

    color: var(--secondaryColor);

    margin-bottom: 20px;
}

.DatosPaginaContacto p span{
    font-family: var(--textFont);
    font-weight: var(--font-weight-small);
    font-size: var(--font-normal);

    color: var(--orange);
}

.DatosParaRellenarPaginaContacto {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
}

.avisos {
    width: 100%;

    padding-left: 10px;

    opacity: 0%;
    transition: var(--transition-really-fast);

    color: var(--red);
}

.EntradaDatosPaginaContacto {
    width: 40vw;
    margin: 10px 0px;

    padding: 15px 10px;

    background-color: var(--secondaryColor);
    color: var(--white);

    border: 0px solid;
}

.EntradaDatosPaginaContacto:focus {
    outline: transparent !important;
}

.EntradaDatosPaginaContacto::placeholder {
    font-family: var(--textFont);
    font-weight: var(--font-weight-medium);

    color: var(--white);
}

.EntradaDatosPaginaContacto::-webkit-outer-spin-button, .EntradaDatosPaginaContacto::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

.AceptarPolitica {
    display: flex;
    flex-direction: column;
}

.PoliticaDatos {
    width: 40vw;
    margin: 10px 0px;

    display: flex;
    flex-direction: row;

    align-items: center;
    justify-content: start;

    gap: 10px;

    padding: 0px 10px;
}

.PoliticaDatos p {
    margin: 0;
}

.DatosPaginaContacto .DatosParaRellenarPaginaContacto .BotonEnviarContacto {
    width: 100px;
    text-align: center;

    font-family: var(--textFont);
    font-size: var(--font-small);
    font-weight: var(--font-weight-medium);

    margin: 10px 0px 0px 0px;
    padding: 13px 0px;

    background-color: var(--orange);
    color: var(--white);

    border: 0px solid;

    transition: var(--transition-fast);
    cursor: pointer;
}

.DatosPaginaContacto .DatosParaRellenarPaginaContacto .BotonEnviarContacto:hover {
    background-color: var(--primaryColorDarker);
}

.TrabajaConNosotros {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;

    padding-left: 30vw;
    padding-right: 30vw;

    margin-bottom: 200px;

    opacity: 0;

    animation-name: appear;
    animation-duration: 2s;
    animation-delay: 0.5s;
    animation-fill-mode: forwards;
}

.TrabajaConNosotros h2 {
    margin-bottom: 20px;

    font-family: var(--textFont);
    font-weight: var(--font-weight-big);
    font-size: var(--font-big);

    color: var(--primaryColor);
}

.TrabajaConNosotros p {
    font-family: var(--textFont);
    font-weight: var(--font-weight-small);
    font-size: var(--font-normal);

    color: var(--secondaryColor);

    margin-bottom: 20px;
}

.TrabajaConNosotros p span {
    font-family: var(--textFont);
    font-weight: var(--font-weight-small);
    font-size: var(--font-normal);

    color: var(--orange);
}

/* Ajustes de Pantalla */
@media (width <= 1600px) {

    .MapaLocal iframe {
        width: 450px;
        height: 338px;
    }
}

@media (width <= 1200px) {
    .DatosPaginaContacto {
        padding-left: 15vw;
        padding-right: 15vw;
    }

    .EntradaDatosPaginaContacto {
        width: 70vw;
    }

    .TrabajaConNosotros {  
        padding-left: 15vw;
        padding-right: 15vw;
    }

    .DescripcionSitio {
        margin: 20px;
    }

    .MapaLocal iframe {
        width: 300px;
        height: 225px;
    }
}

@media (width <= 1000px) {
    .DatosPaginaContacto {
        padding-left: 2vw;
        padding-right: 2vw;

        margin-bottom: 100px;
    }

    .EntradaDatosPaginaContacto {
        width: 96vw;
    }

    .TrabajaConNosotros {  
        padding-left: 2vw;
        padding-right: 2vw;

        margin-bottom: 100px;
    }

    .Lugar {
        flex-direction: column;
    }

    .ImagenLocal {
        width: 70%;
        margin-right: 0;
    }
}