/* =========== Media Query ========== */

/* applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
}

/* applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
  header .nav-menu ul .logo-txt a {
    font-size: 20px;
  }

  header .nav-right-content ul li a button {
    font-size: 18px;
  }
}

/* applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
  .pl-30 {
    padding-left: 30px !important;
  }
  .pl-15 {
    padding-left: 15px !important;
  }
  .col-md-1 {
    width: 8.3333333333%;
    padding: 0 15px;
  }
  .col-md-2 {
    width: 16.6666666667%;
    padding: 0 15px;
  }
  .col-md-3 {
    width: 25%;
    padding: 0 15px;
  }
  .col-md-4 {
    width: 33.3333333333%;
    padding: 0 15px;
  }
  .col-md-5 {
    width: 41.6666666667%;
    padding: 0 15px;
  }
  .col-md-6 {
    width: 50%;
    padding: 0 15px;
  }
  .col-md-7 {
    width: 58.3333333333%;
    padding: 0 15px;
  }
  .col-md-8 {
    width: 66.6666666667%;
    padding: 0 15px;
  }
  .col-md-9 {
    width: 75%;
    padding: 0 15px;
  }
  .col-md-10 {
    width: 83.3333333333%;
    padding: 0 15px;
  }
  .col-md-11 {
    width: 91.6666666667%;
    padding: 0 15px;
  }
  .col-md-12 {
    width: 100%;
    padding: 0 15px;
  }

  header .nav-mid-content,
  header .nav-right-content {
    display: none;
  }

  header .menu-toggler-btn {
    display: block;
  }

  header .mobile-menu.show {
    display: flex;
    flex-direction: column;
    transform: translateY(0px);
  }

  .about-content .help-image,
  footer .footer-content .help-image {
    min-height: 130px;
  }

  .about-content .about-contact-content h5,
  footer .footer-content .footer-contact-content h5 {
    font-size: 18px;
  }

  .about-content .about-contact-content .about-contact-icon div,
  footer .footer-content .footer-contact-content .footer-contact-icon div {
    padding-right: 15px;
  }

  .about-content .about-contact-content .about-contact-icon div i,
  footer .footer-content .footer-contact-content .footer-contact-icon div i {
    font-size: 18px;
  }

  .about-content .about-contact-content .about-contact-icon div a,
  footer .footer-content .footer-contact-content .footer-contact-icon div a {
    font-size: 18px;
  }

  .service_section .home-service-card,
  .service_section .business-service-card {
    max-width: 300px;
    width: 100%;
    min-height: 287px;
    height: 100%;
  }

  .service_section .home-service-card div,
  .service_section .business-service-card div {
    width: 120px;
    height: 108px;
  }

  .service_section .business-service-card h1,
  .service_section .home-service-card h1 {
    font-size: 28px;
  }

  .contact-page-content {
    margin: 0 auto;
  }

  .about-image-section
    .about-us-page-content
    .about-us-card
    .inner-card-content
    p,
  .why-us-page .why-us-page-content .why-us-card .inner-why-card-content p {
    font-size: 16px;
  }
}

/* Custom Media Query For better responsive */
@media (max-width: 899px) {
  .payment-system,
  .payment-system2 {
    padding-top: 20px;
  }

  .payment-system2 {
    margin-top: 30px;
  }

  .payment-system div img,
  .payment-system2 div img {
    width: 70px;
  }
}

/* applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
  .col-sm-1 {
    width: 8.3333333333%;
    padding: 0 15px;
  }
  .col-sm-2 {
    width: 16.6666666667%;
    padding: 0 15px;
  }
  .col-sm-3 {
    width: 25%;
    padding: 0 15px;
  }
  .col-sm-4 {
    width: 33.3333333333%;
    padding: 0 15px;
  }
  .col-sm-5 {
    width: 41.6666666667%;
    padding: 0 15px;
  }
  .col-sm-6 {
    width: 50%;
    padding: 0 15px;
  }
  .col-sm-7 {
    width: 58.3333333333%;
    padding: 0 15px;
  }
  .col-sm-8 {
    width: 66.6666666667%;
    padding: 0 15px;
  }
  .col-sm-9 {
    width: 75%;
    padding: 0 15px;
  }
  .col-sm-10 {
    width: 83.3333333333%;
    padding: 0 15px;
  }
  .col-sm-11 {
    width: 91.6666666667%;
    padding: 0 15px;
  }
  .col-sm-12 {
    width: 100%;
    padding: 0 15px;
  }
  .price-box .title {
    padding: 20px;
  }
  .right-box {
    padding: 20px;
  }
  .about-content .help-image,
  footer .footer-content .help-image {
    max-width: 200px;
    max-height: 150px;
    min-width: none;
    min-height: none;
    margin: 0 auto;
  }

  .about-content .about-contact-content h5,
  footer .footer-content .footer-contact-content h5 {
    text-align: center;
    font-size: 20px;
  }

  .about-content .about-contact-content .about-contact-icon div,
  footer .footer-content .footer-contact-content .footer-contact-icon div {
    display: block;
  }

  .about-content .about-contact-content .about-contact-icon .large-screen-show,
  footer
    .footer-content
    .footer-contact-content
    .footer-contact-icon
    .large-screen-show {
    display: none;
  }

  .about-content .about-contact-content .about-contact-icon div,
  footer .footer-content .footer-contact-content .footer-contact-icon div {
    padding-right: 20px;
  }

  .about-content .about-contact-content .about-contact-icon,
  footer .footer-content .footer-contact-content .footer-contact-icon {
    justify-content: center;
  }

  .about-content .about-contact-content .about-contact-icon div i,
  footer .footer-content .footer-contact-content .footer-contact-icon div i {
    font-size: 22px;
    padding-right: 5px;
  }

  .about-content .about-contact-content .about-contact-icon div a,
  footer .footer-content .footer-contact-content .footer-contact-icon div a {
    font-size: 20px;
    border-bottom: 1px solid var(--text-primary--);
    font-weight: 700;
    color: var(--text-primary--);
  }

  footer
    .footer-content
    .footer-contact-content
    .footer-contact-icon
    div
    a:hover,
  .about-content .about-contact-content .about-contact-icon div a:hover {
    color: var(--text-green--);
  }

  .button-left {
    justify-content: center;
    align-items: center;
  }

  .why-box {
    flex-direction: column;
  }
  .why-us {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  .qr_code_section .qr_code_images {
    flex-direction: column;
  }

  footer .footer-content {
    text-align: center;
  }

  footer .footer-content .footer-contact-content .footer-contact-icon {
    width: 100%;
    margin: 20px auto;
    display: flex;
    justify-content: center;
  }

  .payment-system {
    margin: 20px 0;
  }

  .payment-system2 {
    margin-bottom: 20px;
  }

  .banner-content {
    padding-top: 40px;
  }

  .why-us-page-bottom h3 {
    font-size: 26px;
  }

  .why-us-page-bottom p {
    font-size: 18px;
  }

  .why-us-page-bottom iframe {
    height: 300px;
  }

  .why-us-page
    .why-us-page-content
    .why-us-card
    .inner-why-card-content
    .check-mark-image,
  .about-image-section
    .about-us-page-content
    .about-us-card
    .inner-card-content
    .check-mark-image {
    max-width: 28px;
    max-height: 28px;
  }

  .contact-btns {
    flex-direction: column;
    align-items: flex-start;
  }

  .contact-btns .submit-form-btn {
    margin-bottom: 20px;
  }

  .contact-btns .submit-form-btn .submit-btn,
  .contact-btns .conditions-btn .terms-btn {
    font-size: 16px;
  }

  .contact-btns .conditions-btn {
    min-width: 250px;
  }

  .about-header-img {
    max-width: 120px !important;
    width: 100% !important;
    max-height: unset !important;
  }

  .about-header-img img {
    width: 100% !important;
    height: auto !important;
  }

  .celebration-image {
    max-width: 120px !important;
    width: 100% !important;
    max-height: unset !important;
  }

  .celebration-image img {
    width: 100% !important;
    height: auto !important;
  }
}

/*  applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
  .col-xs-1 {
    width: 8.3333333333%;
    padding: 0 15px;
  }
  .col-xs-2 {
    width: 16.6666666667%;
    padding: 0 15px;
  }
  .col-xs-3 {
    width: 25%;
    padding: 0 15px;
  }
  .col-xs-4 {
    width: 33.3333333333%;
    padding: 0 15px;
  }
  .col-xs-5 {
    width: 41.6666666667%;
    padding: 0 15px;
  }
  .col-xs-6 {
    width: 50%;
    padding: 0 15px;
  }
  .col-xs-7 {
    width: 58.3333333333%;
    padding: 0 15px;
  }
  .col-xs-8 {
    width: 66.6666666667%;
    padding: 0 15px;
  }
  .col-xs-9 {
    width: 75%;
    padding: 0 15px;
  }
  .col-xs-10 {
    width: 83.3333333333%;
    padding: 0 15px;
  }
  .col-xs-11 {
    width: 91.6666666667%;
    padding: 0 15px;
  }
  .col-xs-12 {
    width: 100%;
    padding: 0 15px;
  }
  .about-right .right-button {
    flex-wrap: wrap;
  }

  footer .footer-address h3 {
    font-size: 20px;
    line-height: 24px;
  }

  footer .footer-address h5 {
    font-size: 12px;
    line-height: 20px;
  }

  footer .footer-address h6 {
    font-size: 12px;
    padding-top: 0;
  }

  .service_section .home-service-card,
  .service_section .business-service-card {
    max-width: 250px;
    width: 100%;
    min-height: 247px;
    height: 100%;
  }

  .service_section .home-service-card div,
  .service_section .business-service-card div {
    width: 96px;
    height: 84px;
  }

  .service_section .business-service-card h1,
  .service_section .home-service-card h1 {
    font-size: 24px;
  }

  .contact-us-section h1,
  .contact-form-section h1,
  .about-image-section h1,
  .service-heading h1,
  .why-us-page h1,
  .price h1 {
    font-size: 34px;
  }

  .contact-us-section .contact-us-card,
  .contact-us-section .contact-address-card {
    max-width: 250px;
  }

  .contact-us-section .contact-us-card .contact-us-icon,
  .contact-us-section .contact-address-card .contact-address-icon {
    width: 50px;
    height: 50px;
    top: -12%;
  }

  .ri-phone-line,
  .ri-message-2-line,
  .ri-price-tag-3-line,
  .ri-map-2-fill,
  .ri-mail-send-fill {
    font-size: 26px;
  }

  .contact-us-section .contact-us-card .help-line {
    font-size: 18px;
  }

  .contact-us-section .contact-us-card .help-line-contact,
  .contact-us-section .contact-us-card h5,
  .contact-us-section .contact-us-card .text-line-contact,
  .contact-us-section .contact-us-card .price-line-contact {
    font-size: 16px;
  }

  .contact-us-section .contact-address-card .address-txt {
    font-size: 14px;
  }

  .banner-content {
    padding-top: 80px;
  }

  .banner-content h1 {
    font-size: 38px;
  }

  .about-image-section
    .about-us-page-content
    .about-us-card
    .inner-card-content
    p,
  .service-heading p,
  .why-us-page .why-us-page-content .why-us-card .inner-why-card-content p {
    font-size: 14px;
  }

  .service-box .box-top h4 {
    font-size: 18px;
  }

  .service-box .box-bottom ul li {
    font-size: 16px;
  }

  .contact-form-section form label {
    font-size: 15px;
  }

  .contact-form-section form label span,
  .contact-form-section form textarea::placeholder,
  .contact-form-section form input::placeholder {
    font-size: 14px;
  }

  .why-us-page-bottom h3 {
    font-size: 22px;
  }

  .why-us-page-bottom p {
    font-size: 16px;
  }

  .why-us-page-bottom iframe {
    height: 250px;
  }

  .why-us-page
    .why-us-page-content
    .why-us-card
    .inner-why-card-content
    .check-mark-image,
  .about-image-section
    .about-us-page-content
    .about-us-card
    .inner-card-content
    .check-mark-image {
    max-width: 24px;
    max-height: 24px;
  }

  .price-box .title {
    font-size: 20px;
  }

  .price-box .right-box h3 {
    font-size: 18px;
  }

  .price-box .right-box p,
  .price-box .right-box ul li,
  .price-box .right-box ul li a,
  .price-box .right-box a {
    font-size: 16px;
    line-height: 25px;
  }

  .page-buttons-groups {
    flex-direction: column;
  }
}