@media (min-width:320px) and (max-width:767px){
    .navbar{       
        height: auto;
    }
    .navbar-brand {
        max-width: 200px;
    }
    .banner-content{
        display: block;
    }
    .green-box{
        margin-bottom: 15px;
    }
    .banner-btn-grp{
        display: block;
        width: auto;
        margin-top: 20px;
    }
    .main-banner{
        margin-top: 70px;
    }
    .main-banner .display-4{
        width: auto;
        font-size: 34px;
    }
    .banner-btn-grp .btn-primary{
        margin-right: 0;
    }
    .btn-lg{
        width: 100%;
        padding: 15px;
        font-size: 18px;
        margin-bottom: 15px;
    }
    .navbar-nav{
        align-items: flex-start;
        padding: 15px 0;
    }
    .btn-sm{
        padding: 10px;
    }
    .navbar-nav li{
        padding: 5px 0;
    }
    h2{
        font-size: 25px;
    }
    .main{
        padding: 25px 0;
    }
    ul.ex-rate{
        width: 100%;
        margin-top: 10px;
    }
    ul.ex-rate li{
        padding: 10px 0;
        font-size: 16px;
    }
    footer{
        padding: 25px 0;
    }
    footer ul li{
        display: block;
        padding: 10px 0;
    }
    .btn-info img{
        max-width: 50px;
    }
    .chat-area{
        bottom: 16px;
    }
    footer p{
        font-size: 12px;
    }
    footer ul li a{
        font-size: 14px;
    }
    /* Sign in page */
    .sign-in-area{
        height: calc(100vh - 66px);
        padding-top: 58px;
    }
    .signin-box .form-control{
        height: 35px;
    }
    .show-hide{
        top: 35px;
    }
    .show-hide a{
        font-size: 12px;
    }
    .signin-box{
        width: auto;
    }
    .signin-title{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .signin-box label{
        font-size: 12px;
    }
    .rem-forgot a{
        font-size: 12px;
    }
    a.signup-link{
        font-size: 12px;
    }

    /* Sign up page */
    .signup-box{
        width: auto;
    }
    .sign-up-area{
        padding-top: 90px;
    }
    .signup-title {
        font-size: 20px;
        margin-bottom: 10px;
    }
    .signup-box label {
        font-size: 12px;
    }
    .signup-box .form-control {
        height: 35px;
    }
   span.exist-accnt{
        display: block;
    }
    .signup-box-link{
        flex-direction: column;
        align-items: flex-start;
    }
    
    .signup-box-link .btn{
        margin-bottom: 15px;
    }
    .signup-box-link .signin-link{
        font-size: 16px;
        text-transform: uppercase;
    }
     /* 20-June-2020 */
    label{
        font-size: 14px;
    }
    .become-agent{
        padding-top: 90px;
    }
    h4{
        font-size: 18px;
    }
    h5{
        font-size: 16px;
    }

    .contact-box, .profile-box{
        width: 100%;
    }
    .contact-title, .profile-title{
        font-size: 28px;
    }
    .profile-area, .sign-up-area, .rec-area{
        padding-top: 120px;
        min-height: auto;
    }
    .sign-in-area{
        min-height: auto;
        padding-top: 0;
    }
    .verification-code{
        width: 100%;
    }
    .send-money-wrapper{
        padding-top: 90px;
    }
    .steps-holder ul li{
        font-size: 12px;
    }
    .step{
        width: 40px;
        height: 40px;
        border-width: 2px;
    }
    .step.active{
        border-width: 2px;
    }
    .steps-holder ul::before{
        height: 2px;
    }
    .send-money-main .form-control,  .agent-form-info-box .form-control{
        height: 35px;
    }
    .currency-name{
        top: 40px;
    }
    .custome-box-btn-grp{
        flex-direction: column;
    }
    .custom-box-btn{
        margin-bottom: 20px;
    }
    .track-box .btn{
        margin-top: 0;
        margin-bottom: 25px;
    }
    .track-box-status{
        margin-bottom: 20px;
    }
    .custom-box-btn{
        margin-right: 0;
    }
    .to{
    top: 76px;
    
    }
}

@media (min-width:768px) and (max-width:991px){
    .navbar{       
        height: auto;
    }
    .main-banner{
        margin-top: 70px;
        height: calc(100vh - 600px);
    }
    .main-banner .display-4{
        width: 50%;
        font-size: 34px;
    }
    .banner-btn-grp .btn-lg{
        font-size: 15px;
        padding: 15px;
    }
    .navbar-nav{
        align-items: flex-start;
        padding: 15px 0;
    }
    .btn-sm{
        padding: 10px;
    }
    .navbar-nav li{
        padding: 5px 0;
    }
    h2{
        font-size: 25px;
    }
    .main{
        padding: 25px 0;
    }
    ul.ex-rate{
        width: 100%;
        margin-top: 10px;
    }
    ul.ex-rate li{
        padding: 10px 0;
        font-size: 16px;
    }
    footer{
        padding: 25px 0;
    }
    footer ul li{
        display: block;
        padding: 10px 0;
    }
    .btn-info img{
        max-width: 50px;
    }
    .chat-area{
        bottom: 16px;
    }
    footer p{
        font-size: 12px;
    }
    footer ul li a{
        font-size: 14px;
    }
    /* Sign in page */
    .sign-in-area{
        height: calc(100vh - 500px);
        padding-top: 58px;
    }
    .signin-box .form-control, .agent-form-info-box .form-control{
        height: 35px;
    }
    .show-hide{
        top: 35px;
    }
    .show-hide a{
        font-size: 12px;
    }
   
    .signin-title{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .signin-box label{
        font-size: 12px;
    }
    .rem-forgot a{
        font-size: 12px;
    }
    a.signup-link{
        font-size: 12px;
    }
    /* Signup */
    .signup-box{
        width: auto;
    }
    
    .signup-title{
        font-size: 20px;
        margin-bottom: 10px;
    }
    .signup-box label{
        font-size: 12px;
    }
    /* 20-June-2020 */
    label{
        font-size: 12px;
    }
    .become-agent{
        padding-top: 90px;
    }
    h4{
        font-size: 20px;
    }
  
    .contact-title, .profile-title{
        font-size: 30px;
    }

    .profile-area, .sign-up-area, .rec-area{
        padding-top: 120px;
        min-height: auto;
    }
    .verification-code{
        width: 50%;
    }
    .custom-box-btn{
        margin-right: 16px;
    }
    .to{
        top: 76px;
        
        }
}

@media (min-width:992px) and (max-width:1199px){
    .main-banner{
        margin-top: 70px;
        height: calc(100vh - 200px);
    }
    .main-banner .display-4{
        width: auto;
        font-size: 34px;
    }
    .btn-lg{        
        padding: 15px;
        font-size: 18px;
        margin-bottom: 15px;
    }
    .btn-sm{
        padding: 10px;
    }    
    h2{
        font-size: 25px;
    }
    .main{
        padding: 25px 0;
    }
    ul.ex-rate{
        width: 70%;
        margin-top: 10px;
    }
    ul.ex-rate li{       
        font-size: 16px;
    }
    footer ul li{
        padding: 0 10px;
    }
    .btn-info img{
        max-width: 50px;
    }
    .chat-area{
        bottom: 16px;
    }
   /* Sign in page */
   .sign-in-area{
    height: calc(100vh - 180px);
    padding-top: 58px;
}
.signin-box .form-control{
    height: 35px;
}
.show-hide{
    top: 35px;
}
.show-hide a{
    font-size: 12px;
}

.signin-title{
    font-size: 20px;
    margin-bottom: 10px;
}
.signin-box label{
    font-size: 12px;
}
.rem-forgot a{
    font-size: 12px;
}
a.signup-link{
    font-size: 12px;
}
 /* Signup */
 .signup-box{
    width: auto;
}

.signup-title{
    font-size: 20px;
    margin-bottom: 10px;
}
.signup-box label{
    font-size: 12px;
}
 /* 20-June-2020 */
 label{
    font-size: 12px;
}
.become-agent{
    padding-top: 90px;
}
h4{
    font-size: 20px;
}
.sign-up-area{
    padding-top: 90px;
}
.contact-title, .profile-title{
    font-size: 30px;
}
}

@media (min-width:1200px) and (max-width:1600px){
    .main-banner{
        margin-top: 70px;
        height: calc(100vh - 200px);
    }
    .main-banner .display-4{
        width: 40%;
        font-size: 34px;
    }
    .btn-lg{        
        padding: 15px;
        font-size: 18px;
    }
    .btn-sm{
        padding: 10px;
    }    
    h2{
        font-size: 25px;
    }
    .main{
        padding: 45px 0;
    }
    ul.ex-rate{
        width: 70%;
        margin-top: 10px;
    }
    ul.ex-rate li{       
        font-size: 16px;
    }
    footer ul li{
        padding: 0 10px;
    }
    .btn-info img{
        max-width: 50px;
    }
    .chat-area{
        bottom: 16px;
    }
       /* Sign in page */
   .sign-in-area{
    height: calc(100vh - 156px);
    padding-top: 58px;
}
.signin-box .form-control{
    height: 45px;
}
.show-hide{
    top: 41px;
}
.show-hide a{
    font-size: 14px;
}

.signin-title{
    font-size: 28px;
    margin-bottom: 10px;
}
.signin-box label{
    font-size: 14px;
}
.rem-forgot a{
    font-size: 14px;
}
a.signup-link{
    font-size: 14px;
}
 /* 20-June-2020 */
 label{
    font-size: 14px;
}
.become-agent{
    padding-top: 90px;
}
h4{
    font-size: 20px;
}
.sign-up-area{
    padding-top: 120px;
}
.contact-title, .profile-title{
    font-size: 30px;
}
}