:host,
:root,
html,
::after,
::before {
    --primary-color: #0075FF;
    --primary-font-color: #ffffff;
    --secondary-color: #FF5656;
    --secondary-font-color: #ffffff;
    ---secondary-color: #FF565644;
    --a-hover-color: #FF5656;
    --heading-color: #2c3e50;
    --descprition-color: #6e7da3;
    --deaf-font-color: #8894ad;
    --deaf-font-color-600: #8894ad1f;
    --deaf-font-color-400: #8894ad44;
    --label-font-color: #151e42;
    --input-font-color-700: #6d7ca3;
    --input-font-color-500: #6d7ca388;
    ---input-font-color-500: #484f5f;
    --input-border-color: #d4dcff;
    --faded-font-color: #525c84;
    --primary-disabled: #0075ff22;
    --primary-border-color: #e5edf9;
    --primary-border-color-600: #e5edf966;
    ---primary-border-color: #eaeef7;
    --grid-text-color: #424857;
    ---grid-text-color: #838eaa;
    --overlay-color: #000000;
    --stats-bg-color: #fcfdfe;
    --stars-color: #d1e4fa;
    --dashboard-secondary-bg-color: #f5f9fd;
    --black-700: #000000;
    --white-700: #ffffff;
    --white-500: #FFFFFFDE;
    --white-200: #ffffff22;
    --orange-700: #f8b849;
    --purple-700: #4339f2;
    --red-700: #fb295b;
    --green-700: #34b53a;
    --green-500: #5dc461;
    --grey-700: #808080;
    --cyan-700: #28F8C0;
    --golden-700: #FFBB00;
    --input-radius: 10px;
    --border-radius-lg: 20px;
    --border-radius: 12px;
    --border-radius-md: 16px;
    --border-radius-xs: 4px;
    --primary-font: sans-serif;
    --icons-font: "Font Awesome 6 Free", emoji;
    --transition: 300ms;
    --overlay-opacity: 0.6;

    /* Icons Variables */
    --chevron-down-icon-code: "\f078";
    --heart-filled-icon-code: "\f004";
    --star-filled-icon-code: "\f005";
    --square-icon-code: "\f0c8";
    --check-icon-code: "\f00c";
    --circle-icon-code: "\f111";
    --close-icon-code: "\f00d";
    --marker-icon-code: "\f3c5";
    --search-icon-code: "\f002";
    --remove-heart-icon-code: "\e4ff";
    --loading-icon: "\f110";
}

/**
 * Default CSS Start
 *
 * This CSS Will Be Overwrite With Dynamic CSS
 */
body {
    font-size: 13px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(---grid-text-color);
    margin: 0 0 0 0;
}

h1 {
    font-size: 24px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

h2 {
    font-size: 22px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

h3 {
    font-size: 20px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

h4 {
    font-size: 18px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

h5 {
    font-size: 16px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

h6 {
    font-size: 14px;
    line-height: 1.5em;
    font-weight: 700;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

p {
    font-size: 13px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(---grid-text-color);
    margin: 0 0 0 0;
}

label {
    font-size: 13px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(--heading-color);
    margin: 0 0 0 0;
}

a,

.post-page-numbers {
    color: var(--primary-color);
}

a:hover,
a:focus, {
    color: var(--a-hover-color);
}

.p-sm {
    font-size: 11px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(---grid-text-color);
    margin: 0 0 0 0;
}

.p-md {
    font-size: 12px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(---grid-text-color);
    margin: 0 0 0 0;
}

.p-lg {
    font-size: 14px;
    line-height: 1.5em;
    font-weight: 400;
    font-family: var(--bs-body-font-family);
    color: var(---grid-text-color);
    margin: 0 0 0 0;
}
.single-tour-mian h1 {
    font-size: 52px;
    font-weight: 800;
    color: #060077;
    margin-bottom: 15px;
    font-family: 'Inter';
}
.tour-gallery-images img {
    height: 550px !important;
    border-radius: 23px;
    object-fit: cover;
}
.tour-gallery-images .slick-dots {
    display: flex;
    list-style: none;
    background-color: #fff;
    width: max-content;
    margin: auto;
    margin-top: -38px;
    z-index: 999;
    position: relative;
    gap: 7px;
    padding: 6px 18px 15px 18px;
    border-radius: 20px 20px 0 0;
    min-width: 343px;
    justify-content: center;
}
.tour-gallery-images .slick-dots button {
    color: #fff0;
    font-size: 0;
    width: 8px;
    height: 8px;
    border: unset;
    background-color: #00000087;
    border-radius: 50%;
}
.tour-gallery-images .slick-dots .slick-active button {
    background-color: #000;
}
.tour-gallery-images {
    margin-bottom: 40px;
}
.tour-details-content p {
    font-size: 14px;
    color: #000000;
    font-family: 'Inter';
    line-height: 1.6em;
    margin: 0 0 14px 0;
}
.tour-details-content {
    margin-bottom: 40px;
}
.tour-headings {
    font-size: 28px;
    color: #020b7c;
    font-family: 'Inter';
    margin-bottom: 28px;
    text-transform: capitalize;
}
.tour-inclusions-list {
    border-bottom: 1px solid #060077;
    padding-bottom: 40px;
    margin-bottom: 40px;
}
.tour-inclusions-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.tour-inclusions-list ul li {
    width: calc(100% / 2 - 13px);
}
.tour-inclusions-list ul li {
    font-size: 14px;
    width: calc(100% / 2 - 13px);
    color: #000000;
    font-family: 'Inter';
    display: flex;
    align-items: center;
    gap: 10px;
}
.tour-inclusions-list ul i {
    color: #060077;
    font-size: 16px;
}
.tour-single-timings-tabs {
    margin-bottom: 40px;
    box-shadow: 0 4px 50px 7px #00000017;
    border-radius: 25px;
    padding: 40px;
    display: flex;
}
.tour-single-timings-tabs .tour-single-timings-tabs-content {
    width: calc(100% / 2);
}
.tour-single-timings-tabs .tour-single-timings-tabs-content h6 {
    font-weight: 400;
    line-height: 1.6em;
    font-family: 'Inter';
}
.tour-single-timings-tabs .tour-single-timings-tabs-content .tour-headings {
    margin-bottom: 12px;
}
.tour-single-timings-tabs-content.left-border {
    border-left: 1px solid #ddd;
}
.single-tour-mian {
    padding: 50px 0;
}
.sidebar-top-content {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    justify-content: space-between;
}
.sidebar-top-content p {
    font-size: 12px;
    color: #000;
    font-weight: 700;
    font-family: 'Inter';
}
.sidebar-top-content h5 {
    font-size: 11px;
    color: #000;
    font-weight: 700;
    font-family: 'Inter';
}
.sidebar-top-content h5 a {
    color: #000;
    text-decoration: unset;
}
.tour-sidebar-data {
    margin-top: 57px;
}

.sidebar-main-content {
    box-shadow: 0 4px 50px 7px #00000017;
    border-radius: 25px;
    padding: 25px;
}

.sidebar-main-content .sidebar-title{
    font-size: 28px;
    color: #020b7c;
    font-family: 'Inter';
    margin-bottom: 28px;
    text-transform: capitalize;
}
.sidebar-main-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
}
.sidebar-main-content ul li {
    width: 100%;
    display: flex;
    font-size: 14px;
    color: #000000;
    font-family: 'Inter';
    line-height: 1.6em;
    margin: 0 0 14px 0;
    gap: 15px;
}
.sidebar-main-content ul li img {
    width: 21px;
    height: auto;
    object-fit: contain;
}