@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');

  
body { background: #2B2B2B; overflow: hidden;  position: relative; padding: 0; margin: 0; font-family: 'Manrope', sans-serif; font-size: 14px; font-weight: 400; line-height: 1.42;  } 
img{ max-width: 100%; }

h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 { font-weight: 600;  }

a{ color: inherit; text-decoration: none; }
/* a:hover{ color: #2B2B2B; text-decoration: none;} */
a:hover,
a:focus{ text-decoration: none; color: inherit; }

.btn:focus { box-shadow: 0 0 0 0.25rem rgb(194 170 120 / 20%); }

.theme-color { color: #C2AA78; }
.primary-btn { font-size: 14px; text-transform: uppercase;background: #C2AA78; color: #fff; padding: 8px 30px; border-radius: 40px; border: 1px solid #C2AA78; outline: none; font-weight: 600; }
.primary-btn:hover, .primary-btn:focus{ color: #fff; }
.primary-btn svg{ width: 20px; vertical-align: baseline; margin-left: 10px; }
.primary-btn svg path{  fill: #fff; }


.form-control { border: 0; border-bottom: 1px solid #C2AA78; border-radius: 0; }
textarea.form-control { resize: none; min-height: 100px; }
.form-control:focus { box-shadow: none; border-color: #C2AA78; }

  
/* ----------------------------------
 Bootstrap Fix: IE10
 in Windows 8 & Windows Phone 8
 ---------------------------------- */
@-webkit-viewport { width: device-width; } 
@-moz-viewport { width: device-width; } 
@-ms-viewport { width: device-width; } 
@-o-viewport { width: device-width; } 
@viewport { width: device-width; } 


/* ----------------------------------
 Input Light
 ---------------------------------- */
/* .form-control.form-control-light { color: #B8B8B8;  }  */
.form-control.form-control-light:-moz-placeholder { color: #ABA7A6; font-size: 13px; } 
.form-control.form-control-light::-moz-placeholder { color: #ABA7A6; font-size: 13px;} 
.form-control.form-control-light:-ms-input-placeholder { color: #ABA7A6; font-size: 13px;} 
.form-control.form-control-light::-webkit-input-placeholder { color: #ABA7A6;font-size: 13px; } 

/* ====== Page Loader Animation ====== */
.loader { background: var(--loader-color); position: fixed; z-index: 1200; box-sizing: border-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 100%; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; transition: opacity 1s linear; } 
.fade-out.loader { opacity: 0; } 
.loader .loader-inner { display: block; width: 70px; }
.loader .loader-inner lottie-player{width: 70px; }


/* Page Title */
.page-title { display: flex; justify-content: space-between; align-items: center; margin: 0 0 20px;}
.page-title h1{ margin: 0; font-size: 32px; }

/* Section Title */
.section-title { margin: 20px 0; display: flex; align-items: center; justify-content: space-between; }
.section-title h2{ font-size: 26px; font-weight: 700; margin: 0; }
.section-title h2 span{ font-weight: 300; }
.section-title a{ color: var(--secondary-color); }

/* Custom Scrolling Css */
.custom-scroll-div { scrollbar-width: thin; scrollbar-color: #c3c3c3 #fff; }
.custom-scroll-div::-webkit-scrollbar { width: 8px; }
.custom-scroll-div::-webkit-scrollbar-track { background-color: #f1f1f1; /* -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); */ }
.custom-scroll-div::-webkit-scrollbar-thumb { background-color: #939393; }

/* Data Not Found */
.no-data-found { padding: 80px 0;  display: flex; align-items: center; justify-content: center; }
.no-data-found .box{ max-width: 380px; margin: 0 auto; text-align: center; }
.no-data-found .box img{ margin: 0 0 30px; max-width: 250px; }

/* Header  */
header {}
header .navbar .navbar-toggler-icon { width: 24px; height: 17px; background-image: none; position: relative; border-bottom: 1px solid #C2AA78; transition: all 300ms linear; }
header .navbar .navbar-toggler-icon::after, 
header .navbar .navbar-toggler-icon::before{ width: 24px; position: absolute; height: 1px;  background-color: #C2AA78; top: 0; left: 0; content: ''; z-index: 2; transition: all 300ms linear; }
header .navbar .navbar-toggler-icon::after{ top: 8px; }
header .navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::after { transform: rotate(45deg); }
header .navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon::before { transform: translateY(8px) rotate(-45deg); }
header .navbar .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon { border-color: transparent; }



/* header .bottom-side .navbar-collapse{ position: fixed; padding: 12px; background: #000; top: 0px; left: 0px; bottom: 0; width: 280px; height: 100vh !important; transition: .3s; padding-top: 0px; box-shadow: 0px 2px 1px 0px #e2e2e2; }
header .bottom-side .navbar-nav li a{ color: #fff; }
header .bottom-side .collapse:not(.in) { display: block; left: -294px; transition: .3s; }
header .bottom-side .collapse.show{ left: -12px; transition: .3s; display: block; } */

header .navbar-expand-lg { flex-wrap: wrap; padding: 0; height: 100vh; align-items: start; flex-direction: column; }
header .navbar-expand-lg .navbar-nav {  flex-direction: column;}
header .bottom-side{  margin: auto auto 15px;  }
header .bottom-side .navbar-nav li{ display: block; padding: 5px 0; }
header .bottom-side .navbar-nav li a{ color: #fff; text-decoration: none; text-transform: uppercase; }
header .bottom-side .navbar-nav li a.active{ color: #E13D33; position: relative;}
header .bottom-side .navbar-nav li a.active::after{content: ""; position: absolute; top: 0; left: -15px; width: 2px; height: 20px; background: #E13D33;}
header .bottom-side .page-number { color: #C2AA78; font-size: 23px; font-weight: 900; }
header .bottom-side .page-number span{ -webkit-text-stroke: 0.5px #C2AA78; color: transparent; }

header .logo{  width: 111px;  background: #fff; padding: 8px; margin: 0 auto; }
header .follow{ font-size: 8px;  font-weight: 900; padding: 4px 0 0;  display: flex; white-space: nowrap; }
header .follow img{ width: 13px; }
header .follow a{ margin-left: 5px; }


/*  */
/* section.landing-slider { position: relative; }
section.landing-slider .media-wrap{ height: 100vh; background: #2B2B2B; }
section.landing-slider .inner-landing .slider-holder .slick-dots{ position: fixed; left: 60px; bottom: 120px; padding: 0; margin: 0;list-style: none; z-index: 100; color: #fff; }
section.landing-slider .inner-landing .slider-holder .slick-dots li { margin: 10px 0; }
section.landing-slider .inner-landing .slider-holder .slick-dots li.slick-active{ color: #E13D33; position: relative; }
section.landing-slider .inner-landing .slider-holder .slick-dots li.slick-active::after{ content: ""; position: absolute; top: 0; left: -15px; width: 2px; height: 20px; background: #E13D33; }
section.landing-slider .inner-landing .slides-numbers{ position: fixed; left: 60px; bottom: 60px; padding: 0; margin: 0;list-style: none; z-index: 100; color: #fff; } */

section.landing-page { display: flex;  background: #2B2B2B;}
section.landing-page .header{ width: 15%; flex: 0 0 auto; position: fixed;  top: 0; z-index: 999; }
section.landing-page .page-contnet{ flex: 1 1 auto; }

/* Home Page */
section.landing-page .home-page { position: relative; }
section.landing-page .home-page .box { display: flex; color: #fff; align-items: center; margin: 0 auto; padding: 0 0 0 15%; }
section.landing-page .home-page .box .content{ width: 100%; position: relative; z-index: 1; }
section.landing-page .home-page .box .content .text { position: relative; z-index: 99; font-size: 18px; }
section.landing-page .home-page .box .content .text h1 { font-size: 100px;font-weight: 900; text-transform: uppercase; line-height: 1; margin: 0 0 20px; }
section.landing-page .home-page .box .content .text h1 span.fill{ display: block; -webkit-text-stroke: 1px #C2AA78; color: transparent; }
section.landing-page .home-page .box .content .text h1 span.red{ color: #E13D33; }

section.landing-page .home-page .box .img { height: 100vh; display: flex; }
/* section.landing-page .home-page .box .img .lottie-home{ position: absolute; top: -110px; right: 0; bottom: 0; } */
section.landing-page .home-page .box .img .lottie-home{ position: absolute; top: -20px; right: 0px; bottom: 0; width: 35%; }
/* section.landing-page .home-page .box .img .bg { position: absolute; top: -120px; right: -50px; }
section.landing-page .home-page .box .img .bg img{ max-width: 750px; }
section.landing-page .home-page .box .img .museum{ position: relative;  margin-top: auto;}
section.landing-page .home-page .box .img .museum img{ max-width: 490px; } */

section.landing-page .home-page .news-events { max-width: 50%; width: 100%; }
section.landing-page .home-page .news-events .head-title{ border-top: 1px solid #EE1C25; padding: 10px 0 0; display: flex; justify-content: space-between; align-items: center; }
/* section.landing-page .home-page .news-events .news-slider{ position: relative; } */
section.landing-page .home-page .news-events .news-slider .item{ padding: 0 5px; }
.news-box { color: #000; }
.news-box .news-img img{ width: 100%; object-fit: cover; /*height: 90px;*/ }
.news-box .data{  padding: 8px 0; color: #fff; }
.news-box .data a{ display: flex; gap: 10px; justify-content: center; }
.news-box .data h6{ margin: 0; }
.news-box .data p{ margin: 0 0 5px; height: 37px; font-size: 12px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; }
.news-box .data .primary-btn{ font-size: 12px; padding: 6px 15px;}


.news-slider .slide-arrow {border: 0; background: rgba(255, 255, 255, 0.5); position: absolute; top: 50%; transform: translateY(-50%); line-height: 10px; left: -30px; z-index: 10; height: 25px; width: 25px; border-radius: 50%; text-align: center; font-size: 15px; }
.news-slider .slide-arrow.next-arrow{ left: unset; right: -31px; }


/* Next Page */
section.landing-page .page-contnet .next-page { }
section.landing-page .page-contnet .next-page{text-decoration: none; color: #fff;writing-mode: vertical-rl;text-transform: uppercase; font-size: 12px; transform: translateY(-50%) rotate(180deg);  position: fixed; right: 50px; top: 50%;  padding-left: 10px; z-index: 100; font-weight: 700; }
section.landing-page .page-contnet .next-page::after{ content: ""; position: absolute; top: 50%; right: 100%; bottom: 0; background: #fff; width: 100px; height: 1px;    transform: translateY(-50%);}
section.landing-page .page-contnet .next-page::before{ content: ""; position: absolute; top: 50%; right: 100%; bottom: 0; background: #fff; width: 5px; height: 5px;     transform: translateY(-50%);}

/* Content Page */
section.landing-page .content-page { color: #fff; padding: 50px 0; overflow-y: auto; height: 100vh; }
section.landing-page .content-page .inner-content{ max-width: 960px; margin: 0 auto; }

section.landing-page .content-page .book-detail { max-width: 590px; }
section.landing-page .content-page .book-detail .img{ max-width: 282px; }
section.landing-page .content-page .book-detail .text-box{ margin: 20px 0; padding: 15px 0 0; border-style: solid; border-image: linear-gradient(to left, rgb(43 43 43) 0%, rgb(194 170 120) 50%, rgb(43 43 43) 100%) 100% 0 100% 0/1px 0 1px 0 stretch; }
section.landing-page .content-page .book-detail .whre-find{ display: flex; align-items: center; justify-content: space-between; }
section.landing-page .content-page .book-detail .whre-find .text p{ margin: 0;}
section.landing-page .content-page .book-detail .whre-find .text span{ display: block; color: #E13D33; }

section.landing-page .content-page .book-main {  }
section.landing-page .content-page .book-main .head .custom-nav-tabs li { padding: 0 65px 0 0;  }
section.landing-page .content-page .book-main .head .custom-nav-tabs li a{ padding: 0; font-size: 18px;  color: #ABA7A6; position: relative;  }
section.landing-page .content-page .book-main .head .custom-nav-tabs li a.active{ color: #C2AA78; }
section.landing-page .content-page .book-main .head .custom-nav-tabs li a::after{ content: ""; position: absolute; top: -3px;  right: -30px; height: 35px; width: 1px; background: #ABA7A6;  }
section.landing-page .content-page .book-main .head .custom-nav-tabs li:last-child a::after{ display: none; }

/* section.landing-page .content-page .book-main .head .title{ position: relative; font-size: 18px;  display: flex; justify-content: space-between; max-width: 225px; }
section.landing-page .content-page .book-main .head .title .theme-color { position: relative; }
section.landing-page .content-page .book-main .head .title .theme-color::after{ content: ""; position: absolute; top: -3px;  right: -30px; height: 35px; width: 1px; background: #ABA7A6; }
section.landing-page .content-page .book-main .head .title span.story{ color: #ABA7A6; } */

section.landing-page .content-page .book-main .search { width: 290px; display: flex; justify-content: end; margin: 0 0 20px; }
section.landing-page .content-page .book-main .search .icon-search-container { display: flex; align-items: center;  border-radius: 35px;  height: 35px;  width: 35px; position: relative; transition: width 0.2s ease-out; backface-visibility: hidden; padding: 0 0 0 10px;}
section.landing-page .content-page .book-main .search .icon-search-container.active { width: 290px; border-bottom: 1px solid #000000; background: #000;}
section.landing-page .content-page .book-main .search .icon-search-container.active .fa-times-circle { opacity: 1; }
section.landing-page .content-page .book-main .search .icon-search-container.active .search-input {  width: 230px; }
section.landing-page .content-page .book-main .search .icon-search-container .fa-search {color: #2980b9; font-size: 30px; position: absolute; top: 7px;left: 8px; cursor: pointer; }
section.landing-page .content-page .book-main .search .icon-search-container .fa-times-circle { opacity: 0; color: #d9d9d9; font-size: 20px;  position: absolute;  top: 12px;  right: 8px;  transition: opacity 0.2s ease-out; cursor: pointer; }
section.landing-page .content-page .book-main .search .icon-search-container .search-input { color: #fff; padding: 0; position: absolute; cursor: default; left: 35px;  top: 2px; width: 0;  border: none; outline: none; font-size: 18px;  background-color: rgba(255, 255, 255, 0); transition: width 0.2s ease-out; }
section.landing-page .content-page .book-main .search .icon-search-container .search-input:focus{ box-shadow: none; }

section.landing-page .content-page .book-listing { overflow: hidden;max-width: 320px; }
section.landing-page .content-page .book-listing .inner-listing{padding: 15px 0 0; margin-top: 15px; height: calc(100vh - 200px); overflow-y: auto; margin-right: -15px;}
section.landing-page .content-page .book-listing .box{ display: flex; align-items: center; padding: 10px 0; }
section.landing-page .content-page .book-listing .box .img{ width: 100px; }
section.landing-page .content-page .book-listing .box .detail{ padding: 0 0 0 15px; max-width: 200px; }
section.landing-page .content-page .book-listing .box .detail h5{ font-size: 18px; }


section.landing-page .content-page .empty-state { height: calc(100vh - 110px); text-align: center; display: flex; align-items: center; }
section.landing-page .content-page .empty-state .box { max-width: 400px; margin: 0 auto; }
section.landing-page .content-page .empty-state .box h5{ margin: 15px 0; }
section.landing-page .content-page .empty-state .box img{ max-width: 200px; }

/* Contact Us */
section.landing-page .contact-us { height: 100vh; display: flex; align-items: center; position: relative; overflow-y: auto; flex-wrap: wrap; padding: 30px 0; background-image: url('../images/contact-bg1.jpg'); background-repeat: no-repeat; background-size: 42%; background-position: 100% 0%; }
section.landing-page .inner-contact { max-width: 960px; margin: 0 auto; }
section.landing-page .contact-us .contact-form{ background: #fff; padding: 20px; border-radius: 10px; position: relative; z-index: 10; }
section.landing-page .contact-us .contact-form h3{ font-size: 22px; margin: 0 0 15px; }
section.landing-page .contact-us .category { display: block; text-align: center; }
section.landing-page .contact-us .category ul{ list-style: none; padding: 0; margin: 0 0 15px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; }
section.landing-page .contact-us .category .checkmark{ font-weight: 600; display: block; width: 100%; align-items: center; border: 1px solid transparent;  padding: 10px 25px; border-radius: 30px; position: relative; cursor: pointer; -webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; line-height: normal;}
section.landing-page .contact-us .category input { position: absolute; cursor: pointer; opacity: 0; height: 20px; width: 20px; top: 0px; left: 0; }
section.landing-page .contact-us .category input:checked ~ .checkmark { border-color: #C2AA78; color: #C2AA78; }
section.landing-page .contact-us .contact-info { color: #fff; position: relative; z-index: 10;  }
section.landing-page .contact-us .contact-info ul{ list-style: none; padding: 0; margin: 0;}
section.landing-page .contact-us .contact-info ul li{ padding: 5px 0; }
section.landing-page .contact-us .contact-info ul li .icon{ width: 30px; display: inline-block; }

/* Xandria Page */
body.light-mode header .logo{ background: #C2AA78; padding: 0; }
body.light-mode header .bottom-side .navbar-nav li a{ color: #000; }
body.light-mode header .bottom-side .navbar-nav li a.active{ color: #E13D33; }
body.light-mode header .bottom-side .page-number{ color: #E13D33; }
body.light-mode header .bottom-side .page-number span{ -webkit-text-stroke: 0.5px #E13D33; }
body.light-mode section.landing-page{ background: #fff;    align-items: start; }
body.light-mode { overflow-y: auto; height: 100%; }
body.light-mode section.landing-page .header{ flex: 0 0 auto; }
body.light-mode section.landing-page .page-contnet .next-page { color: #E13D33; }
body.light-mode section.landing-page .page-contnet .next-page::before { background: #E13D33; }
body.light-mode section.landing-page .page-contnet .next-page::after { background: #E13D33; }


section.landing-page .xandria-page { position: relative; background-image: url('../images/xandria-bg1.png'); background-repeat: no-repeat; background-size: 42%; background-position: 110% 70%; }
/* section.landing-page .xandria-page .app-box{ max-width: 1000px; margin: 0 auto; position: relative; z-index: 10;} */
/* section.landing-page .xandria-page .slide-box{ margin: 0 auto; max-width: 1000px;  height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; } */

section.landing-page .xandria-page .list-museum { max-width: 1000px; width: 100%; margin: 0 auto; padding: 80px 0 300px; }
section.landing-page .xandria-page .list-museum .list-data{ border-top: 1px solid #000; display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; }
section.landing-page .xandria-page .list-museum .list-data li{ width: 33.33%;  }
section.landing-page .xandria-page .list-museum .list-data li:not(:last-child){border-right: 1px solid #000;  }
section.landing-page .xandria-page .list-museum .list-data li .box{ padding: 15px; position: relative; }
section.landing-page .xandria-page .list-museum .list-data li .box .no{ position: absolute; top: 5px; right: 10px;  }

section.landing-page .xandria-page .logo-btn { max-width: 400px; margin: 100px auto 50px; }
section.landing-page .xandria-page .logo-btn .sign-btn{ display: flex; justify-content: space-between; padding: 20px 0 0; }
section.landing-page .xandria-page .logo-btn .sign-btn .btn{ width: 100%; }



section.landing-page .app-box{ max-width: 1000px; width: 100%; margin: 0px auto; }
section.landing-page .app-box .app-screen{ margin-top: -190px; position: relative; }
section.landing-page .app-screen .app-img{ max-width: 80%; margin: 0 auto; }
section.landing-page .app-screen .content{ padding: 50px 0; font-size: 18px; }
section.landing-page .app-screen .content h2{ font-weight: 800; font-size: 50px; margin: 0 0 20px;}
section.landing-page .app-screen .content .app-download { display: flex; justify-content: center; }
section.landing-page .app-screen .content .app-download img{ max-width: 150px; margin: 0 5px; }



section.landing-page .active-plan { margin-top: 50px; }
section.landing-page .active-plan .membership-slider .item{ padding: 0 12px; }
section.landing-page .active-plan .title{ font-weight: 800; text-align: center; }
section.landing-page .plan-listing { background: #C2AA78; padding: 0 0 50px; }
section.landing-page .member-box { margin: 20px 0; }
section.landing-page .member-box .top-box{  position: relative; color: #fff; text-align: center; margin: 0 0 20px; background: #2B2B2B; padding: 30px 0px; border-radius: 10px; }
section.landing-page .member-box .top-box img{ max-width: 130px; margin: 0 auto;  }
section.landing-page .member-box .top-box h5{ margin: 10px 0; font-size: 16px; color: var(--dark-white-color); }
section.landing-page .member-box .top-box.theme{ background: #C2AA78; }
section.landing-page .member-box .top-box .brouch img{ position: absolute; top: 10px; right: 10px; width: 20px; }
section.landing-page .member-box .top-box .price{ background: #3D3D3D; padding: 5px 10px; margin: 0 0 5px; font-size: 20px; }
section.landing-page .member-box .top-box.theme .price{ background: #AF9869; }
  
section.landing-page .subscription-list { background: #fff; color: #000; padding: 20px 0px; overflow: hidden; box-shadow: 0px 3px 10px 0px rgb(66 66 66 / 50%); border-radius: 10px;  }
section.landing-page .subscription-list .inner-scroll{ margin-right: -17px; padding: 0px 25px 20px; height: 300px; overflow-y: auto; }
section.landing-page .subscription-list h4{ margin: 0 0 15px; font-size: 20px; text-align: center; }
section.landing-page .subscription-list ul{ list-style: none; padding: 0 0 0 30px; margin: 0; }
section.landing-page .subscription-list ul li{ position: relative; margin: 5px 0; display: inline-block; width: 100%; }
section.landing-page .subscription-list ul li::after{ content: ""; position: absolute; width: 15px; height: 15px; background: url('../images/circal-right.svg') no-repeat; background-size: 100%; left: -30px; top: 5px; }
section.landing-page .subscription-list .bottom-btn { text-align: center; margin: 20px 0 0px; }
 

