/* #region ======== Global Styling ======== */
@media screen and (max-width: 1440px) {
  .hero-bg::before {
    width: 900px;
    height: 900px;
  }

  .twosec-bg::before {
    width: 900px;
    height: 900px;
    left: -500px;
  }

  .thirdsec-bg::before {
    width: 900px;
    height: 900px;
    left: 1100px;
  }

  .hero-bg::after {
    left: 1280px;
  }

  .hero::after {
    left: 90px;
  }
}

@media screen and (max-width: 1399px) {
  .hero-bg::after {
    left: 1200px;
  }

  .twosec-bg::before {
    top: 400px;
  }
}

@media screen and (max-width: 1199px) {
  header aside .overflow-hidden::before {
    left: 590px;
  }

  .hero-bg::after {
    left: 1000px;
    top: 740px;
  }

  .thirdsec-bg::before {
    left: 1015px;
    top: 660px;
  }

  .about-bg::before {
    width: 300px;
    height: 500px;
    top: 800px;
    left: -200px;
  }
}

@media screen and (max-width: 992px) {

  .container,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl {
    max-width: 990px;
  }
}

@media screen and (max-width: 991px) {
  h1 {
    font-size: 60px;
    line-height: 72px;
  }

  h2 {
    font-size: 34px;
    line-height: 44px;
  }

  h3 {
    font-size: 28px;
    line-height: 38px;
  }

  h4 {
    font-size: 24px;
    line-height: 30px;
  }

  h5 {
    font-size: 18px;
    line-height: 24px;
  }

  h6 {
    font-size: 16px;
    line-height: 20px;
  }

  .p,
  p {
    font-size: 14px;
    line-height: 18px;
  }

  a {
    font-size: 16px;
    line-height: 20px;
  }

  button {
    font-size: 16px;
    line-height: 20px;
  }

  header aside .overflow-hidden::before {
    left: 300px;
    top: 470px;
  }

  .hero-bg::before {
    width: 625px;
    height: 625px;
    top: -200px;
    left: 500px;
  }

  .hero-bg::after {
    left: -340px;
    top: 1160px;
  }

  .hero::after {
    display: none;
  }

  .twosec-bg::before,
  .about-bg::before {
    display: none;
  }

  .thirdsec-bg::before {
    left: 560px;
    top: 260px;
  }
}

@media screen and (max-width: 768px) {
  .hero-bg::before {
    width: 625px;
    height: 625px;
    top: -272px;
    left: 249px;
  }

  .thirdsec-bg::before {
    left: 450px;
  }
	.About p {text-align: left !important; font-size: 1.2rem;}
	.Blogs p {font-size: 1rem; line-height: 1.5;}
	.Blogs > .container > .row > .col-lg-6 > div > div > figure > .img-mob {display:block;}
	.Blogs > .container > .row > .col-lg-6 > div > div > figure > .img-desc {display:none;}
	
}

@media screen and (max-width: 480px) {
  h1 {
    font-size: 42px;
    line-height: 48px;
  }

  h2 {
    font-size: 30px;
    line-height: 40px;
  }

  h3 {
    font-size: 28px;
    line-height: 38px;
  }

  h4 {
    font-size: 22px;
    line-height: 28px;
  }

  h5 {
    font-size: 18px;
    line-height: 23px;
  }

  h6 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 500;
  }

  .p,
  p {
    font-size: 14px;
    line-height: 18px;
  }

  a {
    font-size: 16px;
    line-height: 20px;
  }

  button {
    font-size: 16px;
    line-height: 20px;
  }

  .hero-bg::before {
    width: 379px;
    height: 379px;
    top: -131px;
    left: -121px;
    filter: blur(130px);
  }

  .hero-bg::after {
    display: none;
  }

  .twosec-bg::before,
  .about-bg::before {
    display: block;
    width: 379px;
    height: 379px;
    top: 240px;
    left: 107px;
    filter: blur(130px);
  }

  .thirdsec-bg::before {
    display: none;
  }

  /* form validation modal */
  #HeaderModal div,
  #NewsletterModal div,
  #ContactModal div,
  #FeedbackModal div,
  #ComingsoonModal div {
    width: 290px;
  }
}

/* #endregion */
/* ======== End of Global Styling ======== */

/* #region ========= 1.1. Header section ========= */
@media screen and (max-width: 1199px) {
  .menu-bar .p-0 img {
    width: 150px;
  }
}

