@font-face {
    font-family: 'Brandon Light';
    src: url(../fonts/Brandon_light.otf);
}

main{
    background-color: var(--color_two);
}

.contacto{
    height: 95vh;
    display: flex;
    justify-content: space-between;
    padding: 3rem 0 0 0;
    max-width: 80rem;
    width: 95%;
    margin: auto;
}

.contacto article{
    margin: 3rem 0 0 0;
    max-width: 80rem;
    width: 100%;
}

.contacto article h2{
    font-family: 'Brandon Light';
    font-size: 59px;
    color: var(--color_one);
    letter-spacing: 1px;
}

.contacto article div{
    margin: 2.5rem 0 0 0;
    font-family: 'Brandon Regular';
}

.contacto article .contacto_dir{
    margin-top: 4.2rem;
}

.contacto article div h3{
    color: var(--color_three);
    font-size: 14px;
    letter-spacing: 1px;
}

.contacto article div span,
.contacto article div a{
    font-size: 21px;
    color: var(--color_one);
    text-decoration: none;
}

@media (max-width: 990px){
    .contacto {
        width: 85%;
        height: 70rem;
        flex-direction: column;
    }
    .contacto picture{
        height: 32rem;
    }
    .contacto picture img{
        width: 100%;
    }
}

@media (max-width: 490px){
    .contacto article h2 {
        font-size: 54px;
    }
    .contacto {
        height: auto;
    }
    .contacto picture {
        height: 20rem;
        margin-top: 4rem;
      }
}