.navbar{
    display: none !important;
}
@media only screen and (max-width: 1600px) {
    .header .logo{
        padding: unset;
        padding-left: 160px;
    }

    .header .nav{
        padding: unset;
        padding-right: 160px;
    }
}


@media only screen and (max-width: 1200px) {
    .header .logo{
        padding: unset;
        padding-left: 25px;
    }

    .header .nav{
        padding: unset;
        padding-right: 25px;
    }
}

@media only screen and (max-width: 930px) {
    .header{
        display: none;
    }

    .navbar{
        display: flex !important;
        position: absolute !important;
        top:0;
        width: 100%;
    }
    .navbar-brand img{
        width: 80px;
        height: 80px;
    }

    .main{
        min-height: 100vh;

    }

}

/* main */

@media only screen and (max-width: 1570px) {
    .main .right img{
        width: 800px;
    }
}


@media only screen and (max-width: 1400px) {
    .main .right img{
        width: 650px;
    }
    .main .left h2{
        font-size: 35px;
    }

    .main .left h3{
        font-size: 18px;
    }

    .main .left .online h2{
        font-size: 15px;
    }
}

@media only screen and (max-width: 1270px) {

    .main {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column-reverse;
    }
    .main .left{
        position: unset;
    }

    .main .right{
        position: unset;
    }

    .main .right img{
        width: 400px;
    }
    .scroll{
        display: none !important;
    }
}


@media only screen and (max-width: 540px) {
    .main .left h2{
        font-size: 25px;
    }

    .main .left h3{
        font-size: 14px;
    }

    .main .left .online h2{
        font-size: 15px;
    }

    .main .left .btns button{
        padding: 2.5px 15px;
    }
    .main .right{
        display: flex;
        justify-content: center;
        align-content: center;

    }
    .main .right img{
        max-width: 90%;
        display: none;
    }
}
/*  section */


@media only screen and (max-width: 1540px) {

    .section .title {
        padding: 0;
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
        text-align: center;

    }

    .section   .title h2{
        font-size: 30px;
    }
    .section .title h3{
        font-size: 18px;
    }


}

@media only screen and (max-width: 1640px) {

    .section .content .modes{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .section .content .modes .card h2 {
        font-size: 20px;
    }

    .section .content .modes .card h3 {
        font-size: 15px;
        width: 500px;
    }

    .section .content .modes .card{
        height: 200px !important;
        padding: unset !important;
    }
}

@media only screen and (max-width: 530px) {

    .section .content .modes .card h3{
        width: 280px;
    }



}


@media only screen and (max-width: 670px) {
    
    .cnt{
        display: flex;
        justify-content: center;
        flex-direction: column;
        align-items: center;
    }
    .cnt  .card{
            width: 100% !important;
        padding: unset !important;
        margin-left: 50PX;;
        }   

        .footer .logo {
            padding: 0 !important;
        }

}
/* tops */
@media only screen and (max-width: 1270px) {

    .section .content .tops{
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
    }

    .section .content .tops .tables{
        width: 100%;
    }

    .section .content .tops .tables .table .left h2{
        font-size: 15px;
        margin: 0 7px;

    }

    .section .content .tops .tables .table .left h3{
        font-size: 15px;
        margin: 0 5px;
    }

    .section .content .tops .tables .table .left img{
        width: 30px;
    }

    .section .content .tops .tables .table .right h3{
        font-size: 14px !important;
    }


}



/* foooter */

@media only screen and (max-width: 1300px) {
    .footer{
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-bottom: 50px;
        padding: 0;
    }

    .footer img{
        padding: unset !important;
    }
    .evenly{
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        width: 100%;
    }
}


@media only screen and (max-width: 950px) {
    .footer .evenly .links h2{
        font-size: 16px !important
    }

    .footer .evenly .links h3{
        font-size: 12.5px !important
    }

    .footer .evenly .media h2{
        font-size: 16px !important
    }

    .footer .evenly .media h3{
        font-size: 12.5px !important
    }


    .mojang{
        display: none;
    }
}

@media only screen and (max-width: 425px) {
    .footer .evenly .links h2{
        font-size: 14px !important
    }

    .footer .evenly .links h3{
        font-size: 10.5px !important
    }

    .footer .evenly .media h2{
        font-size: 14px !important
    }

    .footer .evenly .media h3{
        font-size: 9.5px !important;
    }


    .mojang{
        display: none;
    }
}