@media (min-width: 1400px) {
    .modal-content {
        margin-top: 60px !important;
        padding: 40px 75px !important;
        width: 67% !important;
        display: flex !important;
        flex-direction: column !important;
    }
    .header-bg {
        position: relative !important;      
    }
} 

@media (min-width: 700px) and (max-width: 1300px) {    
    .modal-content {
        width: 50%;
        
    }
    
}


 
@media (max-width: 425px) {
    body { position: relative; }
              
    .modal-content {margin: 78px 19px !important; display: flex !important; flex-direction: column !important; padding: 24px 30px !important;}
              
    .site-logo img {height: 95% !important; width: auto !important;}
              
    .header-bg {padding-left: 19px !important; height: 105px !important;}
              
    .h2, h2 {font-size: 30px !important;}
              
    .text-muted {font-size: 12px !important; padding: 0px 0px 15px !important;}
    
    label {font-size: 15px !important; padding: 0px 0px 0px !important;}
              
    .courses__payment_input input {height: 50px !important; padding: 15px 46px 15px 42px !important; font-size: 14px !important; margin: 5px 0px 0px 0px !important; }
              
    .btn {font-size: 16px !important;}
               
    a.btn.btn-link {font-size: 12px !important; padding: 0px;}
              
    .text-primary {font-size: 16px !important;}
              
    .forget-pass, .new-register{font-size: 12px !important;}
}