/* ********************************************************** 2560px **********************************************************  */
@media (min-width: 2560px) and (max-width: 3839px) {
   .container {
      max-width: 1760px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   h1 {
      font-size: 70px;
   }

   h2 {
      font-size: 40px;
   }

   h3 {
      font-size: 24px;
   }

   h4 {
      font-size: 24px;
   }

   h5 {
      font-size: 24px;
   }

   p {
      font-size: 18px;
      line-height: 24px;
   }

   .slider-item .row-card .active-btn {
      font-size: 18px;
   }

   .logo {
      margin-top: 100px;
      margin-bottom: 15px;
      width: 120px;
      height: auto;
   }
}

/* ********************************************************** 1920px **********************************************************  */
@media (min-width: 1920px) and (max-width: 2559px) {
   .container {
      max-width: 1760px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   h1 {
      font-size: 46px;
   }

   h2 {
      font-size: 36px;
   }

   h3 {
      font-size: 20px;
   }

   h4 {
      font-size: 20px;
   }

   h5 {
      font-size: 20px;
   }

   p {
      font-size: 16px;
      line-height: 24px;
   }

   .slider-item .row-card .active-btn {
      font-size: 16px;
   }

   .logo {
      margin-top: 100px;
      margin-bottom: 15px;
      width: 120px;
      height: auto;
   }
}



/* ********************************************************** 1440px **********************************************************  */
@media (min-width: 1440px) and (max-width: 1919px) {
   .container {
      max-width: 1280px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   h1 {
      font-size: 46px;
   }

   h2 {
      font-size: 36px;
   }

   h3 {
      font-size: 20px;
   }

   h4 {
      font-size: 20px;
   }

   h5 {
      font-size: 20px;
   }

   p {
      font-size: 16px;
      line-height: 24px;
   }

   .slider-item .row-card .active-btn {
      font-size: 16px;
   }

   .logo {
      margin-top: 100px;
      margin-bottom: 15px;
   }
}

/* ********************************************************** 1366px **********************************************************  */
@media (min-width: 1366px) and (max-width: 1439px) {
   .container {
      max-width: 1206px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   .logo {
      margin-top: 50px;
      margin-bottom: 15px;
   }
}

/* ********************************************************** 1024px **********************************************************  */
@media (max-width: 1024px) {
   .bg-header {
      background: url(../img/bg-header/1024.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 124px;
      margin-bottom: 15px;
      width: 120px;
      height: auto;
   }
}

/* ********************************************************** 834px **********************************************************  */
@media (max-width: 834px) {
   .bg-header {
      background: url(../img/bg-header/834.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 74px;
      margin-bottom: 15px;
      width: 120px;
      height: auto;
   }

   /* ***************** header ***************** */
   .container {
      max-width: 774px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   /* ***************** about ***************** */

   .about .row-content .item-none {
      display: none;
   }

   .about .row-content .item-text {
      flex: 0 1 66.666%;
      display: flex;
      justify-content: flex-end;
   }

   .about .row-content .item-logo {
      flex: 0 1 33.333%;
      display: flex;
      justify-content: flex-start;

   }

   .about .row-content .item-logo img {
      margin-left: 20px;
   }

   /* ***************** qualities ***************** */

   .qualities .row {
      display: flex;
      padding: 0px -10px;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;

   }

   .qualities .card {
      flex: 0 1 calc(50% - 20px);
      margin: 0;
   }
}

/* ********************************************************** 768px **********************************************************  */

@media (max-width: 768px) {
   .bg-header {
      background: url(../img/bg-header/768.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   /* ***************** orders ***************** */
   .orders-body .item {
      flex: 0 1 65%;
   }

   #cart-modal {
      width: 90%;
   }


}


/* ********************************************************** 480px **********************************************************  */

@media (max-width: 480px) {
   .bg-header {
      background: url(../img/bg-header/480.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 74px;
      margin-bottom: 15px;
      width: 60px;
      height: auto;
   }

   .container {
      max-width: 480px;
      margin: 0 auto;
      padding: 0px 20px;
   }

   /* ***************** about ***************** */
   .about .row-content {
      display: flex;
      flex-direction: column-reverse;
   }

   .about .row-content .item-none {
      display: none;
   }

   .about .row-content .item-text {
      flex: 0 1 100%;
      display: flex;
      justify-content: flex-end;
   }

   .about .row-content .item-logo {
      flex: 0 1 100%;
      display: flex;
      justify-content: center;

   }

   .about .row-content .item-logo img {
      margin-left: 20px;
   }

   /* ***************** qualities ***************** */

   .qualities .row {
      display: flex;
      padding: 0px -10px;
      flex-wrap: wrap;
      justify-content: center;
      gap: 20px;

   }

   .qualities .card {
      flex: 0 1 100%;
      margin: 0;
   }

   /* ***************** orders ***************** */
   .orders-body .item {
      flex: 0 1 90%;
   }

}

/* ********************************************************** 430px **********************************************************  */

@media (max-width: 430px) {
   .bg-header {
      background: url(../img/bg-header/430.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 74px;
      margin-bottom: 15px;
      width: 60px;
      height: auto;
   }

   h1 {
      font-size: 35px;
      margin-bottom: 7px;
   }
}

/* ********************************************************** 390px **********************************************************  */

@media (max-width: 390px) {
   .bg-header {
      background: url(../img/bg-header/390.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 74px;
      margin-bottom: 15px;
      width: 60px;
      height: auto;
   }
}

/* ********************************************************** 320px **********************************************************  */

@media (max-width: 320px) {
   .bg-header {
      background: url(../img/bg-header/320.jpg)no-repeat top center;
      background-size: cover;
      height: 100vh;
      width: 100%;
   }

   .logo {
      margin-top: 25px;
      margin-bottom: 15px;
      width: 50px;
      height: auto;
   }

   h1 {
      font-size: 27px;
      margin-bottom: 2px;
   }
}