﻿.banner{
    background-position: right;
    background-size: cover;
    height: 400px;
    width: 100%;
}

.content-banner{
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    flex-direction: column;
    height: 400px;
}

.content-banner h1{    
    color: #fff;
    text-transform: none;
    margin: 0 0 15px 0;
    font-size: 28px;
}

.content-banner p{
    font-size: 17px;
    color: #fff;
    font-weight: 500;
}

@media (min-width: 1025px) and (min-width: 1200px){
    .banner{
        background-image: url("/Personas/Paginas/nosotros/oficinas/src/imgs/banner-desktop.webp");
    }
}


@media (min-width: 769px) and (max-width: 1024px){
    .banner{
        background-image: url("/Personas/Paginas/nosotros/oficinas/src/imgs/banner-ipad-pro.webp");
    }
}

@media (min-width: 600px) and (max-width: 768px) {
    .banner{
        background-image: url("/Personas/Paginas/nosotros/oficinas/src/imgs/banner-ipad-mini.webp");;
    }

    .content-banner h1{
        font-size: 20px;
    }
    
    .content-banner p{
        font-size: 15px;
    }
}

@media (max-width: 600px) {
    .banner{
        background-image: url("/Personas/Paginas/nosotros/oficinas/src/imgs/banner-movil.webp");
    }

    .content-banner {
        justify-content: flex-end;
        align-items: center;
        padding-bottom: 75px;
    }
}