.principal-marcas{
    overflow: hidden;
}
.container-marcas{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 1000%;
    height: 70px;
    margin-top:90px;
    margin-bottom: 0px;
    position: fixed;
    /*background: beige;*/
 }




 
.principal-marcas .container-marcas{
    animation-name:marquee;
    animation-duration: 60s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    position: relative;
    /*display: inline;*/
}
.moving-text p:hover{
    animation-play-state: paused;
}


div.marcas-cuadradas{
    width: 60px;
    height: 60px;
    background: red;
    margin-right:20px;
}

div.marcas-rectangulares{
    width: 90px;
    height: 60px;
    background: red;
    margin-right:20px;
}

@keyframes marquee{
    0%{
        left:1px;
    }
    100%{
        left:-4000px;
    }
}

@media screen and (min-width: 1224px) and (max-width: 9000px) {

    .container-marcas{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        width: 1000%;
        height: 70px;
        margin-top:80px;
        margin-bottom: 0px;
        /*background: beige;*/
     }

 }

 @media screen and (min-width: 1024px) and (max-width: 1223px) {

    .container-marcas{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        width: 1000%;
        height: 150px;
        margin-top:145px;
        margin-bottom: 0px;
        /*background: beige;*/
     }

 }