body {
    overflow-x: hidden;
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    background: url(../images/tactile_noise.jpg);
}




[class^=swiper-button-] {
    transition: all 0.3s ease;
}

.swiper-slide {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
}

.contents h1 {
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
}

.para-content p {
    font-size: 28px;
    font-style: italic;
    line-height: 40px;
}

.fullscreen-active #closeBtnModalCalendarInner {
    display: none;
}


@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

.animate__zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn
}

/* Modal Popup Styles */
.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    background: rgba(24, 24, 27, 0.98);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    opacity: 0;
    pointer-events: none;
}

.modal-overlay.zoom-in {
    -webkit-animation: zoomIn 0.5s ease forwards;
    animation: zoomIn 0.5s ease forwards;
}

@-webkit-keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }

    to {
        opacity: 0
    }
}

@keyframes zoomOut {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0;
        -webkit-transform: scale3d(.3, .3, .3);
        transform: scale3d(.3, .3, .3)
    }

    to {
        opacity: 0
    }
}


.modal-overlay.zoom-out {
    -webkit-animation-name: zoomOut;
    animation-name: zoomOut
}


.modal-overlay.show {
    display: flex;
    transform: scale(1);
    /* Animate to normal size */
    opacity: 1;
    pointer-events: auto;
}

.modal-overlay.active {
    display: flex;
}

.modal-content {
    position: relative;
    width: 80vw;
    width: 100vw;
    height: 100vh;
    background-color: transparent !important;
    max-height: 100vh;
    background-color: transparent !important;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 50%;
    transform: translateY(-50%);
}

.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 28px;
    color: #fff;
    background: rgba(0, 0, 0, 0.6);
    padding: 4px 10px;
    cursor: pointer;
    z-index: 10;
}

/* Modal Popup Styles */




/* swiper css */

.gallery-thumbs {
    margin-top: 15px;
    height: 55px !important;
}

.gallery-thumbs .swiper-slide {
    width: auto !important;
    height: 100%;
    opacity: 0.4;
    cursor: pointer;
}

.gallery-thumbs .swiper-slide-active {
    opacity: 1;
    border: 2px solid #007bff;
}

.gallery-thumbs .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
}





#modalCalendarInner .swiper-slide .swiper-zoom-container img {
    max-width: 100%;
    max-height: 85%;
    object-fit: contain;
}

#modalCalendarInner .swiper-slide img {
    height: 100%;
    width: auto;
    backface-visibility: hidden;
    /*  transform: rotateX(0deg); */
    transition: transform 0.6s ease-in-out;
}

#modalCalendarInner .swiper-slide.swiper-slide-prev img {
    /*  transform: rotateX(-180deg); */
}

#modalCalendarInner .swiper-slide.swiper-slide-next img {
    /*   transform: rotateX(180deg); */
}

#swiperContainerModalCalendarInner {
    width: 100vw;
    height: 100vh;
}



/* swiper css */
.toolbar-absolute {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    justify-content: end;
    margin: 0;
    padding: 0;
    pointer-events: none;
    z-index: 20;
}

.toolbar-right {
    display: flex;
    justify-content: flex-end;
    flex-wrap: nowrap;
}

.is-swiper-button-prev,
.is-swiper-button-next {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: content-box;
    margin: 0;
    padding: 0;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: none;
    color: #374151;
    background: rgba(24, 24, 27, 0.65);
    background: transparent;
    box-shadow: none;
    pointer-events: all;
    cursor: pointer;
    transition: all 0.15s ease;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
    z-index: 1;
    cursor: pointer;
    right: 1rem;
}

.is-swiper-button-prev {
    left: 1rem;
}

.is-swiper-button-prev svg,
.is-swiper-button-next svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: #dbdbdb;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: opacity .15s ease;
    transform: none;
    filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.15));
    pointer-events: none;
}

.is-swiper-button-prev.swiper-button-disabled,
.is-swiper-button-next.swiper-button-disabled {
    opacity: .2;
}

.swiper-calendar-toolbar {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: content-box;
    position: relative;
    margin: 0;
    padding: 0;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: none;
    color: #374151;
    background: rgba(24, 24, 27, 0.65);
    background: transparent;
    box-shadow: none;
    pointer-events: all;
    cursor: pointer;
    transition: all 0.15s ease;
}

.swiper-calendar-toolbar:hover {
    color: #ffffff;
    background-color: rgba(70, 70, 73, 0.65);
}

.swiper-calendar-toolbar svg {
    width: 24px;
    height: 24px;
    fill: none;
    stroke: #dbdbdb;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    transition: opacity .15s ease;
    transform: none;
    filter: drop-shadow(1px 1px 1px rgba(24, 24, 27, 0.15));
    pointer-events: none;
}


.menu-text {
    position: absolute;
    height: 100%;
    left: -35px;
    top: 0;
    z-index: 9;
    width: 223px;
    text-align: center;
}

.menu-text .text {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 100%;
    text-align: center;
}

.menu-text .text h2 {
    writing-mode: vertical-rl;
    font-size: 162px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    opacity: .05;
    color: #fff;
    margin: 42px;
}

/* new menu */

.offcanvas .abstract {
    background: url(../images/abstract-1.png);
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    z-index: -1;
}

.offcanvas-wrapper {
    position: fixed;
    top: 21%;
    right: 3%;
    z-index: 2;
}

.offcanvas-wrapper .offcanvas {
    background-color: #000;
    transition-property: transform, rotate;
}

.offcanvas-wrapper .offcanvas .offcanvas-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 35vw;
    min-width: 25vw;
    height: 100%;
    padding: 92px 70px;
    padding: 92px 20px;
}

.offcanvas-wrapper .offcanvas.show:not(.hiding),
.offcanvas-wrapper .offcanvas.showing {
    transform: translate(0, 0) rotate(0.001deg);
}