@media screen and (max-width: 991px) {
  header .w-75 {
    width: 40% !important;
  }

  header nav a {
    font-size: 14px;
  }

  header .menu-icon i {
    font-size: 16px;
  }

  header .menu-icon {
    height: 35px;
    width: 43px;
  }

  header .flex-row-reverse {
    width: 28%;
  }

  header nav .gap-lg-5 {
    gap: 36px;
  }

  header .search i {
    padding: 0px;
  }

  /*====== mobile menu drawer ======*/
  header .menu-bar{
    display: none;
  }

  header .offcanvas {
    transition: transform 0.5s ease-in-out;
    background: linear-gradient(135.39deg, #2D1157 0%, #B81844 100%);
  }

  header .offcanvas .btn-close{
    color: #ffff;
    font-size: 24px;
    background: none;
  }

  header .offcanvas .btn-close:hover{
    color: #ffff;
  }

  header .offcanvas .btn-close:focus{
    box-shadow: none;
  }

  header .offcanvas ul{
  transition: 0.5s ease-in-out;
}
}

@media screen and (max-width: 768px) {
  header .w-75 {
    width: 50% !important;
  }

  header .flex-row-reverse {
    width: 37%;
  }

  header .offcanvas{
    width: 300px;
  }
}

@media screen and (max-width: 480px) {
  header .container-fluid {
    flex-wrap: unset !important;
  }

  header .menu-icon {
    height: 38px;
    width: 60px;
  }

  header .menu-icon i {
    font-size: 20px;
  }
}

@media screen and (max-width: 425px) {
  header .menu-icon {
    width: 66px;
  }
}

@media screen and (max-width: 375px) {
  header .menu-icon {
    width: 75px;
  }
}

@media screen and (max-width: 360px) {
  header .menu-icon {
    width: 80px;
  }
}

@media screen and (max-width: 320px) {
  header .menu-icon {
    height: 37px;
    width: 92px;
  }
}

/* #endregion */
/* ========= End of 1.1. Header section ========= */

/* #region ========= 1.2. Hero section ========= */
@media screen and (max-width: 1399px) {
  .hero p {
    padding: 0px 0px 39px;
  }

  .hero::before {
    top: 793px;
  }

  .hero hr {
    height: 167px;
  }
}

@media screen and (max-width: 1199px) {
  .hero .m-auto {
    grid-template-columns: 54% 44%;
    grid-gap: 12px;
  }
}

@media screen and (max-width: 1024px) {
  .hero::before {
    display: none;
  }

  .hero {
    padding: 59px 0px 0px;
  }
}

@media screen and (max-width: 991px) {
  .hero::before {
    display: block;
    top: 615px;
    left: 0;
    transform: rotate(180deg);
  }

  .hero .align-items-end .position-relative::before {
    top: -47px;
    right: -60px;
    width: 560px;
    height: 560px;
  }

  .hero {
    padding: 58px 0px 0px;
    margin: 0px 0px -77px;
  }

  .hero .m-auto {
    grid-template-columns: 100%;
    grid-gap: 0px;
  }

  .hero h1 {
    padding: 0px 130px 20px;
    text-align: center;
  }

  .hero p {
    padding: 0px 184px 40px;
    text-align: center;
  }

  .hero .fa-play {
    height: 50px;
    width: 50px;
  }

  .hero .modal-body {
    width: 600px;
  }

  .hero .justify-content-sm-center {
    gap: 50px;
  }

  .hero .flex-column p {
    padding: 5px 40px 0px 0px;
  }

  .hero .gap-lg-3 {
    margin: 0px;
    padding: 37px 47px 38px;
    grid-row-start: 3;
    grid-row-end: 4;
    top: -140px;
  }

  .hero .align-items-end {
    grid-row-start: 2;
    padding: 80px 0px 0px;
    z-index: -999;
  }

  .hero .align-items-end .position-relative {
    width: 65% !important;
  }
}

@media screen and (max-width: 768px) {
  .hero .align-items-end .position-relative::before {
    top: -40px;
    right: -60px;
    width: 440px;
    height: 440px;
  }

  .hero {
    margin: 0px 0px -40px;
  }

  .hero h1 {
    padding: 0px 20px 20px;
  }

  .hero p {
    padding: 0px 15px 40px;
  }

  .hero .flex-column p {
    padding: 5px 0px 0px;
  }

  .hero .gap-lg-3 {
    top: -105px;
  }
}

@media screen and (max-width: 480px) {
  .hero .align-items-end .position-relative::before {
    right: 0px;
    width: 450px;
    height: 450px;
  }

  .hero::before {
    display: none;
  }

  .hero {
    padding: 38px 0px 0px;
    margin: 0px;
  }

  .hero h1 {
    padding: 0px 0px 15px;
  }

  .hero p {
    padding: 0px 10px 41px;
  }

  .hero .hover1 {
    padding: 17px 101px;
  }

  .hero .fa-play {
    height: 45px;
    width: 45px;
  }

  .hero .modal-body {
    width: 400px;
  }

  .hero .justify-content-sm-center {
    gap: 34px;
  }

  .hero .gap-lg-3 {
    padding: 28px 51px;
    top: 0px;
  }

  .hero .flex-column p {
    padding: 5px 100px 0px;
  }

  .hero hr {
    height: 1px;
    width: 100%;
  }

  .hero .align-items-end {
    padding: 65px 0px 0px;
  }

  .hero .align-items-end .position-relative {
    width: 100% !important;
  }
}

@media screen and (max-width: 425px) {
  .hero .flex-column p {
    padding: 5px 63px 0px;
  }

  .hero .align-items-end .position-relative::before {
    top: -33px;
    width: 400px;
    height: 400px;
  }
}

@media screen and (max-width: 375px) {
  .hero h1 {
    padding: 0px 0px 15px;
  }

  .hero .flex-column p {
    padding: 5px 40px 0px;
  }

  .hero .align-items-end .position-relative::before {
    right: -12px;
    width: 360px;
    height: 360px;
  }

  .hero .modal-body {
    width: 300px;
  }
}

@media screen and (max-width: 320px) {
  .hero .hover1 {
    padding: 17px 95px;
  }

  .hero .flex-column p {
    padding: 5px 20px 0px;
  }

  .hero .align-items-end .position-relative::before {
    right: -10px;
    width: 315px;
    height: 315px;
  }
}

/* #endregion */
/* ========= End of 1.2. Hero section ========= */

/* #region ======== 1.3. About Us Section ======== */
@media screen and (max-width: 1399px) {
  .About p {
    padding: 0px 33px 40px 0px;
  }
}

@media screen and (max-width: 1199px) {
  .About h2 {
    font-size: 46px;
  }

  .About p {
    padding: 0px 0px 30px;
  }

  .About button {
    padding: 17px 38px;
  }
}

@media screen and (max-width: 991px) {
  .About {
    padding: 70px 0px;
  }

  .About h2 {
    font-size: 34px;
    padding: 23px 25px 18px 0px;
  }

  .About p {
    padding: 0px 15px 40px 0px;
  }

  .About li i {
    font-size: 16px;
  }

  .About .flex-sm-row {
    padding: 26px 0px 0px;
  }

  .About .hover1 {
    padding: 17px 32px;
  }
}

@media screen and (max-width: 768px) {
  .About h2 {
    padding: 14px 0px 12px;
  }

  .About p {
    padding: 0px 15px 26px 0px;
  }

  .About li i {
    margin: 0px 20px 0px 0px;
  }

  .About .flex-sm-row {
    gap: 20px;
  }
}

@media screen and (max-width: 767px) {
  .About .flex-sm-row {
    padding: 26px 0px 30px;
  }
}

@media screen and (max-width: 480px) {
  .About {
    padding: 50px 0px;
  }

  .About h2 {
    padding: 15px 20px 8px;
  }

  .About p {
    padding: 0px 10px 22px;
  }

  .About li i {
    margin: 0px 13px 0px 0px;
    font-size: 16px;
  }

  .About .hover1 {
    width: 90%;
  }
}

@media screen and (max-width: 360px) {
  .About h2 {
    padding: 15px 0px 8px;
  }
}

/* #endregion */
/* ======== End of 1.3. About Us section ======== */

/* #region ======== 1.4. Services section ======== */
@media screen and (max-width: 991px) {
  .Services {
    padding: 0px 0px 70px;
  }

  .Services.mx-auto {
    padding: 70px 0px;
  }

  .Services .gap-lg-4 {
    padding: 0px 0px 35px;
  }

  .Services .align-items-lg-start {
    padding: 50px 30px;
  }

  .Services .m-auto {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, auto);
    grid-gap: 25px;
  }

  .Services .m-auto .align-items-lg-start:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
  }

  .Services .m-auto .align-items-lg-start:nth-child(3),
  .Services .m-auto .align-items-lg-start:nth-child(4) {
    padding: 20px 30px;
  }

  .Services .pt-md-3 {
    grid-column: 1 / 3;
    grid-row: 4 / 5;
  }

  .Services .m-0 {
    grid-column: 2 / 3;
    grid-row: 1 / 3;
  }
}

