@media(max-width: 768px){

    .top__menu > a{
        display: none;
    }

main{
    margin-top: 8.5rem;
    height: 100vh;
    width: 100vw;
    position: relative;

}
    main > img{
        width: 100vw;
    }

    main > h2{
        position: absolute;
        top: 1rem;
        left: 1rem;
        padding: 2rem .5rem;
        width: 90%;
        height: 100%;
        font-weight: 600;
        font-size: 3.2rem;
        line-height: 4.5rem;
        background-color:#f8f8f856;
        color: var(--color-black-1);
    }

}

@media(min-width: 605px){
    main > h2{
     font-size: 4rem;
     line-height: 5rem;
    }

}

@media(min-width: 769px){

    .top__menu > i{
        display: none;
    }

    main{
        margin-top: 8.5rem;
        height: 100vh;
        width: 100vw;
        position: relative;
    
    }

    main > img{
        width: 100vw;
    }

    main > h2{
        position: absolute;
        top: 3rem;
        left: 1rem;
        padding: 2rem .5rem;
        width: 90%;
        height: 100%;
        font-weight: 600;
        font-size: 5rem;
        line-height: 6rem;
        background-color:#f8f8f856;
        color: var(--color-black-1);
    }

    .top__header__expanded{
        display: none;
    }
}