@media screen and (min-width:240px) and (max-width:1279px) {
  body { -webkit-text-size-adjust: none;}
  input, textarea, button, select { appearance: none; -moz-appearance: none; -webkit-appearance: none; }
  input[type="radio"] { appearance: radio; -moz-appearance: radio; -webkit-appearance: radio; }
  input[type="checkbox"] { appearance: checkbox; -moz-appearance: checkbox; -webkit-appearance: checkbox; }
  select { background-image: url(../images/select-arr.png); background-repeat: no-repeat; background-position: right center; }
  }
  @media screen and (min-width:1501px) and (max-width:3000px) {
  .login-sec{  width: 100%; display: flex; align-items: center; justify-content: center; position:relative; height:100vh;}
  .register-sec { height:auto;}
  }
  @media screen and (min-width:1366px) and (max-width:1500px) {
  
  }
  @media screen and (min-width:1024px) and (max-width:1279px) {
  .top-logo h2 { line-height:36px;}	
  .register-sec { padding: 50px 0 30px;}
  
  }
  @media screen and (min-width:768px) and (max-width:1023px) {
  .top-logo h2 { line-height:36px;}
  .register-sec { padding: 50px 0 30px;}
  .login-blk.resgister-blk .top-logo p { line-height:20px; margin-top:20px;}  
  }
  
  @media screen and (min-width:1024px) and (max-width:1279px) {
    body.blue-bg:before, body.blue-bg:after { background-size: 100%; width: 300px; height: 300px;}	
    body.blue-bg.register-bg:after { background-size:100%; width:300px; height: 170px;}
    .container { width: 100%; max-width: 100%;}
    .login-sec { height:100vh;}	
    .login-sec.register-sec { height:auto;}
    .payment-sec { padding-left: 50px;}
    .per-info h2 p {width: calc(80% - 150px);}
    .per-info .edit-btn { right:0;}
}
    