@media screen and (max-width: 480px) {
  .Services {
    padding: 0px 0px 50px;
  }

  .Services.mx-auto {
    padding: 50px 0px;
  }

  .Services .gap-lg-4 {
    padding: 0px 0px 21px;
  }

  .Services h2 {
    padding: 0px 75px 0px;
  }

  @media (max-width: 480px) {
    .Services .m-auto {
      display: grid;
      grid-template-columns: 1fr;
      grid-template-rows: auto;
      grid-gap: 20px;
    }

    .Services .m-auto .align-items-lg-start:nth-child(1),
    .Services .m-auto .align-items-lg-start:nth-child(2),
    .Services .m-auto .align-items-lg-start:nth-child(3),
    .Services .m-auto .align-items-lg-start:nth-child(4),
    .Services .pt-md-3,
    .Services .m-0 {
      grid-column: 1 / 2;
      grid-row: auto;
    }
  }


  .Services .align-items-lg-start,
  .Services .m-auto .align-items-lg-start:nth-child(3),
  .Services .m-auto .align-items-lg-start:nth-child(4) {
    padding: 30px 15px;
  }
}

@media screen and (max-width: 375px) {
  .Services h2 {
    padding: 0px 20px 0px;
  }
}

@media screen and (max-width: 320px) {
  .Services h2 {
    padding: 0px;
  }
}

/* #endregion */
/* ======== End of 1.4. Services section ======== */

/* #region ========= 1.5. Choose Us section ========= */
@media screen and (max-width: 1399px) {
  .ChooseUs .align-items-md-start p {
    padding: 0px 12px 0px 0px;
  }

  .ChooseUs .flex-column p {
    padding: 0px;
  }
}

@media screen and (max-width: 1199px) {
  .ChooseUs .align-items-md-start p {
    padding: 0px;
  }
}

@media screen and (max-width: 991px) {
  .ChooseUs {
    padding: 0px 0px 70px;
  }

  .ChooseUs.mx-auto {
    padding: 0px 0px 15px;
  }
}

@media screen and (max-width: 768px) {
  .ChooseUs .align-items-md-start {
    padding: 20px 0px;
    gap: 13px;
  }

  .ChooseUs .flex-column {
    gap: 15px;
  }

  .ChooseUs .flex-column .hover3 {
    padding: 20px;
  }

  .ChooseUs .align-items-md-start p {
    padding: 0px 8px 0px 0px;
  }
}

@media screen and (max-width: 767px) {
  .ChooseUs .flex-column {
    padding: 0px 0px 30px;
  }

  .ChooseUs .align-items-md-start p {
    padding: 0px 10px;
  }
}

@media screen and (max-width: 480px) {
  .ChooseUs {
    padding: 0px 0px 50px;
  }

  .ChooseUs.mx-auto {
    padding: 0px;
  }

  .ChooseUs .align-items-md-start {
    padding: 0px 0px 30px;
    gap: 10px;
  }

  .ChooseUs .align-items-md-start p {
    padding: 0px 10px;
  }

  .ChooseUs h2 {
    padding: 0px 28px;
  }

  .ChooseUs .flex-column .hover3 {
    padding: 16px 10px;
    gap: 10px;
  }
}

@media screen and (max-width: 320px) {
  .ChooseUs h2 {
    padding: 0px;
  }

  .ChooseUs .align-items-md-start p {
    padding: 0px;
  }
}

/* #endregion */
/* ========= End of 1.5. Choose Us section ========= */

/* #region ========= 1.6. Achievement section ======== */
@media screen and (max-width: 1399px) {
  .Achievement .justify-content-center hr {
    width: 34%;
  }

  .Achievement h1 {
    left: 25px;
  }

  .Achievement p {
    left: 181px;
  }
}

@media screen and (max-width: 1199px) {
  .Achievement .justify-content-center hr {
    width: 31%;
  }

  .Achievement h1 {
    left: 9px;
  }

  .Achievement p {
    left: 165px;
  }
}

@media screen and (max-width: 991px) {
  .Achievement.mt-0 {
    padding: 70px 0px;
  }

  .Achievement .justify-content-center {
    padding: 0px 0px 40px;
  }

  .Achievement .justify-content-center hr {
    width: 37%;
  }

  .Achievement h1 {
    left: 12px;
    font-size: 100px;
  }

  .Achievement p {
    top: 37px;
    left: 155px;
  }

  .Achievement .gap-5 {
    gap: 14px !important;
  }
}

