HTML - Ayuda con diseño responsivo

@media ( min-width:480px){

.argumento{

        font-family: 'arial';

        font-family: var(--fuenteprincipal);

        text-decoration-color: white;

        text-align: center;

        text-align: justify;

        padding-right: 15rem;

        line-height: 25pt;

        padding-top: -5rem;

        text-decoration: white;

        text-size-adjust: 2rem;

        font-size: 26px;

        text-indent: 10%;

        padding-left: 15rem;

    }

}

@media  all and (min-width:480px){

.barra1{

  max-width: 100%;

    padding: 0rem 4rem;

    padding-bottom: 0;

    padding-top: 7.5rem;

    margin:0 auto;

    position: relative;

    }

.barra1 .nav1{

        display: grid;

        grid-template-columns: repeat(4, 2fr);

        grid-column-gap: 5rem;

    }

.barra1 .nav1 a{

        font-family: var(--fuenteprincipal);

        font-size: 4rem;

        color: white;

        vertical-align:middle;

        object-fit: cover;

}

    }