/* iPhone 6 */
/* Landscape */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) {
  /* Sidebar */
  #wrapper {
    display: block !important;
    height: 100vh;
  }

  sidebar-cmp {
    width: 100%;
    position: absolute;
    left: -100%;
    z-index: 10001;
  }

  sidebar-cmp.is-open {
    left: 0;
  }

  navbar-cmp .nav-container {
    position: fixed;
    width: 100%;
    z-index: 10000;
  }
  /* End Sidebar */

  .title-header {
    font-size: 26px !important;
  }

  .content-layout {
    margin-top: 70px !important;
  }

  .container-fluid {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
  }

  app-dashboard .merchant-info-wrapper {
    display: block !important;
  }

  app-dashboard .date-container {
    width: 100% !important;
  }

  app-dashboard .date-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .rate-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .rate-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .rate-value {
    font-size: 28px !important;
  }

  app-dashboard .rate-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .stock-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .stock-wrapper.second {
    display: flex !important;
    flex-wrap: wrap;
  }

  app-dashboard .transaction-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .transaction-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .other-container {
    width: 48% !important;
    margin-bottom: 12px;
  }

  app-check-price .width48 {
    width: 100%;
  }

  app-check-price .scanner-wrapper {
    display: block !important;
  }

  app-check-price .scanner-wrapper .left-col {
    margin-right: 0px;
    margin-bottom: 40px;
  }

  app-check-price .scanner-wrapper .right-col {
    margin-right: 0px;
    width: 100%;
  }

  app-check-price .scanner-wrapper .right-col label {
    text-align: center;
    padding-right: 0px !important;
  }

  app-check-price .action-button-container {
    display: flex;
    justify-content: center;
  }

  app-check-price .sku-data {
    flex-direction: column;
    align-items: center;
  }

  app-check-price .sku-data .prod-desc-img {
    margin-right: 0px;
    margin-bottom: 16px;
  }

  app-check-price .sku-data .prod-desc-wrapper h6 {
    text-align: center;
  }

  app-check-price .detail {
    margin-left: 0px !important;
  }

  app-model .card-body .title-header {
    font-size: 14px !important;
  }

  app-model .filter-wrapper {
    display: block !important;
  }

  app-model .filter {
    display: block;
    width: 100% !important;
  }

  app-model .filter-field {
    width: 100% !important;
  }

  app-model .filter-button-wrapper {
    margin-top: 8px;
    width: 100% !important;
    justify-content: space-between;
  }

  app-model .filter-button-wrapper button {
    width: 48% !important;
  }

  app-add-model .variant-col {
    width: 44% !important;
  }

  app-detail-sku .detail-wrapper {
    display: block;
  }

  app-detail-sku .detail-wrapper .width48 {
    width: 100% !important;
  }

  app-detail-sku .detail-wrapper .width48:nth-child(2) {
    margin-left: 0px !important;
  }

  .width60 {
    width: 100% !important;
  }

  .datatable-search {
    width: 100% !important;
    margin-bottom: 18px;
  }

  .dataTables_wrapper .dt-buttons {
    display: none;
  }

  div.dataTables_paginate {
    float: left !important;
  }

  table.custom-table button {
    padding: 10px 10px !important;
  }

  .dataTables_info {
    display: none;
  }
}
/* End Landscape */

/* Portrait */
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: landscape) {
  /* Sidebar */
  #wrapper {
    display: block !important;
    height: 100vh;
  }

  sidebar-cmp {
    width: 100%;
    position: absolute;
    left: -100%;
    z-index: 10001;
  }

  sidebar-cmp.is-open {
    left: 0;
  }

  navbar-cmp .nav-container {
    position: fixed;
    width: 100%;
    z-index: 10000;
  }
  /* End Sidebar */

  .title-header {
    font-size: 26px !important;
  }

  .content-layout {
    margin-top: 70px !important;
  }

  .container-fluid {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
  }

  app-dashboard .rate-value {
    font-size: 28px !important;
  }

  app-check-price .width48 {
    width: 100%;
  }

  app-check-price .scanner-wrapper {
    display: block !important;
  }

  app-check-price .scanner-wrapper .left-col {
    margin-right: 0px;
    margin-bottom: 40px;
  }

  app-check-price .scanner-wrapper .right-col {
    margin-right: 0px;
    width: 100%;
  }

  app-check-price .scanner-wrapper .right-col label {
    text-align: center;
    padding-right: 0px !important;
  }

  app-check-price .action-button-container {
    display: flex;
    justify-content: center;
  }

  app-check-price .sku-data {
    flex-direction: row;
    justify-content: space-around;
  }

  app-check-price .sku-data .prod-desc-img {
    margin-right: 0px;
    margin-bottom: 16px;
  }

  app-check-price .sku-data .prod-desc-wrapper h6 {
    text-align: center;
  }

  app-check-price .detail {
    margin-left: 0px !important;
  }

  app-model .card-body .title-header {
    font-size: 14px !important;
  }

  app-model .filter-wrapper {
    display: block !important;
  }

  app-model .filter {
    display: block;
    width: 100% !important;
  }

  app-model .filter-field {
    width: 100% !important;
  }

  app-model .filter-button-wrapper {
    margin-top: 8px;
    width: 100% !important;
    justify-content: space-between;
  }

  app-model .filter-button-wrapper button {
    width: 48% !important;
  }

  app-add-model .variant-col {
    width: 44% !important;
  }

  .width60 {
    width: 100% !important;
  }

  .datatable-search {
    width: 100% !important;
    margin-bottom: 18px;
  }

  .dataTables_wrapper .dt-buttons {
    display: none;
  }

  div.dataTables_paginate {
    float: left !important;
  }

  table.custom-table button {
    padding: 10px 10px !important;
  }

  .dataTables_info {
    display: none;
  }
}
/* End Portrait */
/* End iPhone 6 */