@media screen and (max-width: 768px) {
  .Achievement .justify-content-center {
    padding: 0px 0px 27px;
  }

  .Achievement .justify-content-center hr {
    width: 33%;
  }

  .Achievement h1 {
    left: 12px;
    font-size: 64px;
  }

  .Achievement p {
    top: 37px;
    left: 118px;
  }

  .Achievement .row .col-6:nth-child(4) p {
    left: 111px;
  }
}

@media screen and (max-width: 480px) {
  .Achievement {
    padding: 0px 0px 50px;
  }

  .Achievement.m-0 {
    padding: 50px 0px;
  }

  .Achievement .justify-content-center hr {
    width: 22%;
  }

  .Achievement h1 {
    left: 12px;
    font-size: 48px;
  }

  .Achievement p,
  .Achievement .row .col-6:nth-child(4) p {
    top: 25px;
    left: 115px;
  }
}

@media screen and (max-width: 425px) {
  .Achievement .justify-content-center hr {
    width: 18%;
  }

  .Achievement p,
  .Achievement .row .col-6:nth-child(4) p {
    left: 106px;
  }
}

@media screen and (max-width: 375px) {
  .Achievement .justify-content-center hr {
    width: 14%;
  }

  .Achievement p,
  .Achievement .row .col-6:nth-child(4) p {
    left: 98px;
  }
}

@media screen and (max-width: 360px) {
  .Achievement .justify-content-center hr {
    width: 13%;
  }

  .Achievement .row .col-6:nth-child(4) p {
    left: 95px;
  }
}

@media screen and (max-width: 320px) {
  .Achievement .justify-content-center hr {
    width: 8%;
  }
}

/* #endregion */
/* ========= 1.6. End of Achievement section ======== */

/* #region ========= 1.7. Discover section ======== */
@media screen and (max-width: 1399px) {
  .Discover h2 {
    padding: 0px 44px;
  }

  .Discover p {
    padding: 30px 102px 50px;
  }
}

@media screen and (max-width: 1199px) {
  .Discover p {
    padding: 30px 40px 50px;
  }
}

@media screen and (max-width: 991px) {
  .Discover {
    padding: 65px 0px;
  }

  .Discover .d-flex {
    padding: 40px 0px 36px;
  }

  .Discover h2 {
    padding: 0px 148px;
  }

  .Discover p {
    padding: 30px 84px 50px;
  }
}

@media screen and (max-width: 768px) {
  .Discover {
    padding: 55px 0px;
  }

  .Discover h2 {
    padding: 0px 37px;
  }

  .Discover p {
    padding: 15px 15px 25px;
  }
}

@media screen and (max-width: 480px) {
  .Discover {
    padding: 70px 0px;
  }

  .Discover .d-flex {
    padding: 33px 0px 36px;
  }

  .Discover h2 {
    padding: 0px 30px;
  }

  .Discover p {
    padding: 6px 10px 27px;
  }

  .Discover a {
    padding: 14px 53px;
  }
}

@media screen and (max-width: 320px) {
  .Discover h2 {
    padding: 0px;
  }
}

/* #endregion */
/* ========= 1.7. End of Discover section ======== */

/* #region ======== 1.8. Pricing Plan section ======== */
@media screen and (max-width: 1399px) {
  .Plan .pt-0 p {
    padding: 0px 0px 50px;
  }

  .Plan .pt-0 h2 {
    padding: 25px 0px 20px;
  }
}

@media screen and (max-width: 1199px) {
  .Plan .flex-column p {
    padding: 0px 0px 30px;
  }

  .Plan li i {
    margin: 0px 10px 0px 0px;
    font-size: 16px;
  }

  .Plan li {
    font-size: 13px;
  }
}

@media screen and (max-width: 991px) {
  .Plan {
    padding: 70px 0px;
  }

  .Plan .pt-0 h2 {
    padding: 23px 0px 12px;
  }

  .Plan .pt-0 p {
    padding: 0px 85px 35px;
  }

  .Plan .gap-4 .flex-column:nth-child(-n + 2) {
    padding: 34px 24px 33px;
  }
}

@media screen and (max-width: 768px) {
  .Plan .flex-column .align-items-center {
    padding: 32px 0px 22px;
  }
}

@media screen and (max-width: 480px) {
  .Plan {
    padding: 50px 0px;
  }

  .Plan .flex-column p {
    padding: 0px 30px 28px 0px;
  }

  .Plan li {
    font-size: 16px;
  }

  .Plan .pt-0 h2 {
    padding: 20px 55px 14px;
  }

  .Plan .pt-0 p {
    padding: 0px 10px 32px;
  }
}

@media screen and (max-width: 360px) {
  .Plan .pt-0 h2 {
    padding: 20px 0px 14px;
  }

  .Plan .pt-0 p {
    padding: 0px 0px 32px;
  }

  .Plan .flex-column p {
    padding: 0px 0px 28px;
  }
}

@media screen and (max-width: 320px) {
  .Plan .pt-0 p {
    padding: 0px 0px 32px;
  }

  .Plan .flex-column p {
    padding: 0px 0px 28px;
  }

  .Plan li {
    font-size: 13px;
  }
}

/* #endregion */
/* ========= 1.8. End of Pricing Plan section ======== */

/* #region ======== 1.9. Testimonial section ======== */
@media screen and (max-width: 1399px) {
  .Testimonial h2 {
    padding: 22px 45px 53px 0px;
  }

  .Testimonial p {
    padding: 0px 0px 23px;
  }

  .TestimonialSlider .slick-dots {
    bottom: -45px;
  }
}

@media screen and (max-width: 1199px) {
  .Testimonial h2 {
    padding: 22px 35px 30px 0px;
  }

  .TestimonialSlider .slick-dots {
    bottom: -30px;
  }

  .Testimonial .pt-0 .flex-column:nth-child(2) {
    padding: 0px 18px 20px;
  }

  .Testimonial .h-100 {
    bottom: -60px;
  }
}

