@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,100..900;1,9..144,100..900&display=swap');

*{margin:0; padding:0; box-sizing:border-box;}
html {font-size: 50%;}
body{font-weight:400; font-family: 'Montserrat', sans-serif; font-weight:300;}
img {vertical-align: top; max-width: 100%;}
a {text-decoration: none;}
ul,ol {list-style: none;}
.wrapper {max-width:1300px; margin:0 auto; width: 100%}
.wrapper-big {max-width:85%; margin: 0 auto;}

.title-row {margin-bottom: 4rem; display: flex;}
.title-row.center {justify-content: center;}
.title-row .sec-title {font-size: 4.5rem; color:#514e4e; border-bottom: .4rem solid #fadb96; font-weight:500;}

header {padding: 1.5rem 0;}
header .wrapper{ display: flex; justify-content: space-between; }
header .toggle-btn {display: none;}

.right-header {display: flex; align-items: center;}
.right-header ul{display: flex;}
.right-header ul li {font-family: 'Montserrat', sans-serif; padding: 0 2rem; font-size: 2rem; line-height:2.5rem; font-weight: 400}
.right-header ul li:last-child{border-right:0; padding-right: 0;}
.right-header ul li a{color:#514e4e; position:relative;}
.right-header ul li a.active:before {
    position: absolute;
    bottom: -5px;
    right: 0;
    content: '';
    background: #efd301;
    width: 100%;
    height: 3px;
    z-index: -1;
    transition: .2s 
ease-in;
}
.right-header ul li a:hover {color: #e20202;}
.right-header ul li a.active{ color: #e20202; font-weight: 500}
.sub-title {font-size: 3rem; color:#514e4e; margin-bottom: 3rem; font-weight:normal;}

.bannerSec {position: relative;}
.topbanner::before{position: absolute; width: 100%; height: 100%; left: 0; top: 0; content: ''; background: rgba(0, 0, 0, .6)}
.banner-section {
    position: relative;
    margin-top: 28px;
}
.banner-section .whitebox{
    
    background: #fff;
    width: 1120px;
    margin:10px auto;

}
.bannerbox{
    position: relative;
    padding: 70px 0 65px 45px;
}
.bannerSec img {width: 100%;}
.banner-section img{
    width: auto;
    height: auto;
}
.banner-section h4{
    font-size: 23px;
    color: #8b0303;
    font-family: 'Montserrat', sans-serif;
    position: absolute;
    top: 53%;
    left: 45%;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: -1px;
}
.cta{
    position: absolute;
       right: 58px;
    top: 92px;
}
.cta a{
    background: #fff;
    border: 3px solid #e20202;
    color: #e20202;
    font-family: 'Montserrat', sans-serif;
    text-transform: uppercase;
    cursor: pointer;
    font-size: 19px;
    font-weight: 700;
    width: 165px;
    text-align: center;
    padding: 10px 0;
    display: block;
    margin-bottom: 15px;
}
.graphic1{
        margin: 0 auto;
    position: relative;
    left: 50%;
    transform: translate(-50%, 0);
}
.graphic2{
       
    position: absolute;
    left:0;
    top: 0;
}
.graphic3{
       
    position: absolute;
    right:0;
    top: 0;
}
.graphic4{
        margin: 0 auto;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    top: 0;
}
.graphic5{
        margin: 0 auto;
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    bottom: 16px;
}
.auto{
        position: absolute;
    left: 13px;
    bottom: -17px;
}
.auto2{
        position: absolute;
    right: 13px;
    bottom: -17px;
}
.bannerSec .textContent {position: absolute; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; top:0; left:0; flex-direction: column;}
.bannerSec .textContent h1{ font-size:38px; color:#fff; font-family: 'Montserrat', sans-serif; font-weight: 600; margin: 0; padding: 0;}
/* .bannerSec.experience .textContent {height:55%; bottom:0; top:auto;} */
.bannerSec.experience .textContent h1{ font-weight:500; font-size:5.5rem; text-align: center;}
.bannerSec .textContent p{ font-family: 'Avenir Next Cyr'; font-style: italic; color:#fff; text-align: center; font-size: 4.4rem; line-height:1.4; margin-top: 12rem;}

.eventSec{ padding-bottom:8rem;  padding-top: 5rem;}
.eventType{ margin-left:12.5%;}
.event-row{ display: flex; justify-content: space-between; align-items: center;}
.event-list {display: inline-flex; justify-content: space-between;}
.event-box { width:490px; box-shadow:0 0 5px #ccc ; overflow: hidden; border-radius: 2.5rem; margin:5px;}
.event-box > a{ overflow: hidden; display: block;}
.event-box img{transition:.4s ease-in;}
.event-box:hover img{transform: scale(1.05);}
.event-box .event-content {padding: 2rem;}
.event-box .event-content h4{ font-size: 2.2rem; line-height:2.5rem; margin-bottom:1rem; font-weight:600;}
.event-box .event-content h4 a{ color:#514e4e;}
.event-box .event-content p {font-size: 2.2rem; line-height:3.5rem;  color:#6a6767; font-weight:300;}
.event-list .owl-dots{ margin-top:4rem!important;}

.viewbtn-row{ text-align: center;}
.view-all-btn{background: #f3f3f2; display: inline-block; vertical-align: top; font-size: 2.2rem; color:#979393; text-transform: uppercase; padding:1.5rem 2.5rem; font-style: italic; box-shadow:1rem 1rem 0 #e1fdeb;}
.view-all-btn:hover{ background:#e4e4dd;}

.eventgroup_sec{ padding-top: 5rem;}
.eventgroup_sec .heading{ font-family: 'Avenir Next Cyr'; font-weight:400; font-size:3rem; line-height:1.5; color:#514e4e; text-align: center; width:580px; max-width:100%; margin:0 auto 3rem; }
.allEvents{ display: flex; flex-wrap: wrap;}
.singleEvt{ flex:0 0 33.33%; padding:4rem 3%; text-align: center;display: flex; flex-direction: column; align-items: center;}
.singleEvt .imgwrap{ border-radius:50%; overflow: hidden;}
.singleEvt .imgwrap:hover img{ transform: scale(1.1);}
.singleEvt h4{ font-size:2.5rem; line-height:3rem; font-family: 'Avenir Next Cyr'; font-weight:400; margin-top:3rem; position: relative; padding:1.2rem 2rem; cursor: pointer;}
.singleEvt h4:before{ position: absolute; bottom:0; right:0; content:''; background:#e1fdeb;width:85%; height:50%; z-index: -1; transition:.2s ease-in;}
.singleEvt h4:hover:before{ height:100%; width:100%;}
.allEvents img{ border-radius:50%; transition:.4s ease-in;}

.serviceSec {padding:5rem 0 3rem;}
.serviceSec p {font-size: 2.2rem; line-height: 1.5; color:#514e4e;}
.services-list {display: flex; justify-content: space-between; margin-top:7rem;}
.service-type {background: #f3f2f2; width: 46%; padding:3.5rem; box-shadow:2rem 2rem 0 #e1fdeb;}
.service-type h3 {font-size: 3.4rem; color:#514e4e; font-weight:500;}
.service-type ul {padding:3rem 3rem 0;}
.service-type ul li{ font-size: 2.4rem; line-height: 1.7; color:#514e4e; margin-bottom:1.5rem; background:url('../images/check2.png') no-repeat 0 0; background-size:auto 30px; padding-left:7rem;}

.aboutSec {margin-bottom: 10rem;  padding-top:5rem;}
.about-us {display: flex; justify-content: space-between;}
.about-content {width: 50%;}
.about-us p {font-size: 2.5rem; line-height:6rem; color:#514e4e;}
.about-img { display: inline-flex; flex-direction: column; margin-top:-3rem;}
.about-img img {border:1rem solid #f3f2f2; width:300px;}
.about-img1 {transform: rotate(6deg);}
.about-img2 { margin: -12rem 0 0 -12rem; transform: rotate(345deg);}

.contactSec {background:#be022f; padding:6rem 0; position: relative;}
.contactSec .contact-content {position: relative;}
/* .contactSec::before{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; content: ''; background: rgba(255,255,255,.5)} */
.contactSec p {font-size: 2.5rem; line-height:5rem; color:#ffffff;}
.contactSec .formSec {position: relative; margin: 7rem auto 0; width: 95%;}
.contactSec .title-row .sec-title{ color: #fff;}

.form-row {display: flex; margin-bottom:3rem;}
.form-row .form-group{ width:49%; margin: 0 4rem 0 0; position: relative;}
.form-row .form-group + .form-group{ margin-right:0;}
.formSec .form-row label {display: flex; align-items: center; color:#2b2525; font-size: 2.2rem; }
.formSec .form-row label .form-checkbox {margin-right: 1rem; height: 4rem; width: 4rem;}
.formSec .form-row .form-input {font-size: 2rem; padding: 1rem 2rem; border:none; color:#514e4e; height: 7rem; width:100%; font-family: "Fraunces", serif; font-weight:300;}
.formSec .form-row .form-input:focus{outline: none;}
.formSec .form-row textarea {font-size: 2rem; padding: 1rem 2rem; border:none; color:#514e4e; height:20rem; width:100%; resize: none; font-family: "Fraunces", serif; font-weight:300;}
.formSec .form-row textarea:focus{outline: none;}
.form-row .multi-form-element {display: flex; flex-direction: column; justify-content: space-between; height:100%;}
.form-row .multi-form-element .form-group{ width:100%; margin:0;}
.formSec .submit-btn, .interst-form .submit-btn{ border:none; background:#111; color: #fff; padding:10px; height: 5rem;  font-size:1.5rem; line-height:1; width:100px; text-transform: uppercase; cursor: pointer; font-family: "Fraunces", serif; font-weight:500;}
.formSec .submit-btn:hover,  .interst-form .submit-btn:hover{ background: #000;}

.formSec label.error { position: absolute; left: 0; bottom: -2.5rem; top: auto; color: #ff0000; font-size: 1.5rem; line-height: 2rem; font-weight: normal;}

footer{ background:#000; padding:3rem 0;}
footer .wrapper{ display:flex; justify-content: space-between; align-items: center;}
footer p{ color:#fff; font-size:2rem; line-height:1.5;}

.socialLinks{ display: inline-flex;}
.socialLinks li{ margin-right:3rem;}
.socialLinks li:last-child{ margin-right:0;}
.socialLinks li a{ display:inline-block; width:5rem; height:5rem; background:url('../images/social-icon.png') no-repeat 0 0; background-size: auto 5rem;}
.socialLinks li .instagram{ background-position:0 0;}
.socialLinks li .facebook{ background-position:-52px 0;}
.socialLinks li .whatsup{ background-position:-100px 0; width:6rem;}
.socialLinks li .youtube{ background-position:-166px 0; width:6rem;}

/* Fashion page css start here */
.fashion-banner {background: #000; display: flex; position: relative;}
.fashion-banner img {width: 50%; height:100vh; object-fit: cover; object-position:
top;}
.fashion-banner::before{position: absolute; width: 50%; height: 100%; left: 0; top: 0; content: ''; background: rgba(0, 0, 0, .2)}
.fashion-banner .banner-content {color:#fff; position: absolute; display: flex; flex-direction: column; justify-content: center; height: 100%; width: 50%; right: 8rem;}
.fashion-banner .banner-content h1 {font-size: 7.8rem; line-height: 9rem; margin-bottom:2rem;}
.fashion-banner .banner-content h4 {font-size: 2rem; line-height: 3rem; margin-bottom: 0.5rem;}
.fashion-banner .banner-content h4 span {font-weight: 100;}

.fashion-title {position: relative; font-size: 5.3rem; line-height: 6rem; margin-bottom: 3rem; text-align: center; font-weight: 500;}
.fashion-title::after{border:2px solid #000; height: 0; width: 65px; position: absolute; content: ''; bottom: -10px; left:calc(50% - 32.5px);}

.intro-sec {padding:6rem 0; }
.intro-sec .intro-text {width: 62%;}
.intro-sec .intro-text p {font-size: 2.2rem; line-height: 4rem; margin-bottom: 2rem; font-weight:300; text-align: justify;}
.intro-sec .intro-text p strong {font-weight: 500;}
.intro-sec img {width: 32%;}

/* introduction secton end here */

.exhibitionSec {background: url('../images/hotel.png') no-repeat top center; background-size:cover; padding:7rem 0; position: relative;}
.exhibitionSec::before{ position: absolute; width: 100%; height: 100%; left: 0; top: 0; content: ''; background: rgba(0, 0, 0, .7)}
.exhibitionSec .showcase {display: flex; flex-wrap: wrap; justify-content: space-between; color:#fff; position: relative;}
.exhibitionSec .showcase .showcase-box {flex:0 0 45%; text-align: center; margin-bottom: 4rem;}
.exhibitionSec h3 {font-size: 2.5rem; line-height: 3rem; margin-bottom: 1.5rem; font-weight:500;}
.exhibitionSec p {font-size: 2.2rem; font-weight: 300; line-height: 3.5rem; }
.exhibitionSec .collection {text-align: center;}

/* exhibition secton end here */
.floorplan-sec {margin:6rem 0 10rem;}
.floorplan-sec h2 {font-size: 5rem; line-height: 5rem; font-weight: 500; margin-bottom: 5rem;}
.floorplan-sec img {margin-bottom: 4rem; width:calc(100% - 1.5rem); margin-left: -1.5rem;}
.floorplan-sec p {font-size: 2.2rem; line-height: 3.5rem; margin-bottom: 2rem; color:#514e4e;}

/* hotel-map secton end here */
.itenary-sec .itenary-detail {margin-bottom: 6rem;}
.itenary-sec .itenary-detail img {width: 48%;}
.itenary-sec .itenary-detail .itenary-text {width: 46%;}
.itenary-sec .itenary-detail .itenary-text p {font-size: 2.2rem; line-height: 5rem; font-weight:300;}

.itenary-sec .timeline-sec {margin-bottom: 5rem;}
.itenary-sec .timeline-sec .schedule {margin-bottom: 4rem;}
.itenary-sec .timeline-sec .schedule h4 {font-size: 2.2rem; line-height: 3rem; text-align: center; margin-bottom: 1.5rem; font-weight:500;}
.itenary-sec .timeline-sec .schedule h4 small {font-weight: 300; font-size:100%;}
.itenary-sec .timeline-sec .schedule ul {display: flex; justify-content: center;}
.itenary-sec .timeline-sec .schedule ul li {font-size: 2rem; line-height: 2.2rem; border-right: 1px solid #000; padding: 0 1rem;}
.itenary-sec .timeline-sec .schedule ul li:last-child{border:none; padding-right: 0;}

.itenary-sec .itenary-services .service-list {margin-bottom: 5rem;}
.itenary-sec .itenary-services .service-list:last-child{ margin-bottom:0;}
.itenary-sec .itenary-services .service-list h4 {display: inline-flex; align-items: center; border:2px solid #000; padding: 1rem 1.5rem; font-size: 2.5rem; line-height: 3rem; margin-bottom: 2rem; font-weight:400;}
.itenary-sec .itenary-services .service-list h4 img {margin-right: 1rem; width:3rem;}
.itenary-sec .itenary-services .service-list ul li {font-size: 2rem; line-height: 3rem; margin-bottom: 1rem; font-weight:300;}
.itenary-sec .quote {font-size: 2.5rem; line-height: 4rem; text-align: center; font-style:italic; font-weight:300; }
.itenary-sec .itenary-services .service-list > img{ margin-top:1rem;}

.interstSec { padding:6rem 0 3rem;}
.interstSec p {font-size: 2.2rem; line-height: 3rem; text-align: center; font-weight:100; letter-spacing:0.1rem;}
.interstSec .interst-form {margin: 5rem 0 6rem;}
.interstSec .interst-form img {width: 45%;}
.interstSec .interst-form form {width: 45%;}
.interstSec .interst-form input {width: 100%; font-size: 2rem; line-height: 2.5rem; padding: 1rem; height: 5rem; margin-bottom: 2rem; font-family: "Fraunces", serif; font-weight:300;}
.interstSec .interst-form input:focus{outline: none;}
.interst-form .submit-btn{ margin-top:2rem;}
.interstSec .join-us {text-align: center;}
.interstSec .join-us p {margin: 2rem 0; color:#514e4e; font-weight:400;}
.interstSec .join-us a {font-size: 2.2rem; line-height: 3rem; color:#514e4e;}

.mCSB_inside>.mCSB_container{ margin-right:0;}
.success{
	border: 1px solid green;
    height: auto;
    border-radius: 5px;
    padding: 5px;
    background: darkseagreen;
    color: black;
    font-size: 14px;
}
.error{
	  border: 1px solid red;
    height: auto;
    border-radius: 5px;
    padding: 5px;
    background: bisque;
    color: red;
	font-size: 14px;}
    .next-events {
        background: #efd301;
        padding: 1px 0 19px;
    }
@media (max-width: 1340px) {
    .wrapper {
        max-width: 1120px;
    }
    .banner-section .whitebox{
        width: 1020px;
    }
    .auto {
        left: -24px ;
    }
    .auto2 {
        right: -24px;
    }
    .expo-cpoy {
        max-width: 360px;
    }
    img.graphic1, img.graphic5 {
        width: 800px;
    }
    img.graphic4 {
        width: 895px;
    }
    .cta {
        top: 85px;
    }
    .cta a {
        font-size: 17px;
        padding: 8px 0;
    }
    img.graphic6 {
        width: 320px;
    }
    .banner-section h4{
        left: 41%;
        font-size: 21px;
    }
}
@media (max-width: 1200px) {
     .auto {
        left: 3px ;
    }
    img.auto, img.auto2{
        width: 120px;
    }
    .auto2 {
        right: 3px;
    }
}
@media (max-width: 1100px) {
    .bannerSec .textContent h1{
        font-size: 30px;
    }
    .banner-section .whitebox {
        width: 920px;
    }
    .expo-cpoy {
        max-width: 300px;
    }
    img.graphic1, img.graphic5 {
        width: 730px;
    }
    img.graphic4 {
        width: 795px;
    }
    .cta {
        top: 85px;
    }
    .cta a {
        font-size: 17px;
        padding: 8px 0;
    }
    img.graphic6 {
        width: 280px;
    }
    .banner-section h4{
        left: 40%;
        font-size: 18px;
    }
}
@media (max-width: 990px) {
    .bannerSec .textContent h1{
        font-size: 30px;
    }
    .banner-section .whitebox {
        width: 720px;
    }
    .expo-cpoy {
        max-width: 220px;
    }
    img.graphic1, img.graphic5 {
        width: 630px;
    }
    img.graphic4 {
        width: 600px;
    }
    .cta {
        top: 62px;
    }
    .cta a {
        font-size: 16px;
        padding: 8px 0;
        width: 140px;
    }
    img.graphic6 {
        width: 220px;
    }
    img.graphic2, img.graphic3{
        width: 60px;
    }
    .banner-section h4{
        left: 39%;
        font-size: 16px;
    }
        img.auto, img.auto2 {
        width: 90px;
    }
    .auto {
        left: 20px;
    }
        .auto2 {
        right: 19px;
    }
}

@media (max-width: 767px) {
    .bannerSec .textContent h1{
        font-size: 30px;
    }
    .banner-section .whitebox {
        width: 90%;
    }
    .expo-cpoy {
        max-width: 48%;
    }
    img.graphic1, img.graphic5 {
        width: 80%;
    }
    img.graphic4 {
        width: 83%;
    }
    .cta {
        top: 62px;
    }
    .cta a {
        font-size: 16px;
        padding: 8px 0;
        width: 140px;
    }
    img.graphic6 {
        width: 220px;
        display: block;
        margin-top: 20px;
    }
    img.graphic2, img.graphic3{
        width: 60px;
    }
    .banner-section h4{
                
        font-size: 16px;
        top: auto;
        bottom: 20px;
        left: 50px;
    }
        img.auto, img.auto2 {
        width: 90px;
        display: none;
    }
    .auto {
        left: 20px;
    }
        .auto2 {
        right: 19px;
    }
        .bannerSec {
            height: 400px;
        }
        .bannerSec img{
            height: 100%;
        }
        .banner-section img{
            height: auto;
        }
        
}
@media (max-width: 500px) {
    .bannerbox {
            padding: 40px 0 90px 45px;
        }
          
               img.graphic6 {
       width: 170px;
        display: block;
        margin-top: 10px;
        left: -30px;
        position: relative;
        top: 10px;
    }
        .expo-cpoy {
                max-width: 70%;
        position: relative;
        left: 23px;
    }
    
        .cta a {
       font-size: 12px;
        padding: 8px 0;
        width: 108px;
        /* display: inline-block; */
        margin: 9px 0 0 0;
        line-height: normal;
        border-width: 2px;
    }
        .cta {
               right: 18px;
        top: auto;
        bottom: 36px;
    }
        img.graphic2, img.graphic3 {
        width: 45px;
    }
        .banner-section h4 {
                 font-size: 13px;
    top: auto;
    bottom: 43px;
    left: 20px;
    }
}

@media (max-width: 420px) {
  
            .banner-section .whitebox {
        width: 100%;
    }
    .banner-section h4{
        font-size: 12px;
    }
}