/* Extra small devices (portrait phones, less than 575.98px) */
@media (max-width: 575.98px) {
  #desktop {
    display: none;
  }

  section.navbar-custom {
    /* padding-top: 60px; */
    background-color: #f9f9f9;
    /* line-height: 60px; */
  }

  div.body-balance {
    height: -webkit-calc(100vh - 85px);
    height: -moz-calc(100vh - 85px);
    height: calc(100vh - 85px);
  }

  .tab-border-balance {
    height: -webkit-calc(100vh - 135px);
    height: -moz-calc(100vh - 135px);
    height: calc(100vh - 135px);
  }

  .body-height-exchange-rate {
    height: -webkit-calc(100vh - 185px);
    height: -moz-calc(100vh - 185px);
    height: calc(100vh - 185px);
  }

  .body-height-history-rate {
    max-height: -webkit-calc(100vh - 272px);
    max-height: -moz-calc(100vh - 272px);
    max-height: calc(100vh - 272px);
    font-size: 1rem;
  }

  .edit-rate input {
    width: 50px;
    height: 24px;

  }

  .edit-rate input:disabled {
    -webkit-text-fill-color: #0d0d0d;
    color: #595959 !important;
  }

  .flex-container>div.flex-custom-branch {
    width: 100% !important;
    margin: unset;
    text-align: center;
  }

  .form-control {
    height: 30px;
    font-size: 1rem;
  }

  .rate-history-tab>li>a {
    font-size: 1.2rem;
  }

  /* btn */
  .btn {
    font-size: 1rem;
  }

  .btn-md {
    padding: 6px 8px;
  }

  .box-date-currency-rate img {
    height: 34px;
    margin-top: -3px;
  }

  .table-fixed-head table>thead>tr>th,
  .body-height-exchange-rate,
  .mode-tab-hq>li>a,
  .box-date-currency-rate a,
  a.login-type {
    font-size: 1rem !important;
  }

  .box-date-currency-rate a {
    margin-top: 0px;
  }

  .mode-tab-hq>li>a {
    font-size: 0.7rem !important;
  }

  /* nav */
  .nav>li>a {
    padding: 10px 3px;
  }

  /* table */
  .table>thead>tr>th,
  .table>tbody>tr>th,
  .table>tfoot>tr>th,
  .table>thead>tr>td,
  .table>tbody>tr>td,
  .table>tfoot>tr>td {
    padding: 6px;
  }

  .table.border-none thead tr th,
  .table.border-none tbody tr td {
    border-top: none !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
  }

  /****************/
  /* Authencation */
  /****************/
  .inbox-logo-img img {
    height: 100px;
  }

  .box-item-menu {
    width: 140px;
    height: 130px;
  }

  .box-item-menu img {
    height: 65px;
  }

  .box-item-menu p {
    margin-top: 15px;
  }

  .staff-tab>li>a {
    padding: 8px 6px;
    text-align: center;
    width: auto;
    height: 30px;
    font-size: 1.0rem;
  }

  div.body-login {
    /* height: calc(100vh - 370px); */
    width: 80%;
  }
}

/* Extra small devices (portrait phones, less than 576px) */
@media (min-width: 576px) {
  @content;
}

/* Extra small devices (portrait phones, less than 922px) */
@media (min-width: 922px) {
  @content;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
  @content;
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) {
  body {
    overflow-x: hidden;
  }

  #mobile {
    display: none;
  }

  #mobile-show-rate {
    display: none;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  body {
    overflow-x: hidden;
  }

  #mobile {
    display: none;
  }

  #mobile-show-rate {
    display: none;
  }

  .form-control {
    height: 35px;
    font-size: 1.2rem !important;
  }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  #mobile-show-rate {
    display: none;
  }

  .logo img.mobile {
    display: none;
  }

  #mobile {
    display: none;
  }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

  .table-fixed-head table>thead>tr>th,
  .body-height-exchange-rate {
    font-size: 1.4rem;
  }

  #mobile-show-rate {
    display: none;
  }

  #mobile {
    display: none;
  }

  .logo img.mobile {
    display: none;
  }
}