.offcanvas-wrapper .offcanvas.offcanvas-end {
    width: auto;
    border: none;
    transform: translate(calc(100% + 6vw), 0) rotate(0.001deg);
}

.offcanvas-wrapper .offcanvas {
    background-color: var(--primary-t-color);
    transition-property: transform, rotate;
}


.offcanvas.hiding,
.offcanvas.show,
.offcanvas.showing {
    visibility: visible;
}




.White-bg {
    background: url(../images/grey-background.jpg) no-repeat center;
    background-size: cover;
}

.White-bg .contents h1,
.White-bg .para-content p {
    color: #363636;
}

.White-bg .footer span {
    color: #303030;
}

.White-bg .menu-item {
    background-image: linear-gradient(to right, #3a9497 45%, #363636 55%);
}

.White-bg .menu-item::before {
    filter: invert(1);
}

.White-bg .footer span a {
    color: #363636;
}

.White-bg .footer span:hover a {
    color: #3a9497;
}


.White-bg .panorama-slider .swiper-pagination {
    bottom: -10px;
    --swiper-pagination-bullet-inactive-color: #040404;
    --swiper-pagination-color: #424242;
}

.White-bg .logo-wrapper {
    background: rgb(0 0 0 / 12%);
}

.White-bg .logo-wrapper::before {
    background: rgb(0 0 0 / 12%);
}



/* body:before {
    overflow-x: hidden;
    position: relative;
} */

*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.main-slider:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 46%);
    top: 0;
    left: 0;
    z-index: 1;
}

.main-slider.remove-overly:after {
    background: none;
}

/* .main-slider .slide-bgimg {
  transition: transform 0.8s ease;
  transform-origin: center center;
} */


.swiper-container {
    width: 100%;
    height: 100vh;
    float: left;
    transition: opacity 0.6s ease, transform 0.3s ease;
}

.swiper-container.nav-slider {
    /* width: 1345px; */
    width: 100%;
    padding-left: 5px;
    position: absolute;
    z-index: 9999999999;
    top: auto;
    right: 0;
    height: 334px;
    /* bottom: 140px; */
}

.right-slider-cont {
    width: 70%;
    width: 1344px;
    width: 1450px;
    position: absolute;
    z-index: 999;
    top: auto;
    right: -250px;
    height: 470px;
    bottom: 0;
}

.show-hide-wrapper {
    transition: transform 0.6s cubic-bezier(0.65, 0, 0.35, 1), opacity 0.6s ease;
    transform-origin: right center;
    transform: scaleX(1) translateX(0);
    opacity: 1;
    pointer-events: auto;
}

.show-hide-wrapper.hide-wrapper {
    transform: scaleX(0) translateX(100%);
    opacity: 0;
    /* pointer-events: none; */
}

.right-slider-cont .swiper-slide.swiper-slide-active .cal-sm-thumb-wrapper {
    position: absolute;
    top: 3.2px;
    left: 3.3px;
    width: 98%;
    height: 98%;
    background-position: center;
    background-size: cover;
    border-radius: 10px;
    overflow: hidden;
}

.right-slider-cont .swiper-container.nav-slider .swiper-slide.swiper-slide-active {
    opacity: 1;
    /* background-color: #797979; */
    background-color: #dbdbdb;

}


.swiper-container.nav-slider .swiper-slide {
    cursor: pointer;
    transition: opacity 0.3s ease;
    /* opacity: 0.4; */
}

.swiper-container.nav-slider .swiper-slide.swiper-slide-active {
    opacity: 1;
}

.swiper-container.nav-slider .swiper-slide .content {
    width: 100%;
    padding: 25px;
    top: auto;
    bottom: 0;
    height: 100%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}

.year-value {
    text-align: left;
    font-size: 27px;
    font-size: 24px;
    line-height: 45px;
    margin-bottom: 0;
    font-weight: 500;
    color: #9a9a9a;
}

.main-navigation .swiper-button-prev,
.main-navigation .swiper-button-next {
    z-index: 60;
    width: 50px;
    height: 50px;
    border-radius: 999px;
    border: 2px solid #ffffff;
    display: grid;
    place-items: center;
    place-items: center;
    background-size: 12px;
    transition: all .3s ease;
}

.main-navigation .swiper-button-prev::after,
.main-navigation .swiper-button-next::after {
    position: absolute;
    content: "";
    top: 2px;
    right: 2px;
    bottom: 2px;
    left: 2px;
    background: #ffffff;
    border-radius: 50%;
    transform-origin: 50% 50%;
    transform: scale(0);
    transition: all .35s;
    z-index: -1;
}

.main-navigation .swiper-button-prev:hover:after,
.main-navigation .swiper-button-next:hover:after {
    transform: scale(1);
}


.main-navigation .swiper-button-next {
    margin-left: 20px;
    right: 25px;
}

.swiper-container.nav-slider .swiper-slide .content .title {
    font-size: 32px;
    line-height: 41px;
    font-weight: 500;
    letter-spacing: .5px;
    margin-bottom: 0;
    position: relative;
    /* width: 80%; */
    transition: color 0.3s ease;
}

.swiper-container.nav-slider .swiper-slide .content:hover .title {
    color: #00f7ff;
}

.swiper-container.nav-slider .swiper-slide .content .title:before {
    content: '';
    position: absolute;
    background: #ffffff;
    left: 0;
    top: -10px;
    width: 50px;
    height: 3px;
    transition: width 0.4s ease, background-color 0.4s ease;
}

.swiper-container.nav-slider .swiper-slide .content:hover .title:before {
    width: 60%;
    background-color: #00f7ff;
}


.swiper-container.nav-slider .swiper-slide .content .title span {
    display: block;
}

.swiper-container.nav-slider .swiper-slide .content .lower-title:before {
    display: none;
}


/* .swiper-container:hover .swiper-button-prev,
.swiper-container:hover .swiper-button-next {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
} */

