@media (max-width: 1499.98px) {
  .loginBoxContent h4 {
    font-size: 44px;
  }
}

@media (max-width: 1399.98px) {
  .loginBoxContent h4 {
    font-size: 34px;
  }
  .loginBoxContent p {
    font-size: 22px;
  }
  .loginFormBox {
    width: 55%;
  }
  .contactus-page .contactus-details {
    
    margin: -30px 0 100px;
  }
 
}
@media (max-width: 1299.98px) {

  .loginTitleBox {
    width: 100%;
  }

}
@media (max-width: 1199.98px) {
  .loginHome .headSlied, .loginForm .headSlied {
    width: 70%;
  }
  .login-box-form h3 {
    font-size: 28px;
  }
  .loginBoxContent h4 {
    font-size: 32px;
  }
  .login-box-form-input {
    max-width: 400px;
  }
  .logionFotter {
    background: #ffffff;
  }
  body.login.loginForm .loginFormArea:before {
    right: -20px;
    border: 20px solid #4B539B;
  }
  .loginBoxContent {
    width: 40%;
  }
  .commonTheme header .navbar .navbar-brand img {
    width: 80px;
  }
  .commonAreaBoxSideBar {
    width: 0px !important;
    position: absolute;
    top: 70px;
    height: calc(100% - 70px);
    overflow: hidden;
    z-index: 9;
  }
  .commonAreaBox:has(.close):before {
    content: '';
    background: #0f142696;
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 5;
  }
  .SuperAdminClass .commonAreaBoxSideBar {
    width: 0px !important;
    border-right: 0;
  }

  .commonAreaBoxSideBar.close {
    width: 240px !important;
  }

  .SuperAdminClass .commonAreaBoxSideBar.close {
    width: 245px !important;
    border-right: 5px solid #313155;
  }

  .commonAreaBoxSideBar ~ .commonAreaBoxConnect, .SuperAdminClass .commonAreaBox .commonAreaBoxConnect {
    width: 100%;
  }
  .commonAreaBoxCard .card.customCardTheme {
    width: 100%;
    margin-bottom:15px;
  }
  .commonAreaBoxCard {
    flex-direction: column;
  }
  .commonTheme table {
    min-width: 900px !important;
  }
  .commonTheme table.customTableTitle {
    min-width: unset !important;
  }
    .commonTheme table.customTableBody {
      min-width: unset !important;
    }
  .modal-dialog table {
    min-width: 600px !important;
  }
  footer .footerSupport .footer-item {
    padding-left: 5%;
  }
  .ClientAdminClass .titletag .filterRight {
    flex-direction:row;
  }
  .loginForm header {
    position: relative;
  }
}
@media (max-width: 992.98px) {
  .modal.show .modal-dialog {
    max-width: 100% !important;
  }
  .loginHome .PropaneSoftware .left-contect h2 {
    font-size: 30px;
  }
  .loginForm main.main-group {
    padding-top: 50px;
  }
  .login-box {
    flex-direction: column;
    padding-bottom:0;
  }
  .loginForm main.main-group {
    padding-bottom: 0;
    justify-content: flex-start;
  }
  .loginBoxContent {
    width: 100%;
  }
  .loginForm, .loginForm .loginFormArea {
    overflow-x: hidden;
    overflow-y: auto;
  }
  .areaConnectBox {
    position: relative;
    padding-top: 10%;
    text-align: center;
  }
  .loginFormBox {
    width: 100%;
  }
  .loginlink {
    width: auto;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  ul.loginlink li {
    margin: auto;
  }
  .login-box-form-input {
    max-width: 530px;
  }
  body.login.loginForm .loginFormArea:before, body.login.loginForm .loginFormArea:after {
    display:none;
  }
  .loginBoxContent {
    position: relative;
    
    bottom:0;
    z-index: 1;
    

  }
  body.login.loginForm .loginFormArea .loginBoxContent:before,
  body.login.loginForm .loginFormArea .loginBoxContent:after {
    content: '';
    position: absolute;
    display: block;
    width: 120%;
    height: 100%;
    max-height: 400px;
    border-radius: 90% 90% 0 0;
    left: -10%;
    bottom: 0%;
  }
  body.login.loginForm .loginFormArea .loginBoxContent:before {
   
  
    background: #1A226F;
    border-top: 20px solid #4B539B;
   
  }
  body.login.loginForm .loginFormArea .loginBoxContent:after {    
    background: #1F297F54;
    z-index: -2;
    bottom:20px;
  }
  .logionFotter {
    background: #1A226F;
    position: unset;
    color:#fff;
    text-align:center;
  }
  .commonTheme header .navbar .navbar-brand {
    width: 140px;
  }
  
 
  .mUser-option {
    display:none;
  }
    .mProfile, .mUser-option.open {
      display: block;
    }
    .mUser-option.open {
      position: absolute;
      right: 0;
      /*      width: 100%;*/
      top: 80px;
      background: #fff;
      z-index: 8;
      box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    }
      .mUser-option.open ul.navbar-nav {
        flex-direction: column !important;
        gap: 0px !important;
        padding: 10px;
      }
  header .navbar .profile .dropdown .dropdown-toggle {
    padding: 11px 20px !important;
  }
  a#userBtn {
    width: 40px;
    height: 40px;
    border-radius: 30px;
    background: #313155;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
  }
  .dashboard-wrapper .dash-tab .titletag .left-btn h2 {
    font-size: 18px;
    white-space: nowrap;
  }
  .ClientAdminClass .dashboard-wrapper .dash-tab .titletag {
    flex-direction: column;
    align-items: baseline;
    gap: 15px;
  }
   
  .filterRight {
    flex-direction: column;
    width: auto;
  }
  .contactus-page .contactus-details {
    margin: 20px 0 0;
  }
  .contactus-page-details {
    flex-direction: column-reverse;
  }
    .contactus-page-details .left-contect ,
    .contactus-page-details .right-contect {
      width:100%;
    }
  .contactus-page .contactus-details {
    flex-direction: column;
  }
    .contactus-page .contactus-details > div {
      width: 100%;
      max-width: 100%;
      padding: 30px 15px !important;
    }
  footer .footerSupport .footer-item {
    width: calc(100% / 2 - 9px);
  }
  .custom_col.custom_col_btn {
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 10px;
  }
  .custom_row.custom_view .custom_col.custom_col_btn {
    width: auto;
  }
}
@media (max-width: 767.98px) {
  .ClientAdminClass .filterRight.ClientAdminView {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
  }
  .custom_row.custom_view .custom_col.custom_col_btn {
    width: 100%;
  }
  .dashboard-wrapper .dash-tab .titletag {
   
    flex-direction: column;
    gap: 15px;
  }
    .dashboard-wrapper .dash-tab .titletag .left-btn {
      text-align:left;
      width:100%;
    }
    .dashboard-wrapper .dash-tab .titletag .left-btn h2 {
      text-align: left;
      display: flex;
      width: 100%;
    }
  
  .areaConnectBox {
    padding-top: 20%;
  }
  .custom_row {
    gap:10px;
    padding: 20px 0;
  }
/*    .custom_row .custom_col {
      width: calc(50% - 10px);
    }*/
      .custom_row .custom_col .input-group.mb-3 {
        margin-bottom:0!important;
      }

  table.table {
    min-width:1024px;
  }
  .dashboard-wrapper .dash-tab .table-data-list table td {
    white-space: nowrap;
  }
  .custom_row .custom_col {
    width: calc(50% - 10px);
  }

    .custom_row .custom_col .input-group {
      display: flex;
      flex-direction: column;
    }
  .custom_col.custom_col_btn {
    width: 100%;
    align-items: center;
    display: flex;
    justify-content: center;
    gap:10px;
  }
 
}
@media (max-width: 575.98px) {
  .loginHome .headSlied, .loginForm .headSlied {
    width: 100%;
    margin-top: 20px;
  }
  .loginHome header .navbar .navbar-brand, .loginForm header .navbar .navbar-brand {
    margin: auto;
  }
  section.PropaneSoftware {
    flex-direction: column-reverse;
    height: auto;
    background: #fff;
    justify-content: space-around;
    min-height: 580px;
  }
  .loginHome main.main-group {
    min-height: 548px;
  }
  .PropaneSoftware .left-contect {
    width: 100%;
  }
  .PropaneSoftware .right-contect {
    width: 100%;
  }
  footer .footerSupport .footer-item {
    width:100%;
  }
    .filterRight input.form-control.filtertb {
      max-width: 247px;
    }
  .custom_row .custom_col {
    width: 100%;
  }
  .filterRightInput .input-group .label {
    text-align: center;
  }

  .filterRightInput .input-group {
    flex-direction: column;
    align-items: center;
  }
        .custom_row .custom_col .input-group {
        flex-direction: column;
      }
  .custom_row .custom_col .input-group .form-control {
   width:100%;
  }
}