/* Landscape phones and portrait tablets */
@media (max-width: 767px) {

  .profile-page .vehicle .exterior-item {
    min-height: 700px;
  }

  .profile-page .insurance .information {
    padding-top: 0;
  }

  .profile-page .menu {
    text-align: center;
  }

  .typist {
    position: relative;
    top: 0;
  }

  .profile-page .vehicle .box.box-1 {
    height: auto;
  }

  .profile-page .item .menu-item {
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
  }

  .content-information-profile .panel-body.box-body.cus-h5 .col-md-6 {
    width: 50%;
    float: left;
  }

  .profile-page .vehicle .box.box-2 {
    height: auto;
    min-height: auto;
  }

  .profile-page .vehicle .box.box-3 {
    height: auto;
    min-height: auto;
  }

  .profile-page .vehicle .box .box-body.bottom {
    position: relative;
  }

  .profile-page .information {
    padding-top: 0;
    margin-top: 60px;
  }

  .profile-page .coe-bidding .bidding .information {
    padding-top: 0;
    margin-top: 60px;
  }

  .profile-page .loan .information {
    padding-top: unset;
  }

  .profile-page .vehicle .box-info {
    margin-top: 0;
  }

  .profile-page .drag-360-profile .drag-content img {
    right: 0;
  }

  .profile-modal-content .content {
    width: unset;
    padding: 10px;
    overflow-y: unset;
  }

  .profile-modal-content {
    width: 50% !important;
    height: auto;
  }

  .profile-modal-content div {
    overflow-y: unset !important;
  }

  .profile-page .drag-360-profile .drag-content .threesixty {
    min-height: 400px;
    overflow: unset;
  }

  .profile-page .drag-360-profile {
    position: relative;
    min-height: 400px;
  }

  .profile-page .drag-360-profile .drag-content img {
    width: 75%;
  }

  .profile-page .information .box.deposit {
    height: 250px;
  }

  .profile-page .loan .block-build {
    position: relative;
    top: 30px;
  }
}

/* Portrait phones and smaller */
@media (max-width: 480px) {
  .profile-page .item .menu-item.active {
    opacity: 1;
    color: unset;
  }

  .profile-page .menu .slick-slide .menu-item.active {
    color: red;
    text-shadow: 2px 2px 4px #000000;
    font-size: 11px;
  }

  .box-coe-bidding-detail .cell input {
    width: 100%;
  }

  .profile-page .menu {
    text-align: center;
    padding-left: unset;
    padding-right: unset;
  }

  .profile-page .item .menu-item {
    display: inline;
    padding-left: 5px;
    padding-right: 5px;
  }

  .profile-page .coe-bidding .bidding .information {
    padding-top: 0;
    margin-top: 30px;
  }

  .profile-page .drag-360-profile .drag-content .content-txt-360 {
    bottom: 0;
  }

  .profile-page .threesixty {
    overflow: hidden;
  }

  .profile-page .drag-360-profile .drag-content img {
    right: 0;
  }

  .profile-page .information {
    margin-top: 60px;
  }

  .profile-page .vehicle .box-info {
    margin-top: 0;
  }

  .profile-modal-content .content {
    width: unset;
  }

  .profile-modal-content {
    width: 100% !important;
  }

  .profile-page .information .box.sales-agreement {
    height: 250px;
  }

  .profile-page .drag-360-profile .drag-content .threesixty {
    min-height: 300px;
    overflow: unset;
  }

  .profile-page .drag-360-profile {
    position: relative;
    min-height: 300px;
  }

  .profile-page .vehicle .box.current-status {
    height: unset;
  }

  .profile-page .item.exterior {
    z-index: 99;
  }

  .profile-page .drag-360-profile .drag-content img {
    width: 100%;
  }

  .profile-page .vehicle .internal img {
    width: 100%;
  }

  .profile-page .vehicle .box.sales-agreement {
    height: 250px;
  }

  .profile-page .block-btn {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
  }

  .profile-page .information .box.deposit {
    height: auto;
  }

  /* loan */
  .profile-page .loan .information {
    padding-top: unset;
  }

  .profile-page .loan .box.box-red {
    min-height: 300px;
  }

  .profile-page .information .applying-hire-purchase-approved {
    top: 0;
    padding-top: 15px;
  }

  .profile-page .loan .information .purchase-information {
    top: 0;
  }

  .profile-page .loan .information .guarantor {
    top: 50px;
  }

  .profile-page .loan .block-build {
    top: 30px;
  }

  /* insurance */
  .profile-page .insurance .information {
    padding-top: unset;
  }

  .profile-page .insurance .information .insurance-quotes-insured {
    top: 0;
  }

  .profile-page .insurance .information .guarantor {
    top: 50px;
  }

  .profile-page .insurance .information .purchase-information {
    top: 0;
  }

  .profile-page .insurance .block-build {
    position: relative;
    top: 30px;
  }

  /*coe*/
  .profile-page .coe-bidding .bidded .information {
    padding-top: unset;
  }

  .profile-page .delivery .information {
    padding-top: 0;
  }

  .profile-page .delivery .memo-delivery {
    top: -300px;
  }

  .profile-page .delivery .block-build {
    top: -250px;
  }

  .profile-page .information .box.box-payment-detail .box-body .cell {
    text-align: center;
  }

  .profile-page .information .box.box-payment-detail .box-body .cell.text-right {
    line-height: 44px;
  }

  .profile-page .information {
    padding-top: 0;
  }

  .profile-page .vehicle .exterior-item {
    height: auto;
    padding-bottom: 15px;
  }

  .profile-page .vehicle .exterior-item .content {
    top: 0;
    transform: translateY(0);
  }

  .profile-page .vehicle .exterior-item .content .typist-c {
    margin-top: 25px;
    position: unset;
  }

  .profile-page .vehicle .exterior-item .content .typist {
    margin-top: 25px;
    position: unset;
  }

  .profile-page .vehicle .item .box {
    height: auto;
    min-height: 150px;
  }

  .profile-page .item .box.sales-agreement {
    height: 280px;
  }

  .profile-page .vehicle .item .box .panel-body {
    position: relative;
  }

  .profile-page .coe-bidding .bidding .row .box {
    height: auto;
  }

}

/* Portrait phones < 320px and smaller */
@media (max-width: 320px) {

  .profile-page .menu {
    padding-left: unset;
    padding-right: unset;
    margin-left: -10px;
  }
}