/* .swiper-container.loading {
    opacity: 0;
    visibility: hidden;
} */

.swiper-slide {
    /* overflow: hidden; */
    position: relative;
}

.swiper-slide .slide-bgimg {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    /* height: 100%; */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.swiper-slide .slide-bgimg {
    background-image: none !important;
}

.nav-slider .slide-bgimg {
    border-radius: 10px;
}

.glow-content {
    padding: 2px;

}


.swiper-slide .slide-bgimg {
    /* transform: scale(1);
    transition: .3s ease-in-out; */
    overflow: hidden;
}

.swiper-slide .slide-bgimg img {
    transform: scale(1);
    transition: .3s ease-in-out;
}


.swiper-slide:hover .slide-bgimg img {
    -webkit-transform: scale(1.03);
    transform: scale(1.03);
}

.swiper-container.nav-slider .swiper-slide {
    border-radius: 10px;
}


/* .nav-slider .swiper-slide-active .slide-bgimg {
    border: 2px solid #cbcbcb;  
}  */

.nav-slider .swiper-slide-active .slide-bgimg {
    /* animation: move 5s linear infinite;
  offset-path: rect(0% auto 100% auto);
  background: radial-gradient(#fff, #f1f5f9, transparent); */
}


.nav-slider .swiper-slide-active .glow {
    animation: move 5s linear infinite;
    offset-path: rect(0% auto 100% auto);
    /* background: radial-gradient(#fff, #f1f5f9, transparent); */
    background: radial-gradient(#ffbf3d, #ec9917, transparent);
    position: absolute;
    width: 235px;
    height: 235px;
    transform: rotate(45deg);
}

@keyframes move {
    0% {
        offset-distance: 0%;
    }

    100% {
        offset-distance: 100%;
    }
}

.nav-slider .swiper-slide {
    box-shadow: 2px 6px 10px 2px rgb(0 0 0 / 85%);
}

/* .nav-slider .swiper-slide .slide-bgimg {
    min-width: 431px;
} */

.swiper-slide .entity-img {
    /* display: none; */
    width: 100%;
    /*  height: 100%; */
}

.swiper-slide .content {
    position: absolute;
    /* top: 10%; */
    bottom: -32px;
    left: 0;
    width: 100%;
    /* padding-left: 5%; */
    color: #fff;
    display: flex;
    justify-content: center;
}

.swiper-slide .content .title {
    font-size: 2.6em;
    font-weight: bold;
    margin-bottom: 30px;
}

.swiper-slide .content .caption {
    display: block;
    font-size: 13px;
    line-height: 1.4;
    transform: translateX(50px);
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.7s ease;
}

.swiper-slide .content .caption.show {
    transform: translateX(0);
    opacity: 1;
}

.main-navigation {
    position: absolute;
    bottom: 0;
    z-index: 9;
    width: 147px;
    height: 60px;
    left: 0;
}

.right-controller-cont {
    width: 57.2%;
    width: 1099px;
    width: 1204px;
    position: absolute;
    z-index: 999;
    top: auto;
    right: 0;
    height: 60px;
    bottom: 40px;
}

.right-controller-cont .swiper-button-prev.swiper-button-white,
.right-controller-cont .swiper-button-next.swiper-button-white {
    background-image: none;
}

.right-controller-cont .swiper-button-prev svg,
.right-controller-cont .swiper-button-next svg {
    fill: #fff;
    width: 70%;
    height: 70%;
    position: relative;
}

.right-controller-cont .swiper-button-prev svg {
    transform: rotate(180deg);
}

.right-controller-cont .swiper-button-prev:hover svg,
.right-controller-cont .swiper-button-next:hover svg {
    fill: #189a9e;
}

/* [class^=swiper-button-] {
    width: 44px;
    opacity: 0;
    visibility: hidden;
} */

/* .swiper-button-prev {
    transform: translateX(50px);
}

.swiper-button-next {
    transform: translateX(-50px);
} */
.logo-wrapper {
    display: block;
    position: fixed;
    z-index: 0;
    background: rgb(255 255 255 / 15%);
    background: transparent;
    padding: 25px;
    padding: 0px 0px;
    left: 30px;
    height: 60px;
    width: 65px;
    position: fixed;
}

/* .logo-wrapper::before {
    position: absolute;
    left: 0;
    content: "";
    z-index: -1;
    margin-top: -3px;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    background-color: #fff;
    height: 41px;
    bottom: -18px;
    width: 65px;
    height: 18px;
} */

.logo-wrapper img {
    position: absolute;
    width: 65px;
    width: 55px;
    left: 30px;
    top: 10px;
    top: 15px;
    transform: translate(-50%);
    z-index: 9999;
}

.custom-swiper-content {
    /* position: absolute;
    top: 20%;
    left: 50%;
    transform: translateX(-50%); */
    /* z-index: 1; */
    text-align: center;
}

.contents h1 {
    color: #fff;
    /* font-family: "Oswald", sans-serif; */
    font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
    font-weight: 500;
    font-size: 62px;
    line-height: 80px;
    font-size: 90px;
    font-size: 100px;
    letter-spacing: 4px;
    position: relative;
}

.contents span {
    display: block;
}

.para-content {
    max-width: 47%;
    margin: 20px auto 0;
}



.para-content p {
    font-size: 30px;
    color: #fff;
    font-weight: 400;
    line-height: 40px;
    margin-bottom: 0;
}

.footer {
    position: fixed;
    z-index: 0;
    bottom: 15px;
    left: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 0 30px;
}

.footer span a:hover {
    color: #00f7ff;
}

/* .contents h1::before {
    content: '';
    position: absolute;
    background: #ffffff;
    left: 0;
    top: -10px;
    width: 30px;
    height: 3px;
} */

.footer span {
    /* color: #eaeae8;
    font-size: 15px; */
    color: #696969;
    font-size: 12px;
    line-height: 26px;
}

.footer span a {
    color: #696969;
    text-decoration: none;
}

.progress-count {
    display: flex;
    align-items: center;
    position: absolute;
    /* bottom: -24px; */
    bottom: 0;
    left: 230px;
    width: 65%;
    left: 210px;
    width: 73%;
    display: none;
}

.progress-line {
    width: 100%;
    height: 2px;
    background-color: #dbeaf0;
    /* position: absolute;
    bottom: 20px;
    left: 230px; */
}

.number-count {
    margin-left: 20px;
    display: none;
}

.number-count span {
    font-size: 60px;
    color: #fff;
    line-height: 50px;
    font-family: "Oswald", sans-serif;
    font-weight: 500;
}


#flipbook .page {
    width: 100%;
    height: 100%;
    background: white;
    border: 1px solid #ccc;
    line-height: 600px;
    text-align: center;
    font-size: 24px;
}

#flipbook-container {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 99999999999;
}