/* iPad */
/* Landscape */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  /* Navigation Bar */
  .title-header {
    font-size: 26px !important;
  }

  .container-fluid {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
  }

  app-dashboard .merchant-info-wrapper {
    display: block !important;
  }

  app-dashboard .date-container {
    width: 100% !important;
  }

  app-dashboard .date-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .rate-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .rate-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .rate-value {
    font-size: 28px !important;
  }

  app-dashboard .rate-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .stock-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .stock-wrapper.second {
    display: flex !important;
    flex-wrap: wrap;
  }

  app-dashboard .transaction-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .transaction-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .other-container {
    width: 48% !important;
    margin-bottom: 12px;
  }

  app-check-price .width48 {
    width: 100%;
  }

  app-check-price .scanner-wrapper {
    display: block !important;
  }

  app-check-price .scanner-wrapper .left-col {
    margin-right: 0px;
    margin-bottom: 40px;
  }

  app-check-price .scanner-wrapper .right-col {
    margin-right: 0px;
    width: 100%;
  }

  app-check-price .scanner-wrapper .right-col label {
    text-align: center;
    padding-right: 0px !important;
  }

  app-check-price .action-button-container {
    display: flex;
    justify-content: center;
  }

  app-check-price .sku-data {
    flex-direction: row;
    justify-content: space-around;
  }

  app-check-price .detail {
    margin-left: 0px !important;
    margin-bottom: 32px !important;
  }

  app-model .card-body .title-header {
    font-size: 14px !important;
  }

  app-model .filter-wrapper {
    display: block !important;
  }

  app-model .filter {
    display: block;
    width: 100% !important;
  }

  app-model .filter-field {
    width: 100% !important;
  }

  app-model .filter-button-wrapper {
    margin-top: 8px;
    width: 100% !important;
    justify-content: space-between;
  }

  app-model .filter-button-wrapper button {
    width: 48% !important;
  }

  app-add-model .variant-col {
    width: 44% !important;
  }

  .width60 {
    width: 100% !important;
  }

  .datatable-search {
    width: 100% !important;
    margin-bottom: 18px;
  }

  .dataTables_wrapper .dt-buttons {
    display: none;
  }

  div.dataTables_paginate {
    float: left !important;
  }

  table.custom-table button {
    padding: 10px 10px !important;
  }

  .dataTables_info {
    display: none;
  }
}

/* Portrait */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  /* Navigation Bar */
  .title-header {
    font-size: 26px !important;
  }

  .container-fluid {
    padding-left: 2.5rem !important;
    padding-right: 2.5rem !important;
  }

  app-dashboard .merchant-info-wrapper {
    display: block !important;
  }

  app-dashboard .date-container {
    width: 100% !important;
  }

  app-dashboard .date-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .rate-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .rate-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .rate-value {
    font-size: 28px !important;
  }

  app-dashboard .rate-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .stock-wrapper {
    display: block !important;
    height: auto;
  }

  app-dashboard .stock-wrapper.second {
    display: flex !important;
    flex-wrap: wrap;
  }

  app-dashboard .transaction-container {
    width: 100% !important;
    padding-top: 20px;
    padding-bottom: 20px;
  }

  app-dashboard .transaction-container:nth-child(1) {
    margin-bottom: 8px !important;
  }

  app-dashboard .other-container {
    width: 48% !important;
    margin-bottom: 12px;
  }

  app-check-price .width48 {
    width: 100%;
  }

  app-check-price .scanner-wrapper {
    display: block !important;
  }

  app-check-price .scanner-wrapper .left-col {
    margin-right: 0px;
    margin-bottom: 40px;
  }

  app-check-price .scanner-wrapper .right-col {
    margin-right: 0px;
    width: 100%;
  }

  app-check-price .scanner-wrapper .right-col label {
    text-align: center;
    padding-right: 0px !important;
  }

  app-check-price .action-button-container {
    display: flex;
    justify-content: center;
  }

  app-check-price .sku-data {
    flex-direction: row;
    justify-content: space-around;
  }

  app-check-price .detail {
    margin-left: 0px !important;
    margin-bottom: 32px !important;
  }

  app-model .card-body .title-header {
    font-size: 14px !important;
  }

  app-model .filter-wrapper {
    display: block !important;
  }

  app-model .filter {
    display: block;
    width: 100% !important;
  }

  app-model .filter-field {
    width: 100% !important;
  }

  app-model .filter-button-wrapper {
    margin-top: 8px;
    width: 100% !important;
    justify-content: space-between;
  }

  app-model .filter-button-wrapper button {
    width: 48% !important;
  }

  app-add-model .variant-col {
    width: 44% !important;
  }

  .width60 {
    width: 100% !important;
  }

  .datatable-search {
    width: 100% !important;
    margin-bottom: 18px;
  }

  .dataTables_wrapper .dt-buttons {
    display: none;
  }

  div.dataTables_paginate {
    float: left !important;
  }

  table.custom-table button {
    padding: 10px 10px !important;
  }

  .dataTables_info {
    display: none;
  }
}
/* End iPad */

@media only screen and (max-width: 768px) {
  .prod-price {
    float: none;
  }
}