/* ===== Global Design ===== */
@media (max-width: 374px) {
  .container {
    max-width: 320px;
  }
}

@media (min-width: 375px) and (max-width: 479px) {
  .container {
    max-width: 360px;
  }
}

@media (min-width: 480px) and (max-width: 599px) {
  .container {
    max-width: 420px;
  }
}

@media (min-width: 600px) and (max-width: 767px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) and (max-width: 899px) {
  .container {
    max-width: 810px;
  }
}

@media (min-width: 900px) and (max-width: 1024px) {
  .container {
    max-width: 950px;
  }
}

@media (min-width: 1025px) and (max-width: 1199px) {
  .container {
    max-width: 1080px;
  }
}

@media (min-width: 1200px) and (max-width: 1439px) {
  .container {
    max-width: 1260px;
  }
}

@media (min-width: 1440px) {
  .container {
    max-width: 1320px;
  }
}

@media (max-width: 1024px) {
  h1 {
    font-size: 64px;
  }

  h2 {
    font-size: 36px;
  }

  h3 {
    font-size: 32px;
  }

  h4 {
    font-size: 26px;
  }

  h5 {
    font-size: 22px;
  }

  h6 {
    font-size: 18px;
  }

  p,
  a {
    font-size: 16px;
  }

  .Padtop {
    padding-top: 70px;
  }

  .Padbottom {
    padding-bottom: 70px;
  }

  .Padtopbottom {
    padding-top: 70px;
    padding-bottom: 70px;
  }


}

@media (max-width: 767px) {
  h1 {
    font-size: 48px;
    line-height: 50px;
  }

  h2 {
    font-size: 32px;
  }

  h3 {
    font-size: 28px;
  }

  h4 {
    font-size: 24px;
  }

  h5 {
    font-size: 18px;
  }

  h6 {
    font-size: 16px;
  }

  p,
  a {
    font-size: 14px;
  }

  .Padtop {
    padding-top: 50px;
  }

  .Padbottom {
    padding-bottom: 50px;
  }

  .Padtopbottom {
    padding-top: 50px;
    padding-bottom: 50px;
  }
}

/* ===== End of Global Design ===== */
/* ===== 1.0. Header Section ===== */
@media (max-width: 991px) {
  header .nav-logo img {
    width: 100px;
  }

  header #mySidenav img {
    width: 100px;
  }
}

/* ===== End of 1.0. Header Section ===== */
/* ===== 1.1. Hero Section ===== */
@media (max-width: 1024px) {
  .Hero .bluish-bg {
    width: 70%;
    height: 70%;
  }

  .Hero i:nth-child(1) {
    top: 0px;
    left: 50px;
  }

  .Hero i:nth-child(2) {
    top: 150px;
    left: -10px;
  }

  .Hero i:nth-child(3) {
    top: 100px;
    right: -10px;
  }

  .Hero i:nth-child(4) {
    top: 300px;
    right: 50px;
  }
}

@media (max-width: 768px) {
  .Hero .bluish-bg {
    width: 50%;
    height: 50%;
    opacity: 0.8;
  }

  .Hero i:nth-child(1) {
    display: none;
  }

  .Hero i:nth-child(2) {
    display: none;
  }

  .Hero i:nth-child(3) {
    display: none;
  }

  .Hero i:nth-child(4) {
    display: none;
  }
}

/* ===== End of 1.1. Hero Section ===== */
/* ===== 1.2. Video Component Section ===== */
@media (max-width: 768px) {
  .Video img {
    width: 100%;
  }
}

/* ===== 1.2. Video Component Section ===== */
/* ===== 1.3. Partners Section ===== */
@media (max-width: 991px) {
  .partners-slider .slide-track {
    width: calc((100% / 5) * 10);
    /* 5 visible, duplicated => 10 */
    animation-duration: 15s;
  }
}

@media (max-width: 767px) {
  .partners-slider .slide-track {
    animation-duration: 15s;
  }
}

/* ===== End of 1.3. Partners Section ===== */
/* ===== 1.4. Industries Section ===== */
@media (max-width: 991px) {
  .Industies img {
    width: 120px;
    height: auto;
  }

  .Industies .col-6:nth-last-child(1) {
    margin-top: 75px;
    margin-left: -80px;
  }
}

/* ===== 1.5. How We Work Section ===== */
@media (min-width: 992px) {
  .HowWeWork .justify-content-between:hover>div {
    opacity: 0.98;
  }

  .HowWeWork .justify-content-between:hover .slide-text {
    transform: translateX(30%);
  }

  .HowWeWork .justify-content-between:hover .carousel {
    transform: translateX(-45%);
  }

  .HowWeWork .justify-content-between:hover .slide-text>*,
  .HowWeWork .justify-content-between:hover .slide-text h5 {
    transform: translateX(30%);
    text-align: right;
  }

  .HowWeWork .justify-content-between.flex-md-row-reverse:hover .carousel {
    transform: translateX(50%);
  }

  .HowWeWork .justify-content-between.flex-md-row-reverse:hover .slide-text>*,
  .HowWeWork .justify-content-between.flex-md-row-reverse:hover .slide-text h5 {
    transform: translateX(-90%);
    text-align: left;
  }
}

@media (max-width: 991px) {

  .HowWeWork .slide-text,
  .HowWeWork .carousel {
    width: 100%;
    text-align: right !important;
  }

  .HowWeWork .flex-md-row-reverse .slide-text,
  .HowWeWork .carousel {
    width: 100%;
    text-align: left !important;
  }

}

@media (max-width: 768px) {
  .HowWeWork .slide-text {
    text-align: center !important;

  }
}

/* ===== End of 1.5. How We Work Section ===== */
/* =====  Progress Section ===== */
@media (max-width: 991px) {
  .Progress .count-up span {
    font-weight: 600;
    font-size: 40px;
    margin: 14px;
  }
}

/* ===== End of Progress Section ===== */
/* ===== 1.8. Faq Section ===== */
@media (max-width: 991px) {
  .Faq .accordion-item h1 {
    font-size: 46px;
  }
}

@media (max-width: 580px) {
  .Faq .accordion-item h1 {
    font-size: 28px;
  }
}

/* ===== End of 1.8. Faq Section ===== */
/* ===== Calender Section ===== */
@media (max-width: 1024px) {
  .Calender .book {
    height: 900px;
  }
}

/* ===== End of Calender Section ===== */
/* ===== 1.9. Footer Section ===== */
@media (max-width: 991px) {

  footer .col-lg-3 p,
  footer .col-lg-4 p {
    width: 40%;
    text-align: center;
  }
}

@media (max-width: 580px) {

  footer .col-lg-3 p,
  footer .col-lg-4 p {
    width: 70%;
  }
}

/* ===== 1.9. Footer Section ===== */