@media screen and (max-width: 991px) {
  .Testimonial {
    padding: 70px 0px;
  }

  .Testimonial.mx-auto {
    padding: 70px 0px 15px;
  }

  .Testimonial h2 {
    padding: 14px 230px 25px 0px;
  }

  .Testimonial img[alt="testimonial-comma"] {
    width: 55px;
    height: 42px;
  }

  .TestimonialSlider .slick-dots {
    bottom: -30px;
  }

  .Testimonial .h-100 {
    bottom: 0px;
  }
}

@media screen and (max-width: 768px) {
  .Testimonial h2 {
    padding: 14px 105px 25px 0px;
  }

  .Testimonial .pt-0 .flex-column:nth-child(2) {
    padding: 0px 10px 20px;
  }

  .Testimonial .h-100 {
    bottom: -65px;
  }
}

@media screen and (max-width: 767px) {
  .Testimonial .col-md-7 {
    padding-right: 12px;
  }

  .Testimonial .col-md-5 {
    padding-left: 12px;
  }

  .Testimonial .h-100 {
    bottom: 0px;
  }

  .Testimonial .pt-0 .flex-column:nth-child(2) {
    border-radius: 20px;
    padding: 0px 20px 50px;
  }
}

@media screen and (max-width: 480px) {
  .Testimonial {
    padding: 50px 0px;
  }

  .Testimonial.mx-auto {
    padding: 50px 0px 0px;
  }

  .Testimonial h2 {
    padding: 16px 80px 18px;
  }

  .Testimonial p {
    padding: 0px 0px 20px;
  }

  .Testimonial img[alt="testimonial-comma"] {
    width: 90px;
    height: 69px;
  }

  .Testimonial .pt-0 .flex-column:nth-child(2) {
    padding: 0px 4px 50px;
  }

  .TestimonialSlider .slick-dots {
    bottom: -45px;
  }

  .TestimonialSlider .slick-dots li button:before {
    width: 12px;
    height: 12px;
    font-size: 25px;
  }

  .slick-dots li.slick-active button:before {
    color: transparent;
  }
}

@media screen and (max-width: 425px) {
  .Testimonial h2 {
    padding: 16px 52px 18px;
  }
}

@media screen and (max-width: 375px) {
  .Testimonial h2 {
    padding: 16px 28px 18px;
  }
}

@media screen and (max-width: 320px) {
  .Testimonial h2 {
    padding: 16px 0px 18px;
  }
}

/* #endregion */
/* ======== 1.9. End of Testimonial section ======== */

