@media only screen and (max-width:1400px) {
    .card {
        margin-left: 91px !important;

        width: 424px !important;
    }
}

@media only screen and (max-width:1200px) {
    .card {
        margin-left: 91px !important;
        width: 100% !important;
        max-width: 424px !important;
    }
}

@media only screen and (max-width:768px) {
    .navul {
        margin-right: 50px;
        display: block !important;
        padding: 5px 10px !important;
    }

    .hero-img {
        display: none !important;
    }

    .boxer {

        width: 100%;
        max-width: 585px !important;
        min-height: 50vh;
    }

    .box-para {
        margin-left: 20px !important;
    }

    .box span {
        margin-left: 15px !important;
    }

    .oderlist {
        margin-left: -9px !important;
    }
}

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

    .navul {
        margin-right: 50px;
        display: block !important;
        padding: 5px 10px !important;
    }

    .logo {
        padding: 10px 30px !important;

    }

    .apply {
        display: none !important;
    }

    .hero {
        display: none !important;
    }

.popup{
    display: none!important;
}
    .res-details {
        background-color: #ec7a27 !important;
        padding: 10px 10px !important;
    }
    .res-part{
        margin-left:-49px !important;
        width: 400px !important;
    }
    .responsive {
        display: block !important;

    }

    .res-info {
        background-color: rgba(192, 192, 192, 0.3);
        padding: 10px 0;
    }

    .res-para {
        color: white !important;
        font-size: 20px !important;
        font-weight: 700 !important;
    }

    .res-info span {
        font-weight: 600 !important;
        color: #153243 !important;
        font-size: 16px !important;
        margin-bottom: 20px !important;
    }
    .mob-edge{
        background-color: #153243!important;
        color: white!important;
        border: none!important;
        padding: 10px 15px!important;
        font-weight: 500!important;
        margin-top: 15px!important;
        margin-left: 10px!important;
        text-align: center!important;
    }
    .register-form .form-control {
        border: none;
        background: none;
        border-bottom: 1px solid #ffc107;
        border-radius: 0px !important;
        color: #fff;
        margin-bottom: 15px;
    }
    .register-form .form-control:focus,
    .register-form .form-control:hover{
      border:none;
      margin: 0 auto;
      background: none;
      box-shadow: none;
      border-bottom: 1px solid #fff;
      color: #fff;
    }
    .form-control option{
        width:100%!important;
        max-width:100px!important ;
        color: black !important;
        font-weight: 400!important;
    }

    .oderlist {
        margin-left: -9px !important;
    }

    .course-info div {
        margin-left: 43px !important;
    }

    .animated-image {
        height: 200px !important;
    }

    .coach-info {    
         margin-left: -10px !important
    }

    .supply {
        padding: 5px 10px !important;
        margin-left: -20px !important;
        min-width: 200px !important;
    }
}

 @media only screen and (min-width:375px) {
   
    .course-info div {
        margin-left: 12px !important;
    }

    .supply {
        padding: 5px 10px !important;
        margin-left: -40px !important;
        min-width: 200px !important;
    }

} 

@media only screen and (min-width:360px) {
   
    .course-info div {
        margin-left: 12px !important;
    }

    .supply {
        padding: 5px 10px !important;
        margin-left: -40px !important;
        min-width: 150px !important;
    }

}