#dynamic-flipbook {
    width: 100% !important;
    height: 100% !important;
}

/* .ti-sharethis,
.ti-download,
.ti-file {
    display: none !important;
} */

#flipbook-close {
    position: absolute;
    top: 20px;
    right: 30px;
    font-size: 30px;
    fill: #fff;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 10000;
}

.df-bg {
    background-color: transparent !important;
}

#flipbook-close:hover {
    fill: #217d2d;
}

.df-ui .df-ui-page label {
    padding: 0;
}

.datetime .time {
    display: inline-block;
    width: 23px;
    text-align: center;
}

.df-ui-btn.df-ui-share.df-icon-share,
.df-ui-btn.df-ui-pagemode.df-icon-file,
.df-ui-btn.df-ui-download.df-icon-download {
    display: none !important;
}

@keyframes arrowss {
    0% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
        transform: translate(-5.33333px, -10.33333px) rotate(-45deg);
    }

    10%,
    90% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
    }

    50% {
        border-left: 3px solid #ffffff;
        border-bottom: 3px solid #ffffff;
        transform: translate(-5.33333px, 0px) rotate(-45deg);
    }

    100% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
        transform: translate(-5.33333px, 10.33333px) rotate(-45deg);
    }
}

.content .title {
    opacity: 0;
}

.number-cont {
    overflow: hidden;
    line-height: 1;
}

/* .number-cont p {
    display: block;
    animation: reveal 1.5s cubic-bezier(0.77, 0, 0.175, 1) 0.5s;
}

@keyframes reveal {
    0% {
        transform: translate(0, 100%);
    }

    100% {
        transform: translate(0, 0);
    }
} */

.right-side-btns {
    position: fixed;
    z-index: 10;
    right: 0;
    top: 37%;
    display: none;
}

.explore-more-wrapper {
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgb(255 255 255 / 15%);
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    cursor: pointer;
}

.explore-more-wrapper img {
    width: 25px;
}

.explore-more-wrapper:hover img {
    -webkit-animation-name: hvr-icon-buzz-out;
    animation-name: hvr-icon-buzz-out;
    -webkit-animation-duration: 0.75s;
    animation-duration: 0.75s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
}

@keyframes hvr-icon-buzz-out {

    10% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    20% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    30% {
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }

    40% {
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }

    50% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    60% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    70% {
        -webkit-transform: translateX(2px) rotate(1deg);
        transform: translateX(2px) rotate(1deg);
    }

    80% {
        -webkit-transform: translateX(-2px) rotate(-1deg);
        transform: translateX(-2px) rotate(-1deg);
    }

    90% {
        -webkit-transform: translateX(1px) rotate(0);
        transform: translateX(1px) rotate(0);
    }

    100% {
        -webkit-transform: translateX(-1px) rotate(0);
        transform: translateX(-1px) rotate(0);
    }
}

.expanded-container {
    position: fixed;
    width: 30%;
    height: 100vh;
    background-color: #fff;
    z-index: 999999999;
    top: 0;
    right: -100%;
    transition: transform 0.3s ease-in-out;
    background-color: #030712 !important;
    box-shadow: 2px 6px 10px 2px rgb(0 0 0 / 73%);
    padding: 0;
}

.expanded-container.show {
    right: 0;
}

.top-cont {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px dashed #535353;
}

.top-cont h2 {
    font-size: 30px;
    color: #fff;
    margin-bottom: 0;
}

.close-btn-menu {
    background: transparent;
    outline: none;
    border: 0;
    width: 27px;
    height: 27px;
}

.close-btn-menu img {
    width: 100%;
}

.inner-detail-box img {
    width: 100%;
    transform: scale(1);
    transition: .3s ease-in-out;
    display: block;
}

.inner-detail-box:hover img {
    transform: scale(1.1);
}

.inner-detail-box {
    border-radius: 7px;
    overflow: hidden;
    margin-top: 20px;
    border: 1px solid #3f3f3f;
    position: relative;
}

.inner-detail-box::before {
    width: 100%;
    height: 40%;
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    background: linear-gradient(rgb(62 62 53 / 0%) 0%, rgb(0 0 0 / 88%) 100%);
    z-index: 1;
}


/* #zoom-image.active {
	color: #ff0;
	transform: scale(1.2);
} */

.zoom-active #play-pause,
.zoom-active #fullscreenBtn,
.zoom-active #closeBtnModalCalendarInner {
    pointer-events: none;
}

.detail-cont .row .col-xl-4:nth-child(1) .inner-detail-box,
.detail-cont .row .col-xl-4:nth-child(2) .inner-detail-box,
.detail-cont .row .col-xl-4:nth-child(3) .inner-detail-box {
    margin-top: 0;
}

.cal-year {
    font-size: 28px;
    line-height: 30px;
    color: #fff;
    position: absolute;
    right: 15px;
    top: 12px;
}