/* #region ======== 1.10. Blog section ======== */
@media screen and (max-width: 1399px) {
  .Blogs .h-100 p {
    padding: 0px 0px 40px;
  }

  .Blogs .h-100 h4 {
    padding: 20px 0px;
  }

  .Blogs .flex-sm-row .h-100:first-child h4 {
    padding: 10px 0px;
  }

  .Blogs .row .col-lg-4:nth-last-child(1) h4 {
    padding: 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Blogs .gap-4 p {
    padding: 0px;
  }

  .Blogs .w-lg-100 .h-100 {
    padding: 30px 12px 46px;
  }
}

@media screen and (max-width: 991px) {
  .Blogs.mx-auto {
    padding: 70px 0px;
  }

  .Blogs .flex-sm-row .h-100:first-child h4 {
    padding: 17px 40px 14px 0px;
  }

  .Blogs .gap-4 .flex-column {
    padding: 32px 10px 6px;
  }

  .Blogs .h-100 h4 {
    padding: 17px 130px 14px 0px;
  }

  .Blogs .h-100 p {
    padding: 0px 159px 36px 0px;
  }

  .Blogs .w-lg-100 .h-100 {
    padding: 36px 25px 40px;
  }

  .Blogs .row .col-lg-6:nth-child(2) {
    flex: unset;
  }
}

@media screen and (max-width: 768px) {
  .Blogs .h-100 p {
    padding: 0px 50px 30px 0px;
  }
}

@media screen and (max-width: 480px) {
  .Blogs.mx-auto {
    padding: 50px 0px;
  }

  .Blogs .pb-4 h2 {
    padding: 0px 22px;
  }

  .Blogs .h-100 div {
    padding: 16px 12px 30px;
  }

  .Blogs .h-100 h4 {
    padding: 17px 0px 14px;
  }

  .Blogs .h-100 p {
    padding: 0px 0px 25px;
  }

  .Blogs .gap-4 .flex-column {
    padding: 16px 12px 6px;
  }

  .Blogs .gap-4 p {
    padding: 0px 0px 12px;
  }

  .Blogs .w-lg-100 .h-100 {
    padding: 37px 20px 37px;
  }

  .Blogs .flex-sm-row .h-100:first-child h4 {
    padding: 15px 75px 12px 0px;
  }

  .Blogs .w-lg-100 .h-100 p {
    padding: 0px 95px 26px 0px;
  }
}

@media screen and (max-width: 360px) {
  .Blogs .pb-4 h2 {
    padding: 0px;
  }
}

@media screen and (max-width: 320px) {
  .Blogs .flex-sm-row .h-100:first-child h4 {
    padding: 15px 0px 12px;
  }

  .Blogs .w-lg-100 .h-100 h4 {
    padding: 10px 0px;
  }

  .Blogs .w-lg-100 .h-100 p {
    padding: 0px 12px 26px 0px;
  }
}

/* #endregion */
/* ======== End of 1.10. Blog section ======== */

/* #region ======== 1.11. Partners section ======== */
@media screen and (max-width: 991px) {
  .Partners {
    padding: 70px 0px;
  }
}

@media screen and (max-width: 1024px) {

  .Partners .PartnersSlider1 .align-items-center,
  .Partners .PartnersSlider2 .align-items-center {
    width: 162px;
    height: 64px;
  }

  .Partners img[alt="partnerslogo1"] {
    width: 118px;
    height: 24px;
  }

  .Partners img[alt="partnerslogo2"] {
    width: 106px;
    height: 25px;
  }

  .Partners img[alt="partnerslogo3"] {
    width: 110px;
    height: 25px;
  }

  .Partners img[alt="partnerslogo4"] {
    width: 105px;
    height: 25px;
  }

  .Partners img[alt="partnerslogo5"] {
    width: 110px;
    height: 25px;
  }

  .Partners img[alt="partnerslogo6"] {
    width: 115px;
    height: 25px;
  }

  .Partners img[alt="partnerslogo7"] {
    width: 115px;
    height: 25px;
  }
}

@media screen and (max-width: 480px) {
  .Partners {
    padding: 50px 0px;
  }

  .Partners h2 {
    padding: 0px 50px;
  }

  .Partners .PartnersSlider1 .align-items-center,
  .Partners .PartnersSlider2 .align-items-center {
    width: 130px;
    height: 51px;
  }

  .Partners img[alt="partnerslogo1"],
  .Partners img[alt="partnerslogo3"],
  .Partners img[alt="partnerslogo4"],
  .Partners img[alt="partnerslogo5"],
  .Partners img[alt="partnerslogo7"] {
    width: 85px;
    height: 20px;
  }

  .Partners img[alt="partnerslogo2"] {
    width: 88px;
    height: 20px;
  }

  .Partners img[alt="partnerslogo6"] {
    width: 90px;
    height: 20px;
  }
}

/* #endregion */
/* ======== 1.11. End of Partners section ======== */

/* #region ======== 1.12. Newsletter section ======== */
@media screen and (max-width: 1399px) {
  .Newsletter .row p {
    padding: 0px 80px 42px 0px;
  }

  .Newsletter form .d-flex {
    width: 90%;
  }
}

@media screen and (max-width: 1199px) {
  .Newsletter .row p {
    padding: 0px 0px 42px;
  }

  .Newsletter form .d-flex {
    width: 100%;
  }

  .Newsletter input[type="email"] {
    padding: 25px 0px 20px 24px;
  }

  .Newsletter button {
    padding: 18px 36px;
  }
}

@media screen and (max-width: 991px) {
  .Newsletter {
    padding: 35px 0px 0px;
  }

  .Newsletter .pb-4 {
    padding: 0px 0px 0px 20px;
  }

  .Newsletter input[type="email"] {
    padding: 19px 0px 18px 16px;
  }

  .Newsletter button {
    padding: 17px 36px;
  }
}

@media screen and (max-width: 768px) {
  .Newsletter .row h4 {
    padding: 21px 0px 10px;
  }

  .Newsletter .row p {
    padding: 0px 0px 26px;
  }

  .Newsletter figure {
    top: 15px;
  }
}

@media screen and (max-width: 480px) {
  .Newsletter {
    padding: 48px 0px 0px;
  }

  .Newsletter .pb-4 {
    padding: 0px;
  }

  .Newsletter .row h4 {
    padding: 14px 10px 10px;
  }

  .Newsletter .row p {
    padding: 0px 10px 32px;
  }

  .Newsletter form .d-flex {
    gap: 10px;
    border: none;
    width: 90%;
  }

  .Newsletter input[type="email"] {
    border: 1px solid #b81844;
    border-radius: 15px;
    padding: 19px 0 16px 18px;
  }

  .Newsletter form button {
    position: relative !important;
  }

  .Newsletter button {
    padding: 16px 0px;
  }

  .Newsletter figure {
    top: 0px;
  }
}

/* #endregion */
/* ======== 1.12. End of Newsletter section ======== */

/* #region ======== 1.13. Footer section ======== */
@media screen and (max-width: 1536px) {
  footer::before {
    top: 130px;
    width: 850px;
    height: 850px;
  }
}

@media screen and (max-width: 1399px) {
  footer::before {
    width: 800px;
    height: 800px;
    left: 22%;
  }

  footer .align-items-lg-start p {
    padding: 0px 0px 15px;
  }
}

@media screen and (max-width: 1199px) {
  footer::before {
    width: 700px;
    height: 700px;
  }
}

@media screen and (max-width: 991px) {
  footer::before {
    top: 350px;
    left: 14%;
  }

  footer {
    padding: 55px 0px 30px;
  }

  footer .align-items-lg-start p {
    padding: 0px 95px 15px;
  }

  footer a {
    font-size: 14px;
  }

  footer .justify-content-lg-between {
    gap: 150px;
  }
}

@media screen and (max-width: 768px) {
  footer::before {
    left: 5%;
  }

  footer img {
    width: 125px;
  }

  footer .justify-content-lg-between {
    gap: 100px;
  }
}

@media screen and (max-width: 767px) {
  footer .row .col-lg-4:nth-child(1) {
    order: 1;
  }

  footer .row .col-lg-4:nth-child(2) {
    order: 3;
  }

  footer .row .col-lg-4:nth-child(3) {
    order: 2;
  }

  footer .align-items-lg-start p {
    padding: 0px 15px 15px;
  }

  footer .align-items-lg-start .gap-md-4 a {
    height: 30px;
    width: 30px;
    font-size: 12px;
  }

  footer .gap-3 .gap-2 .justify-content-center {
    height: 30px;
    width: 30px;
    font-size: 12px;
  }
}

@media screen and (max-width: 480px) {
  footer::before {
    width: 480px;
    height: 480px;
    left: unset;
    top: 400px;
  }

  footer {
    padding: 60px 0px 15px;
  }

  footer .text-center p {
    padding: 0px 15px;
    font-size: 12px;
  }
}

@media screen and (max-width: 320px) {
footer .justify-content-lg-between{
  gap: 64px;
}
}

/* #endregion */
/* ======== 1.13. Footer section ======== */

/* #region ======== 2.2. Subpages-hero section ======== */
@media screen and (max-width: 1399px) {
  .Subpages-hero p {
    padding: 0px 115px;
  }
}

@media screen and (max-width: 1199px) {
  .Subpages-hero p {
    padding: 0px 22px;
  }
}

@media screen and (max-width: 991px) {
  .Subpages-hero {
    padding: 70px 0px;
  }
}

@media screen and (max-width: 768px) {
  .Subpages-hero .bg::before {
    left: -620px;
  }
}

@media screen and (max-width: 480px) {
  .Subpages-hero .bg::before {
    top: 210px;
    left: -770px;
  }

  .Subpages-hero {
    padding: 50px 0px;
  }

  .Subpages-hero h2 {
    padding: 0px 35px;
  }

  .Subpages-hero p {
    padding: 0px 10px;
  }
}

@media screen and (max-width: 375px) {
  .Subpages-hero .bg::before {
    top: 230px;
  }

  .Subpages-hero h2 {
    padding: 0px;
  }
}

/* #endregion */
/* ======== End of 2.2. Subpages-hero section ======== */

/* #region ======== 2.4. States section ======== */
@media screen and (max-width: 1399px) {
  .States p {
    padding: 0px;
  }
}

@media screen and (max-width: 1199px) {
  .States .flex-sm-row .flex-column {
    padding: 35px 15px;
  }
}

@media screen and (max-width: 991px) {
  .States {
    padding: 0px 0px 70px;
  }
}

@media screen and (max-width: 480px) {
  .States {
    padding: 0px 0px 50px;
  }
}

/* #endregion */
/* ======== End of 2.4. States section ======== */

/* #region ======== 2.5. Vision section ======== */
@media screen and (max-width: 1399px) {
  .Vision hr {
    margin: 40px 0px 50px;
  }

  .Vision .align-items-center p {
    padding: 0px 30px 0px 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Vision .align-items-center p {
    padding: 0px;
  }
}

@media screen and (max-width: 1199px) {
  .Vision h2 {
    padding: 0px 52px 24px 0px;
  }
}

@media screen and (max-width: 991px) {
  .Vision {
    padding: 70px 0px;
  }

  .Vision .align-items-center p {
    padding: 0px 10px 0px 0px;
  }
}

@media screen and (max-width: 768px) {
  .Vision .gap-4 figure {
    padding: 18px;
  }
}

@media screen and (max-width: 767px) {
  .Vision h2 {
    padding: 0px 18px;
  }
}

@media screen and (max-width: 480px) {
  .Vision {
    padding: 50px 0px;
  }
}

@media screen and (max-width: 425px) {
  .Vision h2 {
    padding: 0px;
  }

  .Vision .align-items-center p {
    padding: 0px;
  }
}

/* #endregion */
/* ======== End of 2.5. Vision section ======== */

/* #region ======== 3.3. Contact Us section ======== */
@media screen and (max-width: 1399px) {

  .ContactUs .gap-sm-5 p,
  .ContactUs .gap-3 p {
    padding: 0px;
  }
}

@media screen and (max-width: 991px) {
  .ContactUs {
    padding: 70px 0px;
  }

  .ContactUs .gap-3 p {
    padding: 0px 15px 0px;
  }
}

@media screen and (max-width: 480px) {
  .ContactUs {
    padding: 50px 0px;
  }

  .ContactUs .gap-3 p {
    padding: 0px 10px 0px;
  }

  .ContactUs i {
    height: 60px;
    width: 60px;
  }

  .ContactUs form {
    padding: 30px 15px 35px;
  }

  .ContactUs .gap-sm-5 .gap-4 {
    padding: 25px 20px;
  }
}

@media screen and (max-width: 375px) {
  .ContactUs form button {
    width: 100%;
  }

  .ContactUs .gap-sm-5 .gap-4 {
    flex-direction: column !important;
  }

  .ContactUs .gap-sm-5 .gap-2 {
    align-items: center;
    text-align: center;
  }
}

/* #endregion */
/* ======== End of 3.3. Contact Us section ======== */

/* #region ======== 3.4. Map section section ======== */
@media screen and (max-width: 991px) {
  .Map {
    padding: 0px 0px 15px;
  }
}

@media screen and (max-width: 480px) {
  .Map {
    padding: 0px;
  }

  .Map iframe {
    height: 350px;
  }
}

/* #endregion */
/* ======== End of 3.4. Map section section ======== */

/* #region ======== 5.3. Faq's Section ======== */
@media screen and (max-width: 1399px) {
  .Faq .accordion-body {
    padding: 0px 75px 40px 26px;
  }

  .Faq .px-3 p {
    padding: 0px 0px 16px;
  }
}

@media screen and (max-width: 1199px) {
  .Faq .accordion-body {
    padding: 0px 40px 40px 26px;
  }
}

@media screen and (max-width: 991px) {
  .Faq {
    padding: 70px 0px 15px;
  }

  .Faq .accordion-body {
    padding: 0px 60px 25px 26px;
  }
}

@media screen and (max-width: 480px) {
  .Faq {
    padding: 50px 0px 0px;
  }

  .Faq .accordion-body {
    padding: 0px 22px 25px 18px;
  }

  .Faq .row .col-lg-6:nth-child(4) .px-3 {
    padding: 45px 0px;
  }

  .Faq .row .col-lg-6:nth-child(4) .px-3 {
    gap: 20px;
  }

  .Faq .px-3 .justify-content-center {
    transform: scale(0.7);
  }
}

/* #endregion */
/* ======== End of 5.3. Faq's Section ======== */

/* #region ======== 7.3. Blog Details section ======== */
@media screen and (max-width: 991px) {
  .Blog-details {
    padding: 70px 0px 24px;
  }

  .Blog-details i {
    height: 45px;
    width: 45px;
    font-size: 20px;
  }

  .Blog-details .col-sm-10 .pb-4::first-letter {
    font-size: 60px;
    padding: 0px 15px 12px 0px;
  }

  .Blog-details .gap-2 li {
    font-size: 14px;
  }
}

@media screen and (max-width: 480px) {
  .Blog-details {
    padding: 50px 0px 35px;
  }

  .Blog-details i {
    height: 35px;
    width: 35px;
    font-size: 16px;
  }

  .Blog-details .col-sm-10 .pb-4::first-letter {
    font-size: 50px;
  }

  .Blog-details .slick-track {
    gap: 10px;
  }

  .Blog-details .slick-dots li button:before {
    width: 10px;
    height: 10px;
    font-size: 25px;
  }

  .Blog-details .slick-dots li {
    width: 10px;
  }
}

/* #endregion */
/* ======== End of 7.3. Blog Details section ======== */

/* #region ======== 7.4. Feedback section ======== */
@media screen and (max-width: 991px) {
  .Feedback {
    padding: 0px 0px 25px;
  }

  .Feedback form input::placeholder,
  .Feedback form textarea::placeholder {
    font-size: 14px;
  }
}

@media screen and (max-width: 767px) {
  .Feedback .gap-sm-5 {
    width: 100%;
  }

  .Feedback form {
    width: 100%;
  }

  .Feedback textarea {
    padding: 20px 15px;
  }

  .Feedback input {
    width: 100%;
    height: 60px;
    padding: 15px;
  }
}

@media screen and (max-width: 480px) {
  .Feedback {
    padding: 0px;
  }
}

@media screen and (max-width: 375px) {
  .Feedback form button {
    width: 100%;
  }
}

/* #endregion */
/* ======== End of 7.4. Feedback section ======== */

/* #region ======== 9.3. Our Team section ======== */
@media screen and (max-width: 991px) {
  .Team.mx-auto {
    padding: 70px 0px 15px;
  }
}

@media screen and (max-width: 480px) {
  .Team.mx-auto {
    padding: 50px 0px 0px;
  }
}

/* #endregion */
/* ======== 9.3. Our Team section ======== */

/* #region ======== 10.3. Portfolio section ======== */
@media (max-width: 1199px) {
  .Portfolio .position-absolute {
    gap: 5px;
    padding: 15px 8px;
  }
}

@media (max-width: 991px) {
  .Portfolio {
    padding: 70px 0px 15px;
  }

  .Portfolio .col-lg-4 {
    display: none;
  }

  .Portfolio .position-absolute {
    gap: 10px;
  }
}

@media (max-width: 480px) {
  .Portfolio {
    padding: 50px 0px 0px;
  }

  .Portfolio .col-lg-4 {
    display: block;
    padding: 0px 12px;
  }
}

/* #endregion */
/* ======== End of 10.3. Portfolio section ======== */

/* #region ======== 11.1. Coming Soon section ======== */
@media screen and (max-width: 1199px) {
  .Coming-soon .text-center p {
    padding: 0px 35px;
  }

  .Coming-soon input[type="email"] {
    padding: 26px 0px 20px 24px;
  }

  .Coming-soon button {
    padding: 18px 36px;
  }
}

@media screen and (max-width: 991px) {
  .Coming-soon {
    padding: 70px 0px;
  }

  .Coming-soon .d-flex.text-center {
    gap: 18px;
    padding: 0px 0px 45px;
  }

  .Coming-soon input[type="email"] {
    padding: 20px 0px 18px 16px;
  }

  .Coming-soon button {
    padding: 17px 36px;
  }

  .Coming-soon #comingsoonTimer {
    transform: scale(0.8);
    padding: 50px 0px 0px;
  }

  .Coming-soon span {
    bottom: 30px;
  }
}

@media screen and (max-width: 480px) {
  .Coming-soon {
    padding: 50px 0px 15px;
  }

  .Coming-soon .text-center p {
    padding: 0px 10px;
  }

  .Coming-soon form .d-flex {
    border: none;
    gap: 12px;
    width: 85%;
  }

  .Coming-soon input[type="email"] {
    border: 1px solid #b81844;
    border-radius: 15px;
    padding: 19px 0 16px 18px;
  }

  .Coming-soon form button {
    position: relative !important;
    padding: 16px 0px;
  }

  .Coming-soon #comingsoonTimer {
    transform: scale(0.6);
    padding: 25px 0px 0px;
  }
}

