@media (max-width:992px){

    #navbar{

        padding:20px 30px;

    }

    .hero-wrapper{

        flex-direction:column;

        text-align:center;

    }

    .hero-left{

        width:100%;

    }

    .hero-right{

        width:100%;

        margin-top:40px;

    }

    .hero-player{

        width:420px;

    }

    .hero-buttons{

        justify-content:center;

    }

}