﻿
/* ============================================================
    [Master Stylesheet]

    Theme Name:     Trava      
    Theme URL:      http://      
    Description:    Trava - Travel Agency & Tour Booking HTML Template
    Author:         PhotoClerks           
    Version:        1.0.0

============================================================== */
/*
========================================
*********** TABLE OF CONTENTS **********

    01.  Variables Css
    02.  Font Size css
    03.  Common Typography Css 
    04.  Reset css 
    05.  Banner css
    06.  choose css
    07.  destination css
    08.  featured css
    09.  success numbers css
    10.  discounts css
    11.  brand logo css
    12.  activities css
    13.  client feedback css
    14.  video css
    15.  blog css
    16.  callToAction css
    17.  follow us css
    18.  explore css
    19.  tour css
    20.  card css
    21.  coming soon css
    22.  booking css
    23.  faq css
    24.  gallery css
    25.  Preloader Css 
    26.  Scroll back to top Css
    27.  navbar css
    28.  footer css
    29.  breadcrumb css
    30.  contact css   

========================================*/
@import url("css2.css");

@font-face {
    font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  src: url(../font/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format("woff2");
}

.material-icons {
    font-family: "Material Icons";
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-smoothing: antialiased;
    -webkit-font-feature-settings: "liga";
    font-feature-settings: "liga";
}

@font-face {
    font-family: "Material Symbols Outlined";
  font-style: normal;
  font-weight: 100 700;
  src: url(../font/font.woff2) format("woff2");
}

.material-symbols-outlined {
    font-family: "Material Symbols Outlined";
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: "liga";
    font-feature-settings: "liga";
    -webkit-font-smoothing: antialiased;
}

/* ============================
   Variables Css
=============================== */
:root {
  /* Font Family */
    --body-font: "微软雅黑", "Microsoft YaHei", sans-serif;
    --regular: 400;
    --medium: 500;
    --semibold: 600;
    --bold: 700;
  /* ================== 
    Theme Color
   =================== */
  /* Base Color */
    --base-h: 18;
    --base-s: 87%;
    --base-l: 52%;
    --base: var(--base-h) var(--base-s) var(--base-l);
    --base-d-100: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.1);
    --base-d-200: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.2);
    --base-d-300: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.3);
    --base-d-400: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.4);
    --base-d-500: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.5);
    --base-d-600: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.6);
    --base-d-700: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.7);
    --base-d-800: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.8);
    --base-d-900: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 0.9);
    --base-d-1000: var(--base-h) var(--base-s) calc(var(--base-l) - var(--base-l) * 1);
    --base-l-100: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.1);
    --base-l-200: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.2);
    --base-l-300: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.3);
    --base-l-400: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.4);
    --base-l-500: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.5);
    --base-l-600: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.6);
    --base-l-700: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.7);
    --base-l-800: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.8);
    --base-l-900: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 0.9);
    --base-l-1000: var(--base-h) calc(var(--base-s)) calc(var(--base-l) + (100% - var(--base-l)) * 1);
  /* Base Two Color */
    --base-two-h: 225;
    --base-two-s: 84%;
    --base-two-l: 20%;
    --base-two: var(--base-two-h) var(--base-two-s) var(--base-two-l);
    --base-two-d-100: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.1);
    --base-two-d-200: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.2);
    --base-two-d-300: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.3);
    --base-two-d-400: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.4);
    --base-two-d-500: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.5);
    --base-two-d-600: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.6);
    --base-two-d-700: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.7);
    --base-two-d-800: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.8);
    --base-two-d-900: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 0.9);
    --base-two-d-1000: var(--base-two-h) var(--base-two-s) calc(var(--base-two-l) - var(--base-two-l) * 1);
    --base-two-l-100: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.1);
    --base-two-l-200: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.2);
    --base-two-l-300: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.3);
    --base-two-l-400: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.4);
    --base-two-l-500: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.5);
    --base-two-l-600: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.6);
    --base-two-l-700: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.7);
    --base-two-l-800: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.8);
    --base-two-l-900: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 0.9);
    --base-two-l-1000: var(--base-two-h) calc(var(--base-two-s)) calc(var(--base-two-l) + (100% - var(--base-two-l)) * 1);
  /* ==================== 
    Color Variables 
   ===================== */
    --white: 0 0% 100%;
    --black: 0 0% 0%;
    --body-color: 225 84% 20%;
    --border-color: 0 0% 96%;
    --section-bg: 16 100% 98%;
  /* ==================== 
    Bootstrap Modifier
   ===================== */
  /* Primary Color */
    --primary-h: 18;
    --primary-s: 87%;
    --primary-l: 52%;
    --primary: var(--primary-h) var(--primary-s) var(--primary-l);
    --primary-d-100: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.1);
    --primary-d-200: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.2);
    --primary-d-300: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.3);
    --primary-d-400: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.4);
    --primary-d-500: var(--primary-h) var(--primary-s) calc(var(--primary-l) - var(--primary-l) * 0.5);
    --primary-l-100: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.1);
    --primary-l-200: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.2);
    --primary-l-300: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.3);
    --primary-l-400: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.4);
    --primary-l-500: var(--primary-h) calc(var(--primary-s)) calc(var(--primary-l) + (100% - var(--primary-l)) * 0.5);
  /* Secondary Color */
    --secondary-h: 225;
    --secondary-s: 84%;
    --secondary-l: 20%;
    --secondary: var(--secondary-h) var(--secondary-s) var(--secondary-l);
    --secondary-d-100: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.1);
    --secondary-d-200: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.2);
    --secondary-d-300: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.3);
    --secondary-d-400: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.4);
    --secondary-d-500: var(--secondary-h) var(--secondary-s) calc(var(--secondary-l) - var(--secondary-l) * 0.5);
    --secondary-l-100: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.1);
    --secondary-l-200: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.2);
    --secondary-l-300: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.3);
    --secondary-l-400: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.4);
    --secondary-l-500: var(--secondary-h) calc(var(--secondary-s)) calc(var(--secondary-l) + (100% - var(--secondary-l)) * 0.5);
  /* Success Color */
    --success-h: 112;
    --success-s: 100%;
    --success-l: 40%;
    --success: var(--success-h) var(--success-s) var(--success-l);
    --success-d-100: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.1);
    --success-d-200: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.2);
    --success-d-300: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.3);
    --success-d-400: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.4);
    --success-d-500: var(--success-h) var(--success-s) calc(var(--success-l) - var(--success-l) * 0.5);
    --success-l-100: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.1);
    --success-l-200: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.2);
    --success-l-300: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.3);
    --success-l-400: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.4);
    --success-l-500: var(--success-h) calc(var(--success-s)) calc(var(--success-l) + (100% - var(--success-l)) * 0.5);
  /* Danger Color */
    --danger-h: 0;
    --danger-s: 96%;
    --danger-l: 63%;
    --danger: var(--danger-h) var(--danger-s) var(--danger-l);
    --danger-d-100: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.1);
    --danger-d-200: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.2);
    --danger-d-300: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.3);
    --danger-d-400: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.4);
    --danger-d-500: var(--danger-h) var(--danger-s) calc(var(--danger-l) - var(--danger-l) * 0.5);
    --danger-l-100: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.1);
    --danger-l-200: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.2);
    --danger-l-300: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.3);
    --danger-l-400: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.4);
    --danger-l-500: var(--danger-h) calc(var(--danger-s)) calc(var(--danger-l) + (100% - var(--danger-l)) * 0.5);
  /* Warning Color */
    --warning-h: 40;
    --warning-s: 100%;
    --warning-l: 46%;
    --warning: var(--warning-h) var(--warning-s) var(--warning-l);
    --warning-d-100: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.1);
    --warning-d-200: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.2);
    --warning-d-300: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.3);
    --warning-d-400: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.4);
    --warning-d-500: var(--warning-h) var(--warning-s) calc(var(--warning-l) - var(--warning-l) * 0.5);
    --warning-l-100: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.1);
    --warning-l-200: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.2);
    --warning-l-300: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.3);
    --warning-l-400: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.4);
    --warning-l-500: var(--warning-h) calc(var(--warning-s)) calc(var(--warning-l) + (100% - var(--warning-l)) * 0.5);
  /* Info Color */
    --info-h: 196;
    --info-s: 100%;
    --info-l: 50%;
    --info: var(--info-h) var(--info-s) var(--info-l);
    --info-d-100: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.1);
    --info-d-200: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.2);
    --info-d-300: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.3);
    --info-d-400: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.4);
    --info-d-500: var(--info-h) var(--info-s) calc(var(--info-l) - var(--info-l) * 0.5);
    --info-l-100: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.1);
    --info-l-200: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.2);
    --info-l-300: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.3);
    --info-l-400: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.4);
    --info-l-500: var(--info-h) calc(var(--info-s)) calc(var(--info-l) + (100% - var(--info-l)) * 0.5);
}

.section-bg {
    background-color: hsl(var(--section-bg));
}

/* ============================
   Font Size css
=============================== */
.fs-10 {
    font-size: 0.5rem;
}

.fs-11 {
    font-size: 0.563rem;
}

.fs-12 {
    font-size: 0.625rem;
}

.fs-13 {
    font-size: 0.688rem;
}

.fs-14 {
    font-size: 0.75rem;
}

