@media (max-width:900px){
    .sobre-imgs{
        width: 90%;
    }
    #HdF{
        display: none;
    }
    #HdA{
        display: none;
    }
    .main{
        padding-left: 1em;
        padding-right: 1em;
        padding-top: 3em;
    }
    .sobre-imgs img:hover{
        cursor: crosshair;
        width: 110px;
        opacity: 1;
        filter: contrast(120%);
    }
    .card-list {
        display: block;
        margin: 1rem auto;
        padding: 0;
        font-size: 0;
        text-align: center;
        list-style: none;
    }
    .card {
        height: 30em;
        display: inline-block;
        width: 50%;
        margin: 1rem;
        font-size: 1rem;
    }
}




@media (max-width:849px){
    .capa img{
        height: 18rem;
    }
    .sobre h1{
        font-size: 25px;
    
    }
    
    .sobre p{
        font-size: 18px;
    }
}

@media (max-width:852px){
    .capa img{
        height: 14rem;
    }
    .sobre h1{
        font-size: 20px;
    
    }
    
    .sobre p{
        font-size: 17px;
    }
}

@media (max-width:740px){
    .main{
        padding-left: .5em;
        padding-right: .5em;
        padding-top: 2em;
    }
    
    .card-list {
        display: block;
        margin: 1rem auto;
        padding: 0;
        font-size: 0;
        text-align: center;
        list-style: none;
    }
    .card {
        height: 30em;
        display: inline-block;
        width: 40%;
        margin: .5rem;
        font-size: 1rem;
    }
}
@media (max-width:652px){
    .sobre-imgs{
        height: 450px;
    }
    .capa img{
        height: 12rem;
    }
    .sobre h1{
        font-size: 18px;
        text-align: center;
    
    }
    
    .sobre p{
        font-size: 14px;
    }

    .sobre{
        padding: 2em;
    }

    .menu ul,li,a{
        font-size: 15px;
    }

    .header{
        padding: 2rem 1rem;
    }
}

@media (max-width:670px){
    .trailers iframe{
        width: 430px;
        height: 255px;
    }
}


@media (max-width:481px){
    .trailers{
        gap: 1rem;
    }
    .trailers iframe{
        width: 340px;
        height: 235px;
    }

    .sobre-imgs{
        height: 350px;
    }
    .sobre{
        padding: 1em;
    }
    .capa img{
        height: 10rem;
    }
    .sobre h1{
        font-size: 15px;
        text-align: center;
    
    }
    
    .sobre p{
        font-size: 13px;
    }
    .main{
        padding-left: .5em;
        padding-right: .5em;
        padding-top: 2em;
    }
    
    .card-list {
        display: block;
        margin: 1rem auto;
        padding: 0;
        font-size: 0;
        text-align: center;
        list-style: none;
    }
    .card {
        height: 30em;
        display: inline-block;
        width: 100%;
        margin: .5rem;
        font-size: 1rem;
    }
}

@media (max-width:405px){
    .sobre{
        padding: .5rem;
    }
    .capa img{
        height: 7rem;
    }
    .sobre h1{
        font-size: 16px;
        text-align: center;
    }
    
    .sobre p{
        font-size: 12px;
    }
}

@media (max-width:287px){
    .trailers{
        gap: .5rem;
    }
    .trailers iframe{
        width: 260px;
        height: 185px;
    }
    .sobre{
        padding: .5rem;
    }
    .capa img{
        height: 5rem;
    }
    .sobre h1{
        font-size: 12px;
        text-align: center;
    
    }
    
    .sobre p{
        font-size: 10px;
        text-align: center;
    }
}