.inner-detail-box:hover .cal-year {
    -webkit-animation-name: hvr-bob-float, hvr-bob;
    animation-name: hvr-bob-float, hvr-bob;
    -webkit-animation-duration: .3s, 1.5s;
    animation-duration: .3s, 1.5s;
    -webkit-animation-delay: 0s, .3s;
    animation-delay: 0s, .3s;
    -webkit-animation-timing-function: ease-out, ease-in-out;
    animation-timing-function: ease-out, ease-in-out;
    -webkit-animation-iteration-count: 1, infinite;
    animation-iteration-count: 1, infinite;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-direction: normal, alternate;
    animation-direction: normal, alternate;
}

@keyframes hvr-bob-float {
    100% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}

@keyframes hvr-bob {
    0% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }

    50% {
        -webkit-transform: translateY(-4px);
        transform: translateY(-4px);
    }

    100% {
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}

.detail-cont {
    overflow-y: auto;
    /* height: 93%; */
    padding-bottom: 5px;
    scroll-behavior: smooth;
    padding-right: 7px;
    overflow-x: hidden;
    height: calc(100vh - 120px);
}

.detail-cont::-webkit-scrollbar {
    width: 6px;
    /* thin scrollbar */
}

.detail-cont::-webkit-scrollbar-track {
    background: #1e1e1e;
    /* track color */
    border-radius: 3px;
}

.detail-cont::-webkit-scrollbar-thumb {
    background-color: #888;
    /* thumb color */
    border-radius: 3px;
}

.detail-cont::-webkit-scrollbar-thumb:hover {
    background-color: #aaa;
    /* thumb color on hover */
}

.show-hide-btn {
    height: 50px;
    width: 50px;
    background: rgb(255 255 255 / 15%);
    /* position: absolute;
    right: 0;
    top: 50%; */
    /* transform: translateY(-50%); */
    opacity: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-top: 10px;
    /* z-index: 9; */
}

.arr-ows {
    transform: rotate(270deg);
}

.arr-ows.rotate {
    transform: rotate(90deg);
}

.arr-ows:before {
    content: '';
    position: absolute;
    width: 13px;
    height: 13px;
    border-left: 3px solid #ffffff;
    border-bottom: 3px solid #ffffff;
    transform: translate(3px, 106.66667px) rotate(-45deg);
    animation: arrowss 1.5s linear infinite;
    margin-top: -8px;
}

.arr-ows:after {
    content: '';
    position: absolute;
    width: 13px;
    height: 13px;
    border-left: 3px solid #ffffff;
    border-bottom: 3px solid #ffffff;
    transform: translate(3px, 0px) rotate(-45deg);
    animation: arrowss 1.5s linear infinite -0.75s;
    margin-top: -8px;
}


@keyframes arrowss {
    0% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
        transform: translate(-5.33333px, -10.33333px) rotate(-45deg);
    }

    10%,
    90% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
    }

    50% {
        border-left: 3px solid #ffffff;
        border-bottom: 3px solid #ffffff;
        transform: translate(-5.33333px, 0px) rotate(-45deg);
    }

    100% {
        border-left: 3px solid transparent;
        border-bottom: 3px solid transparent;
        transform: translate(-5.33333px, 10.33333px) rotate(-45deg);
    }
}