@media screen and (max-width: 1199px) {
    .fs-14 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-14 {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-14 {
        font-size: 0.688rem;
    }
}

.fs-15 {
    font-size: 0.813rem;
}

@media screen and (max-width: 1199px) {
    .fs-15 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-15 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-15 {
        font-size: 0.75rem;
    }
}

.fs-16 {
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .fs-16 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-16 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-16 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) {
    .fs-16 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .fs-16 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .fs-16 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .fs-16 {
        font-size: 0.75rem;
    }
}

.fs-17 {
    font-size: 0.938rem;
}

@media screen and (max-width: 1199px) {
    .fs-17 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-17 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-17 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 1199px) {
    .fs-17 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .fs-17 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .fs-17 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .fs-17 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-17 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-17 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-17 {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-17 {
        font-size: 0.75rem;
    }
}

.fs-18 {
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .fs-18 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-18 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-18 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-18 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-18 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-18 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-18 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-18 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-18 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-18 {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-18 {
        font-size: 0.813rem;
    }
}

.fs-19 {
    font-size: 1.063rem;
}

@media screen and (max-width: 1199px) {
    .fs-19 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-19 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-19 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-19 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-19 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-19 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-19 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-19 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-19 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-19 {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-19 {
        font-size: 0.875rem;
    }
}

.fs-20 {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .fs-20 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-20 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-20 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-20 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-20 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-20 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-20 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-20 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-20 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-20 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-20 {
        font-size: 0.938rem;
    }
}

.fs-21 {
    font-size: 1.188rem;
}

@media screen and (max-width: 1199px) {
    .fs-21 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-21 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-21 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-21 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-21 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-21 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-21 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-21 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-21 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-21 {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-21 {
        font-size: 1rem;
    }
}

.fs-22 {
    font-size: 1.25rem;
}

@media screen and (max-width: 1199px) {
    .fs-22 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-22 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-22 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-22 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-22 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-22 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-22 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-22 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-22 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-22 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-22 {
        font-size: 1.063rem;
    }
}

.fs-23 {
    font-size: 1.313rem;
}

@media screen and (max-width: 1199px) {
    .fs-23 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-23 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-23 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-23 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-23 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-23 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-23 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-23 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-23 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-23 {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-23 {
        font-size: 1.125rem;
    }
}

.fs-24 {
    font-size: 1.375rem;
}

@media screen and (max-width: 1199px) {
    .fs-24 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-24 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-24 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-24 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-24 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-24 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-24 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-24 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-24 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-24 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-24 {
        font-size: 1.188rem;
    }
}

.fs-25 {
    font-size: 1.438rem;
}

@media screen and (max-width: 1199px) {
    .fs-25 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-25 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-25 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-25 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-25 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-25 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-25 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-25 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-25 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-25 {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-25 {
        font-size: 1.25rem;
    }
}

.fs-26 {
    font-size: 1.5rem;
}

@media screen and (max-width: 1199px) {
    .fs-26 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-26 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-26 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-26 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-26 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-26 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-26 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-26 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-26 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-26 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-26 {
        font-size: 1.313rem;
    }
}

.fs-27 {
    font-size: 1.563rem;
}

@media screen and (max-width: 1199px) {
    .fs-27 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-27 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-27 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-27 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-27 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-27 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-27 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-27 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-27 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-27 {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-27 {
        font-size: 1.375rem;
    }
}

.fs-28 {
    font-size: 1.625rem;
}

@media screen and (max-width: 1199px) {
    .fs-28 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-28 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-28 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-28 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-28 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-28 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-28 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-28 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-28 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-28 {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-28 {
        font-size: 1.438rem;
    }
}

.fs-29 {
    font-size: 1.688rem;
}

@media screen and (max-width: 1199px) {
    .fs-29 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-29 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-29 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-29 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-29 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-29 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-29 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-29 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-29 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-29 {
        font-size: 1.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-29 {
        font-size: 1.5rem;
    }
}

.fs-30 {
    font-size: 1.75rem;
}

@media screen and (max-width: 1199px) {
    .fs-30 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-30 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-30 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-30 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-30 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-30 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-30 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-30 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-30 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-30 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-30 {
        font-size: 1.563rem;
    }
}

.fs-31 {
    font-size: 1.813rem;
}

@media screen and (max-width: 1199px) {
    .fs-31 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-31 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-31 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-31 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-31 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-31 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-31 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-31 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-31 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-31 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-31 {
        font-size: 1.625rem;
    }
}

.fs-32 {
    font-size: 1.875rem;
}

@media screen and (max-width: 1199px) {
    .fs-32 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-32 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-32 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-32 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-32 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-32 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-32 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-32 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-32 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-32 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-32 {
        font-size: 1.688rem;
    }
}

.fs-33 {
    font-size: 1.938rem;
}

@media screen and (max-width: 1199px) {
    .fs-33 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-33 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-33 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-33 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-33 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-33 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-33 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-33 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-33 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-33 {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-33 {
        font-size: 1.75rem;
    }
}

.fs-34 {
    font-size: 2rem;
}

@media screen and (max-width: 1199px) {
    .fs-34 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-34 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-34 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-34 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-34 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-34 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-34 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-34 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-34 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-34 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-34 {
        font-size: 1.813rem;
    }
}

.fs-35 {
    font-size: 2.063rem;
}

@media screen and (max-width: 1199px) {
    .fs-35 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-35 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-35 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-35 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-35 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-35 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-35 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-35 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-35 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-35 {
        font-size: 1.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-35 {
        font-size: 1.875rem;
    }
}

.fs-36 {
    font-size: 2.125rem;
}

@media screen and (max-width: 1199px) {
    .fs-36 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-36 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-36 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-36 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-36 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-36 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-36 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-36 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-36 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-36 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-36 {
        font-size: 1.938rem;
    }
}

.fs-37 {
    font-size: 2.188rem;
}

@media screen and (max-width: 1199px) {
    .fs-37 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-37 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-37 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-37 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-37 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-37 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-37 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-37 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-37 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-37 {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-37 {
        font-size: 2rem;
    }
}

.fs-38 {
    font-size: 2.25rem;
}

@media screen and (max-width: 1199px) {
    .fs-38 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-38 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-38 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-38 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-38 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-38 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-38 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-38 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-38 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-38 {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-38 {
        font-size: 2.063rem;
    }
}

.fs-39 {
    font-size: 2.313rem;
}

@media screen and (max-width: 1199px) {
    .fs-39 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-39 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-39 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-39 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-39 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-39 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-39 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-39 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-39 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-39 {
        font-size: 2.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-39 {
        font-size: 2.125rem;
    }
}

.fs-40 {
    font-size: 2.375rem;
}

@media screen and (max-width: 1199px) {
    .fs-40 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-40 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-40 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-40 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-40 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-40 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-40 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-40 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-40 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-40 {
        font-size: 2.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-40 {
        font-size: 2.188rem;
    }
}

.fs-41 {
    font-size: 2.438rem;
}

@media screen and (max-width: 1199px) {
    .fs-41 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-41 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-41 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-41 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-41 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-41 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-41 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-41 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-41 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-41 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-41 {
        font-size: 2.25rem;
    }
}

.fs-42 {
    font-size: 2.5rem;
}

@media screen and (max-width: 1199px) {
    .fs-42 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-42 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-42 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-42 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-42 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-42 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-42 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-42 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-42 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-42 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-42 {
        font-size: 2.313rem;
    }
}

.fs-43 {
    font-size: 2.563rem;
}

@media screen and (max-width: 1199px) {
    .fs-43 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-43 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-43 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-43 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-43 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-43 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-43 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-43 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-43 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-43 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-43 {
        font-size: 2.375rem;
    }
}

.fs-44 {
    font-size: 2.625rem;
}

@media screen and (max-width: 1199px) {
    .fs-44 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-44 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-44 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-44 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-44 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-44 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-44 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-44 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-44 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-44 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-44 {
        font-size: 2.438rem;
    }
}

.fs-45 {
    font-size: 2.688rem;
}

@media screen and (max-width: 1199px) {
    .fs-45 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-45 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-45 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-45 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-45 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-45 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-45 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-45 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-45 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-45 {
        font-size: 2.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-45 {
        font-size: 2.5rem;
    }
}

.fs-46 {
    font-size: 2.75rem;
}

@media screen and (max-width: 1199px) {
    .fs-46 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-46 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-46 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-46 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-46 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-46 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-46 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-46 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-46 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-46 {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-46 {
        font-size: 2.563rem;
    }
}

.fs-47 {
    font-size: 2.813rem;
}

@media screen and (max-width: 1199px) {
    .fs-47 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-47 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-47 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-47 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-47 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-47 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-47 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-47 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-47 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-47 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-47 {
        font-size: 2.625rem;
    }
}

.fs-48 {
    font-size: 2.875rem;
}

@media screen and (max-width: 1199px) {
    .fs-48 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-48 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-48 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-48 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-48 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-48 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-48 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-48 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-48 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-48 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-48 {
        font-size: 2.688rem;
    }
}

.fs-49 {
    font-size: 2.938rem;
}

@media screen and (max-width: 1199px) {
    .fs-49 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-49 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-49 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-49 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-49 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-49 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-49 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-49 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-49 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-49 {
        font-size: 2.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-49 {
        font-size: 2.75rem;
    }
}

.fs-50 {
    font-size: 3rem;
}

@media screen and (max-width: 1199px) {
    .fs-50 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-50 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-50 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-50 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-50 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-50 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-50 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-50 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-50 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-50 {
        font-size: 2.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-50 {
        font-size: 2.813rem;
    }
}

.fs-51 {
    font-size: 3.063rem;
}

@media screen and (max-width: 1199px) {
    .fs-51 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-51 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-51 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-51 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-51 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-51 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-51 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-51 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-51 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-51 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-51 {
        font-size: 2.875rem;
    }
}

.fs-52 {
    font-size: 3.125rem;
}

@media screen and (max-width: 1199px) {
    .fs-52 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-52 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-52 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-52 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-52 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-52 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-52 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-52 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-52 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-52 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-52 {
        font-size: 2.938rem;
    }
}

.fs-53 {
    font-size: 3.188rem;
}

@media screen and (max-width: 1199px) {
    .fs-53 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-53 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-53 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-53 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-53 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-53 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-53 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-53 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-53 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-53 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-53 {
        font-size: 3rem;
    }
}

.fs-54 {
    font-size: 3.25rem;
}

@media screen and (max-width: 1199px) {
    .fs-54 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-54 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-54 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-54 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-54 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-54 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-54 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-54 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-54 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-54 {
        font-size: 3.125rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-54 {
        font-size: 3.063rem;
    }
}

.fs-55 {
    font-size: 3.313rem;
}

@media screen and (max-width: 1199px) {
    .fs-55 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-55 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-55 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-55 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-55 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-55 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-55 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-55 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-55 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-55 {
        font-size: 3.188rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-55 {
        font-size: 3.125rem;
    }
}

.fs-56 {
    font-size: 3.375rem;
}

@media screen and (max-width: 1199px) {
    .fs-56 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-56 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-56 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-56 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-56 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-56 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-56 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-56 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-56 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-56 {
        font-size: 3.25rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-56 {
        font-size: 3.188rem;
    }
}

.fs-57 {
    font-size: 3.438rem;
}

@media screen and (max-width: 1199px) {
    .fs-57 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-57 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-57 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-57 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-57 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-57 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-57 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-57 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-57 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-57 {
        font-size: 3.313rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-57 {
        font-size: 3.25rem;
    }
}

.fs-58 {
    font-size: 3.5rem;
}

@media screen and (max-width: 1199px) {
    .fs-58 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-58 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-58 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-58 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-58 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-58 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-58 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-58 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-58 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-58 {
        font-size: 3.375rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-58 {
        font-size: 3.313rem;
    }
}

.fs-59 {
    font-size: 3.563rem;
}

@media screen and (max-width: 1199px) {
    .fs-59 {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-59 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-59 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-59 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-59 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-59 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-59 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-59 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-59 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-59 {
        font-size: 3.438rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-59 {
        font-size: 3.375rem;
    }
}

.fs-60 {
    font-size: 3.625rem;
}

@media screen and (max-width: 1199px) {
    .fs-60 {
        font-size: 3.75rem;
    }
}

@media screen and (max-width: 991px) {
    .fs-60 {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 575px) {
    .fs-60 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 1399px) {
    .fs-60 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 1199px) {
    .fs-60 {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 991px) {
    .fs-60 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 1399px) and (max-width: 575px) {
    .fs-60 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 767px) {
    .fs-60 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .fs-60 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .fs-60 {
        font-size: 3.5rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .fs-60 {
        font-size: 3.438rem;
    }
}

.btn-magnetic {
    position: relative;
    overflow: hidden;
    z-index: 1;
    -webkit-transition: all cubic-bezier(0.645, 0.045, 0.355, 1) 0.35s;
    transition: all cubic-bezier(0.645, 0.045, 0.355, 1) 0.35s;
    cursor: pointer;
    border: 1px solid hsl(var(--border-color));
    font-size: 0.875rem;
    font-weight: var(--bold);
    display: inline-block;
    color: hsl(var(--secondary));
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    padding: 15px 20px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 5px;
}

@media screen and (max-width: 1199px) {
    .btn-magnetic {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .btn-magnetic {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .btn-magnetic {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) {
    .btn-magnetic {
        padding: 10px 20px;
    }
}

.btn-magnetic:hover, .btn-magnetic:focus {
    border-color: hsl(var(--base));
    color: hsl(var(--white));
}

.btn-magnetic:hover i, .btn-magnetic:focus i {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
}

.btn-magnetic:hover span, .btn-magnetic:focus span {
    width: 225%;
    height: 225%;
}

.btn-magnetic i {
    font-size: 1.125rem;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

@media screen and (max-width: 1199px) {
    .btn-magnetic i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .btn-magnetic i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .btn-magnetic i {
        font-size: 1.063rem;
    }
}

.btn-magnetic span {
    position: absolute;
    width: 0;
    height: 0;
    background-color: hsl(var(--base));
    -webkit-transition: width 0.4s ease-in-out, height 0.4s ease-in-out;
    transition: width 0.4s ease-in-out, height 0.4s ease-in-out;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: -1;
    border-radius: 10px;
}

.btn-magnetic.btn-magnetic-active {
    background: hsl(var(--base));
    color: hsl(var(--white));
}

.btn-magnetic.btn-magnetic-active:hover {
    border-color: hsl(var(--secondary));
}

.btn-magnetic.btn-magnetic-active span {
    background: hsl(var(--secondary));
}

.custom_anime_top {
    -webkit-animation: anime-top 1.5s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
    animation: anime-top 1.5s forwards cubic-bezier(0.645, 0.045, 0.355, 1);
    opacity: 0;
}

@-webkit-keyframes anime-top {
    0% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%);
        -webkit-clip-path: inset(0 0 100% 0);
        clip-path: inset(0 0 100% 0);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
        opacity: 1;
    }
}

@keyframes anime-top {
    0% {
        -webkit-transform: translateY(-5%);
        transform: translateY(-5%);
        -webkit-clip-path: inset(0 0 100% 0);
        clip-path: inset(0 0 100% 0);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        -webkit-clip-path: inset(0 0 0 0);
        clip-path: inset(0 0 0 0);
        opacity: 1;
    }
}

.modal-search-box .s__box {
    position: relative;
}

.modal-search-box input[type=text] {
    padding: 15px 20px;
    padding-right: 40px;
    font-size: 1rem;
    height: 50px;
    line-height: 48px;
    color: hsl(var(--gray3));
    font-size: 16px;
    border-radius: 5px;
}

.modal-search-box input[type=text]:focus {
    border-bottom-color: hsl(var(--primary));
}

.modal-search-box button {
    position: absolute;
    right: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    color: hsl(var(--gray3));
}

#searchBoxModal .modal-body {
    padding: 30px;
}

@media screen and (max-width: 991px) {
    #searchBoxModal .modal-body {
        margin-top: 30px;
    }
}

#searchBoxModal .btn-close {
    position: absolute;
    right: 40px;
    top: 20px;
    opacity: 1;
    color: hsl(var(--black));
    background: hsl(var(--white)) var(--bs-btn-close-bg) center/1em auto no-repeat;
    padding: 15px;
    z-index: 1;
}

@media screen and (max-width: 991px) {
    #searchBoxModal .btn-close {
        position: relative;
        right: 0;
    }
}

#searchBoxModal .search-quick-list {
    padding-top: 30px;
}

#searchBoxModal .search-quick-list ul {
    display: grid;
    gap: 6px;
    margin-top: 10px;
}

#searchBoxModal .search-quick-list ul a {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--base-two));
}

@media screen and (max-width: 1199px) {
    #searchBoxModal .search-quick-list ul a {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    #searchBoxModal .search-quick-list ul a {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    #searchBoxModal .search-quick-list ul a {
        font-size: 0.813rem;
    }
}

#searchBoxModal .search-quick-list ul a:hover {
    color: hsl(var(--base));
}

#smooth-wrapper {
    overflow-x: hidden;
}

/* ================================= 
  Common Typography Css 
=================================== */
* {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

body {
    font-family: var(--body-font);
    color: hsl(var(--body-color));
    word-break: break-word;
    min-height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    overflow-x: hidden;
}

p {
    font-size: 1rem;
    margin: 0;
    color: hsl(var(--body-color));
}

@media screen and (max-width: 1199px) {
    p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    p {
        font-size: 0.938rem;
    }
}

span {
    display: inline-block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: hsl(var(--base-two));
    line-height: 1.3;
    font-weight: 700;
}

@media screen and (max-width: 767px) {
    h1,
h2,
h3,
h4,
h5,
h6 {
        margin: 0 0 15px 0;
    }
}

h1 {
    font-size: 4.375rem;
}

@media screen and (max-width: 1399px) {
    h1 {
        font-size: 3.4375rem;
    }
}

@media screen and (max-width: 1199px) {
    h1 {
        font-size: 2.8125rem;
    }
}

@media screen and (max-width: 991px) {
    h1 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 767px) {
    h1 {
        font-size: 2.1875rem;
    }
}

@media screen and (max-width: 575px) {
    h1 {
        font-size: 1.875rem;
    }
}

h2 {
    font-size: 2.5rem;
    margin-top: -10px !important;
}

@media screen and (max-width: 1399px) {
    h2 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 1199px) {
    h2 {
        font-size: 2.5rem;
    }
}

@media screen and (max-width: 991px) {
    h2 {
        font-size: 2.1875rem;
    }
}

@media screen and (max-width: 767px) {
    h2 {
        font-size: 1.875rem;
    }
}

@media screen and (max-width: 575px) {
    h2 {
        font-size: 1.5625rem;
    }
}

h3 {
    font-size: 1.875rem;
}

@media screen and (max-width: 1399px) {
    h3 {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 1199px) {
    h3 {
        font-size: 1.5625rem;
    }
}

@media screen and (max-width: 991px) {
    h3 {
        font-size: 1.4375rem;
    }
}

@media screen and (max-width: 767px) {
    h3 {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 575px) {
    h3 {
        font-size: 1.25rem;
    }
}

h4 {
    font-size: 1.5rem;
}

@media screen and (max-width: 1399px) {
    h4 {
        font-size: 1.3125rem;
    }
}

@media screen and (max-width: 1199px) {
    h4 {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 991px) {
    h4 {
        font-size: 1.1875rem;
    }
}

@media screen and (max-width: 767px) {
    h4 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    h4 {
        font-size: 1.0625rem;
    }
}

h5 {
    font-size: 1.25rem;
}

@media screen and (max-width: 1399px) {
    h5 {
        font-size: 1.1875rem;
    }
}

@media screen and (max-width: 1199px) {
    h5 {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 991px) {
    h5 {
        font-size: 1.0625rem;
    }
}

@media screen and (max-width: 767px) {
    h5 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    h5 {
        font-size: 1rem;
    }
}

h6 {
    font-size: 1rem;
}

@media screen and (max-width: 1399px) {
    h6 {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1199px) {
    h6 {
        font-size: 0.9375rem;
    }
}

@media screen and (max-width: 991px) {
    h6 {
        font-size: 0.9375rem;
    }
}

@media screen and (max-width: 767px) {
    h6 {
        font-size: 0.9375rem;
    }
}

@media screen and (max-width: 575px) {
    h6 {
        font-size: 0.9375rem;
    }
}

p {
    color: hsl(var(--base-two)/0.65);
}

h1 > a,
h2 > a,
h3 > a,
h4 > a,
h5 > a,
h6 > a {
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    -webkit-transition: 0.2s linear;
    transition: 0.2s linear;
    line-height: inherit;
}

a {
    display: inline-block;
    -webkit-transition: 0.2s linear;
    transition: 0.2s linear;
    text-decoration: none;
    color: hsl(var(--info));
}

a:hover {
    color: hsl(var(--base));
}

img {
    max-width: 100%;
    height: auto;
}

select {
    cursor: pointer;
}

ul,
ol {
    padding: 0;
    margin: 0;
    list-style: none;
}

button {
    border: 0;
    background-color: transparent;
}

button:focus {
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-select:focus {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.dashboard-body h1,
.dashboard-body h2,
.dashboard-body h3,
.dashboard-body h4,
.dashboard-body h5,
.dashboard-body h6 {
    font-family: var(--body-font);
}

/* ============================
    Reset css 
=============================== */
*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

* {
    margin: 0;
    padding: 0;
}

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
}

ul[role=list],
ol[role=list] {
    list-style: none;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

html:focus-within {
    scroll-behavior: smooth;
}

a:not([class]) {
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto;
}

button,
a {
    text-decoration: none;
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 0;
}

button:focus,
a:focus {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 0;
}

img,
picture,
svg,
video,
canvas {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
    font-style: italic;
    background-repeat: no-repeat;
    background-size: cover;
}

img {
    margin-bottom: -1px;
}

input,
button,
textarea,
select {
    font: inherit;
}

@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }

    *,
*::before,
*::after {
        -webkit-animation-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        -webkit-animation-iteration-count: 1 !important;
        animation-iteration-count: 1 !important;
        -webkit-transition-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
        -webkit-transition: none;
        transition: none;
    }
}

.offcanvas-backdrop {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background: hsl(var(--secondary)/0.5) !important;
    opacity: 1 !important;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    width: 0;
}

.offcanvas-backdrop.show {
    width: 100%;
    border-radius: 0;
}

.offcanvas {
    background: hsl(var(--secondary));
    height: 100vh;
}

button.btn-close {
    -webkit-filter: invert(99%) sepia(0%) saturate(819%) hue-rotate(70deg) brightness(105%) contrast(100%);
    filter: invert(99%) sepia(0%) saturate(819%) hue-rotate(70deg) brightness(105%) contrast(100%);
    opacity: 1;
}

.navbar-brand {
    margin-right: 0;
}

body,
html {
    scroll-behavior: smooth;
}

body ::-moz-selection, html ::-moz-selection {
    background: hsl(var(--primary)/0.7);
    color: hsl(var(--black));
}

body ::selection,
html ::selection {
    background: hsl(var(--primary)/0.7);
    color: hsl(var(--black));
}

.slide-transition {
    -webkit-transition-timing-function: linear;
    transition-timing-function: linear;
}

.inner-slide-element {
    width: auto;
    display: inline-block;
    padding: 0 15px;
}

.datepicker table tr td.today,
.datepicker table tr td.today:hover,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today.disabled:hover {
    background: hsl(var(--secondary)/0.1);
    color: hsl(var(--secondary));
}

.datepicker table tr td.today:hover,
.datepicker table tr td.today:hover:hover,
.datepicker table tr td.today.disabled:hover,
.datepicker table tr td.today.disabled:hover:hover,
.datepicker table tr td.today:active,
.datepicker table tr td.today:hover:active,
.datepicker table tr td.today.disabled:active,
.datepicker table tr td.today.disabled:hover:active,
.datepicker table tr td.today.active,
.datepicker table tr td.today:hover.active,
.datepicker table tr td.today.disabled.active,
.datepicker table tr td.today.disabled:hover.active,
.datepicker table tr td.today.disabled,
.datepicker table tr td.today:hover.disabled,
.datepicker table tr td.today.disabled.disabled,
.datepicker table tr td.today.disabled:hover.disabled,
.datepicker table tr td.today[disabled],
.datepicker table tr td.today:hover[disabled],
.datepicker table tr td.today.disabled[disabled],
.datepicker table tr td.today.disabled:hover[disabled] {
    background: hsl(var(--base));
    color: hsl(var(--white));
}

.datepicker table tr td span.active:hover,
.datepicker table tr td span.active:hover:hover,
.datepicker table tr td span.active.disabled:hover,
.datepicker table tr td span.active.disabled:hover:hover,
.datepicker table tr td span.active:active,
.datepicker table tr td span.active:hover:active,
.datepicker table tr td span.active.disabled:active,
.datepicker table tr td span.active.disabled:hover:active,
.datepicker table tr td span.active.active,
.datepicker table tr td span.active:hover.active,
.datepicker table tr td span.active.disabled.active,
.datepicker table tr td span.active.disabled:hover.active,
.datepicker table tr td span.active.disabled,
.datepicker table tr td span.active:hover.disabled,
.datepicker table tr td span.active.disabled.disabled,
.datepicker table tr td span.active.disabled:hover.disabled,
.datepicker table tr td span.active[disabled],
.datepicker table tr td span.active:hover[disabled],
.datepicker table tr td span.active.disabled[disabled],
.datepicker table tr td span.active.disabled:hover[disabled],
.datepicker table tr td.active:hover,
.datepicker table tr td.active:hover:hover,
.datepicker table tr td.active.disabled:hover,
.datepicker table tr td.active.disabled:hover:hover,
.datepicker table tr td.active:active,
.datepicker table tr td.active:hover:active,
.datepicker table tr td.active.disabled:active,
.datepicker table tr td.active.disabled:hover:active,
.datepicker table tr td.active.active,
.datepicker table tr td.active:hover.active,
.datepicker table tr td.active.disabled.active,
.datepicker table tr td.active.disabled:hover.active,
.datepicker table tr td.active.disabled,
.datepicker table tr td.active:hover.disabled,
.datepicker table tr td.active.disabled.disabled,
.datepicker table tr td.active.disabled:hover.disabled,
.datepicker table tr td.active[disabled],
.datepicker table tr td.active:hover[disabled],
.datepicker table tr td.active.disabled[disabled],
.datepicker table tr td.active.disabled:hover[disabled] {
    background: hsl(var(--base));
}

.datepicker.dropdown-menu {
    font-family: var(--body-font);
    padding: 15px;
    border: none;
    margin: 25px 0;
}

.datepicker table thead:first-child tr:first-child th {
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .datepicker table thead:first-child tr:first-child th {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .datepicker table thead:first-child tr:first-child th {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .datepicker table thead:first-child tr:first-child th {
        font-size: 0.938rem;
    }
}

.datepicker table thead:first-child tr:nth-child(2) {
    color: hsl(var(--base));
}

.datepicker table thead .prev,
.datepicker table thead .next {
    background: hsl(var(--base));
    color: hsl(var(--white));
    padding: 10px 15px;
}

.datepicker table thead .prev:hover,
.datepicker table thead .next:hover {
    background: hsl(var(--secondary)) !important;
}

.datepicker table thead .dow {
    padding-top: 20px;
}

.datepicker table td {
    width: 38px;
    height: 38px;
    border-radius: 50px;
    padding: 7px 5px !important;
}

.text-reveal {
    position: relative;
    z-index: 1;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    -webkit-transform-origin: left;
    transform-origin: left;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.text-reveal[data-scroll=in] {
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.text-reveal::after {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #fcfcfc;
    -webkit-transform-origin: right;
    transform-origin: right;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.text-reveal[data-scroll=in]::after {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.video-play-btn {
    z-index: 10;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    display: block;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    position: relative;
}

.video-play-btn::before, .video-play-btn::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 60px;
    height: 60px;
    background: hsl(var(--primary));
    border-radius: 50%;
}

.video-play-btn::before {
    z-index: 0;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
}

.video-play-btn:after {
    z-index: 1;
    -webkit-transition: all 200ms;
    transition: all 200ms;
}

.video-play-btn i {
    display: block;
    position: relative;
    z-index: 3;
    color: hsl(var(--white));
    font-size: 35px;
    text-align: center;
}

.swiper-pagination {
    position: relative;
    margin-top: 60px;
}

.swiper-pagination .swiper-pagination-bullet {
    width: 15px;
    height: 15px;
}

.swiper-pagination .swiper-pagination-bullet-active {
    background-color: hsl(var(--base));
}

.pagination {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.pagination .page-item {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .pagination .page-item {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .pagination .page-item {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .pagination .page-item {
        font-size: 1.063rem;
    }
}

.pagination .page-link {
    border: 1px solid hsl(var(--secondary)/0.1);
    color: hsl(var(--secondary));
    font-weight: 600;
    outline: none;
    border-radius: 5px;
    width: 40px;
    height: 40px;
    padding: 0;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .pagination .page-link {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .pagination .page-link {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .pagination .page-link {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 424px) {
    .pagination .page-link {
        font-size: 0.875rem;
        width: 30px;
        height: 30px;
    }
}

@media screen and (max-width: 424px) and (max-width: 1199px) {
    .pagination .page-link {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 424px) and (max-width: 991px) {
    .pagination .page-link {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 424px) and (max-width: 575px) {
    .pagination .page-link {
        font-size: 0.813rem;
    }
}

.pagination .page-link.active, .pagination .page-link:focus, .pagination .page-link:hover {
    background: hsl(var(--base));
    border-color: hsl(var(--base));
    color: hsl(var(--white));
}

.pagination .page-link .material-icons {
    font-size: 1.125rem;
    width: 15px;
}

@media screen and (max-width: 1199px) {
    .pagination .page-link .material-icons {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .pagination .page-link .material-icons {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .pagination .page-link .material-icons {
        font-size: 1.063rem;
    }
}

.accordion-button:not(.collapsed) {
    color: var(--bs-accordion-active-color);
    background-color: hsl(var(--base)/0.1);
    -webkit-box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
    box-shadow: inset 0 calc(-1 * var(--bs-accordion-border-width)) 0 var(--bs-accordion-border-color);
}

.form-check-input:checked {
    background-color: hsl(var(--base));
    border-color: hsl(var(--base));
    -webkit-box-shadow: hsl(var(--base)/0.25);
    box-shadow: hsl(var(--base)/0.25);
}

.form-check-label a {
    color: hsl(var(--secondary));
}

.form-check-label a:hover {
    color: hsl(var(--base));
}

.form-control {
    color: hsl(var(--base-two)/0.8);
}

.form-control:focus {
    -webkit-box-shadow: 0 0 0 0.15rem hsl(var(--base)/0.03);
    box-shadow: 0 0 0 0.15rem hsl(var(--base)/0.03);
    border-color: hsl(var(--base));
    color: hsl(var(--base-two)/0.8);
}

input:-internal-autofill-selected {
    background: hsl(var(--base));
}

.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label::after {
    background: none;
}

.form-floating > .form-control:not(:-ms-input-placeholder) ~ label::after {
    background: none;
}

.form-floating > .form-control-plaintext ~ label::after,
.form-floating > .form-control:focus ~ label::after,
.form-floating > .form-control:not(:placeholder-shown) ~ label::after,
.form-floating > .form-select ~ label::after {
    background: none;
}

.form-floating > .form-control:-webkit-autofill ~ label {
    color: rgba(var(--bs-body-color-rgb), 0.65);
    -webkit-transform: scale(0.7) translateY(-0.3rem) translateX(0.5rem);
    transform: scale(0.7) translateY(-0.3rem) translateX(0.5rem);
}

.bg--base {
    background-color: hsl(var(--base)) !important;
}

.bg--primary {
    background-color: hsl(var(--primary)) !important;
}

.bg--secondary {
    background-color: hsl(var(--secondary)) !important;
}

.bg--success {
    background-color: hsl(var(--success)) !important;
}

.bg--danger {
    background-color: hsl(var(--danger)) !important;
}

.bg--warning {
    background-color: hsl(var(--warning)) !important;
}

.bg--info {
    background-color: hsl(var(--info)) !important;
}

.text--base {
    color: hsl(var(--base)) !important;
}

.text--primary {
    color: hsl(var(--primary)) !important;
}

.text--secondary {
    color: hsl(var(--secondary)) !important;
}

.text--success {
    color: hsl(var(--success)) !important;
}

.text--danger {
    color: hsl(var(--danger)) !important;
}

.text--warning {
    color: hsl(var(--warning)) !important;
}

.text--info {
    color: hsl(var(--info)) !important;
}

.my-120 {
    margin-top: 60px;
    margin-bottom: 60px;
}

@media (min-width: 576px) {
    .my-120 {
        margin-top: 80px;
        margin-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .my-120 {
        margin-top: 120px;
        margin-bottom: 120px;
    }
}

.mt-120 {
    margin-top: 60px;
}

@media (min-width: 576px) {
    .mt-120 {
        margin-top: 80px;
    }
}

@media (min-width: 992px) {
    .mt-120 {
        margin-top: 120px;
    }
}

.mb-120 {
    margin-bottom: 60px;
}

@media (min-width: 576px) {
    .mb-120 {
        margin-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .mb-120 {
        margin-bottom: 120px;
    }
}

.my-60 {
    margin-top: 30px;
    margin-bottom: 30px;
}

@media (min-width: 576px) {
    .my-60 {
        margin-top: 40px;
        margin-bottom: 40px;
    }
}

@media (min-width: 992px) {
    .my-60 {
        margin-top: 60px;
        margin-bottom: 60px;
    }
}

.mt-60 {
    margin-top: 30px;
}

@media (min-width: 576px) {
    .mt-60 {
        margin-top: 40px;
    }
}

@media (min-width: 992px) {
    .mt-60 {
        margin-top: 60px;
    }
}

.mb-60 {
    margin-bottom: 30px;
}

@media (min-width: 576px) {
    .mb-60 {
        margin-bottom: 40px;
    }
}

@media (min-width: 992px) {
    .mb-60 {
        margin-bottom: 60px;
    }
}

.py-120 {
    padding-top: 60px;
    padding-bottom: 60px;
}

@media (min-width: 576px) {
    .py-120 {
        padding-top: 80px;
        padding-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .py-120 {
        padding-top: 120px;
        padding-bottom: 120px;
    }
}

.pt-120 {
    padding-top: 60px;
}

@media (min-width: 576px) {
    .pt-120 {
        padding-top: 80px;
    }
}

@media (min-width: 992px) {
    .pt-120 {
        padding-top: 120px;
    }
}

.pb-120 {
    padding-bottom: 60px;
}

@media (min-width: 576px) {
    .pb-120 {
        padding-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .pb-120 {
        padding-bottom: 120px;
    }
}

.py-100 {
    padding-top: 60px;
    padding-bottom: 60px;
}

@media (min-width: 576px) {
    .py-100 {
        padding-top: 80px;
        padding-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .py-100 {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}

.pt-100 {
    padding-top: 60px;
}

@media (min-width: 576px) {
    .pt-100 {
        padding-top: 80px;
    }
}

@media (min-width: 992px) {
    .pt-100 {
        padding-top: 100px;
    }
}

.pb-100 {
    padding-bottom: 60px;
}

@media (min-width: 576px) {
    .pb-100 {
        padding-bottom: 80px;
    }
}

@media (min-width: 992px) {
    .pb-100 {
        padding-bottom: 100px;
    }
}

.py-60 {
    padding-top: 30px;
    padding-bottom: 30px;
}

@media (min-width: 576px) {
    .py-60 {
        padding-top: 40px;
        padding-bottom: 40px;
    }
}

@media (min-width: 992px) {
    .py-60 {
        padding-top: 60px;
        padding-bottom: 60px;
    }
}

.pt-60 {
    padding-top: 30px;
}

@media (min-width: 576px) {
    .pt-60 {
        padding-top: 40px;
    }
}

@media (min-width: 992px) {
    .pt-60 {
        padding-top: 60px;
    }
}

.pb-60 {
    padding-bottom: 30px;
}

@media (min-width: 576px) {
    .pb-60 {
        padding-bottom: 40px;
    }
}

@media (min-width: 992px) {
    .pb-60 {
        padding-bottom: 60px;
    }
}

.border--base {
    border-color: hsl(var(--base)) !important;
}

.border--primary {
    border-color: hsl(var(--primary)) !important;
}

.border--secondary {
    border-color: hsl(var(--secondary)) !important;
}

.border--success {
    border-color: hsl(var(--success)) !important;
}

.border--danger {
    border-color: hsl(var(--danger)) !important;
}

.border--warning {
    border-color: hsl(var(--warning)) !important;
}

.border--info {
    border-color: hsl(var(--info)) !important;
}

/* ============================
    Banner css
=============================== */
.banner-area {
    --padding_100: 80px;
    padding-top: 120px;
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 1199px) {
    .banner-area {
        overflow-x: hidden;
    }
}

@media screen and (max-width: 991px) {
    .banner-area {
        padding-top: 50px;
    }
}

.banner-area::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../image/banner-bg.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.banner-area .container {
    max-width: 1500px;
    padding: 0 50px;
}

@media screen and (max-width: 991px) {
    .banner-area .container {
        padding: 0px 20px;
    }
}

.banner-area__text {
    padding-top: var(--padding_100);
}

.banner-area__text h1 {
    margin: -17px 0;
}

@media screen and (max-width: 991px) {
    .banner-area__text h1 {
        max-width: 355px;
    }
}

.banner-area__text p {
    font-size: 1.125rem;
    max-width: 540px;
    padding: 30px 0;
}

@media screen and (max-width: 1199px) {
    .banner-area__text p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .banner-area__text p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .banner-area__text p {
        font-size: 1.063rem;
    }
}

.banner-area__text .btn-magnetic {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.banner-area__text .btn-magnetic:hover {
    border-color: hsl(var(--secondary));
}

.banner-area__text .btn-magnetic span {
    background-color: hsl(var(--secondary));
}

.banner-area__images {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    gap: 24px;
}

@media screen and (max-width: 1199px) {
    .banner-area__images {
        margin-right: 0;
    }
}

@media screen and (max-width: 991px) {
    .banner-area__images {
        margin-top: 24px;
    }
}

.banner-area__images .banner-imgs {
    overflow: hidden;
    border-radius: 10px;
}

.banner-area__images .banner-imgs:first-child {
    margin-top: var(--padding_100);
}

.banner-area__images .banner-imgs:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.banner-area__images .banner-imgs img {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.banner-area__search {
    width: 900px;
    position: relative;
    z-index: 11;
    margin-top: 40px;
}

@media screen and (max-width: 1199px) {
    .banner-area__search {
        width: 940px;
    }
}

@media screen and (max-width: 991px) {
    .banner-area__search {
        width: 100%;
    }
}

.banner-two {
    position: relative;
    z-index: 1;
    margin: 24px;
    margin-bottom: 0;
    padding: 250px 0 180px;
}

@media screen and (max-width: 991px) {
    .banner-two {
        margin: 15px;
        margin-bottom: 0;
        padding: 160px 0 100px;
    }
}

@media screen and (max-width: 424px) {
    .banner-two {
        margin: 5px;
    }
}

.banner-two.m-0::before,
.banner-two.m-0 .slide-bg {
    border-radius: 0;
}

.banner-two::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: hsl(var(--secondary)/0.9);
    z-index: 1;
    border-radius: 10px;
    mix-blend-mode: multiply;
}

.banner-two .slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: 0;
    -webkit-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
    border-radius: 10px;
}

.banner-two__content {
    position: relative;
    z-index: 1;
}

.banner-two__content h1 {
    text-align: center;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .banner-two__content h1 {
        max-width: 650px;
        margin: 0 auto;
    }
}

.banner-two__content p {
    text-align: center;
    font-size: 1.125rem;
    font-weight: 500;
    padding: 20px 0 40px;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .banner-two__content p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .banner-two__content p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .banner-two__content p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1199px) {
    .banner-two__content p {
        max-width: 650px;
        margin: 0 auto;
    }
}
/* ============================
    choose css
=============================== */
.choose-area {
    background: hsl(var(--white));
}

.choose-area__item {
    border-radius: 10px;
    border: 1px solid hsl(var(--secondary)/0.05);
    padding: 40px;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

@media screen and (max-width: 1399px) {
    .choose-area__item {
        padding: 24px;
    }
}

@media screen and (max-width: 767px) {
    .choose-area__item {
        text-align: center;
    }
}

.choose-area__item:hover {
    background: hsl(var(--base)/0.04);
}

.choose-area__item:hover h5 {
    color: hsl(var(--base));
}

.choose-area__item svg {
    min-height: 60px;
}

.choose-area__item h5, .choose-area__item p, .choose-area__item svg {
    -webkit-transition: all 3;
    transition: all 3;
}

.choose-area__item h5 {
    padding: 20px 0 15px;
}

.choose-area__item p {
    font-weight: 400;
}

/* ============================
    destination css
=============================== */
.destination-content__item {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

.destination-content__item img {
    width: 100%;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.destination-content__item:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.destination-content__item:hover .destination-content__text {
    -webkit-transform: translateY(-22px);
    transform: translateY(-22px);
}

.destination-content__item:hover .destination-content__text a {
    padding-bottom: 0px;
}

.destination-content__item:hover .destination-content__text__time span {
    opacity: 1;
}

.destination-content__item:hover::before {
    top: 0;
}

.destination-content__item::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: -webkit-gradient(linear, left bottom, left top, from(hsl(var(--secondary))), color-stop(78.01%, hsl(var(--secondary)/0)));
    background: linear-gradient(0deg, hsl(var(--secondary)) 0%, hsl(var(--secondary)/0) 78.01%);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.destination-content__text {
    position: absolute;
    bottom: 0;
    left: 25px;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    z-index: 1;
}

.destination-content__text a {
    color: hsl(var(--white));
    padding-bottom: 10px;
}

.destination-content__text__time span {
    font-size: 0.875rem;
    font-weight: 400;
    color: hsl(var(--white));
    opacity: 0;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

@media screen and (max-width: 1199px) {
    .destination-content__text__time span {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .destination-content__text__time span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .destination-content__text__time span {
        font-size: 0.813rem;
    }
}

.destination-about .search-bar {
    margin-top: -70px;
    z-index: 1;
    position: relative;
}

/* ============================
    featured css
=============================== */
.featured-content .featured-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    row-gap: 15px;
}

.featured-content .featured-nav li {
    color: hsl(var(--secondary));
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
}

@media screen and (max-width: 1199px) {
    .featured-content .featured-nav li {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-content .featured-nav li {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-content .featured-nav li {
        font-size: 0.813rem;
    }
}

.featured-content .featured-nav li.active, .featured-content .featured-nav li:hover {
    color: hsl(var(--base));
}

.featured-content .card-grid {
    margin-top: -12px;
    margin-bottom: -12px;
}

.featured-content .card-grid .card-grid-item {
    margin-top: 12px;
    margin-bottom: 12px;
}

.featured-content__card {
    border: 1px solid hsl(var(--border-color));
    border-radius: 10px;
    overflow: hidden;
}

.featured-content__card:hover img {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}

.featured-content__card:hover a {
    color: hsl(var(--base));
}

.featured-content__card .card-image {
    overflow: hidden;
}

.featured-content__card .card-image img {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.featured-content__card .card-content {
    padding: 20px;
    background-color: hsl(var(--white));
    display: grid;
}

@media screen and (max-width: 1199px) {
    .featured-content__card .card-content {
        padding: 20px 10px;
    }
}

.featured-content__card .card-content .card-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 0.813rem;
    color: hsl(var(--secondary)/0.5);
    margin-bottom: 10px;
}

@media screen and (max-width: 1199px) {
    .featured-content__card .card-content .card-info {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-content__card .card-content .card-info {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-content__card .card-content .card-info {
        font-size: 0.75rem;
    }
}

.featured-content__card .card-content .card-info span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}

.featured-content__card .card-content .card-info .rating i {
    color: hsl(var(--warning));
    margin: 0 -3px;
}

.featured-content__card .card-content .card-title {
    font-weight: bold;
    color: hsl(var(--secondary));
    margin: 20px 0 20px;
    font-weight: 600;
    line-height: 1.5;
    text-transform: capitalize;
}

@media screen and (max-width: 1199px) {
    .featured-content__card .card-content .card-title {
        margin: 10px 0 15px;
        min-height: 65px;
    }
}

.featured-content__card .card-content .card-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    color: hsl(var(--secondary)/0.5);
    border-top: 1px solid hsl(var(--border-color));
    padding-top: 15px;
}

.featured-content__card .card-content .card-footer .price strong {
    color: hsl(var(--secondary)/0.8);
}

.featured-content__card .card-content .material-icons {
    font-size: 16px;
    vertical-align: middle;
}

.featured-content__card-two {
    border: 1px solid hsl(var(--border-color));
    border-radius: 10px;
    padding: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    overflow: hidden;
}

@media screen and (max-width: 767px) {
    .featured-content__card-two {
        padding: 15px;
    }
}

@media screen and (max-width: 424px) {
    .featured-content__card-two {
        display: grid;
    }
}

.featured-content__card-two:hover .card-image img {
    -webkit-transform: scale(1.4) rotate(5deg);
    transform: scale(1.4) rotate(5deg);
}

.featured-content__card-two:hover::before, .featured-content__card-two:hover::after {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.featured-content__card-two:hover .card-text h5 {
    color: hsl(var(--white));
}

.featured-content__card-two:hover .card-text p {
    color: hsl(var(--white)/0.8);
}

.featured-content__card-two::before, .featured-content__card-two::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    -webkit-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.featured-content__card-two::before {
    background-image: url("../image/two-hover.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.featured-content__card-two::after {
    background: hsl(var(--secondary)/0.8);
}

.featured-content__card-two .card-image {
    overflow: hidden;
    border-radius: 5px;
}

.featured-content__card-two .card-image img {
    -webkit-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

@media screen and (max-width: 767px) {
    .featured-content__card-two .card-image img {
        width: 60px;
        height: 60px;
    }
}

@media screen and (max-width: 424px) {
    .featured-content__card-two .card-image img {
        height: 80px;
        width: 100%;
        -o-object-fit: cover;
        object-fit: cover;
    }
}

.featured-content__card-two .card-text h5 {
    padding-bottom: 5px;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.featured-content__card-two .card-text p {
    color: hsl(var(--secondary)/0.5);
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.featured-content .features-details p {
    font-size: 1rem;
    color: hsl(var(--secondary)/0.7);
    padding-top: 15px;
}

@media screen and (max-width: 1199px) {
    .featured-content .features-details p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-content .features-details p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-content .features-details p {
        font-size: 0.938rem;
    }
}

.featured-content .table {
    margin-top: 10px;
    margin-bottom: 0;
}

.featured-content .table tr {
    border-bottom: 1px solid hsl(var(--secondary)/0.1);
}

.featured-content .table th {
    text-transform: capitalize;
}

.featured-content .table th,
.featured-content .table td {
    padding-left: 0;
    padding-right: 0;
    color: hsl(var(--secondary)/0.7);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .featured-content .table th,
.featured-content .table td {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-content .table th,
.featured-content .table td {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-content .table th,
.featured-content .table td {
        font-size: 0.938rem;
    }
}

.featured-content .city-map,
.featured-content .weather-country {
    border: 1px solid hsl(var(--secondary)/0.1);
    padding: 24px;
    border-radius: 5px;
}

.featured-content .city-map iframe,
.featured-content .weather-country iframe {
    width: 100%;
    height: 250px;
    margin-top: 24px;
    border-radius: 5px;
}

.featured-content .city-map .table tr,
.featured-content .weather-country .table tr {
    border-bottom: 0;
}

.featured-content .city-map .table th,
.featured-content .city-map .table td,
.featured-content .weather-country .table th,
.featured-content .weather-country .table td {
    font-size: 0.875rem;
    padding: 2px 0px;
}

@media screen and (max-width: 1199px) {
    .featured-content .city-map .table th,
.featured-content .city-map .table td,
.featured-content .weather-country .table th,
.featured-content .weather-country .table td {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-content .city-map .table th,
.featured-content .city-map .table td,
.featured-content .weather-country .table th,
.featured-content .weather-country .table td {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-content .city-map .table th,
.featured-content .city-map .table td,
.featured-content .weather-country .table th,
.featured-content .weather-country .table td {
        font-size: 0.813rem;
    }
}

.featured-content-two .featured-content__card {
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease;
}

.featured-content-two .featured-content__card .card-image {
    margin: 20px;
    margin-bottom: 0;
    border-radius: 5px;
}

@media screen and (max-width: 424px) {
    .featured-content-two .featured-content__card .card-image {
        margin: 10px;
        margin-bottom: 0;
    }
}

.featured-content-two .col-md-6,
.featured-content-two .col-md-12 {
    -webkit-transition: width 0.3s ease, margin 0.2s ease;
    transition: width 0.3s ease, margin 0.2s ease;
}

.filter-buttons {
    display: none;
}

@media screen and (max-width: 991px) {
    .filter-buttons {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-bottom: 20px;
    }
}

.search-filter-left {
    display: grid;
    gap: 24px;
}

.search-filter-left__item {
    border-radius: 5px;
    border: 1px solid hsl(var(--secondary)/0.1);
    padding: 24px;
    display: grid;
    gap: 15px;
}

.search-filter-left__item h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.search-filter-left__item .nice-select {
    border: 1px solid hsl(var(--secondary)/0.1);
    font-size: 1rem;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .search-filter-left__item .nice-select {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .search-filter-left__item .nice-select {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .search-filter-left__item .nice-select {
        font-size: 0.938rem;
    }
}

.search-filter-left__item .nice-select::after {
    width: 8px;
    height: 8px;
    right: 20px;
}

.search-filter-left__item .input-group {
    border: 1px solid hsl(var(--secondary)/0.1);
    border-radius: 5px;
    padding: 8px 15px;
    font-size: 1rem;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .search-filter-left__item .input-group {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .search-filter-left__item .input-group {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .search-filter-left__item .input-group {
        font-size: 0.938rem;
    }
}

.search-filter-left__item .input-group input {
    border: 0;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin: 0;
    padding: 0;
}

.search-filter-left__item .search-btn {
    margin-bottom: 0;
    background: hsl(var(--base));
    color: hsl(var(--white));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
}

.search-filter-left__item .form-check {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}

.search-filter-left__item .form-check label {
    padding-bottom: 0;
    margin-bottom: -5px;
    cursor: pointer;
}

.search-filter-left__item .search-packages select,
.search-filter-left__item .search-packages input,
.search-filter-left__item .search-packages button {
    width: 100%;
    margin-bottom: 10px;
    padding: 8px;
    border: 1px solid hsl(var(--border-color));
    border-radius: 5px;
}

.search-filter-left__item input:checked + label {
    color: hsl(var(--base));
}

.search-filter-left .duration-filter label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 8px;
    font-size: 0.875rem;
    font-weight: 500;
}

@media screen and (max-width: 1199px) {
    .search-filter-left .duration-filter label {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .search-filter-left .duration-filter label {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .search-filter-left .duration-filter label {
        font-size: 0.813rem;
    }
}

.search-filter-left .btn-magnetic {
    background: hsl(var(--base));
    color: hsl(var(--white));
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.search-filter-left .btn-magnetic:hover {
    border-color: hsl(var(--secondary));
}

.search-filter-left .btn-magnetic span {
    background: hsl(var(--secondary));
}

.search-filter-left .check-input-group {
    display: grid;
}

.search-filter-left .check-input-group label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .search-filter-left .check-input-group label {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .search-filter-left .check-input-group label {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .search-filter-left .check-input-group label {
        font-size: 0.813rem;
    }
}

input[type=checkbox] {
    width: 16px;
    height: 16px;
    accent-color: hsl(var(--base));
}

input[type=radio] {
    border-radius: 3px;
    width: 15px;
}

input[type=radio]:checked {
    border-color: hsl(var(--base));
    background: hsl(var(--base));
    -webkit-box-shadow: 0 0 2px 1px hsl(var(--base));
    box-shadow: 0 0 2px 1px hsl(var(--base));
}

.featured-select .nice-select {
    border: 0;
    padding: 0 28px 0 8px;
    margin: 0;
    font-size: 1.125rem;
    font-weight: 500;
    height: 22px;
    line-height: 1.2;
}

@media screen and (max-width: 1199px) {
    .featured-select .nice-select {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .featured-select .nice-select {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .featured-select .nice-select {
        font-size: 1.063rem;
    }
}

.featured-select .nice-select::after {
    width: 8px;
    height: 8px;
    right: 9px;
    border-color: hsl(var(--secondary));
}

.sliders_control {
    --range-wh: 8px;
    position: relative;
    height: var(--range-wh);
    padding: 10px 0 20px;
}

.sliders_control input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    pointer-events: all;
    width: var(--range-wh);
    height: var(--range-wh);
    background-color: hsl(var(--white));
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 4px hsl(var(--base));
    box-shadow: 0 0 0 4px hsl(var(--base));
    cursor: pointer;
}

.sliders_control input[type=range]::-moz-range-thumb {
    pointer-events: all;
    width: var(--range-wh);
    height: var(--range-wh);
    background-color: hsl(var(--white));
    border-radius: 50%;
    box-shadow: 0 0 0 5px hsl(var(--base));
    cursor: pointer;
}

.sliders_control input[type=range]::-webkit-slider-thumb:hover {
    background: hsl(var(--base));
}

.sliders_control input[type=range]::-webkit-slider-thumb:active {
    -webkit-box-shadow: inset 0 0 3px hsl(var(--base)), 0 0 9px hsl(var(--base));
    box-shadow: inset 0 0 3px hsl(var(--base)), 0 0 9px hsl(var(--base));
}

.sliders_control input[type=number]::-webkit-inner-spin-button,
.sliders_control input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

.sliders_control input[type=range] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 4px;
    width: 100%;
    position: absolute;
    background-color: hsl(var(--secondary)/0.1);
    pointer-events: none;
    padding-top: 1px;
}

.sliders_control #fromSlider {
    height: 0;
    z-index: 1;
}

.form_control {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .form_control {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .form_control {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .form_control {
        font-size: 0.938rem;
    }
}

.form_control span {
    color: hsl(var(--secondary)/0.7);
}

.form_control button {
    color: hsl(var(--secondary));
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    font-weight: 500;
}

.form_control button:hover {
    color: hsl(var(--base));
}

@media screen and (max-width: 991px) {
    .toggle-grid {
        display: none;
    }
}

.toggle-btn {
    height: 30px;
    color: hsl(var(--secondary));
}

.toggle-btn i {
    font-size: 2.063rem;
}

@media screen and (max-width: 1199px) {
    .toggle-btn i {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 991px) {
    .toggle-btn i {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 575px) {
    .toggle-btn i {
        font-size: 2rem;
    }
}

.toggle-btn.active {
    color: hsl(var(--base));
}

.card__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.card__list .card-image {
    margin-bottom: 20px !important;
}

.card__list .card-content {
    padding-left: 0 !important;
}

.card__list p {
    padding-bottom: 30px;
    font-size: 1rem;
    color: hsl(var(--secondary)/0.7);
}

@media screen and (max-width: 1199px) {
    .card__list p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .card__list p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .card__list p {
        font-size: 0.938rem;
    }
}

.card__list p.d-none {
    display: block !important;
}

/* ============================
    success numbers css
=============================== */
.success-numbers.section-bg {
    position: relative;
    z-index: 1;
}

.success-numbers.section-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../image/counter-shape.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}

.success-numbers.section-bg .success-numbers__content {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

@media screen and (max-width: 991px) {
    .success-numbers.section-bg .success-numbers__content {
        grid-template-columns: repeat(2, 1fr);
    }
}

.success-numbers.section-bg .success-numbers__content .success-numbers__item {
    border-radius: 5px;
    padding: 40px 20px;
    border-radius: 5px;
    -webkit-transition: all 0.4s ease;
    transition: all 0.4s ease;
    background: hsl(var(--white));
}

@media screen and (max-width: 767px) {
    .success-numbers.section-bg .success-numbers__content .success-numbers__item {
        padding: 30px 10px;
    }
}

.success-numbers.section-bg .success-numbers__content .success-numbers__item:hover {
    background: hsl(var(--base)/0.1);
}

.success-numbers__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 24px;
}

@media screen and (max-width: 767px) {
    .success-numbers__content {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
    }

    .success-numbers__content svg {
        width: 50px;
    }
}

.success-numbers__item {
    text-align: center;
}

.success-numbers__item .number {
    font-size: 2.688rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-weight: 600;
    line-height: 1;
    padding: 15px 0 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

@media screen and (max-width: 1199px) {
    .success-numbers__item .number {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 991px) {
    .success-numbers__item .number {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 575px) {
    .success-numbers__item .number {
        font-size: 2.625rem;
    }
}

@media screen and (max-width: 1199px) {
    .success-numbers__item .number {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .success-numbers__item .number {
        font-size: 2.125rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .success-numbers__item .number {
        font-size: 2.063rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .success-numbers__item .number {
        font-size: 2rem;
    }
}

@media screen and (max-width: 991px) {
    .success-numbers__item .number {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .success-numbers__item .number {
        font-size: 1.813rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .success-numbers__item .number {
        font-size: 1.75rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .success-numbers__item .number {
        font-size: 1.688rem;
    }
}

.success-numbers__item p {
    font-size: 1rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .success-numbers__item p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .success-numbers__item p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .success-numbers__item p {
        font-size: 0.938rem;
    }
}
/* ============================
    discounts css
=============================== */
.discounts-area {
    position: relative;
    z-index: 1;
}

.discounts-area.section-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: url("../image/discounts-shape.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.discounts-area .d-grid .discounts-area__img:hover img {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}

.discounts-area .d-grid .discounts-area__img img {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.discounts-area__img {
    overflow: hidden;
    border-radius: 5px;
}

.discounts-area__img:hover img {
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
}

.discounts-area__img img {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.discounts-area__content h2 strong {
    color: hsl(var(--base));
}

.discounts-area__content p {
    font-size: 1rem;
    padding: 25px 0 30px;
}

@media screen and (max-width: 1199px) {
    .discounts-area__content p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .discounts-area__content p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .discounts-area__content p {
        font-size: 0.938rem;
    }
}

.discounts-area__content .btn-magnetic {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.discounts-area__content .btn-magnetic:hover {
    border-color: hsl(var(--secondary));
}

.discounts-area__content .btn-magnetic span {
    background-color: hsl(var(--secondary));
}

.discounts-area__offer {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 11;
    font-size: 35px;
    text-align: center;
    width: 145px;
    height: 145px;
    margin: 0 auto;
    border-radius: 5px;
    background: hsl(var(--base));
    -webkit-transform: rotate(-45deg) translate(-1%, -70%);
    transform: rotate(-45deg) translate(-1%, -70%);
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.discounts-area__offer h3 {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    color: hsl(var(--white));
    font-size: 1.625rem;
    font-weight: 400;
}

@media screen and (max-width: 1199px) {
    .discounts-area__offer h3 {
        font-size: 1.688rem;
    }
}

@media screen and (max-width: 991px) {
    .discounts-area__offer h3 {
        font-size: 1.625rem;
    }
}

@media screen and (max-width: 575px) {
    .discounts-area__offer h3 {
        font-size: 1.563rem;
    }
}

.discounts-area__offer h3 .counter {
    display: block;
    font-size: 2.375rem;
    font-weight: 700;
}

@media screen and (max-width: 1199px) {
    .discounts-area__offer h3 .counter {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) {
    .discounts-area__offer h3 .counter {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 575px) {
    .discounts-area__offer h3 .counter {
        font-size: 2.313rem;
    }
}

.discounts-area__special-offers {
    border-radius: 5px;
    overflow: hidden;
    position: relative;
    z-index: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.discounts-area__special-offers::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left bottom, left top, from(hsl(var(--secondary))), color-stop(78.01%, hsl(var(--secondary)/0)));
    background: linear-gradient(0deg, hsl(var(--secondary)) 0%, hsl(var(--secondary)/0) 78.01%);
    z-index: 1;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

.discounts-area__special-offers:hover::before {
    background: -webkit-gradient(linear, left bottom, left top, from(hsl(var(--secondary))), color-stop(95%, hsl(var(--secondary)/0.1)));
    background: linear-gradient(0deg, hsl(var(--secondary)) 0%, hsl(var(--secondary)/0.1) 95%);
}

.discounts-area__special-offers:hover .special-offers-img img {
    -webkit-transform: scale(1.1) rotate(-4deg);
    transform: scale(1.1) rotate(-4deg);
}

.discounts-area__special-offers .special-offers-img img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.discounts-area__special-offers .special-offers-text {
    position: absolute;
    bottom: 0;
    padding: 30px;
    z-index: 1;
}

.discounts-area__special-offers .special-offers-text h5 {
    color: hsl(var(--white));
    max-width: 265px;
    margin-bottom: 20px;
}

.discounts-area__special-offers .special-offers-text .btn-magnetic {
    color: hsl(var(--white));
}

/* ============================
    brand logo css
=============================== */
.brand-active-slid {
    position: relative;
    z-index: 1;
}

.brand-active-slid::after, .brand-active-slid::before {
    content: "";
    position: absolute;
    bottom: -5px;
    height: 115%;
    width: 100px;
    z-index: 10;
}

.brand-active-slid::before {
    left: -30px;
    background: linear-gradient(80deg, hsl(var(--white)) 50%, rgba(238, 240, 245, 0) 100%);
}

.brand-active-slid::after {
    right: -30px;
    background: linear-gradient(-80deg, hsl(var(--white)) 50%, rgba(238, 240, 245, 0) 100%);
}

/* ============================
    activities css
=============================== */
.activities-content__item {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    z-index: 2;
}

.activities-content__item::before {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: -webkit-gradient(linear, left bottom, left top, from(hsl(var(--secondary))), color-stop(78.01%, hsl(var(--secondary)/0)));
    background: linear-gradient(0deg, hsl(var(--secondary)) 0%, hsl(var(--secondary)/0) 78.01%);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.activities-content__item:hover::before {
    top: 0;
}

.activities-content__item:hover .activities-text {
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
}

.activities-content__item:hover .activities-img img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.activities-content__item:hover .activities-text__desc {
    opacity: 1;
}

.activities-content__item .activities-img img {
    width: 100%;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.activities-content__item .activities-text {
    position: absolute;
    bottom: 0;
    padding: 24px;
    -webkit-transform: translateY(75px);
    transform: translateY(75px);
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 1;
}

@media screen and (max-width: 1199px) {
    .activities-content__item .activities-text {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
    }
}

@media screen and (max-width: 991px) {
    .activities-content__item .activities-text {
        -webkit-transform: translateY(80px);
        transform: translateY(80px);
    }
}

@media screen and (max-width: 767px) {
    .activities-content__item .activities-text {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

.activities-content__item .activities-text__title {
    display: grid;
    grid-template-columns: 1fr 165px;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 24px;
}

@media screen and (max-width: 1199px) {
    .activities-content__item .activities-text__title {
        grid-template-columns: 1fr 155px;
    }
}

@media screen and (max-width: 767px) {
    .activities-content__item .activities-text__title {
        grid-template-columns: 1fr;
    }
}

.activities-content__item .activities-text__title span {
    color: hsl(var(--white));
}

.activities-content__item .activities-text__title h4 {
    color: hsl(var(--white));
    padding-top: 5px;
    max-width: 300px;
}

.activities-content__item .activities-text__title .btn-magnetic {
    background: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .activities-content__item .activities-text__title .btn-magnetic {
        font-size: 0.75rem;
        padding: 11px 10px;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .activities-content__item .activities-text__title .btn-magnetic {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .activities-content__item .activities-text__title .btn-magnetic {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .activities-content__item .activities-text__title .btn-magnetic {
        font-size: 0.688rem;
    }
}

@media screen and (max-width: 991px) {
    .activities-content__item .activities-text__title .btn-magnetic {
        width: 100%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }
}

.activities-content__item .activities-text__desc {
    padding-top: 30px;
    opacity: 0;
}

@media screen and (max-width: 767px) {
    .activities-content__item .activities-text__desc {
        display: none;
    }
}

.activities-content__item .activities-text__desc p {
    font-size: 1rem;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .activities-content__item .activities-text__desc p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .activities-content__item .activities-text__desc p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .activities-content__item .activities-text__desc p {
        font-size: 0.938rem;
    }
}
/* ============================
    client feedback css
=============================== */
.client-feedback {
    position: relative;
}

.client-feedback-slid {
    position: relative;
}

.client-feedback-slid__item {
    border-radius: 5px;
    border: 1px solid hsl(var(--base));
    background: hsl(var(--white));
    padding: 0px 30px 30px;
    margin-top: 45px;
}

.client-feedback-slid__item .feedback-img {
    text-align: right;
}

.client-feedback-slid__item .feedback-img img {
    border-radius: 100px;
    border: 1px solid hsl(var(--base));
    width: 84px;
    height: 84px;
    -o-object-fit: cover;
    object-fit: cover;
    margin: -45px auto 0;
}

.client-feedback-slid__item .feedback-text {
    margin-top: -15px;
}

.client-feedback-slid__item .feedback-text p {
    padding: 10px 0 20px;
    font-size: 0.938rem;
    font-weight: 400;
    color: hsl(var(--secondary)/0.7);
}

@media screen and (max-width: 1199px) {
    .client-feedback-slid__item .feedback-text p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-slid__item .feedback-text p {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-slid__item .feedback-text p {
        font-size: 0.875rem;
    }
}

.client-feedback-slid__item .feedback-text span {
    font-size: 0.875rem;
    color: hsl(var(--secondary)/0.7);
}

@media screen and (max-width: 1199px) {
    .client-feedback-slid__item .feedback-text span {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-slid__item .feedback-text span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-slid__item .feedback-text span {
        font-size: 0.813rem;
    }
}

.client-feedback-slid__item .feedback-user {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.client-feedback-slid__item .feedback-user .rating i {
    font-size: 1.125rem;
    color: hsl(var(--warning));
    margin: 0 -2px;
}

@media screen and (max-width: 1199px) {
    .client-feedback-slid__item .feedback-user .rating i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-slid__item .feedback-user .rating i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-slid__item .feedback-user .rating i {
        font-size: 1.063rem;
    }
}

.swiper__buttons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}

.swiper__buttons .swiper-button-next {
    right: 0;
}

.swiper__buttons .swiper-button-prev {
    left: 0;
}

.swiper__buttons .swiper-button-next,
.swiper__buttons .swiper-button-prev {
    position: relative;
    border: 1px solid hsl(var(--base));
    border-radius: 5px;
    width: 45px;
    color: hsl(var(--base));
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.swiper__buttons .swiper-button-next:hover,
.swiper__buttons .swiper-button-prev:hover {
    background: hsl(var(--base));
    color: hsl(var(--white));
}

.swiper__buttons .swiper-button-next::after,
.swiper__buttons .swiper-button-prev::after {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .swiper__buttons .swiper-button-next::after,
.swiper__buttons .swiper-button-prev::after {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .swiper__buttons .swiper-button-next::after,
.swiper__buttons .swiper-button-prev::after {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .swiper__buttons .swiper-button-next::after,
.swiper__buttons .swiper-button-prev::after {
        font-size: 1.063rem;
    }
}

.client-feedback-two .container {
    position: relative;
}

.client-feedback-two__shape img {
    position: absolute;
    width: 80px;
    height: 80px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100px;
    opacity: 0.3;
}

@media screen and (max-width: 767px) {
    .client-feedback-two__shape img {
        width: 40px;
        height: 40px;
    }
}

.client-feedback-two__shape img:nth-child(2) {
    left: 10%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.client-feedback-two__shape img:nth-child(3) {
    bottom: 0;
}

.client-feedback-two__shape img:nth-child(4) {
    right: 0;
}

.client-feedback-two__shape img:nth-child(5) {
    right: 10%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.client-feedback-two__shape img:nth-child(6) {
    right: 0;
    bottom: 0;
}

.client-feedback-two__item {
    text-align: center;
}

.client-feedback-two__item .feedback-img {
    background: hsl(var(--base)/0.05);
    width: 200px;
    height: 200px;
    padding: 20px;
    border-radius: 100px;
    margin: 0 auto;
    position: relative;
}

@media screen and (max-width: 767px) {
    .client-feedback-two__item .feedback-img {
        width: 150px;
        height: 150px;
    }
}

.client-feedback-two__item .feedback-img::before {
    content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='31' viewBox='0 0 35 31' fill='none'%3E%3Cpath d='M11.073 14.5911H3.02234C3.15966 6.57478 4.7389 5.25302 9.66545 2.33486C10.2319 1.99155 10.4207 1.27059 10.0774 0.686956C9.75128 0.120488 9.01315 -0.0683341 8.44669 0.274979C2.64469 3.70811 0.619141 5.80233 0.619141 15.7755V25.0278C0.619141 27.9631 3.00517 30.332 5.92333 30.332H11.073C14.0942 30.332 16.3772 28.049 16.3772 25.0278V19.8781C16.3772 16.8741 14.0942 14.5911 11.073 14.5911Z' fill='white'/%3E%3Cpath d='M29.6429 14.5911H21.5922C21.7296 6.57478 23.3088 5.25302 28.2354 2.33486C28.8018 1.99155 28.9906 1.27059 28.6473 0.686956C28.304 0.120488 27.5831 -0.0683341 26.9994 0.274979C21.1974 3.70811 19.1719 5.80233 19.1719 15.7927V25.045C19.1719 27.9803 21.5579 30.3492 24.4761 30.3492H29.6258C32.6469 30.3492 34.93 28.0661 34.93 25.045V19.8953C34.9471 16.8741 32.6641 14.5911 29.6429 14.5911Z' fill='white'/%3E%3C/svg%3E");
    position: absolute;
    right: -15px;
    top: 8px;
    width: 72px;
    height: 72px;
    border-radius: 100px;
    background: hsl(var(--base));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

@media screen and (max-width: 767px) {
    .client-feedback-two__item .feedback-img::before {
        right: -5px;
        top: 0;
        width: 65px;
        height: 65px;
    }
}

.client-feedback-two__item .feedback-img img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 100px;
}

.client-feedback-two__item .feedback-text .user-name {
    padding: 40px 0 35px;
}

.client-feedback-two__item .feedback-text .user-name span {
    color: hsl(var(--secondary)/0.5);
    font-size: 0.938rem;
}

@media screen and (max-width: 1199px) {
    .client-feedback-two__item .feedback-text .user-name span {
        font-size: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-two__item .feedback-text .user-name span {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-two__item .feedback-text .user-name span {
        font-size: 0.875rem;
    }
}

.client-feedback-two__item .feedback-text p {
    color: hsl(var(--secondary)/0.7);
    font-size: 1rem;
    max-width: 570px;
    margin: 0 auto;
}

@media screen and (max-width: 1199px) {
    .client-feedback-two__item .feedback-text p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-two__item .feedback-text p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-two__item .feedback-text p {
        font-size: 0.938rem;
    }
}

.client-feedback-slid-three__item {
    text-align: center;
    border: 1.5px solid hsl(var(--border-color));
    padding: 30px 24px;
    border-radius: 5px;
    display: grid;
    gap: 20px;
}

.client-feedback-slid-three__item:hover {
    background: hsl(var(--base)/0.03);
}

.client-feedback-slid-three__item .rating i {
    color: hsl(var(--warning));
}

.client-feedback-slid-three__item p {
    font-size: 1.125rem;
    color: hsl(var(--secondary)/0.7);
}

@media screen and (max-width: 1199px) {
    .client-feedback-slid-three__item p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .client-feedback-slid-three__item p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .client-feedback-slid-three__item p {
        font-size: 1.063rem;
    }
}

.client-feedback-slid-three__item .feedback-img {
    width: 66px;
    height: 66px;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto;
}

/* ============================
    video css
=============================== */
.video-area .video-content {
    position: relative;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 0.8;
}

.video-area .video-content img {
    width: 100%;
    border-radius: 15px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.video-area .video-content .video-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.video-views {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.video-views::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.7;
    background: #081D5C;
    mix-blend-mode: multiply;
}

.video-views .parallax-image {
    position: absolute;
    z-index: -1;
    height: 100vh;
    -o-object-fit: cover;
    object-fit: cover;
}

.video-views .video-views-text {
    padding: 150px 0;
    max-width: 1009px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

@media screen and (max-width: 1399px) {
    .video-views .video-views-text {
        padding: 130px 0;
    }
}

@media screen and (max-width: 1199px) {
    .video-views .video-views-text {
        padding: 110px 0;
    }
}

@media screen and (max-width: 991px) {
    .video-views .video-views-text {
        padding: 100px 15px;
    }
}

.video-views .video-views-text h2 {
    font-size: 3.625rem;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .video-views .video-views-text h2 {
        font-size: 3.75rem;
    }
}

@media screen and (max-width: 991px) {
    .video-views .video-views-text h2 {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 575px) {
    .video-views .video-views-text h2 {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 991px) {
    .video-views .video-views-text h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .video-views .video-views-text h2 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .video-views .video-views-text h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .video-views .video-views-text h2 {
        font-size: 2.313rem;
    }
}

.video-views .video-views-text p {
    font-size: 1.125rem;
    color: hsl(var(--white));
    padding: 20px 0 50px;
}

@media screen and (max-width: 1199px) {
    .video-views .video-views-text p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .video-views .video-views-text p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .video-views .video-views-text p {
        font-size: 1.063rem;
    }
}

.video-views .video-views-text .video-play-btn::before {
    background-color: hsl(var(--white));
}

.video-views .video-views-text .video-play-btn::after {
    border: 5px solid hsl(var(--white));
}

/* ============================
    blog css
=============================== */
.blog-area.section-bg {
    position: relative;
    z-index: 1;
}

.blog-area.section-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../image/counter-shape.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}

.blog-area__list-content .blog-card:hover img {
    -webkit-transform: scale(1.1) rotate(0deg);
    transform: scale(1.1) rotate(0deg);
}

.blog-area__list-content .blog-card .blog-img {
    height: 400px;
}

@media screen and (max-width: 767px) {
    .blog-area__list-content .blog-card .blog-img {
        height: 220px;
    }
}

.blog-area__list-content .blog-card .blog-img iframe {
    height: 400px;
    width: 100%;
}

@media screen and (max-width: 767px) {
    .blog-area__list-content .blog-card .blog-img iframe {
        height: 220px;
    }
}

.blog-area__list-content .blog-card .blog-text {
    gap: 10px;
}

.blog-area__list-content .blog-card .blog-text .blog-post-admin li {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 5px;
    color: hsl(var(--secondary)/0.6);
}

.blog-area__list-content .blog-card .blog-text .blog-post-admin li i {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .blog-area__list-content .blog-card .blog-text .blog-post-admin li i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__list-content .blog-card .blog-text .blog-post-admin li i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__list-content .blog-card .blog-text .blog-post-admin li i {
        font-size: 1.063rem;
    }
}

.blog-area__list-content .blog-card .blog-text p {
    margin-bottom: 15px;
}

.blog-area__list-content .blog-card .blog-text p a {
    color: hsl(var(--base));
}

.blog-area__details .row-gap-4 {
    row-gap: 2rem !important;
}

.blog-area__details .blog-img {
    overflow: hidden;
    border-radius: 5px;
    overflow: hidden;
    height: 400px;
}

@media screen and (max-width: 424px) {
    .blog-area__details .blog-img {
        height: 240px;
    }
}

.blog-area__details .blog-img:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.blog-area__details .blog-img img {
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
    -o-object-fit: cover;
    object-fit: cover;
}

.blog-area__details .social-content {
    background: hsl(var(--secondary)/0.05);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border: 5px;
    gap: 20px;
    padding: 10px 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

@media screen and (max-width: 424px) {
    .blog-area__details .social-content {
        padding: 10px;
        gap: 10px;
    }
}

.blog-area__details .social-content a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    color: hsl(var(--secondary));
    font-weight: 500;
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .blog-area__details .social-content a {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .social-content a {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .social-content a {
        font-size: 0.813rem;
    }
}

.blog-area__details .social-content a:hover {
    color: hsl(var(--base));
}

.blog-area__details .social-content a span {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .blog-area__details .social-content a span {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .social-content a span {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .social-content a span {
        font-size: 1.063rem;
    }
}

.blog-area__details h3 {
    margin-bottom: 15px;
}

.blog-area__details p {
    font-size: 1rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .blog-area__details p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details p {
        font-size: 0.938rem;
    }
}

.blog-area__details .blog-que-box {
    background: hsl(var(--secondary)/0.05);
    border-radius: 5px;
    padding: 30px;
}

.blog-area__details .blog-que-box svg {
    margin-bottom: 15px;
}

.blog-area__details .blog-que-box p {
    text-align: justify;
}

.blog-area__details .tag-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    margin-top: 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.blog-area__details .tag-link i {
    color: hsl(var(--base));
    margin-right: 10px;
}

.blog-area__details .tag-link a {
    font-size: 1rem;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .blog-area__details .tag-link a {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .tag-link a {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .tag-link a {
        font-size: 0.938rem;
    }
}

.blog-area__details .tag-link a:hover {
    color: hsl(var(--base));
}

.blog-area__details .author-wrap {
    background: hsl(var(--secondary)/0.05);
    padding: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    gap: 24px;
    border-radius: 5px;
}

.blog-area__details .author-wrap img {
    width: 80px;
    height: 80px;
    border-radius: 100px;
    -o-object-fit: cover;
    object-fit: cover;
}

.blog-area__details .author-wrap__text h5 {
    margin-bottom: 10px;
}

.blog-area__details .author-wrap__text p {
    padding-bottom: 5px;
}

.blog-area__details .author-wrap__text span {
    font-size: 1rem;
    font-weight: 500;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .blog-area__details .author-wrap__text span {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .author-wrap__text span {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .author-wrap__text span {
        font-size: 0.938rem;
    }
}

.blog-area__details .author-wrap__text span i {
    color: hsl(var(--base));
}

.blog-area__details .comments-details .comments-formate {
    margin-top: 30px;
}

.blog-area__details .comments-details hr {
    border-color: hsl(var(--secondary)/0.4);
    margin: 30px 0;
}

.blog-area__details .comments-details__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    gap: 20px;
}

.blog-area__details .comments-details__item.reply-text {
    margin-left: 90px;
}

@media screen and (max-width: 991px) {
    .blog-area__details .comments-details__item.reply-text {
        margin-left: 30px;
    }
}

.blog-area__details .comments-details__item img {
    width: 70px;
    height: 70px;
    border-radius: 100px;
    -o-object-fit: cover;
    object-fit: cover;
}

.blog-area__details .comments-details__item .date {
    font-size: 0.75rem;
    font-weight: 400;
    color: hsl(var(--secondary)/0.6);
    margin-left: 10px;
}

@media screen and (max-width: 1199px) {
    .blog-area__details .comments-details__item .date {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .comments-details__item .date {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .comments-details__item .date {
        font-size: 0.688rem;
    }
}

.blog-area__details .comments-details__item__text p {
    padding: 10px 0;
}

.blog-area__details .comments-details__item__text button {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: hsl(var(--secondary));
    font-weight: 500;
    font-size: 0.875rem;
    gap: 5px;
}

@media screen and (max-width: 1199px) {
    .blog-area__details .comments-details__item__text button {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .comments-details__item__text button {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .comments-details__item__text button {
        font-size: 0.813rem;
    }
}

.blog-area__details .comments-details__item__text button:hover {
    color: hsl(var(--base));
}

.blog-area__details .comments-details__item__text button i {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .blog-area__details .comments-details__item__text button i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-area__details .comments-details__item__text button i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-area__details .comments-details__item__text button i {
        font-size: 1.063rem;
    }
}

.btn-blog {
    background: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.btn-blog:hover {
    border-color: hsl(var(--secondary));
}

.btn-blog span {
    background: hsl(var(--secondary));
}

.blog-card {
    border-radius: 5px;
    border: 1px solid hsl(var(--secondary)/0.08);
    overflow: hidden;
}

.blog-card:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.blog-card:hover .blog-img-slider img {
    -webkit-transform: scale(1);
    transform: scale(1);
}

.blog-card .blog-img {
    position: relative;
    overflow: hidden;
}

.blog-card .blog-img img {
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.blog-card .blog-img .btn-magnetic {
    position: absolute;
    top: 24px;
    left: 24px;
    background: hsl(var(--white));
    padding: 7px 17px;
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .blog-card .blog-img .btn-magnetic {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-card .blog-img .btn-magnetic {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-card .blog-img .btn-magnetic {
        font-size: 0.813rem;
    }
}

.blog-card .blog-text {
    padding: 24px;
    display: grid;
    gap: 20px;
}

@media screen and (max-width: 1399px) {
    .blog-card .blog-text {
        padding: 15px;
    }
}

@media screen and (max-width: 424px) {
    .blog-card .blog-text {
        padding: 20px 15px;
    }
}

.blog-card .blog-text span {
    color: hsl(var(--secondary)/0.6);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .blog-card .blog-text span {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-card .blog-text span {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-card .blog-text span {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 1199px) {
    .blog-card .blog-text span {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .blog-card .blog-text span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .blog-card .blog-text span {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .blog-card .blog-text span {
        font-size: 0.688rem;
    }
}

@media screen and (max-width: 424px) {
    .blog-card .blog-text span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 424px) and (max-width: 1199px) {
    .blog-card .blog-text span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 424px) and (max-width: 991px) {
    .blog-card .blog-text span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 424px) and (max-width: 575px) {
    .blog-card .blog-text span {
        font-size: 0.75rem;
    }
}

.blog-card .blog-text span i {
    font-size: 1.125rem;
    color: hsl(var(--base)/0.5);
}

@media screen and (max-width: 1199px) {
    .blog-card .blog-text span i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-card .blog-text span i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-card .blog-text span i {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1199px) {
    .blog-card .blog-text span i {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .blog-card .blog-text span i {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .blog-card .blog-text span i {
        font-size: 1rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .blog-card .blog-text span i {
        font-size: 0.938rem;
    }
}

.blog-card.new_place_card {
    background: hsl(var(--white));
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.blog-card.new_place_card:hover {
    border: 1px solid hsl(var(--base));
}

.blog-card.new_place_card .blog-img {
    margin: 24px;
    margin-bottom: 0;
    border-radius: 5px;
    overflow: hidden;
}

@media screen and (max-width: 1399px) {
    .blog-card.new_place_card .blog-img {
        margin: 20px;
        margin-bottom: 0;
    }
}

.blog-card.new_place_card .blog-text {
    text-align: center;
    gap: 15px;
}

.blog-card.new_place_card .blog-text h5 {
    padding-bottom: 0;
}

.blog-card.new_place_card .blog-text p {
    max-width: 250px;
    margin: 0 auto;
}

.blog-card.new_place_card .blog-text .btn-magnetic {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.blog-img-slider img {
    height: 400px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

@media screen and (max-width: 767px) {
    .blog-img-slider img {
        height: 220px;
    }
}

.blog-img-slider img:hover {
    -webkit-transform: translate(0);
    transform: translate(0);
}

.blog-img-slider .swiper-button-next,
.blog-img-slider .swiper-button-prev {
    color: hsl(var(--base));
}

.blog-img-slider .swiper-button-next::after,
.blog-img-slider .swiper-button-prev::after {
    font-size: 30px;
}

.blog-sidebar-content {
    display: grid;
    gap: 24px;
}

.blog-sidebar-content .blog-sidebar-recent-posts,
.blog-sidebar-content .blog-sidebar-categories,
.blog-sidebar-content .blog-sidebar-tags,
.blog-sidebar-content .search-box {
    border: 1px solid hsl(var(--secondary)/0.08);
    display: grid;
    gap: 15px;
    padding: 30px;
    border-radius: 5px;
}

.blog-sidebar-content .blog-sidebar-recent-posts h4,
.blog-sidebar-content .blog-sidebar-categories h4,
.blog-sidebar-content .blog-sidebar-tags h4,
.blog-sidebar-content .search-box h4 {
    margin-bottom: 10px;
}

.blog-sidebar-content .blog-sidebar-recent-posts form,
.blog-sidebar-content .blog-sidebar-categories form,
.blog-sidebar-content .blog-sidebar-tags form,
.blog-sidebar-content .search-box form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.blog-sidebar-content .blog-sidebar-recent-posts form input,
.blog-sidebar-content .blog-sidebar-categories form input,
.blog-sidebar-content .blog-sidebar-tags form input,
.blog-sidebar-content .search-box form input {
    width: 100%;
    height: 55px;
    padding: 15px;
    border: 1px solid hsl(var(--secondary)/0.08);
    outline: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.blog-sidebar-content .blog-sidebar-recent-posts form button,
.blog-sidebar-content .blog-sidebar-categories form button,
.blog-sidebar-content .blog-sidebar-tags form button,
.blog-sidebar-content .search-box form button {
    background: hsl(var(--base));
    height: 100%;
    padding: 10px 16px;
    color: hsl(var(--white));
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.blog-sidebar-content .blog-sidebar-recent-posts form button:hover,
.blog-sidebar-content .blog-sidebar-categories form button:hover,
.blog-sidebar-content .blog-sidebar-tags form button:hover,
.blog-sidebar-content .search-box form button:hover {
    background: hsl(var(--secondary));
}

.blog-sidebar-content .blog-sidebar-recent-posts ul,
.blog-sidebar-content .blog-sidebar-categories ul,
.blog-sidebar-content .blog-sidebar-tags ul,
.blog-sidebar-content .search-box ul {
    display: grid;
    gap: 10px;
}

.blog-sidebar-content .blog-sidebar-recent-posts ul li a,
.blog-sidebar-content .blog-sidebar-categories ul li a,
.blog-sidebar-content .blog-sidebar-tags ul li a,
.blog-sidebar-content .search-box ul li a {
    color: hsl(var(--secondary));
    font-size: 1rem;
    font-weight: 500;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 1199px) {
    .blog-sidebar-content .blog-sidebar-recent-posts ul li a,
.blog-sidebar-content .blog-sidebar-categories ul li a,
.blog-sidebar-content .blog-sidebar-tags ul li a,
.blog-sidebar-content .search-box ul li a {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-sidebar-content .blog-sidebar-recent-posts ul li a,
.blog-sidebar-content .blog-sidebar-categories ul li a,
.blog-sidebar-content .blog-sidebar-tags ul li a,
.blog-sidebar-content .search-box ul li a {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-sidebar-content .blog-sidebar-recent-posts ul li a,
.blog-sidebar-content .blog-sidebar-categories ul li a,
.blog-sidebar-content .blog-sidebar-tags ul li a,
.blog-sidebar-content .search-box ul li a {
        font-size: 0.938rem;
    }
}

.blog-sidebar-content .blog-sidebar-recent-posts .tags-list,
.blog-sidebar-content .blog-sidebar-categories .tags-list,
.blog-sidebar-content .blog-sidebar-tags .tags-list,
.blog-sidebar-content .search-box .tags-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.blog-sidebar-content .blog-sidebar-recent-posts .tags-list li a,
.blog-sidebar-content .blog-sidebar-categories .tags-list li a,
.blog-sidebar-content .blog-sidebar-tags .tags-list li a,
.blog-sidebar-content .search-box .tags-list li a {
    background: hsl(var(--secondary)/0.05);
    padding: 5px 10px;
    border-radius: 2px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.blog-sidebar-content .blog-sidebar-recent-posts .tags-list li a:hover,
.blog-sidebar-content .blog-sidebar-categories .tags-list li a:hover,
.blog-sidebar-content .blog-sidebar-tags .tags-list li a:hover,
.blog-sidebar-content .search-box .tags-list li a:hover {
    background: hsl(var(--base));
    color: hsl(var(--white));
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a,
.blog-sidebar-content .search-box .categories-list li a {
    width: 100%;
    height: 80px;
    overflow: hidden;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    position: relative;
    border-radius: 5px;
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a:hover img,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a:hover img,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a:hover img,
.blog-sidebar-content .search-box .categories-list li a:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a:hover h6,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a:hover h6,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a:hover h6,
.blog-sidebar-content .search-box .categories-list li a:hover h6 {
    color: hsl(var(--base));
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a::before,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a::before,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a::before,
.blog-sidebar-content .search-box .categories-list li a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: hsl(var(--secondary)/0.4);
    z-index: 1;
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a img,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a img,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a img,
.blog-sidebar-content .search-box .categories-list li a img {
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.blog-sidebar-content .blog-sidebar-recent-posts .categories-list li a h6,
.blog-sidebar-content .blog-sidebar-categories .categories-list li a h6,
.blog-sidebar-content .blog-sidebar-tags .categories-list li a h6,
.blog-sidebar-content .search-box .categories-list li a h6 {
    position: absolute;
    color: hsl(var(--white));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
    padding: 30px;
    z-index: 1;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.blog-sidebar-content .search-box {
    background-image: url(../image/two-hover.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 1;
}

.blog-sidebar-content .search-box::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: hsl(var(--secondary)/0.5);
    z-index: -1;
}

.blog-sidebar-content .search-box form {
    border-radius: 3px;
    overflow: hidden;
}

.blog-sidebar-content .recent-posts {
    display: grid;
    gap: 20px;
}

.blog-sidebar-content .recent-posts__item {
    display: grid;
    grid-template-columns: 80px 1fr;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}

.blog-sidebar-content .recent-posts__item:hover img {
    -webkit-transform: scale(1.1) rotate(5deg);
    transform: scale(1.1) rotate(5deg);
}

.blog-sidebar-content .recent-posts__img {
    border-radius: 5px;
    overflow: hidden;
}

.blog-sidebar-content .recent-posts__img a {
    height: 100%;
}

.blog-sidebar-content .recent-posts__img img {
    width: 100%;
    height: 75px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.blog-sidebar-content .recent-posts__text .date {
    font-size: 0.875rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    color: hsl(var(--secondary)/0.6);
    margin-top: 10px;
    font-weight: 500;
}

@media screen and (max-width: 1199px) {
    .blog-sidebar-content .recent-posts__text .date {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-sidebar-content .recent-posts__text .date {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-sidebar-content .recent-posts__text .date {
        font-size: 0.813rem;
    }
}

.blog-sidebar-content .recent-posts__text .material-icons {
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .blog-sidebar-content .recent-posts__text .material-icons {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .blog-sidebar-content .recent-posts__text .material-icons {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .blog-sidebar-content .recent-posts__text .material-icons {
        font-size: 0.938rem;
    }
}
/* ============================
    callToAction css
=============================== */
.cal-to-action {
    border-bottom: 1px solid hsl(var(--border-color)/0.1);
}

.cal-to-action h2 {
    font-size: 2.375rem;
}

@media screen and (max-width: 1199px) {
    .cal-to-action h2 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) {
    .cal-to-action h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 575px) {
    .cal-to-action h2 {
        font-size: 2.313rem;
    }
}

.cal-to-action.section-bg {
    position: relative;
    z-index: 1;
}

.cal-to-action.section-bg::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-image: url("../image/call-action.svg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.1;
}

.cal-to-action form {
    border-radius: 5px;
    background: hsl(var(--white));
    -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px;
    position: relative;
}

.cal-to-action form input {
    border: 0;
    height: 50px;
    width: 100%;
    padding: 0 140px 0 40px;
    outline: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.cal-to-action form span {
    position: absolute;
    left: 20px;
    color: hsl(var(--base));
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .cal-to-action form span {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .cal-to-action form span {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .cal-to-action form span {
        font-size: 1.063rem;
    }
}

.cal-to-action form button {
    position: absolute;
    right: 15px;
    background: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.cal-to-action form button:hover {
    border-color: hsl(var(--secondary));
}

.cal-to-action form button span {
    background: hsl(var(--secondary));
}

.cal-to-action.cal-to-action-three {
    background: hsl(var(--secondary));
}

@media screen and (max-width: 991px) {
    .cal-to-action.cal-to-action-three {
        padding-top: 60px;
    }
}

.cal-to-action.cal-to-action-three.section-bg::before {
    background-image: url("../image/call-action-three.png");
}

.cal-to-action.cal-to-action-three h2 {
    color: hsl(var(--white));
    font-size: 3rem;
}

@media screen and (max-width: 1199px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 3.063rem;
    }
}

@media screen and (max-width: 991px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 3rem;
    }
}

@media screen and (max-width: 575px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.938rem;
    }
}

@media screen and (max-width: 1199px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.313rem;
    }
}

@media screen and (max-width: 991px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .cal-to-action.cal-to-action-three h2 {
        font-size: 2.313rem;
    }
}
/* ============================
    follow us css
=============================== */
.follow-us {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
}

@media screen and (max-width: 991px) {
    .follow-us {
        grid-template-columns: repeat(3, 1fr);
    }
}

.follow-us__card {
    position: relative;
    overflow: hidden;
}

.follow-us__card .img-fluid {
    height: 250px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    width: 100%;
}

@media screen and (max-width: 1199px) {
    .follow-us__card .img-fluid {
        height: 200px;
    }
}

@media screen and (max-width: 991px) {
    .follow-us__card .img-fluid {
        height: 180px;
    }
}

@media screen and (max-width: 424px) {
    .follow-us__card .img-fluid {
        height: 140px;
    }
}

.follow-us__card:hover .img-fluid {
    -webkit-transform: scale(1.1) rotate(-3deg);
    transform: scale(1.1) rotate(-3deg);
}

.follow-us__card:hover .follow-us__card__effect {
    opacity: 1;
}

.follow-us__card__effect {
    background: hsl(var(--base)/0.5);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    opacity: 0;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.follow-us__card__effect h5 {
    margin-bottom: 20px;
    color: hsl(var(--white));
}

/* ============================
    explore css
=============================== */
@media screen and (max-width: 991px) {
    .explore-area__text {
        margin-top: 20px;
    }
}

.explore-area__text h2 {
    max-width: 980px;
}

.explore-area__text p {
    padding: 20px 0 30px;
    max-width: 880px;
    font-size: 1rem;
    color: hsl(var(--secondary)/0.5);
}

@media screen and (max-width: 1199px) {
    .explore-area__text p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .explore-area__text p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .explore-area__text p {
        font-size: 0.938rem;
    }
}

.explore-area__text ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 50px;
}

@media screen and (max-width: 767px) {
    .explore-area__text ul {
        gap: 20px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
}

.explore-area__text ul svg {
    padding-bottom: 15px;
}

.explore-area__text ul li {
    text-align: center;
}

.explore-area__images {
    text-align: right;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: end;
}

.explore-area__images img:first-child {
    margin-right: -90px;
}

/* ============================
    tour css
=============================== */
.tour-details {
    display: grid;
    gap: 18px;
}

.tour-details__date {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 40px;
}

.tour-details__date li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
    color: hsl(var(--secondary)/0.6);
}

.tour-details__date li .material-icons {
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .tour-details__date li .material-icons {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-details__date li .material-icons {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-details__date li .material-icons {
        font-size: 1.063rem;
    }
}

.tour-details .highlights-list {
    display: grid;
    gap: 4px;
}

.tour-details .highlights-list li {
    color: hsl(var(--secondary)/0.8);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .tour-details .highlights-list li {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-details .highlights-list li {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-details .highlights-list li {
        font-size: 0.938rem;
    }
}

.tour-details .highlights-list li::before {
    content: "•";
    font-size: 19px;
    color: hsl(var(--base));
    margin-right: 8px;
    line-height: 1;
}

.tour-details h5 {
    margin-top: 15px;
    text-transform: capitalize;
}

.tour-details p {
    color: hsl(var(--secondary)/0.6);
}

.tour-details .accordion-button {
    font-weight: 600;
    color: hsl(var(--secondary));
    border-radius: 3px;
}

.tour-details .accordion-body .highlights-list {
    margin-top: 5px;
}

.tour-details .accordion-body .highlights-list li {
    list-style: disc;
    margin-left: 15px;
}

.booking-widget {
    border-radius: 5px;
    border: 1px solid hsl(var(--secondary)/0.05);
    background: hsl(var(--white));
    padding: 24px;
    position: relative;
    margin-top: -120px;
    z-index: 1;
}

@media screen and (max-width: 991px) {
    .booking-widget {
        margin-top: 24px;
    }
}

.booking-widget .input-group {
    border: 1px solid hsl(var(--secondary)/0.05);
    padding: 10px;
    display: grid;
    gap: 15px;
    grid-template-columns: 50px 1fr;
}

.booking-widget .input-group .material-icons {
    border-radius: 4px;
    background: hsl(var(--base)/0.1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 7px;
    color: hsl(var(--secondary));
    width: 50px;
    height: 50px;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.booking-widget .input-group span {
    width: 100%;
}

.booking-widget .input-group span .input-group-addon {
    font-size: 1rem;
    font-weight: 600;
}

@media screen and (max-width: 1199px) {
    .booking-widget .input-group span .input-group-addon {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-widget .input-group span .input-group-addon {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-widget .input-group span .input-group-addon {
        font-size: 0.938rem;
    }
}

.booking-widget .input-group .form-control {
    border: 0;
    outline: none;
    width: 100%;
    padding: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: hsl(var(--secondary)/0.6);
}

.booking-widget .btn-magnetic {
    width: 100%;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.booking-widget .ticket-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 1rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .booking-widget .ticket-item {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-widget .ticket-item {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-widget .ticket-item {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 374px) {
    .booking-widget .ticket-item {
        display: grid;
        gap: 5px;
    }
}

.booking-widget .ticket-item .quantity-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.booking-widget .ticket-item .quantity-group .quantity-btn {
    border: 1px solid hsl(var(--secondary));
    width: 20px;
    height: 20px;
    border-radius: 50px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.booking-widget .ticket-item .quantity-group .quantity {
    color: hsl(var(--secondary));
    width: 20px;
    text-align: center;
}

.booking-widget .service-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 6px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.booking-widget .service-item label {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    color: hsl(var(--secondary)/0.6);
}

.booking-widget .service-item label span {
    color: hsl(var(--secondary));
    font-weight: 500;
}

.booking-widget .total-price {
    border-top: 1px solid hsl(var(--secondary)/0.05);
    padding: 15px 0;
    margin-top: 20px;
}

.booking-widget .total-price h4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.tour-offer {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.tour-offer:hover img {
    -webkit-transform: scale(1.1) rotate(-4deg);
    transform: scale(1.1) rotate(-4deg);
}

.tour-offer:hover .tour-offer__content {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.tour-offer__img img {
    width: 100%;
    height: 500px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
}

@media screen and (max-width: 767px) {
    .tour-offer__img img {
        height: 420px;
    }
}

.tour-offer__badge {
    text-transform: uppercase;
    background: hsl(var(--base)/0.7);
    color: hsl(var(--white));
    position: absolute;
    top: 24px;
    right: 24px;
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    padding: 5px 15px;
    font-weight: 600;
    font-size: 0.813rem;
    border-radius: 5px;
}

@media screen and (max-width: 1199px) {
    .tour-offer__badge {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-offer__badge {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-offer__badge {
        font-size: 0.75rem;
    }
}

.tour-offer__content {
    background: hsl(var(--white)/0.65);
    position: absolute;
    left: 0;
    right: 0;
    bottom: 24px;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    width: 90%;
    margin: 0 auto;
    border-radius: 5px;
    padding: 30px;
    display: grid;
    gap: 10px;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
}

@media screen and (max-width: 991px) {
    .tour-offer__content {
        padding: 15px;
    }
}

.tour-offer__content ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-bottom: 5px;
}

.tour-offer__content ul li {
    font-size: 1rem;
    color: hsl(var(--secondary));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}

@media screen and (max-width: 1199px) {
    .tour-offer__content ul li {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-offer__content ul li {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-offer__content ul li {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-offer__content ul li {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .tour-offer__content ul li {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .tour-offer__content ul li {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .tour-offer__content ul li {
        font-size: 0.75rem;
    }
}

.tour-offer__content ul li i {
    font-size: 1.125rem;
    color: hsl(var(--base)/0.8);
}

@media screen and (max-width: 1199px) {
    .tour-offer__content ul li i {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-offer__content ul li i {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-offer__content ul li i {
        font-size: 1.063rem;
    }
}

.tour-offer__content h5 {
    color: hsl(var(--secondary));
}

.tour-offer__content p {
    color: hsl(var(--secondary));
    font-weight: 500;
    letter-spacing: 0.5px;
}

.tour-offer__content .price-number {
    color: hsl(var(--base));
    font-size: 1.375rem;
    font-weight: 700;
}

@media screen and (max-width: 1199px) {
    .tour-offer__content .price-number {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 991px) {
    .tour-offer__content .price-number {
        font-size: 1.375rem;
    }
}

@media screen and (max-width: 575px) {
    .tour-offer__content .price-number {
        font-size: 1.313rem;
    }
}

.tour-offer__content .price-number del {
    color: hsl(var(--secondary));
}

.tour-offer__content .price-number ins {
    text-decoration: none;
}

/* ============================
    card css
=============================== */
.card-area .product-card {
    border: 1px solid hsl(var(--secondary)/0.05);
    border-radius: 10px;
    padding: 15px;
    width: 100%;
}

.card-area .product-card img {
    width: 100%;
    height: 180px;
    -o-object-fit: cover;
    object-fit: cover;
    border-radius: 5px;
}

.card-area .product-card .product-details {
    margin-top: 15px;
}

.card-area .product-card .product-details .price {
    font-weight: bold;
}

.card-area .product-card .product-details .price,
.card-area .product-card .product-details .rating,
.card-area .product-card .product-details p {
    font-size: 0.875rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .card-area .product-card .product-details .price,
.card-area .product-card .product-details .rating,
.card-area .product-card .product-details p {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .card-area .product-card .product-details .price,
.card-area .product-card .product-details .rating,
.card-area .product-card .product-details p {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .card-area .product-card .product-details .price,
.card-area .product-card .product-details .rating,
.card-area .product-card .product-details p {
        font-size: 0.813rem;
    }
}

.card-area .product-card .quantity-controls {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 5px;
}

.card-area .product-card .quantity-controls button {
    padding: 2px 10px;
    border: none;
    background-color: hsl(var(--secondary));
    color: hsl(var(--white));
    border-radius: 3px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.card-area .product-card .quantity-controls button:hover {
    background-color: hsl(var(--base));
}

.card-area .product-card .quantity-controls .quantity {
    font-weight: bold;
    width: 30px;
    text-align: center;
}

.card-area .product-card .delete-btn {
    background: none;
    border: none;
    font-size: 0.875rem;
    cursor: pointer;
    color: hsl(var(--white));
    background: hsl(var(--danger));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 3px;
    border-radius: 4px;
}

@media screen and (max-width: 1199px) {
    .card-area .product-card .delete-btn {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .card-area .product-card .delete-btn {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .card-area .product-card .delete-btn {
        font-size: 0.813rem;
    }
}

.card-area .coupon-section {
    border: 1px solid hsl(var(--secondary)/0.05);
    padding: 15px;
    border-radius: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 5px;
}

.card-area .coupon-section input {
    width: 100%;
    padding: 10px 15px;
    margin-right: 10px;
    border: 1px solid hsl(var(--secondary)/0.05);
    border-radius: 5px;
}

.card-area .coupon-section button {
    padding: 10px 15px;
    background-color: hsl(var(--secondary));
    color: hsl(var(--white));
    border: none;
    border-radius: 5px;
    cursor: pointer;
    min-width: 80px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.card-area .cart-summary {
    border: 1px solid hsl(var(--secondary)/0.05);
    background-color: hsl(var(--base)/0.03);
    border-radius: 5px;
    padding: 20px;
    display: grid;
    gap: 8px;
}

.card-area .cart-summary p {
    font-size: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

@media screen and (max-width: 1199px) {
    .card-area .cart-summary p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .card-area .cart-summary p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .card-area .cart-summary p {
        font-size: 0.938rem;
    }
}

.card-area .cart-summary p span {
    font-weight: 600;
}

.card-area .cart-summary .btn-magnetic {
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: 10px;
}

.wishlist-area .product-card img {
    height: 165px;
}

.wishlist-area .product-card .product-details {
    margin-top: 0;
}

.wishlist-area .product-card .btn-magnetic {
    margin-top: 20px;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: hsl(var(--secondary)/0.03);
}

/* ============================
    coming soon css
=============================== */
.coming-soon {
    background-image: url("../image/coming-soon.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    min-height: 100vh;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    padding: 50px 30px;
}

.coming-soon::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: hsl(var(--secondary)/0.5);
}

.coming-soon__content {
    text-align: center;
    max-width: 700px;
}

.coming-soon__content h4 {
    color: hsl(var(--white));
    margin: 40px 0 30px;
}

.coming-soon__content h1 {
    color: hsl(var(--white));
    font-weight: 700;
    line-height: 1.1;
}

.coming-soon__content form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
}

.coming-soon__content form input {
    background-color: hsl(var(--white));
    height: 60px;
    padding: 15px 20px;
}

.coming-soon__content form .btn-magnetic {
    min-width: 110px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: 60px;
    border-color: hsl(var(--base));
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .coming-soon__content form .btn-magnetic {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .coming-soon__content form .btn-magnetic {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .coming-soon__content form .btn-magnetic {
        font-size: 0.938rem;
    }
}

.coming-soon__content hr {
    border-color: hsl(var(--white)/0.8);
}

.coming-soon__content ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 20px;
    margin-top: 50px;
}

.coming-soon__content ul a {
    font-size: 1.438rem;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .coming-soon__content ul a {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 991px) {
    .coming-soon__content ul a {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 575px) {
    .coming-soon__content ul a {
        font-size: 1.375rem;
    }
}

.coming-soon__content p {
    color: hsl(var(--white));
}

/* ============================
    booking css
=============================== */
.booking-area__info {
    background: hsl(var(--base)/0.03);
    padding: 30px;
}

@media screen and (max-width: 767px) {
    .booking-area__info {
        padding: 24px 15px;
    }
}

.booking-area__info .info-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 10px;
}

.booking-area__info .info-btn .booking-btn-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}

.booking-area__info .info-btn .booking-button-prev {
    border: 1px solid hsl(var(--base)/0.3);
    height: 44px;
    width: 44px;
    border-radius: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.booking-area__info .info-btn .booking-button-prev:hover {
    color: hsl(var(--base));
}

.booking-area__info .info-btn .booking-button-prev i {
    margin-left: 8px;
}

.booking-area__info .nice-select {
    height: 58px;
    line-height: 58px;
    font-size: 0.938rem;
}

@media screen and (max-width: 1199px) {
    .booking-area__info .nice-select {
        font-size: 1rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-area__info .nice-select {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-area__info .nice-select {
        font-size: 0.875rem;
    }
}

.booking-area__info .nice-select::after {
    height: 8px;
    width: 8px;
    right: 20px;
}

.booking-area .booking-nav {
    margin-bottom: 30px;
}

.booking-area .booking-nav button {
    display: grid;
    gap: 10px;
    border-radius: 0;
    border: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
}

.booking-area .booking-nav button svg,
.booking-area .booking-nav button img {
    background: hsl(var(--base)/0.03);
    padding: 15px;
    border-radius: 3px;
    height: 80px;
    width: 80px;
    -o-object-fit: cover;
    object-fit: cover;
    border: 2px solid hsl(var(--secondary)/0.05);
    margin: 0 auto;
}

.booking-area .booking-nav button .details-svg {
    padding: 17px;
}

.booking-area .booking-nav button span {
    font-size: 1.125rem;
    font-weight: 600;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .booking-area .booking-nav button span {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-area .booking-nav button span {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-area .booking-nav button span {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 767px) {
    .booking-area .booking-nav button span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 1199px) {
    .booking-area .booking-nav button span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 991px) {
    .booking-area .booking-nav button span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) and (max-width: 575px) {
    .booking-area .booking-nav button span {
        font-size: 0.75rem;
    }
}

.booking-area .booking-nav .swiper-slide-thumb-active span {
    color: hsl(var(--base));
}

.booking-area .booking-nav .swiper-slide-thumb-active svg,
.booking-area .booking-nav .swiper-slide-thumb-active img {
    border-color: hsl(var(--base));
    background: hsl(var(--secondary)/0.03);
}

.booking-area .info-content .info-title {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--base));
    margin-bottom: 7px;
}

@media screen and (max-width: 1199px) {
    .booking-area .info-content .info-title {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-area .info-content .info-title {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-area .info-content .info-title {
        font-size: 0.813rem;
    }
}

.booking-area .booking-summary {
    background: hsl(var(--base)/0.03);
    border-radius: 4px;
    padding: 24px;
}

.booking-area .booking-summary h5 {
    margin-bottom: 15px;
}

.booking-area .booking-summary ul li {
    font-size: 1rem;
    color: hsl(var(--secondary)/0.5);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 2px 0;
}

@media screen and (max-width: 1199px) {
    .booking-area .booking-summary ul li {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-area .booking-summary ul li {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-area .booking-summary ul li {
        font-size: 0.938rem;
    }
}

.booking-area .booking-summary ul li span {
    font-weight: 600;
    color: hsl(var(--secondary));
}

.booking-area .booking-summary ul li.total {
    font-weight: 600;
    font-size: 1.125rem;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .booking-area .booking-summary ul li.total {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .booking-area .booking-summary ul li.total {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .booking-area .booking-summary ul li.total {
        font-size: 1.063rem;
    }
}

.booking-area .booking-summary ul li hr {
    width: 100%;
}

.help-support {
    background: hsl(var(--secondary)/0.03);
    border-radius: 4px;
    text-align: center;
    padding: 50px 20px;
}

.help-support:hover i {
    color: hsl(var(--base));
}

.help-support i {
    font-size: 3.625rem;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

@media screen and (max-width: 1199px) {
    .help-support i {
        font-size: 3.75rem;
    }
}

@media screen and (max-width: 991px) {
    .help-support i {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 575px) {
    .help-support i {
        font-size: 3.563rem;
    }
}

.help-support span {
    display: block;
    color: hsl(var(--secondary)/0.5);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .help-support span {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .help-support span {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .help-support span {
        font-size: 0.938rem;
    }
}

.help-support h3 {
    color: hsl(var(--secondary));
    padding: 10px 0;
}

.help-support p {
    font-size: 0.875rem;
    font-weight: 600;
}

@media screen and (max-width: 1199px) {
    .help-support p {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .help-support p {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .help-support p {
        font-size: 0.813rem;
    }
}

.payment-confirmed {
    background: hsl(var(--success)/0.1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
    padding: 30px;
    border-radius: 5px;
}

@media screen and (max-width: 767px) {
    .payment-confirmed {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 20px;
    }
}

.payment-confirmed__icon i {
    font-size: 80px;
}

@media screen and (max-width: 767px) {
    .payment-confirmed__icon i {
        font-size: 50px;
    }
}

.payment-confirmed__text h4 {
    padding-bottom: 10px;
}

.payment-confirmed__text p {
    color: hsl(var(--secondary)/0.6);
}

.payment-confirmed__text p a {
    color: hsl(var(--secondary)/0.6);
}

.payment-confirmed__text p a:hover {
    color: hsl(var(--base));
}

.invoice-content__header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-bottom: 24px;
}

@media screen and (max-width: 991px) {
    .invoice-content .invoice__download {
        overflow-x: scroll;
    }
}

.invoice-content__document {
    border: 1.5px solid hsl(var(--secondary)/0.1);
    padding: 30px;
    min-width: 650px;
}

.invoice-content__document .invoice-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 20px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 20px;
}

.invoice-content__document .invoice-header h1 {
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 2.688rem;
}

@media screen and (max-width: 1199px) {
    .invoice-content__document .invoice-header h1 {
        font-size: 2.75rem;
    }
}

@media screen and (max-width: 991px) {
    .invoice-content__document .invoice-header h1 {
        font-size: 2.688rem;
    }
}

@media screen and (max-width: 575px) {
    .invoice-content__document .invoice-header h1 {
        font-size: 2.625rem;
    }
}

.invoice-content__document .invoice-header h1 span {
    color: hsl(var(--base));
}

.invoice-content__document .invoice-title {
    margin-top: 30px;
}

.invoice-content__document .invoice-title h5 {
    color: hsl(var(--secondary));
}

.invoice-content__document .invoice-title ul {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
}

.invoice-content__document .invoice-title ul li {
    font-size: 0.875rem;
    color: hsl(var(--secondary));
    margin: 3px 0;
    font-weight: 600;
}

@media screen and (max-width: 1199px) {
    .invoice-content__document .invoice-title ul li {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .invoice-content__document .invoice-title ul li {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .invoice-content__document .invoice-title ul li {
        font-size: 0.813rem;
    }
}

.invoice-content__document .invoice-title ul li:nth-child(3), .invoice-content__document .invoice-title ul li:nth-child(4) {
    text-align: right;
}

.invoice-content__document .invoice-title ul li span {
    margin-left: 15px;
    font-weight: 400;
    color: hsl(var(--secondary)/0.6);
}

.invoice-content__document table {
    margin: 30px 0;
}

.invoice-content__document table th {
    color: hsl(var(--secondary));
}

.invoice-content__document table td {
    font-size: 0.875rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .invoice-content__document table td {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .invoice-content__document table td {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .invoice-content__document table td {
        font-size: 0.813rem;
    }
}

.invoice-content__document table td strong {
    color: hsl(var(--secondary));
}

.invoice-content__document .table-active {
    --bs-table-bg-state: hsl(var(--secondary)/.05);
}

.invoice-content__document .invoice-footer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-top: 1px solid hsl(var(--secondary)/0.05);
    padding-top: 15px;
}

.invoice-content__document .invoice-footer span {
    font-size: 0.813rem;
}

@media screen and (max-width: 1199px) {
    .invoice-content__document .invoice-footer span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) {
    .invoice-content__document .invoice-footer span {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 575px) {
    .invoice-content__document .invoice-footer span {
        font-size: 0.75rem;
    }
}

.invoice-content__document .payment-info {
    margin-bottom: 50px;
}

.invoice-content__document .payment-info ul {
    margin-top: 10px;
}

.invoice-content__document .payment-info ul li {
    font-size: 0.875rem;
    color: hsl(var(--secondary)/0.6);
    margin: 3px 0;
}

@media screen and (max-width: 1199px) {
    .invoice-content__document .payment-info ul li {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .invoice-content__document .payment-info ul li {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .invoice-content__document .payment-info ul li {
        font-size: 0.813rem;
    }
}

.invoice-content__document .payment-info ul li span {
    margin-right: 10px;
    font-weight: 600;
    color: hsl(var(--secondary));
    width: 110px;
}

.pad-overflow {
    padding: 20px;
}

.download-pdf button {
    cursor: pointer;
    background-color: #007bff;
    color: #fff;
    border: none;
    padding: 10px 15px;
    border-radius: 5px;
    font-size: 16px;
}

.quotes-pad {
    border: 1px solid #ccc;
    padding: 20px;
}

.pad-logo img {
    width: 100px;
}

.quotes-footer span {
    display: block;
    margin-top: 10px;
}

/* ============================
    faq css
=============================== */
.faq-area .accordion-button {
    font-size: 1rem;
    font-weight: 600;
    color: hsl(var(--secondary));
}

@media screen and (max-width: 1199px) {
    .faq-area .accordion-button {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .faq-area .accordion-button {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .faq-area .accordion-button {
        font-size: 0.938rem;
    }
}

.faq-title h2 {
    padding: 10px 0 30px;
}

.faq-testimonial {
    border-radius: 5px;
    overflow: hidden;
    position: relative;
}

.faq-testimonial img {
    height: 465px;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.faq-testimonial__text {
    background: hsl(var(--secondary)/0.5);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    position: absolute;
    bottom: 0;
    left: 0;
    margin: 30px;
    padding: 20px;
    border-radius: 5px;
}

.faq-testimonial__text p {
    color: hsl(var(--white));
    font-size: 1.125rem;
}

@media screen and (max-width: 1199px) {
    .faq-testimonial__text p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .faq-testimonial__text p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .faq-testimonial__text p {
        font-size: 1.063rem;
    }
}
/* ============================
    gallery css
=============================== */
.gallery-contents {
    margin-bottom: -24px;
}

.gallery-contents .col-lg-4 {
    margin-bottom: 24px;
}

@media screen and (max-width: 991px) {
    .gallery-contents .col-lg-4 {
        margin-bottom: 10px;
        padding: 0 7px;
    }
}

.gallery-contents a {
    overflow: hidden;
    border-radius: 5px;
}

.gallery-contents a:hover img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.gallery-contents img {
    -webkit-transition: all 0.5s;
    transition: all 0.5s;
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.gallery-contents .gallery-4 {
    height: 550px;
}

@media screen and (max-width: 1199px) {
    .gallery-contents .gallery-4 {
        height: 400px;
    }
}

@media screen and (max-width: 767px) {
    .gallery-contents .gallery-4 {
        height: auto;
    }
}

.gallery-contents .gallery-8 {
    height: 245px;
}

@media screen and (max-width: 1199px) {
    .gallery-contents .gallery-8 {
        height: 170px;
    }
}

@media screen and (max-width: 767px) {
    .gallery-contents .gallery-8 {
        height: auto;
    }
}
/* Style the cursor elements */
.cursor,
.cursor-trail {
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    border-radius: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1000;
}

.cursor {
    width: 5px;
    height: 5px;
    background-color: hsl(var(--base));
}

.cursor-trail {
    width: 30px;
    height: 30px;
    background-color: hsl(var(--base)/0.3);
}

/* ================================= 
    Preloader Css 
=================================== */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: hsl(var(--black)/0.9);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    z-index: 9999;
    opacity: 1;
    -webkit-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

/* Logo animation styling */
#preloader img {
    width: 100px;
  /* Adjust size as needed */
    -webkit-animation: pulse 1.5s ease-in-out infinite, fade 1.5s ease-in-out infinite alternate;
    animation: pulse 1.5s ease-in-out infinite, fade 1.5s ease-in-out infinite alternate;
}

/* Scale (pulse) animation */
@-webkit-keyframes pulse {
    0%, 100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    /* Adjust scale intensity */
    }
}

@keyframes pulse {
    0%, 100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    /* Adjust scale intensity */
    }
}
/* Fade effect */
@-webkit-keyframes fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    /* Adjust fade intensity */
    }
}

@keyframes fade {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0.5;
    /* Adjust fade intensity */
    }
}

.search-bar {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: end;
    background: hsl(var(--white));
    border: 1px solid hsl(var(--border-color));
    border-radius: 5px;
    padding: 30px;
}

@media screen and (max-width: 991px) {
    .search-bar {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media screen and (max-width: 575px) {
    .search-bar {
        grid-template-columns: repeat(2, 1fr);
        padding: 20px;
    }
}

@media screen and (max-width: 374px) {
    .search-bar {
        grid-template-columns: repeat(1, 1fr);
    }
}

.search-bar__item {
    position: relative;
    min-width: 120px;
}

@media (min-width: 992px) {
    .search-bar__item:last-child {
        max-width: 92px;
    }
}

@media screen and (max-width: 1199px) {
    .search-bar__item:first-child {
        min-width: 180px;
    }
}

.search-bar__item:nth-child(4) {
    min-width: 250px;
}

@media screen and (max-width: 991px) {
    .search-bar__item:nth-child(4) {
        grid-column: 1/-2;
    }
}

@media screen and (max-width: 575px) {
    .search-bar__item:nth-child(5), .search-bar__item:nth-child(4), .search-bar__item:nth-child(1) {
        grid-column: 1/-1;
    }
}

.search-bar .fs-18 {
    font-weight: 600;
    margin-bottom: 10px;
}

.search-bar input {
    border: 0;
    outline: none;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    font-size: 0.875rem;
    font-weight: 500;
    border-radius: 0;
    padding-right: 0;
}

@media screen and (max-width: 1199px) {
    .search-bar input {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .search-bar input {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .search-bar input {
        font-size: 0.813rem;
    }
}

.search-bar input::-webkit-input-placeholder {
    color: hsl(var(--secondary)/0.6);
}

.search-bar input::-moz-placeholder {
    color: hsl(var(--secondary)/0.6);
}

.search-bar input:-ms-input-placeholder {
    color: hsl(var(--secondary)/0.6);
}

.search-bar input::-ms-input-placeholder {
    color: hsl(var(--secondary)/0.6);
}

.search-bar input::placeholder {
    color: hsl(var(--secondary)/0.6);
}

.search-bar .guest-btn {
    font-size: 0.875rem;
    padding-left: 10px;
    font-weight: 500;
    line-height: 40px;
    color: hsl(var(--base-two)/0.7);
}

@media screen and (max-width: 1199px) {
    .search-bar .guest-btn {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .search-bar .guest-btn {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .search-bar .guest-btn {
        font-size: 0.813rem;
    }
}

.search-bar .input-group {
    border: 1px solid hsl(var(--border-color));
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 50px;
    padding: 0 10px;
    padding-right: 3px;
    border-radius: 5px;
}

.search-bar .input-group:focus {
    -webkit-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
}

.search-bar .input-group .material-icons {
    color: hsl(var(--secondary)/0.6);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .search-bar .input-group .material-icons {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .search-bar .input-group .material-icons {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .search-bar .input-group .material-icons {
        font-size: 0.938rem;
    }
}

.search-bar .btn-magnetic {
    width: 100%;
    height: 50px;
    text-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.search-bar .btn-magnetic i {
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .search-bar .btn-magnetic i {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .search-bar .btn-magnetic i {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .search-bar .btn-magnetic i {
        font-size: 0.813rem;
    }
}

.search-bar .btn-magnetic:hover {
    border-color: hsl(var(--secondary));
}

.search-bar .btn-magnetic:hover i {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
}

.search-bar .btn-magnetic span {
    background-color: hsl(var(--secondary));
}

.guest-list {
    background-color: hsl(var(--white));
    position: absolute;
    width: 100%;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    -webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    padding: 20px;
    display: grid;
    gap: 10px;
    opacity: 0;
    z-index: 11;
}

.guest-list.active {
    height: 190px;
    opacity: 1;
}

.guest-list__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 10px;
}

.guest-list__item span {
    text-transform: capitalize;
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--base-two));
}

@media screen and (max-width: 1199px) {
    .guest-list__item span {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .guest-list__item span {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .guest-list__item span {
        font-size: 0.813rem;
    }
}

.guest-list__item .guest-check .quantity-btn {
    min-width: 24px;
    height: 24px;
    background: hsl(var(--border-color));
    border-radius: 5px;
    color: hsl(var(--base-two));
    font-size: 1rem;
    font-weight: 600;
}

@media screen and (max-width: 1199px) {
    .guest-list__item .guest-check .quantity-btn {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .guest-list__item .guest-check .quantity-btn {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .guest-list__item .guest-check .quantity-btn {
        font-size: 0.938rem;
    }
}

.guest-list__item .guest-check .quantity-btn:hover {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
}

.guest-list__item .guest-check .quantity-item {
    min-width: 24px;
    text-align: center;
}

.guest-list .guest-done-btn {
    height: 36px;
    margin-top: 10px;
}

/* ================================= 
    Scroll back to top Css 
=================================== */
.progress-wrap {
    position: fixed;
    right: 50px;
    bottom: 50px;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    border-radius: 50px;
    -webkit-box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.2);
    z-index: 10000;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(15px);
    transform: translateY(15px);
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}

@media screen and (max-width: 991px) {
    .progress-wrap {
        right: 10px;
        bottom: 20px;
        height: 35px;
        width: 35px;
    }
}

.progress-wrap.active-progress {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateY(0);
    transform: translateY(0);
}

.progress-wrap:hover::after {
    opacity: 0;
}

.progress-wrap:hover::before {
    opacity: 1;
}

.progress-wrap::before, .progress-wrap::after {
    position: absolute;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f062";
    text-align: center;
    line-height: 46px;
    font-size: 18px;
    color: hsl(var(--base));
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    display: block;
    z-index: 2;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.progress-wrap::before {
    opacity: 0;
    background-image: linear-gradient(298deg, #da2c4d, #f8ab37);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.progress-wrap .lightScrollIcon::after {
    color: #ecedf3 !important;
}

.progress-wrap svg path {
    fill: none;
}

.progress-wrap svg.progress-circle path {
    stroke: hsl(var(--base));
    stroke-width: 5;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: all 200ms linear;
    transition: all 200ms linear;
}

/* ============================
    navbar css
=============================== */
.navbar-one {
    width: 100%;
    z-index: 111;
    padding: 0px 0;
    position: absolute;
    background: none;
    top: 0; 
}

.navbar-one.sticky {
    background-color: hsl(var(--white));
    border-bottom: 1px solid hsl(var(--border-color));
    position: fixed; 
}

.navbar-one.sticky .container {
    border-bottom: 0;
}

.navbar-one .container {
    max-width: 1500px;
    border-bottom: 1px solid hsl(var(--border-color));
    padding: 0 50px;
}

@media screen and (max-width: 991px) {
    .navbar-one .container {
        padding: 13px 20px;
    }
}

.navbar-one .navbar-brand {
    padding: 0;
}

@media screen and (max-width: 1199px) {
    .navbar-one .navbar-brand img {
        height: 30px;
    }
}

.navbar-one .logo-img {
    height: 3.8rem;
}

.navbar-one .right-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
}

@media screen and (max-width: 1199px) {
    .navbar-one .right-nav {
        gap: 10px;
    }
}

@media screen and (max-width: 991px) {
    .navbar-one .right-nav {
        padding: 0 10px 15px;
        gap: 20px;
    }
}

.navbar-one .right-nav .nice-select {
    background: none;
    border: 0;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0 20px 0 0;
}

@media screen and (max-width: 1199px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .navbar-one .right-nav .nice-select {
        font-size: 0.688rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-one .right-nav .nice-select .current {
        color: hsl(var(--white));
    }
}

.navbar-one .right-nav .nice-select:after {
    border-color: hsl(var(--secondary));
    height: 8px;
    width: 8px;
    margin-top: -6px;
    right: 5px;
}

@media screen and (max-width: 991px) {
    .navbar-one .right-nav .nice-select:after {
        border-color: hsl(var(--white));
    }
}

.navbar-one .right-nav .book-btn {
    background-color: hsl(var(--base));
    color: hsl(var(--white));
    border-color: hsl(var(--base));
}

.navbar-one .right-nav .book-btn:hover {
    border-color: hsl(var(--secondary));
}

.navbar-one .right-nav .book-btn span {
    background-color: hsl(var(--secondary));
}

.navbar-one .right-nav .log-btn {
    border: 1px solid hsl(var(--secondary));
}

.navbar-one .right-nav .log-btn:hover {
    border-color: hsl(var(--base));
}

@media screen and (max-width: 1199px) {
    .navbar-one .right-nav .btn-magnetic {
        font-size: 0.75rem;
        padding: 8px 12px;
        gap: 5px;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .navbar-one .right-nav .btn-magnetic {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .navbar-one .right-nav .btn-magnetic {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .navbar-one .right-nav .btn-magnetic {
        font-size: 0.688rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-one .right-nav .btn-magnetic.log-btn {
        border-color: hsl(var(--white));
        color: hsl(var(--white));
    }
}

.navbar-one .btn-magnetic {
    padding: 10px 20px;
}

.navbar-toggler {
    border: none;
    padding: 2px;
    padding-right: 0;
    margin-right: -10px;
}

.navbar-toggler .animated-svg {
    display: block;
    width: 50px;
    height: 40px;
}

.navbar-toggler .animated-svg .stroke {
    color: hsl(var(--secondary));
}

.navbar-three,
.navbar-two {
    width: 100%;
    z-index: 111;
    padding: 0;
    position: absolute;
    background: none;
    top: 0;
   
}

.navbar-three.sticky .container,
.navbar-two.sticky .container {
    background-color: hsl(var(--secondary)/0.8);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    border-bottom: 0;
    padding: 0 15px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.navbar-three .container,
.navbar-two .container {
    max-width: 1500px;
    border-bottom: 1px solid hsl(var(--border-color)/0.6);
    padding: 0;
}

@media (max-width: 1500px) {
    .navbar-three .container,
.navbar-two .container {
        padding: 0 40px;
    }
}

@media screen and (max-width: 991px) {
    .navbar-three .container,
.navbar-two .container {
        padding: 10px 30px !important;
    }
}

.navbar-three .navbar-brand,
.navbar-two .navbar-brand {
    padding: 0;
}

.navbar-three .logo-img,
.navbar-two .logo-img {
    height: 2.5rem;
}

@media screen and (max-width: 767px) {
    .navbar-three .logo-img,
.navbar-two .logo-img {
        height: 1.875rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-three .navbar-nav,
.navbar-two .navbar-nav {
        margin-bottom: 15px;
    }
}

.navbar-three .navbar-nav .nav-item .nav-link,
.navbar-two .navbar-nav .nav-item .nav-link {
    color: hsl(var(--white));
    padding: 2.1875rem 0.625rem;
}

@media screen and (max-width: 991px) {
    .navbar-three .navbar-nav .nav-item .nav-link,
.navbar-two .navbar-nav .nav-item .nav-link {
        padding: 10px 0;
    }
}

.navbar-three .right-nav,
.navbar-two .right-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 20px;
}

@media screen and (max-width: 1199px) {
    .navbar-three .right-nav .booking-btns,
.navbar-two .right-nav .booking-btns {
        display: none;
    }
}

@media screen and (max-width: 1199px) {
    .navbar-three .right-nav ul.nav,
.navbar-two .right-nav ul.nav {
        display: none;
    }
}

.navbar-three .right-nav ul.nav a,
.navbar-two .right-nav ul.nav a {
    color: hsl(var(--white));
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    font-weight: 500;
}

.navbar-three .right-nav ul.nav a:hover,
.navbar-two .right-nav ul.nav a:hover {
    color: hsl(var(--base));
}

.navbar-three .right-nav .nice-select,
.navbar-two .right-nav .nice-select {
    background: none;
    border: 0;
    font-size: 0.875rem;
    font-weight: 500;
    padding: 0 20px 0 0;
    color: hsl(var(--white));
}

@media screen and (max-width: 1199px) {
    .navbar-three .right-nav .nice-select,
.navbar-two .right-nav .nice-select {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-three .right-nav .nice-select,
.navbar-two .right-nav .nice-select {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .navbar-three .right-nav .nice-select,
.navbar-two .right-nav .nice-select {
        font-size: 0.813rem;
    }
}

.navbar-three .right-nav .nice-select:after,
.navbar-two .right-nav .nice-select:after {
    border-color: hsl(var(--white));
    height: 8px;
    width: 8px;
    margin-top: -6px;
    right: 5px;
}

.navbar-three .right-nav .nice-select .option,
.navbar-two .right-nav .nice-select .option {
    color: hsl(var(--secondary));
}

.navbar-three .right-nav .log__in,
.navbar-two .right-nav .log__in {
    background-color: hsl(var(--white));
    color: hsl(var(--base));
    border-color: hsl(var(--white));
}

.navbar-three .right-nav .log__in:hover,
.navbar-two .right-nav .log__in:hover {
    border-color: hsl(var(--base));
    color: hsl(var(--white));
}

.navbar-three .right-nav .log__in span,
.navbar-two .right-nav .log__in span {
    background-color: hsl(var(--base));
}

.navbar-three .right-nav .nav__search,
.navbar-two .right-nav .nav__search {
    border: 1px solid hsl(var(--white));
    color: hsl(var(--white));
    width: auto;
    height: 40px;
    padding: 0 12px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.navbar-three .right-nav .nav__search i,
.navbar-two .right-nav .nav__search i {
    -webkit-transform: translate(0);
    transform: translate(0);
}

.navbar-three .right-nav .nav__search:hover,
.navbar-two .right-nav .nav__search:hover {
    border-color: hsl(var(--base));
}

.navbar-three .right-nav .nav__search:hover i,
.navbar-two .right-nav .nav__search:hover i {
    -webkit-transform: translate(0);
    transform: translate(0);
}

.navbar-three .btn-magnetic,
.navbar-two .btn-magnetic {
    padding: 10px 20px;
}

.navbar-two {
    top: 25px;
}

@media screen and (max-width: 991px) {
    .navbar-two {
        top: 10px;
    }
}

.navbar-three.sticky {
    background-color: hsl(var(--secondary)/0.9);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
    position: fixed;
    padding: 0 30px;
}

.navbar-three.sticky .container {
    background: none;
    -webkit-backdrop-filter: unset;
    backdrop-filter: unset;
    padding: 0;
}

.navbar-three .container {
    max-width: 1500px;
    border-bottom: 0;
}

.navbar-nav {
    gap: 0.9375rem;
}

@media screen and (max-width: 991px) {
    .navbar-nav {
        gap: 0rem;
    }
}

.navbar-nav .nav-item .nav-link {
    color: hsl(var(--secondary));
    font-size: 0.875rem;
    font-weight: 500;
    padding: 2.1875rem 0.625rem;
    text-transform: uppercase;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media screen and (max-width: 1199px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.75rem;
        padding-left: 0.3125rem;
        padding-right: 0.3125rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 1199px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 991px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 1199px) and (max-width: 575px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.688rem;
    }
}

@media screen and (max-width: 991px) {
    .navbar-nav .nav-item .nav-link {
        padding: 0.625rem;
        color: hsl(var(--white));
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .navbar-nav .nav-item .nav-link {
        font-size: 0.75rem;
    }
}

.navbar-nav .nav-item .nav-link span {
    position: relative;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.navbar-nav .nav-item .nav-link span::before {
    content: attr(data-before);
    -webkit-transition: 0.5s;
    transition: 0.5s;
    color: hsl(var(--base));
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 0;
    overflow: hidden;
}

.navbar-nav .nav-item .nav-link.active, .navbar-nav .nav-item .nav-link:hover {
    color: hsl(var(--base));
    font-weight: 600;
}

.navbar-nav .nav-item .nav-link.active span::before, .navbar-nav .nav-item .nav-link:hover span::before {
    width: 100%;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

.navbar-nav .nav-item:hover .nav-link {
    color: hsl(var(--primary));
}

.navbar-nav .nav-item:hover .dropdown-menu {
    -webkit-transition: 0.5s;
    transition: 0.5s;
    opacity: 1;
}

@media all and (min-width: 991.98px) {
    .navbar-nav .nav-item:hover .dropdown-menu {
        visibility: visible;
        top: 100%;
        -webkit-transform: rotateX(0deg);
        transform: rotateX(0deg);
    }
}

.navbar-nav .nav-item .dropdown-toggle::after {
    content: "\f107";
    font-weight: 900;
    font-family: "Font Awesome 6 free";
    border: 0;
}

@media screen and (max-width: 991px) {
    .navbar-nav .nav-item .dropdown-toggle::after {
        margin-left: auto;
    }
}

@media (max-width: 991.98px) {
    .navbar-nav .nav-item.dropdown .nav-link {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .navbar-nav .nav-item.dropdown .nav-link::after {
        content: "\f107";
        font-weight: 900;
        font-family: "Font Awesome 6 free";
        margin-left: auto;
    }
}

.navbar-nav .nav-item .dropdown-menu {
    -webkit-transition: 0.5s;
    transition: 0.5s;
    margin-top: 0;
    padding: 15px 20px;
    min-width: 200px;
    border: 1px solid hsl(var(--border-color));
}

@media all and (min-width: 991.98px) {
    .navbar-nav .nav-item .dropdown-menu {
        display: block;
        opacity: 0;
        visibility: hidden;
    }
}

.navbar-nav .nav-item .dropdown-menu.fade-down {
    top: 80%;
    -webkit-transform: rotateX(-75deg);
    transform: rotateX(-75deg);
    -webkit-transform-origin: 0% 0%;
    transform-origin: 0% 0%;
}

.navbar-nav .nav-item .dropdown-menu.fade-up {
    top: 100%;
}

.navbar-nav .nav-item .dropdown-menu a {
    padding: 5px 0px;
    background: none;
    -webkit-transition: 0.5s;
    transition: 0.5s;
    position: relative;
    font-weight: 500;
    font-size: 14px;
    border: 0;
    color: hsl(var(--gray3));
}

.navbar-nav .nav-item .dropdown-menu a::before {
    content: "";
    position: absolute;
    left: -10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 2px;
    width: 10px;
    z-index: 99;
    background: hsl(var(--primary));
    opacity: 0;
    border-radius: unset;
    -webkit-transition: 0.5s;
    transition: 0.5s;
}

.navbar-nav .nav-item .dropdown-menu a.active, .navbar-nav .nav-item .dropdown-menu a:hover {
    padding-left: 5px;
    color: hsl(var(--primary));
}

.navbar-nav .nav-item .dropdown-menu a.active::before, .navbar-nav .nav-item .dropdown-menu a:hover::before {
    opacity: 1;
    left: -15px;
}

@media (min-width: 992px) {
    .navbar-nav .nav-item .dropdown-mega-menu {
        min-width: 600px;
        left: -200px;
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}

.nice-select .option.selected.focus, .nice-select .option.focus, .nice-select .option:hover {
    background-color: hsl(var(--base)/0.4);
    color: hsl(var(--secondary));
}

/* ============================
    footer css
=============================== */
.footer-area {
    background-image: url("../image/bg-1.jpg");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 1;
}

.footer-area.footer-two {
    background-image: url("../image/bg-2.jpg");
    padding-bottom: 20px;
}

.footer-area::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background-color: hsl(var(--secondary)/0.9);
}

.footer-area__about p {
    color: hsl(var(--white)/0.8);
    font-size: 1.125rem;
    margin-bottom: 30px;
    max-width: 250px;
}

@media screen and (max-width: 1199px) {
    .footer-area__about p {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area__about p {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area__about p {
        font-size: 1.063rem;
    }
}

.footer-area__about .social {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.footer-area__about .social:hover a {
    opacity: 0.5;
}

.footer-area__about .social:hover a:hover {
    opacity: 1;
}

.footer-area__about .social a {
    font-size: 1rem;
    color: hsl(var(--secondary));
    background: hsl(var(--white));
    width: 40px;
    height: 40px;
    border-radius: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

@media screen and (max-width: 1199px) {
    .footer-area__about .social a {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area__about .social a {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area__about .social a {
        font-size: 0.938rem;
    }
}

.footer-area__about .social a:hover {
    background: hsl(var(--base));
    color: hsl(var(--white));
}

.footer-area .footer_title {
    color: hsl(var(--white));
    margin-bottom: 24px;
}

.footer-area .footer-widget {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 24px;
}

@media screen and (max-width: 1199px) {
    .footer-area .footer-widget {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media screen and (max-width: 991px) {
    .footer-area .footer-widget {
        margin-top: 40px;
        row-gap: 35px;
    }
}

.footer-area .footer-widget__title {
    color: hsl(var(--white));
    margin-bottom: 24px;
}

@media screen and (max-width: 991px) {
    .footer-area .footer-widget__title {
        margin-bottom: 20px;
    }
}

.footer-area .footer-widget__title:last-child .footer-widget__list a:hover {
    padding-left: 0px;
}

.footer-area .footer-widget__title:last-child .footer-widget__list a:hover::before {
    width: 0px;
}

.footer-area .footer-widget__list {
    display: grid;
    gap: 15px;
}

.footer-area .footer-widget__list a {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--white)/0.8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
    display: inline !important;
    width: 100%;
    background-repeat: no-repeat;
    background-position-y: -2px;
    background-image: linear-gradient(transparent calc(100% - 1px), currentColor 1px);
    -webkit-transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
    background-size: 0 100%;
    text-transform: capitalize;
}

@media screen and (max-width: 1199px) {
    .footer-area .footer-widget__list a {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area .footer-widget__list a {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area .footer-widget__list a {
        font-size: 0.813rem;
    }
}

.footer-area .footer-widget__list a:hover {
    background-image: linear-gradient(transparent calc(100% - 1px), currentColor 1px);
    background-size: 100% 100%;
    color: hsl(var(--base));
}

.footer-area .footer-widget__contact {
    display: grid;
    gap: 15px;
}

.footer-area .footer-widget__contact li {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--white)/0.8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
}

@media screen and (max-width: 1199px) {
    .footer-area .footer-widget__contact li {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area .footer-widget__contact li {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area .footer-widget__contact li {
        font-size: 0.813rem;
    }
}

.footer-area .footer-widget__contact li a {
    font-size: 0.875rem;
    font-weight: 500;
    color: hsl(var(--white)/0.8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 15px;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
}

@media screen and (max-width: 1199px) {
    .footer-area .footer-widget__contact li a {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area .footer-widget__contact li a {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area .footer-widget__contact li a {
        font-size: 0.813rem;
    }
}

.footer-area .footer-widget__contact li a:hover {
    color: hsl(var(--base));
}

.footer-area.footer-three.section-bg {
    background: hsl(var(--section-bg));
}

.footer-area.footer-three .footer-widget__contact li a {
    color: hsl(var(--secondary)/0.7);
}

.footer-area.footer-three .footer-widget__contact li a:hover {
    color: hsl(var(--base));
}

.footer-area.footer-three::after {
    display: none;
}

.footer-area.footer-three .footer_title {
    color: hsl(var(--secondary));
}

.footer-area.footer-three .footer-area__about p {
    color: hsl(var(--secondary));
}

.footer-area.footer-three .footer-area__about .social a {
    color: hsl(var(--white));
    background: hsl(var(--secondary));
}

.footer-area.footer-three .footer-area__about .social a:hover {
    background: hsl(var(--base));
}

.footer-area.footer-three .footer-widget__title {
    color: hsl(var(--secondary));
}

.footer-area.footer-three .footer-widget__list a {
    color: hsl(var(--secondary)/0.7);
}

.footer-area.footer-three .footer-widget__list a:hover {
    color: hsl(var(--base));
}

.footer-area.footer-three .copy-right {
    border-top: 1px solid hsl(var(--secondary)/0.1);
}

.footer-area.footer-three .copy-right__text {
    color: hsl(var(--secondary));
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .footer-area.footer-three .copy-right__text {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .footer-area.footer-three .copy-right__text {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .footer-area.footer-three .copy-right__text {
        font-size: 0.813rem;
    }
}

.footer-area.footer-three .copy-right__url a {
    color: hsl(var(--secondary));
}

.footer-area.footer-three .copy-right__url a:hover {
    color: hsl(var(--base));
}

.copy-right {
    border-top: 1.5px solid hsl(var(--border-color)/0.1);
    padding: 20px 0;
}

.copy-right__content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media screen and (max-width: 767px) {
    .copy-right__content {
        display: grid;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        gap: 10px;
    }
}

.copy-right__text {
    color: hsl(var(--white));
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .copy-right__text {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .copy-right__text {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .copy-right__text {
        font-size: 0.813rem;
    }
}

@media screen and (max-width: 767px) {
    .copy-right__text {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        text-align: center;
    }
}

.copy-right__text a {
    color: hsl(var(--base));
    font-weight: 600;
}

.copy-right__url {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 24px;
}

.copy-right__url a {
    color: hsl(var(--white));
    font-size: 0.875rem;
}

@media screen and (max-width: 1199px) {
    .copy-right__url a {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .copy-right__url a {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .copy-right__url a {
        font-size: 0.813rem;
    }
}

.copy-right__url a:hover {
    color: hsl(var(--base));
}

/* ============================
    breadcrumb css
=============================== */
.breadcrumb {
    padding-top: 93px;
    margin-bottom: 0;
    position: relative;
    z-index: 1;
}

.breadcrumb::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80%;
    z-index: -1;
    background-image: url("../image/destination.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: hsl(var(--section-bg));
    z-index: -1;
}

.breadcrumb .container {
    max-width: 1500px;
    position: relative;
}

@media screen and (max-width: 1499px) {
    .breadcrumb .container {
        margin: 0 50px;
    }
}

@media screen and (max-width: 991px) {
    .breadcrumb .container {
        margin: 0 20px;
    }
}

.breadcrumb .breadcrumb-banner-img {
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: 0;
    width: 100%;
    height: 100%;
    max-width: 1400px;
    border-radius: 10px;
    overflow: hidden;
    z-index: 1;
}

.breadcrumb .breadcrumb-banner-img::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: hsl(var(--secondary)/0.2);
    z-index: 1;
}

.breadcrumb .slide-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    opacity: 0;
    -webkit-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}

.breadcrumb__wrapper {
    text-align: center;
    position: relative;
    z-index: 1;
    padding: 180px 0;
}

@media screen and (max-width: 991px) {
    .breadcrumb__wrapper {
        padding: 120px 0;
    }
}

.breadcrumb__title {
    font-size: 3.625rem;
    color: hsl(var(--white));
    text-transform: capitalize;
}

@media screen and (max-width: 1199px) {
    .breadcrumb__title {
        font-size: 3.75rem;
    }
}

@media screen and (max-width: 991px) {
    .breadcrumb__title {
        font-size: 3.625rem;
    }
}

@media screen and (max-width: 575px) {
    .breadcrumb__title {
        font-size: 3.563rem;
    }
}

@media screen and (max-width: 991px) {
    .breadcrumb__title {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 1199px) {
    .breadcrumb__title {
        font-size: 2.438rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 991px) {
    .breadcrumb__title {
        font-size: 2.375rem;
    }
}

@media screen and (max-width: 991px) and (max-width: 575px) {
    .breadcrumb__title {
        font-size: 2.313rem;
    }
}

.breadcrumb__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 15px;
    margin-top: 20px;
}

.breadcrumb__item {
    color: hsl(var(--white));
    text-transform: capitalize;
}

.breadcrumb__item i {
    font-size: 1.438rem;
}

@media screen and (max-width: 1199px) {
    .breadcrumb__item i {
        font-size: 1.5rem;
    }
}

@media screen and (max-width: 991px) {
    .breadcrumb__item i {
        font-size: 1.438rem;
    }
}

@media screen and (max-width: 575px) {
    .breadcrumb__item i {
        font-size: 1.375rem;
    }
}

.breadcrumb__link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: hsl(var(--white));
    gap: 5px;
}

.breadcrumb__link:hover {
    font-weight: 600;
}

/* ============================
    contact css
=============================== */
.contact-info__left {
    border: 1px solid hsl(var(--secondary)/0.1);
    padding: 30px;
    border-radius: 5px;
    display: grid;
    gap: 20px;
}

.contact-info__left h6 {
    color: hsl(var(--secondary)/0.6);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
    padding-bottom: 3px;
}

.contact-info__left p {
    color: hsl(var(--secondary)/0.6);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .contact-info__left p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .contact-info__left p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .contact-info__left p {
        font-size: 0.938rem;
    }
}

.contact-info__left p a {
    color: hsl(var(--secondary)/0.6);
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

.contact-info__left p a:hover {
    color: hsl(var(--base));
}

.contact-info__left .infos-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    gap: 15px;
}

.contact-info__left .infos-item:hover .material-icons {
    background: hsl(var(--secondary)/0.6);
}

.contact-info__left .infos-item:hover h6 {
    color: hsl(var(--base));
}

.contact-info__left .infos-item .material-icons {
    border-radius: 5px;
    background: hsl(var(--base));
    min-width: 40px;
    height: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: hsl(var(--white));
    font-size: 1.125rem;
    margin-top: 3px;
    -webkit-transition: all 0.4s;
    transition: all 0.4s;
}

@media screen and (max-width: 1199px) {
    .contact-info__left .infos-item .material-icons {
        font-size: 1.188rem;
    }
}

@media screen and (max-width: 991px) {
    .contact-info__left .infos-item .material-icons {
        font-size: 1.125rem;
    }
}

@media screen and (max-width: 575px) {
    .contact-info__left .infos-item .material-icons {
        font-size: 1.063rem;
    }
}

.contact-info__form .form-control {
    font-size: 0.875rem;
    font-weight: 500;
    height: 55px;
    padding: 15px;
}

@media screen and (max-width: 1199px) {
    .contact-info__form .form-control {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .contact-info__form .form-control {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .contact-info__form .form-control {
        font-size: 0.813rem;
    }
}

.contact-info__form .form-control::-webkit-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .form-control::-moz-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .form-control:-ms-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .form-control::-ms-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .form-control::placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .wide {
    font-size: 0.875rem;
    font-weight: 500;
    height: 55px;
    line-height: 55px;
    color: hsl(var(--secondary)/0.7);
}

@media screen and (max-width: 1199px) {
    .contact-info__form .wide {
        font-size: 0.938rem;
    }
}

@media screen and (max-width: 991px) {
    .contact-info__form .wide {
        font-size: 0.875rem;
    }
}

@media screen and (max-width: 575px) {
    .contact-info__form .wide {
        font-size: 0.813rem;
    }
}

.contact-info__form textarea.form-control {
    height: 150px;
}

.contact-info__form textarea.form-control::-webkit-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form textarea.form-control::-moz-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form textarea.form-control:-ms-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form textarea.form-control::-ms-input-placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form textarea.form-control::placeholder {
    color: hsl(var(--secondary)/0.7);
}

.contact-info__form .form-floating input,
.contact-info__form .form-floating textarea {
    border-color: hsl(var(--secondary)/0.1);
}

.contact-info__form .form-floating textarea {
    height: 150px;
}

.contact-info__map iframe {
    width: 100%;
    height: 550px;
    border-radius: 5px;
}

@media screen and (max-width: 767px) {
    .contact-info__map iframe {
        height: 260px;
    }
}

.error-content {
    text-align: center;
}

.error-content img {
    max-width: 400px;
    margin: 0 auto 60px;
    width: 100%;
}

.error-content h2 {
    color: hsl(var(--secondary));
}

.error-content p {
    padding: 20px 0 30px;
    max-width: 550px;
    margin: 0 auto;
}

.sing-info-box {
    background: hsl(var(--white));
    padding: 60px 70px;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    width: 100%;
}

@media screen and (max-width: 767px) {
    .sing-info-box {
        padding: 30px 24px;
    }
}

.sing-info-box h2,
.sing-info-box p {
    text-align: center;
}

.sing-info-box .form-floating {
    position: relative;
    margin-bottom: 1.5rem;
}

.sing-info-box .form-floating .password-show-toggle {
    position: absolute;
    right: 16px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    cursor: pointer;
    height: 21px;
}

.sing-info-box .form-floating .password-show-toggle .material-icons {
    font-size: 1.25rem;
    color: hsl(var(--secondary)/0.6);
}

@media screen and (max-width: 1199px) {
    .sing-info-box .form-floating .password-show-toggle .material-icons {
        font-size: 1.313rem;
    }
}

@media screen and (max-width: 991px) {
    .sing-info-box .form-floating .password-show-toggle .material-icons {
        font-size: 1.25rem;
    }
}

@media screen and (max-width: 575px) {
    .sing-info-box .form-floating .password-show-toggle .material-icons {
        font-size: 1.188rem;
    }
}

.sing-info-box .form-floating .password-show-toggle .open-eye-icon {
    display: none;
}

.sing-info-box .remember-me {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 1.5rem;
    font-size: 0.9rem;
}

.sing-info-box .remember-me a {
    text-decoration: none;
    color: hsl(var(--base));
    text-transform: capitalize;
}

.sing-info-box .remember-me a:hover {
    text-decoration: underline;
}

.sing-info-box .remember-me label.form-check-label {
    margin-top: 2px;
    margin-left: 5px;
}

.sing-info-box .btn-magnetic {
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: hsl(var(--secondary));
    color: hsl(var(--white));
    font-size: 1rem;
    height: 58px;
}

@media screen and (max-width: 1199px) {
    .sing-info-box .btn-magnetic {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .sing-info-box .btn-magnetic {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .sing-info-box .btn-magnetic {
        font-size: 0.938rem;
    }
}

.sing-info-box .social-login {
    text-align: center;
}

.sing-info-box .social-login .sing-white {
    position: relative;
    z-index: 1;
    margin: 30px 0;
}

.sing-info-box .social-login .sing-white::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
    border-bottom: 0.3px solid hsl(var(--secondary)/0.3);
    z-index: -1;
}

.sing-info-box .social-login .sing-white span {
    background: hsl(var(--white));
    padding: 0 10px;
    font-weight: 600;
}

.sing-info-box .social-login .social-icons {
    display: grid;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    gap: 10px;
    grid-template-columns: repeat(2, 1fr);
}

.sing-info-box .social-login .social-icons a,
.sing-info-box .social-login .social-icons button {
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 10px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: hsl(var(--white));
    border-radius: 3px;
}

.sing-info-box .social-login .social-icons a.google,
.sing-info-box .social-login .social-icons button.google {
    background: #dd4b39;
}

.sing-info-box .social-login .social-icons a.facebook,
.sing-info-box .social-login .social-icons button.facebook {
    background: #3b5998;
}

.sing-info-box .social-login .social-icons a.twitter,
.sing-info-box .social-login .social-icons button.twitter {
    background: #55acee;
}

.sing-info-box .login-link {
    text-align: center;
    margin-top: 15px;
}

.sing-info-box .login-link a {
    text-decoration: none;
    color: hsl(var(--base));
    font-weight: bold;
}

.privacy-content {
    background: hsl(var(--secondary)/0.02);
    padding: 24px 24px 40px;
    border-radius: 5px;
    row-gap: 24px;
}

.privacy-content h1, .privacy-content h2, .privacy-content h3 {
    color: hsl(var(--secondary));
}

.privacy-content p {
    color: hsl(var(--secondary)/0.6);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .privacy-content p {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .privacy-content p {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .privacy-content p {
        font-size: 0.938rem;
    }
}

.privacy-content a {
    color: hsl(var(--secondary)/0.6);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .privacy-content a {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .privacy-content a {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .privacy-content a {
        font-size: 0.938rem;
    }
}

.privacy-content ul {
    margin-top: 10px;
    display: grid;
    gap: 5px;
}

.privacy-content ul li {
    color: hsl(var(--secondary)/0.8);
    font-size: 1rem;
}

@media screen and (max-width: 1199px) {
    .privacy-content ul li {
        font-size: 1.063rem;
    }
}

@media screen and (max-width: 991px) {
    .privacy-content ul li {
        font-size: 1rem;
    }
}

@media screen and (max-width: 575px) {
    .privacy-content ul li {
        font-size: 0.938rem;
    }
}

.privacy-content ul li::before {
    content: "\f111";
    font-weight: 900;
    font-family: "Font Awesome 6 free";
    font-size: 7px;
    margin-right: 10px;
}
/*# sourceMappingURL=main.css.map */