@media screen and (max-width: 375px) {
  .Coming-soon #comingsoonTimer {
    transform: scale(0.5);
    padding: 15px 0px 0px;
  }

  .Coming-soon form .d-flex {
    width: 95%;
  }
}

@media screen and (max-width: 320px) {
  .Coming-soon form .d-flex {
    width: 100%;
  }

  .Coming-soon #comingsoonTimer {
    transform: scale(0.45);
  }
}

/* #endregion */
/* ======== End of 11.1. Coming Soon section ======== */

/* #region ======== 12.1. Error 404 section ======== */
@media screen and (max-width: 1399px) {
  .Error p {
    padding: 0px 125px;
  }
}

@media screen and (max-width: 1199px) {
  .Error .bg::before {
    top: 410px;
    left: -470px;
  }

  .Error .text-center {
    gap: 30px;
  }

  .Error p {
    padding: 0px 35px;
  }
}

@media screen and (max-width: 991px) {
  .Error h1 {
    font-size: 200px;
    line-height: 160px;
  }

  .Error p {
    padding: 0px 105px;
  }
}

@media screen and (max-width: 768px) {
  .Error::before {
    left: -585px;
  }

  .Error p {
    padding: 0px 10px;
  }
}

@media screen and (max-width: 480px) {
  .Error .bg::before {
    top: 410px;
    left: -760px;
  }

  .Error {
    padding: 50px 0px;
  }

  .Error .text-center {
    gap: 20px;
  }

  .Error h1 {
    font-size: 120px;
    line-height: 115px;
  }
}

@media screen and (max-width: 375px) {
  .Error .bg::before {
    top: 490px;
  }

  .Error h1 {
    font-size: 100px;
    line-height: 100px;
  }
}

/* #endregion */
/* ======== End of 12.1. Error 404 section ======== */