.inner-detail-caption {
    margin-bottom: 0;
    /* color: #fff; */
    position: absolute;
    bottom: 13px;
    left: 13px;
    font-size: 25px;
    line-height: 32px;
    /* width: 80%; */
    z-index: 2;
    min-height: 62px;
    background-image: linear-gradient(to right, #00f7ff 45%, #ffffff 55%);
    background-size: 220% 100%;
    background-position: 100% 50%;
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    background-repeat: no-repeat;
    transition: 0.5s ease-out;
}

.inner-detail-caption span {
    display: block;
}

.inner-detail-box:hover .inner-detail-caption {
    background-position: 0% 50%;
}

.page-level-search {
    position: relative;
}

.page-level-search .search-input {
    width: 100%;
    padding: 15px 12px;
    border: 1px solid #494949;
    border-radius: 5px;
    font-size: 16px;
    padding-right: 60px;
    height: 50px !important;
    margin-bottom: 20px;
    background: transparent;
    color: #fff;
}

.page-level-search .search-input.form-control:focus {
    box-shadow: none;
}

.page-level-search .search-input::placeholder {
    color: #ffffff;
    opacity: 1;
}

.page-level-search .search-submit {
    position: absolute;
    right: 0;
    top: 0;
    /* transform: translateY(-50%); */
    /* padding: 5px 10px; */
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #defeff url(../images/search.png) no-repeat center;
    width: 45px;
    height: 100%;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.main-slider .swiper-slide {
    transition: none !important;
}


.new {
    color: #fff;
    font-size: 270px;
}


/* new css*/

.top-cont h2 {
    font-size: 40px;
    font-weight: 600;
}

.detail-cont ul {
    list-style: none;
    padding-left: 0;
}

.detail-cont ul li {
    font-size: 25px;
    font-weight: 600;
}

.panorama-slider .swiper-pagination {
    bottom: -30px;
    bottom: -70px;
}

.calendar-contents-wrapper {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    z-index: 0;
}

.slider-contents {
    position: relative;
    /* bottom: -25px; */
}


.top-menu {
    position: fixed;
    right: 92px;
    top: 25px;
    z-index: 1;
}

.top-menu img {
    width: 23px;
}

.menu-item {
    /* color: #fff; */
    font-weight: 600;
    font-size: 16px;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    text-decoration: none;
    background-image: linear-gradient(to right, #00f7ff 45%, #ffffff 55%);
    background-size: 220% 100%;
    background-position: 100% 50%;
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    background-repeat: no-repeat;
    transition: 0.5s ease-out;
}

.menu-item:hover {
    background-position: 0% 50%;
}

.top-menu .menu-item:first-child {
    padding-left: 0;
}

a:hover {
    color: transparent;
}

/* .menu-item::before {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background-image: url(../images/about.svg);
    background-repeat: no-repeat;
    background-size: cover;
} */

.panorama-slider {
    /*  padding: 80px 0;
    padding: 65px 0 35px; */
    position: relative;
    overflow: hidden;
    /* margin: 0 30px; */
}

.calendar-book img {
    width: 27px;
}

.calendar-book {
    position: absolute;
    top: 40px;
    top: 18px;
    right: 15px;
    display: flex;
    align-items: center;
}

.icon-bg {
    background: #707070a1;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    justify-content: center;
    margin-left: 8px;
    cursor: pointer;
    z-index: 9999;
}

.panorama-slider .swiper-slide {
    /*  margin: 0 10px; */
}

.panorama-slider .swiper {
    width: 100%;
    /*  height: 390px; */
}

/* .swiper-slide {
  transform: perspective(1000px) rotateY(0deg) translateZ(0) scale(1) !important;
} */

/* .swiper-slide {
  transform: rotateY(5deg) !important;
} */

/* .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: transparent;
  border: 1px solid rgb(255, 255, 255);
  opacity: 1;
  border-radius: 50%;
  transition: all 0.4s ease;
  margin: 0 4px;
  flex-shrink: 0;
}

.swiper-pagination-bullet-active {
  width: 40px !important;
  border-radius: 5px;
  background: pink;
  border: 1px solid transparent;
} */

/* new css */

@media (max-width: 1600px) {

    .select-menu .select-btn {
        padding: 8px 20px !important;
        font-size: 9px !important;
    }




    .panorama-slider .swiper {
        /*  width: 100%;
        height: 360px; */
    }

    .panorama-slider {
        /*  padding: 35px 0; */
    }

    .contents h1 {
        font-size: 75px;
    }

    .para-content p {
        /* font-size: 25px; */
        font-size: 23px !important;
        line-height: 33px !important;
    }

    .right-slider-cont {
        right: -330px;
    }

    .logo-wrapper {
        height: 55px;
        width: 55px;
    }

    .logo-wrapper::before {
        bottom: -12px;
        width: 55px;
        height: 12px;
    }

    .logo-wrapper img {
        width: 48px;
    }

    .right-controller-cont {
        width: 1019px;
    }

    .right-slider-cont .swiper-slide.swiper-slide-active .cal-sm-thumb-wrapper {
        left: 2.7px;
        width: 98.5%;
    }

    .right-slider-cont {
        width: 1345px;
    }

    .explore-more-wrapper {
        width: 40px;
        height: 40px;
    }

    .explore-more-wrapper img {
        width: 20px;
    }

    .show-hide-btn {
        height: 40px;
        width: 40px;
    }

    .arr-ows:after {
        width: 9px;
        height: 9px;
    }

    .arr-ows:before {
        width: 9px;
        height: 9px;
    }

    .right-side-btns {
        top: 26%;
    }

    .main-navigation .swiper-button-prev,
    .main-navigation .swiper-button-next {
        width: 45px;
        height: 45px;
    }

    .main-navigation .swiper-button-next {
        right: 40px;
    }

    .number-count span {
        font-size: 50px;
    }

    .progress-count {
        left: 160px;
        width: 80%;
    }
}

@media (max-width: 1368px) {
    .footer {
        bottom: 10px;
    }

    .year-value {
        font-size: 20px;
    }

    .swiper-slide .content {
        /*  bottom: -43px; */
    }

    .para-content {
        margin: 0px auto 0;
    }

    .slider-contents {
        /*  bottom: 5px; */
    }

    .df-3dcanvas {
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
    }

    .contents h1 {
        font-size: 65px !important;
    }

    .para-content p {
        font-size: 20px !important;
    }

    /* .select-menu .select-btn {
        font-size: 13px !important;
    }

    .select-menu .select-btn {
        padding: 7px 20px !important;
    } */

    .slider-contents {
        /*  top: 45%; */
    }

    .panorama-slider .swiper {
        /*   width: 100%;
        height: 280px; */
    }

    .right-slider-cont {
        right: -448px;
    }

    .right-controller-cont {
        width: 900px;
    }

}

@media (max-width: 991px) {
    .para-content p {
        font-size: 18px !important;
        line-height: 28px !important;
    }

    .panorama-slider .swiper {
        width: 100%;
        height: 255px;
    }

    .panorama-slider .swiper-slide {
        /*margin: 0 30px !important; */
    }

    .para-content {
        max-width: 55%;
    }

    .slider-contents {
        /* top: 40px; */
    }

    .offcanvas-wrapper .offcanvas .offcanvas-content {
        padding: 92px 15px !important;
    }

    .menu .nav-link:not(.btn) {
        font-size: 28px !important;
    }

    .contents h1 {
        font-size: 55px !important;
    }

}

@media (max-width: 767px) {

    /* .contents h1 {
        font-size: 50px !important;
        line-height: 65px;
    } */
    .contents h1 {
        font-size: 40px !important;
        line-height: 60px;
    }

    .para-content {
        max-width: 70%;
    }

    .para-content p {
        font-size: 16px !important;
        line-height: 25px !important;
    }

    .pt-md-4 {
        padding-top: 0.5rem !important;
    }

    .menu .nav-link:not(.btn) {
        font-size: 22px !important;
    }
}

@media (max-height: 600px) {
    .panorama-slider {
        padding: 38px 0;
    }
}

@media (max-width: 575px) {

    .panorama-slider .swiper-slide {
        /*margin: 0 20px !important;*/
    }

    .contents h1 {
        font-size: 34px !important;
        line-height: 35px;
    }

    .para-content {
        max-width: 80%;
    }

    .navbar-toggler {
        top: 1em;
        right: 1em;
    }


    .menu .nav-link:not(.btn) {
        padding: 5px;
        font-size: 28px;
    }

    .offcanvas-wrapper .offcanvas.offcanvas-end {
        width: 100%;
    }


    .para-content p {
        font-size: 13px !important;
        line-height: 25px !important;
    }

}



@media (max-width: 480px) {
    .calendar-book {
        top: 10px;
    }


    .calendar-book img {
        width: 22px;
    }

    .icon-bg {
        width: 40px;
        height: 40px;
    }

    .swiper-slide .entity-img {
        width: 100%;
        /* height: auto; */
    }

    .logo-wrapper img {
        left: 15px;
    }

    .logo-wrapper img {
        width: 40px;
    }

    .navbar-toggler {
        top: 12px !important;
        right: 15px !important;
    }

    .navbar-toggler .navbar-header,
    .navbar-toggler .content {
        width: 40px !important;
        height: 40px !important;
    }

    .para-content {
        margin: 10px auto 0;
    }

    .footer span {
        font-size: 8px;
    }

    .panorama-slider .swiper-slide {
        margin: 0 !important;
    }

    .menu .nav-link:not(.btn) {
        font-size: 18px !important;
    }

    .contents h1 {
        font-size: 28px !important;
        line-height: 30px;
    }
}

@media (max-width: 420px) {
    .contents h1 {
        font-size: 28px !important;
        line-height: 30px;
    }

    .para-content {
        max-width: 94%;
    }
}

@media (max-width: 390px) {
    .contents h1 {
        font-size: 24px !important;
        line-height: 30px;
    }
}

@media (max-width: 360px) {
    .contents h1 {
        font-size: 23px !important;
        line-height: 30px;
    }

    .para-content p {
        font-size: 11px !important;
        line-height: 20px !important;
    }

    .para-content {
        width: 100%;
    }
}

@media (max-width: 320px) {
    .footer span {
        font-size: 7px;
        line-height: 6px;
    }

    .para-content {
        max-width: 100%;
    }

    .para-content p {
        font-size: 10px !important;
        line-height: 20px !important;
    }

    .contents h1 {
        font-size: 20px !important;
        line-height: 25px;
    }

    .panorama-slider {
        padding: 27px 0;
    }

}


.offcanvas-wrapper {
    position: fixed;
    top: 21%;
    right: 3%;
    z-index: 2;
}

.offcanvas-wrapper .offcanvas {
    background-color: #030712;
    transition-property: transform, rotate;
}

.offcanvas-wrapper .offcanvas.offcanvas-end {
    width: auto;
    border: none;
    transform: translate(calc(100% + 6vw), 0) rotate(0.001deg);
}


.offcanvas-wrapper .offcanvas.show:not(.hiding),
.offcanvas-wrapper .offcanvas.showing {
    transform: translate(0, 0) rotate(0.001deg);
}

.offcanvas-wrapper .offcanvas .fixed-nav-rounded-div {
    position: absolute;
    top: 0;
    left: 1px;
    z-index: -1;
    height: 100%;
    transform: translateX(-100%);
}

.offcanvas-wrapper .offcanvas .fixed-nav-rounded-div .rounded-div-wrap {
    width: 6vw;
    height: 100%;
    transition: var(--animation-slow);
    transition: all 0.85s cubic-bezier(0.7, 0, 0.2, 1);
    will-change: width;
}

.offcanvas-wrapper .offcanvas .fixed-nav-rounded-div .rounded-div-wrap .rounded-div {
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    z-index: -1;
    display: block;
    width: 775%;
    height: 150%;
    background: #030712;
    border-radius: 50%;
    transform: translate(-6.5%, -50%);
}

.offcanvas-wrapper .offcanvas.show:not(.hiding) .fixed-nav-rounded-div .rounded-div-wrap,
.offcanvas-wrapper .offcanvas.showing .fixed-nav-rounded-div .rounded-div-wrap {
    width: 0;
}

.offcanvas-wrapper .offcanvas .offcanvas-content {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 35vw;
    height: 100%;
    padding: 92px 70px;
}

@media (max-width: 575px) {
    .offcanvas-wrapper .offcanvas .offcanvas-content {
        padding: 8vh 7.5vw;
    }
}

.offcanvas-wrapper .offcanvas .offcanvas-content .offcanvas-header {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.offcanvas-wrapper .offcanvas .offcanvas-content .offcanvas-title {
    color: #909DAC;
    font-size: 1.5rem;
    font-weight: 500;
}

.offcanvas-wrapper .offcanvas .offcanvas-content .offcanvas-body {
    overflow: hidden;
}

.offcanvas-wrapper .offcanvas .offcanvas-content hr {
    margin: 20px 0;
    border-style: solid;
}

.offcanvas-wrapper .offcanvas .offcanvas-content .socials .nav-link {
    color: var(--white-color);
}

.offcanvas-wrapper .offcanvas .offcanvas-content .socials .nav-link::after {
    background-color: var(--white-color);
}

.navbar-toggler {
    position: fixed;
    top: 10px;
    right: 30px;
    z-index: 9999999999999;
    cursor: pointer;
}

.navbar-toggler .navbar-header,
.navbar-toggler .content {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 45px;
    height: 45px;
    border-radius: 50%;
}

.navbar-toggler .navbar-header {
    border: 0;
    background-color: #454545;
    transition: background-color 0.25s cubic-bezier(0.36, 0, 0.66, 0), box-shadow 0.25s cubic-bezier(0.36, 0, 0.66, 0);
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.2);
    box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.2);
}

.navbar-toggler .navbar-header .content {
    position: relative;
}

.navbar-toggler .navbar-header .content .toggler-icon {
    position: absolute;
    width: 30%;
    height: 10%;
    opacity: 1;
}

.navbar-toggler .navbar-header .content .toggler-icon::before,
.navbar-toggler .navbar-header .content .toggler-icon::after {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    height: 2px;
    width: 100%;
    transform: translate(-50%, -50%) rotate(0.001deg);
    background: #fff;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1);
}

.navbar-toggler .navbar-header .content .toggler-icon::before {
    top: 0;
    transform: translate(-50%, -50%);
}

.navbar-toggler .navbar-header .content .toggler-icon::after {
    top: 100%;
    transform: translate(-50%, -50%);
}

.navbar-toggler .navbar-header .content .title {
    color: var(--white-color);
    opacity: 0;
}

.navbar-toggler.active .navbar-header {
    background-color: #fff;
}

.navbar-toggler.active .navbar-header .content .toggler-icon::before {
    top: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    background: #030712;
}

.navbar-toggler.active .navbar-header .content .toggler-icon::after {
    top: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    background: #030712;
}

.navbar-toggler.scrolled {
    transform: translateY(0%) scale(1) rotate(0.001deg);
    transition: transform 0.4s cubic-bezier(0.34, 1.5, 0.64, 1);
}

.menu .nav-link:not(.btn) {
    font-size: 3rem;
    font-size: 30px;
    font-weight: 500;
    color: #fff;
    display: table-cell;
    padding: 10px 5px;
}

@media (max-width: 575px) {
    .navbar .navbar-toggler {
        position: unset;
        display: block !important;
        padding: 0;
        border: none;
    }

    .navbar .navbar-toggler.scrolled:not(.active) .navbar-header {
        background-color: transparent;
        box-shadow: none;
    }

    .navbar .navbar-toggler:not(.active) .navbar-header .content .toggler-icon {
        visibility: hidden;
    }

    .navbar .navbar-toggler .navbar-header .content .toggler-icon::before,
    .navbar .navbar-toggler .navbar-header .content .toggler-icon::after {
        transition: none;
    }

    .navbar .navbar-toggler.scrolled {
        transform: translateY(0%) scale(1) rotate(0.001deg);
        transition: transform 0.4s cubic-bezier(0.36, 0, 0.66, 0);
    }

    .navbar .navbar-toggler:not(.active) .navbar-header .content .title {
        font-weight: 600;
        color: var(--primary-p-color);
        opacity: 1;
    }
}

.custom-select-wrapper {
    display: flex;
    align-items: center;
}

.group-select {
    margin-right: 20px;
}


.select-menu .select-btn {
    display: flex;
    /* height: 55px; */
    font-weight: 400;
    border-radius: 8px;
    align-items: center;
    cursor: pointer;
    justify-content: space-between;
    border-radius: 50px;
    padding: 8px 20px;
    font-size: 13px;
    background-color: transparent;
    border: 1px solid transparent;
    transition: box-shadow .15s ease-in-out;
    color: #fff;
    width: 200px;
    width: auto;
    border: 0;
    background-color: #454545;
    transition: background-color 0.25s cubic-bezier(0.36, 0, 0.66, 0), box-shadow 0.25s cubic-bezier(0.36, 0, 0.66, 0);
    -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.2);
    box-shadow: inset 0px 0px 0px 1px rgba(255, 255, 255, 0.2);
}

.select-menu .options {
    position: absolute;
    width: 200px;
    width: auto;
    overflow-y: auto;
    /* max-height: 292px; */
    padding: 2px;
    margin-top: 10px;
    border-radius: 8px;
    /* background: #62626269; */
    background: #313030;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    animation-name: fadeInDown;
    -webkit-animation-name: fadeInDown;
    animation-duration: 0.35s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.35s;
    -webkit-animation-fill-mode: both;
    padding: 8px 10px;
}

.select-menu .options .option {
    display: flex;
    height: 34px;
    cursor: pointer;
    border-radius: 8px;
    align-items: center;
    /* background: #4c4c4c; */
    padding: 0 10px;
    margin-top: 5px;
    /* color: #fff; */
}

.select-menu .options .option:hover {
    background: #212121b3;
}

.select-menu .options .option i {
    font-size: 25px;
    margin-right: 12px;
}

.select-menu .options .option .option-text {
    font-size: 13px;
    color: #ffffff;
}

.select-btn i {
    font-size: 25px;
    transition: 0.3s;
}

.select-menu.active .select-btn i {
    transform: rotate(-180deg);
}

.select-menu.active .options {
    display: block;
    opacity: 0;
    z-index: 10;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
    animation-duration: 0.4s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.4s;
    -webkit-animation-fill-mode: both;
}

@keyframes fadeInUp {
    from {
        transform: translate3d(0, 30px, 0);
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

@keyframes fadeInDown {
    from {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }

    to {
        transform: translate3d(0, 20px, 0);
        opacity: 0;
    }
}

.select-menu .options {
    display: none;
}

.select-menu.active .options {
    display: block;
}

.select-btn a {
    text-decoration: none;
    color: #ffff;
}

.panorama-slider,
.panorama-slider * {
    touch-action: pan-y;
    -ms-touch-action: pan-y;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-tap-highlight-color: transparent;
}

.custom-swiper-content .contents {
    padding: 0 30px 0;
}

.slide-bgimg {
    position: relative;
}


.slide-bgimg:after {
    content: '2024';
    position: absolute;
    bottom: 0;
    font-size: 27px;
    font-weight: 500;
    z-index: 1;
}

.cal-sm-thumb-wrapper {
    width: 100%;
    height: 360px;
    height: auto;
    overflow: hidden;
}

.offcanvas-overlay {
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 100%;
    z-index: 8;
    background-color: rgb(0 0 0 / 63%);
    mix-blend-mode: normal;
    transition: 0.6s cubic-bezier(.858, .01, .068, .99);
    transition-delay: .06s;
    z-index: 999;
}

.offcanvas-overlay.active {
    transform: translateX(-100%);
    transition-delay: 0s;
}