@media screen and (min-width:567px) and (max-width:767px) {
  .user-drop-down .dropdown-toggle img { margin-left: 15px }
}

  @media screen and (min-width:200px) and (max-width:767px) {
  body { padding-bottom: 0; } 
  .login-blk {  width: 100%; display: flex; flex-direction: column; padding: 0 15px;}
  .booking_steps li{width: 40%;}
  .topheading h2{ font-size: 22px;}
  .form-row .form-group{width: 100%;;}
  .form-row { margin-bottom:10px;}
  .login-sec { padding:40px 0 30px;}
  .before-login { height:140px;}
  #middle { margin-top: 179px;}
  .top-logo h2 { line-height:30px; font-size:26px;}	
  .form-group.btn-group { margin-bottom:0;}
  .form-group.btn-group a { margin-top:5px;}
  .register-sec { padding: 50px 0 30px;}
  .login-blk.resgister-blk { width:300px;}
  .login-blk.resgister-blk .top-logo h2 { font-size: 27px;}
  .login-blk.resgister-blk .form-group .form-inner .cmn-btn { width:120px;}
  .login-blk.resgister-blk .form-group .form-inner .form-control { width: calc(100% - 130px); margin-right: 10px;}
  .login-blk.resgister-blk .top-logo p { font-size: 16px; color: #858585; line-height: 20px; margin-bottom: 30px; margin-top: 20px;}
  .login-blk.resgister-blk .top-form { margin-bottom: 30px;}
  .payment-sec { padding-left: 0;}
.per-info h2 span { width:85px; margin-right:10px}
.per-info h2 p { width: calc(100% - 95px);}
.per-info .edit-btn { position: absolute;  right: 0; top: -55px;}
.payment-blk .app-cnt .app-lt { align-items: start;}
.fixed-top { padding:0 15px;}
.header-rt { display: flex; align-items: center; justify-content: flex-end; width: calc(100% - 115px);}
.noti-tab { margin: 0px 10px 0 15px;}
.navbar-dark .navbar-brand { padding: 20px 0; margin: 0;}
.navbar-collapse.show { position: fixed;  background:#fff; width: 250px; z-index:9; box-shadow:0 0 10px rgba(0,0,0,.43);}
.user-drop-down { margin-left: 5px;}
.user-drop-down .dropdown-toggle span{ display:none;}
.user-drop-down .dropdown-toggle { display:inline-block; vertical-align:middle;}
.user-drop-down .dropdown-toggle i { margin-right: 0; float: left;;}
.user-drop-down .dropdown-toggle:after { margin-left:8px; margin-top: 17px;}
.navbar-dark .navbar-nav .nav-item.close-item{ display:block; padding:0 30px 40px;}
.navbar-dark .navbar-nav .nav-item.close-item img{ width:110px;}
.navbar-dark .navbar-toggler { padding:0; border:none;}
.navbar-dark .navbar-nav .nav-item { margin-right: 0;}
.navbar-dark .navbar-nav .nav-link { font-size: 16px; padding: 5px 25px; margin-bottom:10px; font-family: 'montserratbold'; color: #2A2D30; border-bottom: none; border-left:4px solid #fff;}
.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show>.nav-link, .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus { color: #f8af44; border-bottom:none; transition: padding 0.3s ease 0s;     border-color: #f8af44;}
.sidenav { height: 100%; width: 0; position: fixed; z-index: 1; top: 0; right: 0; background-color: #111; overflow-x: hidden; padding-top: 30px; transition: 0.5s;}
.sidenav .closebtn { position: absolute; top: 17px; right: 25px; font-size: 36px; color: #818181;}
.modal-dialog { max-width:90% !important; margin:50px auto 0;}
.modal-content { padding: 30px 20px 20px!important;}
.modal-content button.close { right: -55px !important; top: -45px !important;}
.card-not-approved-model button.close { right: -35px !important }
.my_booking_flow .modal-content button.close { right: -38px !important; } 
.upload-cnt { padding:25px 15px;}
.popup-title { font-size: 18px;}
.cmn_info .login-blk.resgister-blk { width: 100%; padding: 0;}
.form-group.b-day-group .inr-form-group span { margin: 0 5px;}
.cmn-form .form-group .form-control { height:36px; padding:0 15px;}
.modal.show .modal-dialog .form-group { margin-bottom: 10px;}
.cmn-model-fotter { margin-top:10px;}
.del-model .modal-dialog { max-width: 300px !important;}
.choose-model-type .modal-dialog { max-width: 300px !important;}
.cmn-form .form-group.card-group .form-control { background:none;}
.cmn-form .top-form .blk-title { font-size:16px;}
.app-cnt.add-card { flex-direction: row;}
.cmn-heading { display: flex; justify-content: flex-start; width: 100%; align-items: flex-start; flex-direction: column;}
.cmn-heading .cmn-btn { margin-top:15px;}
.wel-sec.profile-top { height: 150px;}
.wel-sec.profile-top .prof-image { top:50px;}
.wel-sec { height: 140px;}
.wel-cnt { display: flex; padding-top: 30px;}
.wel-cnt h2 { font-size:24px;}
.app-cnt { flex-direction: column; align-items: flex-start; justify-content: flex-start;}
.app-cnt.cliniccard-detail{ flex-direction: row;}
.clinic-blk .owl-carousel.owl-drag .owl-item .item {overflow: hidden;}
.app-cnt i{ margin-bottom:10px;}
.app-cnt h2 { width:100%; margin:10px 0 0; line-height:18px;}
.app-cnt h2.time { display: flex; align-items: center; margin-left: 0; width: 100%; flex-direction: row; justify-content: space-between;}
.app-cnt h2.time span{ margin-left:20px;}
.app-cnt h4 { align-items: center; margin-left: 0; width: 100%; margin-top: 5px; flex-direction: row; justify-content: space-between;}
.clinic-blk .owl-theme .owl-nav { top:-190px;}
.serch-cnt { margin-top:20px;}
.add-appoinment { justify-content: flex-start; align-items: flex-start; flex-direction: column; padding:30px 30px 25px;}
.add-appoinment .cmn-btn { margin-top:20px;}
.appoint-blk.my-app-blk .app-cnt h2.clinic-name, .appoint-blk.my-app-blk .app-cnt h4, .appoint-blk.my-app-blk .app-cnt h2.time span, .appoint-blk.my-app-blk .app-cnt h2 span{ display:none;}
.appoint-blk.my-app-blk .app-cnt { position:relative; padding-left:100px;}
.appoint-blk.my-app-blk .app-cnt h2 { margin-top:0;}
.appoint-blk.my-app-blk .app-cnt h2.time{font-family: 'montserratregular'; font-size:13px;}
.appoint-blk.my-app-blk .app-cnt i.logo-ic { position:absolute; left:0; top:13px; width:auto; height:40px; margin:0;  display: flex; align-items: center;    justify-content: center;}
.appoint-blk.my-app-blk .app-cnt i.logo-ic img{ max-width:100%; max-height:100%;}
.modal .form-group .toggle-password { top:38px;}
.modal .form-group .toggle-password.fa-eye-slash { top:36px;}
#book_flow_2 .chose-clinic { display: flex; flex-direction: column; width: 100%; padding: 0;}
.chose-clinic a i { width: 60px;}
.chose-clinic a span { width: calc(100% - 80px);}
.browse-treatment { padding:10px;}
.my_booking_flow .mCSB_inside > .mCSB_container { margin-right: 20px;}
.browse-treatment .accordion-group { padding:10px;}
.schdule-body h1 { text-align:center; font-size:17px;}
.my_booking_flow .schdule-body .popup-title { text-align:center;}
.my_booking_flow .schdule-body p { padding:0;}
.my_booking_flow .schdule-body .browse-treatment { padding: 10px 0 10px 10px;}
#book_flow_2 .chose-time h2 { width: 100%;}
.my_booking_flow .modal-body.time-body { padding: 0;}
.my_booking_flow .time-cnt span { font-size:12px; width:54px;}
.my_booking_flow .modal-dialog { max-width: 290px !important;}
.tret-heading { font-size:15px;}
.my_booking_flow .app-det { text-align:center;}
.my_booking_flow .time-cnt { padding:0;}
.modal-body.payment-body { padding: 0;}
.chose-clinic.payment-options a { border: 2px solid #E7E8EB; padding: 10px 10px; font-family: 'montserratbold'; font-size: 16px; color: #2A2D30; height: 60px;}
.my_booking_flow .card-payment .app-cnt { padding:10px; flex-direction: row;}
.my_booking_flow .card-payment .app-cnt h2 { margin-top:0; line-height:16px; display: contents !important;}
.my_booking_flow .card-payment .app-cnt h4 { display: flex !important;  }
.my_booking_flow .card-payment .app-cnt .card-ic { width: 50px; margin-right: 10px; margin-bottom: 0;}
.my_booking_flow .card-payment .app-cnt .card-ic img{ max-width:100%;}
.my_booking_flow .card-payment.payment-proc .app-cnt.cli-pay {    flex-direction: column; margin-top:0;}

#book_flow_2 .modal-body.thank-body { padding: 0;}
.modal-body.thank-body .popup-title { margin-bottom: 0; font-size: 18px; text-align: center;}
.modal-body.thank-body p.txt{ font-size:13px;}
.thank-body .order-details .ord-cnt {flex-direction: column; margin-bottom:10px;}
.thank-body .order-details .ord-cnt span { width:100%;}
.thank-body .pay-sum .pay-cnt { display: flex; align-items: flex-start; justify-content: flex-start; flex-direction: column;}
.thank-body .pay-sum .pay-cnt strong { margin-top:10px;}
.thank-body .pay-sum .bill-cnt .app-cnt h2 { margin:0;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt h4 { margin-top:10px;}
.thank-body .pay-sum .add-clinic-cnt .app-cnt.bal-cnt h4{ flex-direction: column;}
.modal-footer.thank-footer {  flex-direction: column; }
.timeslots-my-booking .modal-body { padding: 0px !important; }
#choose_appointment_card button.close { right: -40px !important; top: -60px !important;}
.after-login .white-cmn-btn { position: absolute; top: 10px; right: 10px; background-color: #fff;  color: #54595F;  width: 70px;  height: 30px;
    font-size: 14px;}
.card-payment.payment-proc .app-cnt .paid-h2 { display: contents !important; }
.card-payment.payment-proc .app-cnt h2 { display: flex !important; flex-direction: column; }

}
  
  @media screen and (min-width:374px) and (max-width:567px) {
    .add-clinic .modal-dialog {  max-width: 300px !important;}	
    .add-clinic .modal-content { padding:30px 20px 20px !important;}
    }
    
    @media screen and (min-width:200px) and (max-width:580px) {
    .change_password button.close { right: -35px !important; top: -45px !important;}    
    }
    
    @media screen and (min-width:440px) and (max-width:767px) {
    .clinic-blk .owl-theme .owl-nav { top: -170px !important;}
    }
    @media screen and (min-width:567px) and (max-width:767px) {
    .login-blk { width:380px;}	
    .form-row .form-group { width: 48%; display: flex;}
    .form-row { margin-bottom: 0;}
    .login-blk.resgister-blk { width: 500px;}
    .payment-blk .app-cnt .app-lt {    align-items: center;}
    .user-drop-down .dropdown-toggle span{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width:95px; display:inline-block; vertical-align: middle;}
    .user-drop-down .dropdown-toggle img { margin-right: 15px;}
    /* .user-drop-down .dropdown-toggle i { margin-right: 15px;} */
    .user-drop-down .dropdown-toggle:after { margin-left:15px;}
    .upload_image .modal-dialog { max-width: 400px !important;}
    .form-group.b-day-group .inr-form-group span { margin: 0 20px;}
    .login-blk.resgister-blk .top-form { margin-bottom: 20px;}
    .cmn_info .modal-dialog { max-width: 500px !important;}
    .del-model .modal-dialog { max-width: 300px !important;}
    .choose-model-type .modal-dialog { max-width: 300px !important;}
    .cmn-heading { display: flex; justify-content: space-between;  width: 100%;  align-items: center;  flex-direction: row;}
    .cmn-heading .cmn-btn { margin-top:0px;}
    .app-cnt h2 { width: 100%; margin: 10px 0 0; line-height: 18px; align-items: center; justify-content: space-between; flex-direction: row;}
    .add-clinic .modal-dialog {  max-width: 330px !important;}	
    .add-clinic .modal-content { padding:45px !important;}
    .add-clinic button.close { right: -105px !important; top: -60px !important;}
    .chose-clinic a i { width: 120px;}
    .chose-clinic a span { width: calc(100% - 120px);}
    .browse-treatment { padding:10px 40px 20px;}
    .my_booking_flow .mCSB_inside > .mCSB_container { margin-right: 30px;}
    .browse-treatment .accordion-group { padding:15px 20px;}
    .schdule-body h1 { text-align:center; font-size:24px;}
    .my_booking_flow .schdule-body .browse-treatment { padding:40px;}
    #book_flow_2 .chose-time h2 { width: 300px;} 
    .my_booking_flow .time-cnt span { font-size:14px; width:64px;}
    .my_booking_flow .modal-dialog { max-width: 325px !important;}
    #book_flow_2 .modal-dialog { max-width: 500px !important;}
    .my_booking_flow .modal-body.time-body { padding: 0 85px;}
    .tret-heading { font-size:18px;}
    .my_booking_flow .card-payment .app-cnt h2 { margin-top: 0; line-height: 20px; flex-direction: column; align-items: flex-start;}
    .my_booking_flow .card-payment.payment-proc .app-cnt.cli-pay { flex-direction: row; margin-top: 0;}
    .my_booking_flow .card-payment.payment-proc .app-cnt.cli-pay h4{     align-items: flex-end;   flex-direction: column;}
	.form-group.btn-group.chose-type-group .type-btn { margin-bottom:100px;}
	
    }