/* Small devices */
@media screen and (max-width: 580px) {
  #lbFoPass {
    position: relative;
    left: 0px;
  }

  .avatarUser {
    width: 45px !important;
    height: 45px !important;
  }
}

/* Mobile: width < 740px */
@media screen and (max-width: 740px) {
  /********************  Header ********************/

  #desHeaderRoot {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .socialLink {
    font-size: 25px !important;
  }

  .socialLink1 {
    display: none !important;
  }

  .contentDetailCart {
    display: block !important;
  }

  .contentDetailCart #myQuatity,
  .contentDetailCart #myShip {
    padding-top: 20px !important;
    margin-left: 50px !important;
  }

  .contentDetailCart #myTotalProduct {
    padding-bottom: 20px !important;
  }

  .contentDetailCart #myTotal {
    padding-top: 0 !important;
    margin-left: 50px !important;
  }

  #cardChild1,
  #cardChild2 {
    margin: 0;
  }

  #loginRoot {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

/* Tablet: width >= 740 px and width < 1024 px */
@media screen and (max-width: 801px) {
  #cardChild3 {
    margin: 0 !important;
  }
}

@media screen and (max-width: 991px) {
  nav {
    display: none;
  }

  #smallMenuRoot {
    display: inline;
  }

  #productCollapse,
  #beautyCollapse,
  .offcanvas-body,
  .btn-close {
    color: rgb(41, 39, 39);
  }

  header {
    display: none;
  }

  #bannerRoot {
    margin-top: 0px !important;
  }

  #quickMenuRoot {
    background-color: #000;
  }

  #quickMenuRoot h5 {
    color: #ffff;
    text-transform: uppercase;
    letter-spacing: 5px;
    margin-top: 10px !important;
    position: relative;
  }

  #quickMenuRoot h5 {
    display: block;
  }

  .socialLink1 {
    display: flex;
    text-align: right;
    justify-content: right;
    position: absolute;
    top: 0;
    right: 0;
    padding-top: 10px;
  }

  .socialLink1 .ri-facebook-box-line {
    color: #0073c6;
  }

  .socialLink1 .ri-instagram-line {
    color: #d15465;
  }

  .socialLink1 .ri-twitter-line {
    color: #3596b5;
  }

  .socialLink1 .ri-mail-line {
    color: #ff8066;
  }
}

@media screen and (min-width: 992px) {
  nav {
    display: block;
  }

  #quickMenuRoot h5,
  .socialLink1,
  #btnSmallMenu {
    display: none;
  }

  #quickMenuRoot {
    display: none !important;
  }

  header .container {
    margin-top: 5px !important;
  }
}

/* PC : width >= 1024 px */
@media screen and (max-width: 1200px) {
  .card {
    margin-left: 0px !important;
    margin-right: 0px !important;
  }
}
