/*===============================================
Template Name: Restu - Luxury Hotel HTML5 Template 
Author:  https://themeforest.net/user/aonetheme
Description: Description
Version: 1.0.0
Text Domain: Restu
Tags:   accommodation, bed & breakfast, booking, business, clean, hotel, hotel booking, hotel html template, hotel reservation, luxury, online booking, resort html, restaurant, tour, travel.
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. Restu Header Area Css
02. Restu Nav Menu Area Css 
03. Restu Hero Area Css
04. Restu Booking Area Css
05. Restu Room Area Css
06. Restu Room Details Area Css
07. Restu About Area Css
08. Restu Service Area Css
09. Restu Service Details Area Css
10. Restu Find Room Area Css
11. Restu Fecilities Area Css
12. Restu Team Area Css
13. Restu Footar Area Css
14. Restu Blog Area Css
15. Restu Blog List Area Css
16. Restu Blog Details Area Css
17. Restu Contact Area Css
18. Restu Search Box Css
19. Restu Loder Css
20. Restu Pricing Area Css 
21. Restu Sidbar Css 
22. Restu Room List Area Css 
23. Restu Room List Area Css 
24. Restu Place Area Css
25. Restu Top Area Css
26. Restu Hotle Fecilities Area Css
27. Restu Teastimonial Area Css
28. Restu Text Brand Section Css

=======================*/


/*---=================================
   <!--Restu Header Area Css-->
==================================---*/
.header-area {
    padding: 0 101px;
    position: relative;
    background: #ffcc81;
}

.header-menu {
    text-align: center;
}

.header-menu ul li {
    display: inline-block;
    margin-right: 60px;
}

.header-menu ul li a {
    display: inline-block;
    font-size: 22px;
    line-height: 46px;
    color: #000000;
    font-weight: 400;
    font-family: "Lora";
    text-transform: uppercase;
    padding: 25px 0;
    transition: 0.5s;
}

.header-menu ul li a:hover{
    color:#c19d68;
}

.header-menu ul li i {
    font-size: 22px;
    color: #ffff;
    left: 8px;
    position: relative;
    top: 0px;
    transition: 0.5s;
}

.header-menu ul li a:hover i{
    color:#c19d68;
}

.header-area .col-lg-3.text-right {
    text-align: right;
}

.header-search {
    display: inline-block;
}

.header-search i {
    display: inline-block;
    color: #909090;
    font-size: 16px;
    margin-right: 48px;
    position: relative;
    transition: 0.5s;
}

.header-search i:hover{
   color: var(--primary-color);
}

.header-search i:after {
    position: absolute;
    content: "";
    width: 1px;
    height: 18px;
    right: -28px;
    top: 1px;
    background: #5B5B5B;
}

.header-sidbar {
    display: inline-block;
}

.header-sidbar i {
    display: inline-block;
    color: #fff;
    font-size: 36px;
    margin-right: 22px;
    position: relative;
    top: 10px;
    transition: 0.5s;
}

.header-sidbar i:hover{
     color: var(--primary-color);
}

.header-button {
    text-align: right;
    position: relative;
    display: inline-block;
}

.header-button a {
    display: inline-block;
    font-size: 16px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-title);
    background: var(--primary-color);
    padding: 14px 29px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
    border-radius: 30px;
}

.header-button a:hover{
    color:var(--primary-color);
}

.header-button a:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    z-index: -1;
    border-radius: 30px;
    transition: 0.5s;
}

.header-button a:hover:before{
    width: 100%;
    left: 0;
}


/*sub-menu*/
.header-menu ul li.menu-item-has-children {
    position: relative;
}

.header-menu ul li .sub-menu {
    position: absolute;
    width: 200px;
    display: block;
    text-align: left;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    transition: 0.5s;
    top: 150%;
    z-index: 2;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    border-top: 5px solid var(--primary-color);
    border-radius: 3px 3px 0 0;
}

.header-menu ul li:hover .sub-menu{
    opacity: 1;
    top: 100%;
    visibility: visible;
}

.header-menu ul li .sub-menu li a {
    display: block;
    padding: 0px 19px;
    color: #1e1e1e;
    width: 200px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 400;
    transition: 0.5s;
    position: relative;
    z-index: 1;
}

.header-menu ul li .sub-menu li a:hover{
    color: #fff;
}

.header-menu ul li .sub-menu li a:before{
    position: absolute;
    content: "";
    width: 100%;
    height: 0;
    left: 0;
    bottom: 0;
    background:var(--primary-color);
    z-index: -1;
    transition: 0.5s;
}

.header-menu ul li .sub-menu li a:hover:before{
    height:100%;
    top: 0;
}

.sticky {
    left: 0;
    margin: auto;
    position: fixed !important;
    top: 0;
    width: 100%;
    -webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
    box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
    background: #FFCC81 !important;
    transition: 0.5s;
    z-index: 999 !important;
    -webkit-animation: 300ms running fadeInDown;
    animation: 500ms running fadeInUp;
    animation-name: slideInDown;
}



/*---=================================
   <!--Restu Hero Area Css-->
==================================---*/

.hero-area {
    background: url(../images/home-1/hero-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 900px;
    padding: 40px 0 0;
}

.hero-content {
    text-align: center;
    position: relative;
}

.hero-content h1 {
    font-size: 70px;
    text-transform: uppercase;
    line-height: 68px;
}

.hero-content h1 span {
    color: var(--primary-color);
    position: relative;
    display: inline-block;
}

.hero-content h1 span:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: -210px;
    top: 0;
    background: url(../images/home-1/hero-text-shape1.png);
    background-repeat: no-repeat;
    background-position: left;
}

.hero-content h1 span:after {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    right: -425px;
    top: 0;
    background: url(../images/home-1/hero-text-shape2.png);
    background-repeat: no-repeat;
    background-position: left;
}


.hero-shape-one {
    position: absolute;
    left: -166px;
    top: 12px;
    animation: rotateme 20s linear infinite;
}

.hero-shape-two {
    position: absolute;
    right: -166px;
    top: 12px;
    animation: rotateme 20s linear infinite;
}

.hero-area .row.add-bg.align-items-center {
    background: #252525;
    position: relative;
    padding: 35px 15px 38px;
    border-top: 5px solid var(--primary-color);
    margin-top: 45px;
    z-index: 99;
}

.booking-input-box {
    position: relative;
    width: 22%;
    display: inline-block;
}

.booking-input-box:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 90%;
    right: 10px;
    top: -2px;
    background: #66666673;
}

.booking-input-box.upper:before{
    background:none;
}

.booking-input-box h4 {
    font-size: 14px;
    line-height: 14px;
    color: #acacac;
    font-weight: 400;
    font-family: "Lora";
    margin-left: 3px;
}

.booking-input-box input {
    width: 78% !important;
    height: 50px;
    outline: 0 !important;
    background: transparent;
    border: transparent !important;
    color: #fff;
    padding: 0 6px 0 0 !important;
}

.booking-input-box input::placeholder{
    color:#fff;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    filter: brightness(24.3) invert(15);
}

.booking-input-box select {
    width: 78%;
    height: 50px;
    outline: 0;
    background: transparent;
    border: transparent;
    color:#fff;
}

.booking-input-box option {
    color: #222;
    font-family: "Lora";
    font-size: 16px !important;
    display: inline-block;
}

.booking-button {
    position: absolute;
    right: 28px;
    top: 50px;
    display: inline-block;
}

.booking-button button {
    background: var(--primary-color);
    padding: 12px 31px;
    border: transparent;
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-title);
    position: relative;
    z-index: 1;
    transition: 0.5s;
    border-radius: 30px;
}

.booking-button button:hover {
    color: var(--primary-color);
}

.booking-button button:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    z-index: -1;
    transition: 0.5s;
    border-radius: 30px;

}

.booking-button button:hover:before{
    width: 100%;
    left: 0;
}

.hero-slider-area {
    padding: 0 55px 0;
    margin-top: -97px;
}

.hero-slider-thumb img {
    width: 100%;
}

.hero-slider-area .owl-dots {
    text-align: center;
    position: relative;
    top: -23px;
}

.hero-slider-area .owl-dot {
    background: var(--primary-color);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
    margin: 0 4px;
}

.hero-slider-area .owl-dot.active{
    width: 14px;
    height: 14px;
}



/*---=================================
   <!--Restu About Area Css-->
==================================---*/
.about-area {
    padding: 208px 0 120px;
}

.section-title {
    margin-bottom: 56px;
}

.section-title h4 {
    font-size: 24px;
    color: var(--primary-color);
    font-family: var(--fonts-subtitle);
    font-weight: 400;
    margin: 0 0 20px;
}

.section-title h1 {
    font-size: 44px;
    text-transform: uppercase;
    line-height: 41px;
}

.section-title h1 span{
    color: var(--primary-color);
}

.section-title h1.style {
    margin-left: 155px;
    position: relative;
}

.section-title h1.style:before {
    position: absolute;
    content: "";
    width: 142px;
    height: 1px;
    left: -154px;
    top: 29px;
    background: var(--primary-color);
}

.section-title p.style {
    width: 80%;
    margin-left: 158px;
    margin-top: 24px;
}

.single-about-thumb img {
    width: 100%;
}

.about-right {
    margin-left: 65px;
    margin-top: 21px;
}

.project-button a {
    display: inline-block;
    background: var(--secondary-color);
    color: #fff;
    text-transform: uppercase;
    padding: 14px 29px;
    border-radius: 30px;
    font-size: 16px;
    position:relative;
    z-index: 1;
    transition: 0.5s;
}

.project-button a:hover{
    color:#fff;
}

.project-button a:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:var(--primary-color);
    z-index: -1;
    border-radius: 30px;
    transition: 0.5s;
}

.project-button a:hover:before{
    width: 100%;
    left: 0;
}

.about-right-desc p {
    margin-top: 36px;
}

.about-author {
    display: flex;
    align-items: center;
    gap: 19px;
    margin-top: 42px;
}

.about-author-content h4 {
    font-size: 22px;
    line-height: 26px;
    color: #1e1e1e;
    font-weight: 500;
}

.about-author-content p {
    margin-left: 29px;
    position: relative;
}

.about-author-content p:before {
    position: absolute;
    content: "";
    width: 18px;
    height: 1px;
    top: 15px;
    left: -26px;
    background: #c19d68;
}

.about-thumb-right {
    position: relative;
    top: 60px;
    left: -55px;
}


/*---=================================
   <!--Restu Room Area Css-->
==================================---*/
.room-area {
    background: #f7f6f2;
    padding: 120px 0 119px;
}

.room-area .section-title {
    margin-bottom: 62px;
    padding-bottom: 56px;
    border-bottom: 2px solid #61616126;
}

.room-area .container-fluid.add-margin {
    margin-left: 280px;
}

.single-room-box {
    position: relative;
    overflow: hidden;
    margin: 0 27px 0 0;
}

.single-room-content {
    width: 55%;
    padding: 0 0 0 39px;
    display: flex;
    align-items: center;
    background: #252525;
    justify-content: space-between;
    border: 5px solid var(--primary-color);
    border-top: transparent;
    border-right: transparent;
    position: absolute;
    bottom: -180px;
    left: 11px;
    transition: 0.5s;
}

.single-room-box:hover .single-room-content{
    bottom: 11px;
}

.room-title a {
    display: inline-block;
    color: #ffff;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 600;
    font-family: var(--fonts-title);
}

.room-title h4 {
    color: #acacac;
    font-size: 17px;
    font-weight: 400;
    font-family: var(--fonts-body);
    margin: 10px 0 0;
}

.room-price {
    background: var(--primary-color);
    text-align: center;
    padding: 13px 14px 10px;
}

.room-price h4 {
    font-size: 36px;
    color: #fff;
    text-transform: uppercase;
    font-family: var(--fonts-title);
    margin: 0;
    border: 1px dashed #fff;
    padding: 23px 21px 31px;
    font-weight: 800;
}

.room-area .owl-prev {
    display: inline-block;
    position: absolute;
    top: -31%;
    right: 31%;
}

.room-area .owl-prev i {
    width: 54px;
    height: 54px;
    border-radius: 27px;
    background-color: #000000;
    display: inline-block;
    text-align: center;
    color: #fff;
    line-height: 54px;
    transition: 0.5s;
}

.room-area .owl-next {
    display: inline-block;
    position: absolute;
    top: -31%;
    right: 35%;
}

.room-area .owl-next i {
    width: 54px;
    height: 54px;
    border-radius: 27px;
    background-color: #000000;
    display: inline-block;
    text-align: center;
    color: #fff;
    line-height: 54px;
    transition: 0.5s;
}

.room-area .owl-prev i,
.room-area .owl-next i:hover{
    background: var(--primary-color);
}


/*---=================================
   <!-- Restu Fecilities Area Css -->
==================================---*/

.fecilities-area {
    background: url(../images/home-1/facilities-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 118px 0 445px;
}

.single-fecilities-box {
    border: 1px solid rgba(255,255,255,0.15);
    text-align: center;
    padding: 37px 0 32px;
    transition: 0.5s;
    position: relative;
    z-index: 1;
}

.single-fecilities-box:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:var(--primary-color);
    transition: 0.5s;
}

.single-fecilities-box:hover:before{
    width: 100%;
    left: 0;
}

.fecilities-icon img{
    transition: 0.5s;
}

.single-fecilities-box:hover .fecilities-icon img{
    filter: brightness(0) invert(1);
}

.fecilities-content h4 {
    font-size: 22px;
    color: #ffff;
    margin: 65px 0 0;
    position: relative;
    font-weight: 500;
}

.fecilities-content h4:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 26px;
    left: 0;
    right: 0;
    top: -41px;
    margin: auto;
    background: rgba(255,255,255,0.5);
}

/*---=================================
   <!--Restu Service Area Css-->
==================================---*/

.service-area {
    padding: 100px 0 120px;
}

.service-area .section-title h1 {
    color: #ffff;
}

.service-area .row.add-margin {
    margin-top: -426px;
}

.single-service-box {
    text-align: center;
    background: #f7f6f2;
    padding: 47px 32px 38px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
}

.single-service-box:hover{
    margin-top: -13px;
}

.single-service-box:before {
    position: absolute;
    content: "";
    width: 86%;
    height: 87%;
    top: -14px;
    bottom: 0;
    left: 0;
    right: 0;
    border: 1px solid #686868;
    margin: auto;
    opacity: 0.2;
    z-index: -1;
}

.single-service-thumb {
    width: 90px;
    height: 90px;
    border-radius: 45px;
    background-color: #ffffff;
    text-align: center;
    line-height: 86px;
    margin: auto;
}

.service-content h4 {
    font-size: 20px;
    text-transform: uppercase;
    color: #000000;
    margin: 24px 0 20px;
}

.service-content p {
    margin: 0 0 37px;
}

.service-button a {
    background: #fff;
    width: 100%;
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 29px;
    color: #151515;
    font-family: var(--fonts-body);
    font-weight: 500;
    transition: 0.5s;
}

.service-button a:hover{
    color: var(--primary-color);
}

.service-button i {
    display: inline-block;
    width: 39px;
    height: 39px;
    border-radius: 20px;
    background-color: #f7f6f2;
    text-align: center;
    line-height: 39px;
    font-size: 26px;
    color: var(--primary-color);
    transform: rotate(-45deg);
    transition: 0.5s;
}

.service-button a:hover i{
    background: var(--primary-color);
    color:#fff;
}

/*---=================================
   <!-- Restu Place Area Css -->
==================================---*/
.place-area {
    background: #f7f6f2;
    padding: 119px 0 0;
    margin-bottom: -169px;
}

.place-area .section-title {
    margin-bottom: 0;
}

.place-area .row.add-border {
    margin-bottom: 62px;
    padding-bottom: 52px;
    border-bottom: 2px solid #61616126;
}

.place-area .project-button {
    text-align: right;
}

.place-area .project-button a {
    display: inline-block;
    background: transparent;
    position: relative;
    top: 9px;
    color: var(--secondary-color);
    border: 1px solid #15151538;
    transition: 0.5s;
}

.place-area .project-button a:hover{
    color:#fff;
}

/*place Images Area*/
.place-images-area {
    padding: 0 278px 0 39px;
}

.single-place-box {
    background: var(--secondary-color);
    padding: 114px 71px 88px 59px;
    margin-left: 9px;
}

.place-images-area .section-title h4 {
    margin: 0 0 13px;
}

.place-images-area .section-title h1 {
    text-transform: capitalize;
    font-size: 40px;
    color: #fff;
}

p.place-desc {
    color: #acacac;
    margin: 64px 0 36px;
    position: relative;
}

p.place-desc:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 30px;
    left: 0;
    top: -46px;
    background: var(--primary-color);
}

.place-button a i {
    display: inline-block;
    width: 56px;
    height: 56px;
    border-radius: 28px;
    background: var(--primary-color);
    color: #fff;
    font-size: 28px;
    transform: rotate(-45deg);
    text-align: center;
    line-height: 56px;
    transition: 0.5s;
}

.place-thumb img {
    width: 100%;
}


.white-bg {
    background: #fff;
    padding: 144px 0;
}



/*---=================================
   <!--Restu Video Area Css-->
==================================---*/
.video-area {
    background: url(../images/home-1/video-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 350px 0 350px;
    margin: 0 54px 0;
}

.video-area .section-title {
    margin-bottom: 48px;
}

.video-area .section-title h1 {
    color: #5cff26;
}

.video-area .section-title p {
    color: #5cff26;
    width: 44%;
    margin: auto;
    opacity: 0.7;
    margin-top: 35px;
}

.video-button i {
    display: inline-block;
    background: var(--primary-color);
    width: 120px;
    height: 120px;
    line-height: 120px;
    color: #5cff26;
    font-size: 32px;
    border-radius: 50%;
    position: relative;
}

.video-button i:after {
    position: absolute;
    content: "";
    width: 120px;
    height: 120px;
    top: 0;
    bottom: 0;
    left: -13px;
    right: 0;
    border-radius: 50%;
    margin: auto;
    border: 2px solid rgba(255,255,255,0.6);
}


/*---=================================
   <!--Restu Teastimonial Area Css-->
==================================---*/
.teastimonila-area {
    padding: 113px 0 120px;
    text-align: center;
}

.testimonial-rating ul li {
    display: inline-block;
    color: var(--primary-color);
    font-size: 17px;
    margin: 0 5px;
}

.single-testi-desc p {
    font-size: 26px;
    line-height: 36px;
    color: #686868;
    font-weight: 600;
    font-family: var(--fonts-title);
    width: 80%;
    margin: auto;
    margin-top: 36px;
}

.teasti-title h4 {
    font-size: 26px;
    font-weight: 600;
    margin-top: 38px;
}

.teastimonila-area .owl-prev {
    position: absolute;
    left: 0;
    top: 40%;
}

.teastimonila-area .owl-prev i {
    opacity: 0.302;
    width: 50px;
    height: 50px;
    line-height: 48px;
    border-radius: 25px;
    color: #000000;
    border: 1.5px solid #686868;
    font-size: 18px;
    transition: 0.5s;
}

.teastimonila-area .owl-next{
    position: absolute;
    right: 0;
    top: 40%;
}

.teastimonila-area .owl-next i {
    opacity: 0.302;
    width: 50px;
    height: 50px;
    line-height: 48px;
    border-radius: 25px;
    color: #000000;
    border: 1.5px solid #686868;
    font-size: 18px;
    transition: 0.5s;
}

.teastimonila-area .owl-next i,
.teastimonila-area .owl-prev i:hover{
    background:var(--primary-color);
    opacity: 1;
    color:#fff;
    border: 1.5px solid var(--primary-color);
}


/*---=================================
   <!--Restu Selections Area Css-->
==================================---*/
.selections-area {
    background: url(../images/home-1/selection-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 102px 0 73px;
    position: relative;
}

.single-selection-box {
    text-align: center;
}

.single-selection-title h1 {
    font-size: 44px;
    text-transform: uppercase;
    line-height: 38px;
    font-weight: 700;
}

.selection-item {
    margin-top: 49px;
    position: relative;
}

.selection-item:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 30px;
    left: 0;
    right: 0;
    bottom: -45px;
    background: var(--primary-color);
    margin: auto;
}

.selection-item:last-child:before{
    background: transparent;
}

.selection-item h4 {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 8px;
}

.selection-item p {
    margin-bottom: 61px;
}

.selection-images-1 {
    position: absolute;
    top: 0;
    left: 308px;
    z-index: 1;
}

.selection-images-2 {
    position: absolute;
    bottom: 0;
    left: 52px;
}

.selection-images-3 {
    position: absolute;
    right: 307px;
    bottom: 0;
}


/*---======================================
   <!--Restu Booking Area Css Style Two-->
=======================================---*/
.booking-area.style-two {
    background: url(../images/home-1/booking-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 0px 244px 0 37px;
    margin: 120px 52px 0;
}

.style-two .google-map {
    padding: 42px 0 34px;
}

.style-two .google-map iframe {
    width: 100%;
    height: 570px;
}

.style-two .single-booking-box {
    background-color: #1c1c1c;
    border: 1px solid rgba(255,255,255,0.15);
    text-align: center;
    padding: 59px 45px 60px;
    margin-left: 35px;
}

.style-two .booking-content {
    border: 1px solid rgba(255,255,255,0.15);
    padding: 25px 43px 25px;
    margin-bottom: 22px;
}

.style-two .booking-content h4 {
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    margin: 0 0 10px;
}

.style-two .booking-content p {
    color: #fff;
    opacity: 0.5;
    margin: 0;
}

.style-two .book-button a {
    display: inline-block;
    color: #fff;
    text-transform: uppercase;
    font-weight: 500;
    background: var(--primary-color);
    width: 100%;
    border-radius: 30px;
    padding: 17px 0;
    margin-top: 24px;
    position: relative;
    z-index: 1;
}

.style-two .book-button a:hover{
    color:var(--primary-color);
}

.style-two .book-button a:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    z-index: -1;
    border-radius: 30px;
    transition: 0.5s;
}

.style-two .book-button a:hover:before{
    width: 100%;
    left: 0;
}


/*---======================================
   <!--Restu Blog Area Css-->
=======================================---*/
.blog-area {
    background: #f7f6f2;
    padding: 119px 0 120px;
}

.blog-area .section-title p.style {
    width: 70%;
}

.blog-right {
    margin-top: 20px;
}

p.blog-desc {
    margin: 32px 0 0;
}

.single-thumb{
    overflow: hidden;
}

.single-thumb img {
    width: 100%;
    transition: 0.5s;
}

.single-blog-box:hover .single-thumb img{
    transform: scale(1.2);
}

.blog-content {
    background: #fff;
    padding: 28px 33px 25px;
}

.meta-blog {
    margin-bottom: 13px;
}

.meta-blog span {
    display: inline-block;
    color: #686868;
    margin-right: 44px;
}

.meta-blog i {
    display: inline-block;
    color: var(--primary-color);
    margin-right: 14px;
}

.blog-content a {
    display: inline-block;
    font-size: 26px;
    line-height: 36px;
    font-weight: 600;
    font-family: var(--fonts-title);
    color: var(--secondary-color);
    transition: 0.5s;
}

.blog-content a:hover{
    color:var(--primary-color);
}

.blog-button {
    border-top: 1px solid #00000036;
    margin: 19px 0 0;
    padding-top: 15px;
}

.blog-button a {
    display: inline-block;
    font-size: 16px !important;
    font-family: var(--fonts-title);
    color: var(--secondary-color);
    font-weight: 500;
    text-transform: uppercase;
    transition: 0.5s;
}

.single-blog-box:hover .blog-button a{
   color:var(--primary-color);
}

.blog-button i {
    display: inline-block;
    font-size: 16px;
    margin-left: 5px;
    color: #141212;
    transition: 0.5s;
}

.single-blog-box:hover .blog-button i{
   color: var(--primary-color);
}



/*---======================================
   <!-- Restu Footar Area Css -->
=======================================---*/
.footer-area {
    background: #151515;
    padding: 119px 0 35px;
}

.footer-widget-logo {
    margin-bottom: 20px;
}

p.footer-desc {
    color: #acacac;
    width: 90%;
    margin: 0 0 26px;
}

.footear-contact i {
    display: inline-block;
    color: var(--primary-color);
    margin-right: 7px;
}

.footear-contact span {
    color: #fff;
    display: inline-block;
    font-family: var(--fonts-body);
}

.footer-widget-title h4 {
    font-size: 22px;
    line-height: 38px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    position: relative;
    margin-bottom: 26px;
    margin-top: 6px;
}

.footer-widget-title h4:before {
    position: absolute;
    content: "";
    width: 20px;
    height: 1px;
    left: 0;
    bottom: 0;
    background:var(--primary-color);
}

.footer-widget-social-icon {
    margin-top: 36px;
}

.footer-widget-social-icon ul li{
    display: inline-block;
}

.footer-widget-social-icon ul li i {
    display: inline-block;
    color: #848484;
    font-size: 15px;
    border: 1px solid #848484;
    width: 35px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    border-radius: 50%;
    margin-right: 8px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
}

.footer-widget-social-icon ul li i:hover{
    color:#fff;
}

.footer-widget-social-icon ul li i:after{
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    left: 0;
    top:0;
    background:var(--primary-color);
    transform: scale(0);
    z-index: -1;
    border-radius: 50%;
    transition: 0.5s;
}

.footer-widget-social-icon ul li i:hover:after{
    transform: scale(1);
}

.footer-widget-menu ul li a {
    display: inline-block;
    font-size: 16px;
    line-height: 40px;
    color: #acacac;
    font-weight: 400;
    font-family:var(--fonts-body);
    position: relative;
}

.footer-widget-menu ul li a:hover {
    margin-left: 14px;
    color:var(--primary-color);
}

.footer-widget-menu ul li a:before {
    position: absolute;
    content: "";
    width: 5px;
    height: 5px;
    left: -16px;
    top: 19px;
    background:var(--primary-color);
    border-radius: 50%;
    opacity: 0;
    transition: 0.5s;
}

.footer-widget-menu ul li a:hover:before{
    opacity:1;
}

.footer-widget-gallery {
    margin-top: 48px;
}

.footer-widget-gallery img {
    float: left;
    margin: 0 9px 9px 0;
}

.single-newsletter-box input {
    background: transparent;
    width: 100%;
    height: 60px;
    text-align: center;
    padding: 0 14px;
    outline: 0;
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 35px;
    color: #fff;
}

.single-newsletter-box input::placeholder{
    color:rgba(255,255,255,0.3) ;
}

.single-newsletter-box button {
    background-color:var(--primary-color);
    width: 100%;
    padding: 16px 0;
    border: transparent;
    margin-top: 16px;
    font-size: 16px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family:var(--fonts-title);
    border-radius: 30px;
}

.footer-area .row.aa-boder {
    border-top: 1px solid rgba(255,255,255,0.1);
    margin-top: 110px;
    padding-top: 17px;
}

.footer-bottom-content h4 {
    font-size: 16px;
    color: #acacac;
    font-weight: 400;
    font-family:var(--body-fonts);
}

.footer-bottom-content ul li {
    display: inline-block;
    float: right;
}

.footer-bottom-content ul li a {
    display: inline-block;
    color: #acacac;
    font-size: 15px;
    margin-left: 54px;
    transition: 0.5s;
}

.footer-bottom-content ul li a:hover{
    color:var(--primary-color);
    text-decoration: underline;
}

.footer-widget-content p {
    color: #acacac;
}





/*---=====================================================================================================
   <!-- Restu Home Two All Css -->
=====================================================================================================---*/



/*---======================================
   <!-- Restu Top Area Css Style Two -->
=======================================---*/
.top-area.style-two {
    background: var(--secondary-color);
    padding: 17px 96px 1px;
}

.top-area.style-two .row.add-border {
    border-bottom: 1px solid rgba(255,255,255,0.10196078431372549);
    padding-bottom: 14px;
}

.style-two .top-info ul li {
    display: inline-block;
    margin-right: 35px;
    font-size: 16px;
    color: #ffffff;
    font-weight: 400;
    font-family: "Lora";
}

.style-two .top-info ul li i {
    color: var(--primary-color);
    display: inline-block;
    margin-right: 14px;
}

.style-two .top-social-icon {
    text-align: right;
}

.style-two .top-social-icon ul li {
    display: inline-block;
    margin-left: 12px;
}

.style-two .top-social-icon ul li.title {
    font-size: 16px;
    color: #ffffff;
    font-weight: 400;
    font-family: var(--fonts-body);
}

.style-two .top-social-icon ul li i {
    display: inline-block;
    color: #ffff;
    transition: 0.5s;
}

.style-two .top-social-icon ul li i:hover{
    color: var(--primary-color);
}



/*---======================================
   <!-- Restu Hero Area Css Style Two -->
=======================================---*/
.hero-area-bg {
    background: var(--secondary-color);
}

.style-two.hero-area {
    background: url(../images/home-2/hero-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 750px;
    padding: 0 0 102px;
    margin: 0 122px 0;
}

.style-two .hero-content h4 {
    font-size: 30px;
    color: #af9556;
    font-weight: 400;
    font-family: var(--fonts-subtitle);
    margin-bottom: 23px;
}

.style-two .hero-content h1 {
    font-size: 76px;
    text-transform: uppercase;
    line-height: 72px;
    color: #fff;
    font-weight: 600;
}

.style-two .hero-button a {
    display: inline-block;
    font-size: 16px;
    text-transform: uppercase;
    color: #161515;
    font-weight: 500;
    background: #fff;
    padding: 17px 40px;
    font-family: var(--fonts-title);
    border-radius: 30px;
    margin-top: 37px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
}

.style-two .hero-button a:hover{
    color:#fff;
}

.style-two .hero-button a::before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:var(--primary-color);
    border-radius: 35px;
    z-index: -1;
    transition: 0.5s;
}

.style-two .hero-button a:hover::before{
    width: 100%;
    left: 0;
}

.style-two .hero-button i {
    display: inline-block;
    color: var(--primary-color);
    font-size: 17px;
    position: relative;
    top: 1px;
    left: 7px;
    transition: 0.5s;
}

.style-two .hero-button a:hover i{
    color:#fff;
}

/*booking-area Home two */

.booking-area .row.add-bg.align-items-center {
    background: #252525;
    position: relative;
    padding: 35px 15px 38px;
    margin-top: 0;
    z-index: 99;
    margin: -75px 0;
}

.booking-input-box {
    position: relative;
    width: 22%;
    display: inline-block;
}

.booking-area .booking-input-box:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 90%;
    right: 27px;
    top: 2px;
    background: #66666673;
}

.booking-input-box.upper:before{
    background:none;
}

.booking-input-box h4 {
    font-size: 14px;
    line-height: 14px;
    color: #acacac;
    font-weight: 400;
    font-family: "Lora";
    margin-left: 3px;
}

.booking-input-box input {
    width: 78% !important;
    height: 50px;
    outline: 0 !important;
    background: transparent;
    border: transparent !important;
    color: #fff;
    padding: 0 6px 0 0 !important;
}

.booking-input-box input::placeholder{
    color:#fff;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    filter: brightness(24.3) invert(15);
}

.booking-input-box select {
    width: 78%;
    height: 50px;
    outline: 0;
    background: transparent;
    border: transparent;
    color:#fff;
}

.booking-input-box option {
    color: #222;
    font-family: "Lora";
    font-size: 16px !important;
    display: inline-block;
}

.booking-button {
    position: absolute;
    right: 28px;
    top: 50px;
    display: inline-block;
}

.booking-button button {
    background: var(--primary-color);
    padding: 12px 31px;
    border: transparent;
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-title);
    position: relative;
    z-index: 1;
    transition: 0.5s;
    border-radius: 30px;
}

.booking-button button:hover {
    color: var(--primary-color);
}

.booking-button button:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    z-index: -1;
    transition: 0.5s;
    border-radius: 30px;

}

.booking-button button:hover:before{
    width: 100%;
    left: 0;
}

/*---======================================
   <!-- Restu About Area Css Style Two -->
=======================================---*/
.about-area.style-two {
    background: #0dcaf0;
    padding: 80px 0 20px;
}

.about-area.style-two .section-title {
    margin-bottom: 6px;
}

.about-area.style-two .section-title h1 {
    color: #fff;
}

.style-two p.section-desc-2 {
    color: #acacac;
    width: 92%;
    margin: 25px 0 0;
}

.style-two .about-thumb {
    position: relative;
    left: -36px;
}

.style-two .about-conuter-box {
    display: inline-block;
    margin-right: 95px;
}

.style-two .about-counter-content h4 {
    font-size: 70px;
    color: var(--primary-color);
    font-weight: 500;
    display: inline-block;
    margin: 0;
}

.style-two .about-counter-content span {
    font-size: 50px;
    color: var(--primary-color);
    font-weight: 500;
    display: inline-block;
}

.style-two .about-counter-content p {
    margin-top: 10px;
    color: #acacac;
}

.style-two .animation-bar {
    width: 100%;
    height: 1px;
    margin-top: 9px;
    position: relative;
    background-color: rgba(255,255,255,0.10196078431372549);
}

.style-two .animation-bar:before {
    position: absolute;
    content: "";
    width: 50px;
    height: 1px;
    top: 0;
    left: 0;
    background:var(--primary-color);
   transition: 0.5s;
    -webkit-animation-duration: 6s;
    animation-duration: 6s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    animation-duration: 6s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-name: MOVE-BG;
}

@-webkit-keyframes MOVE-BG {
  from {
        transform: translateX(0);
  }
  to {
     transform: translateX(590px);
  }
}

@keyframes MOVE-BG {
    from {
          transform: translateX(0);
    }
    to {
       transform: translateX(590px);
    }
  }

.style-two .about-right-box {
    display: flex;
    align-items: center;
    gap: 123px;
}

.style-two .about-author-content h4 {
    color: #ffffff;
}

.style-two .about-author-content p {
    color: #acacac;
}

.style-two .about-author-singthure {
    position: relative;
    top: 16px;
}

.style-two .about-author-singthure:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 52px;
    left: -48px;
    top: 8px;
    background-color: rgba(255,255,255,0.2);
}


/*---======================================
   <!-- Restu Service Area Css Style Two -->
=======================================---*/
.style-two.service-area {
    padding: 100px 0 120px;
    background: var(--secondary-color);
}

.style-two .single-service-item-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 31px;
    border-top: 1px solid rgba(255,255,255,0.10196078431372549);
    padding-top: 23px;
}

.style-two .servcie-item-content {
    display: flex;
    align-items: center;
    gap: 42px;
}

.style-two .service-item-numbar h1 {
    opacity: 0.102;
    font-size: 60px;
    line-height: 50px;
    text-transform: uppercase;
    color: #ffffff;
    font-family: var(--fonts-body);
    transition: 0.5s;
}

.style-two .single-service-item-box:hover .service-item-numbar h1{
    color:var(--primary-color);
    opacity: 1;
}


.style-two .service-item-title h1 {
    font-size: 32px;
    line-height: 50px;
    color: #ffffff;
    font-weight: 600;
    margin: 0;
}

.style-two .service-item-title h4 {
    font-size: 16px;
    color: var(--primary-color);
    font-weight: 400;
    font-family: var(--fonts-body);
    margin: 4px 0 0;
}

.style-two .service-item-button i {
    display: inline-block;
    border: 1px solid rgba(255,255,255,0.2);
    width: 64px;
    height: 64px;
    color: #fff;
    text-align: center;
    line-height: 64px;
    border-radius: 32px;
    transform: rotate(-44deg);
    position: relative;
    top: 6px;
    transition: 0.5s;
}

.style-two .single-service-item-box:hover .service-item-button i{
    background:var(--primary-color);
}

.style-two .service-thumb {
    position: relative;
    left: 37px;
}

.style-two .service-price-box {
    background: var(--primary-color);
    display: inline-block;
    text-align: center;
    padding: 38px 42px 27px;
    position: absolute;
    right: 45px;
    bottom: 20px;
}

.style-two .service-price-box h4 {
    font-size: 34px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 600;
    margin: 0 0 22px;
    font-family: var(--fonts-body);
}

.style-two .service-price-box p {
    color: #ffffff;
    font-size: 18px;
    margin: 0;
}

.style-two .service-price-box a i {
    display: inline-block;
    color: #fff;
    font-size: 18px;
    margin-top: 21px;
}



/*---======================================
   <!-- Restu Room Area Css Style Two -->
=======================================---*/

.room-area.style-two {
    background: #1c1c1c;
    padding: 117px 0 118px;
}

.style-two.room-area .section-title {
    margin-bottom: 0;
    padding-bottom: 52px;
    border-bottom: transparent;
}

.style-two.room-area .section-title h1 {
    color: #fff;
}

.style-two .single-room-box {
    position: relative;
    overflow: hidden;
    margin: 0 15px 0;
}

.style-two .single-room-thumb {
    overflow: hidden;
}

.style-two .single-room-thumb img {
    transition: 0.5s;
    width: 100%;
}

.style-two .single-room-box:hover .single-room-thumb img{
    transform: scale(1.1);
}

.style-two .room-icon {
    position: absolute;
    top: 20px;
    right: 24px;
}

.style-two .room-icon i {
    width: 50px;
    height: 50px;
    border-radius: 25px;
    background-color: #ffffff;
    display: inline-block;
    text-align: center;
    line-height: 50px;
    font-size: 21px;
    color: var(--primary-color);
    transition: 0.5s;
}

.style-two .room-icon i:hover{
    background:var(--primary-color);
    color:#fff;
}

.style-two .room-content {
    padding: 29px 32px 21px;
    border:1px solid var(--secondary-color);
    border-top: transparent;
    background: var(--secondary-color);
    transition: 0.5s;
}

.style-two .single-room-box:hover .room-content{
    border:1px solid rgba(255,255,255,0.1);
    background: transparent;
}

.style-two .room-content h4 {
    text-transform: capitalize;
    font-size: 28px;
    color: #ffffff;
    font-weight: 600;
    margin: 0 0 23px;
}

.style-two .room-content ul li i {
    display: inline-block;
    color: var(--primary-color);
    font-size: 20px;
    padding-right: 4px;
    position: relative;
    top: 3px;
}

.style-two .room-content ul li {
    font-size: 14px;
    line-height: 29px;
    color: #acacac;
    font-weight: 400;
}

.style-two .room-bottom {
    border:1px solid var(--secondary-color);
    border-top: 1px solid rgba(255,255,255,0.1);
    padding: 15px 30px 18px;
    display: flex;
    justify-content: space-between;
    background: var(--secondary-color);
    align-items: center;
    transition: 0.5s;
}

.style-two .single-room-box:hover .room-bottom{
    background: transparent;
    border: 1px solid rgba(255,255,255,0.1);
}

.style-two .room-rewiew ul li {
    display: inline-block;
}

.style-two .room-rewiew ul li i{
    color: var(--primary-color);
    display: inline-block;
}

.style-two .room-button a {
    font-size: 15px;
    line-height: 38px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-title);
    transition: 0.5s;
}

.style-two .room-button a:hover{
    color:var(--primary-color);
}

.style-two.room-area .owl-dots {
    position: relative;
    text-align: center;
    padding-top: 60px;
}

.style-two.room-area .owl-dot {
    position: relative;
    display: inline-block;
    margin: 0 9px;
    width: 12px;
    height: 12px;
    border-radius: 6px;
    background-color: rgba(255,255,255,0.2);
}

.style-two.room-area .owl-dot.active{
    background:var(--primary-color);
    position: relative;
}

.style-two.room-area .owl-dot.active:before {
    position: absolute;
    content: "";
    width: 22px;
    height: 22px;
    left: -5px;
    top: -5px;
    border: 1px solid var(--primary-color);
    border-radius: 30px;
}




/*---======================================
   <!-- Restu Facilities Area Css Style Two -->
=======================================---*/
.style-two.fecilities-area {
    padding: 117px 0 118px;
    background: var(--secondary-color);
}

.style-two.fecilities-area .section-title h1 {
    color: #fff;
}

/*---======================================
   <!-- Restu Video Area Css Style Two -->
=======================================---*/
.style-two.video-area {
    background: url(../images/home-2/video-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 139px 0 152px;
    margin: 0 0 0;
}

/*---======================================
   <!-- Restu Hotle Fecilities Area Css -->
=======================================---*/
.hotel-fecilities {
    background: var(--secondary-color);
    padding: 120px 0 39px;
}

.hotel-fecilities .row.align-items-center {
    margin-bottom: 82px;
}

.hotel-fecilities-box {
    position: relative;
}

.hotel-fecilities-content h4 {
    font-size: 90px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 600;
    font-family: var(--fonts-body);
    opacity: 0.2;
    position: absolute;
    right: 103px;
    top: -45px;
}

.hotel-fecilities-content h5 {
    font-size: 26px;
    line-height: 26px;
    color: var(--primary-color);
    font-family: var(--fonts-subtitle);
    font-weight: 400;
    margin: 0;
}

.hotel-fecilities-content h1 {
    font-size: 40px;
    color: #ffffff;
    font-weight: 600;
    margin: 16px 0 62px;
    position: relative;
}

.hotel-fecilities-content h1:before {
    position: absolute;
    content: "";
    width: 2px;
    height: 33px;
    left: 0;
    bottom: -52px;
    background: var(--primary-color);
}

.hotel-fecilities-content p {
    color: #acacac;
    width: 82%;
    margin: 66px 0 0;
}

.hotel-fecilities-content a i {
    display: inline-block;
    width: 56px;
    height: 56px;
    line-height: 55px;
    border-radius: 28px;
    border: 2px solid rgba(255,255,255,0.1);
    color: rgba(255,255,255,0.7);
    text-align: center;
    transform: rotate(-45deg);
    margin-top: 28px;
    transition: 0.5s;
}

.hotel-fecilities-content a i:hover{
    background:var(--primary-color);
    color:#fff;
}

.hotel-fecilities-thumb {
    position: relative;
    left: 106px;
}

.hotel-fecilities-box.two {
    position: relative;
    left: 101px;
}

.hotel-fecilities-thumb.two {
    left: 70px;
}



/*---=======================================================
   <!-- Restu Teastimonial Area Css Style Two-->
======================================================---*/

.style-two.teastimonial-area {
    background: url(../images/home-2/teasti-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 120px 0 0px;
}

.style-two.teastimonial-area .section-title {
    margin-bottom: 44px;
}

.style-two.teastimonial-area .section-title h1 {
    color: #fff;
}

.style-two .teasti-content p {
    opacity: 0.702;
    font-size: 18px;
    line-height: 32px;
    color: #ffffff;
    font-weight: 400;
    font-style: italic;
    width: 90%;
    margin: 26px 0 23px;
}

.style-two .teasti-rating ul li {
    display: inline-block;
    margin-right: 5px;
}

.style-two .teasti-rating ul li i{
    display: inline-block;
    color:var(--primary-color);
}

.style-two.teastimonial-area .about-author {
    display: flex;
    align-items: center;
    gap: 19px;
    margin-top: 35px;
}

.style-two .single-form-box {
    border: 2px solid rgba(255,255,255,0.15);
    padding: 48px 46px 66px;
    margin-left: 100px;
    border-radius: 10px;
}

.style-two .form-content h4 {
    font-size: 32px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 600;
    text-align: center;
    margin-bottom: 30px;
}

.style-two .single-input-box input {
    width: 100%;
    height: 62px;
    background: transparent;
    padding: 6px 23px;
    text-transform: capitalize;
    border-radius: 4px;
    margin-bottom: 17px;
    font-size: 15px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 400;
    border: 2px solid rgba(255,255,255,0.15);
    outline: 0;
    border-radius: 30px;
}

.style-two .single-input-box input::placeholder{
    opacity: 0.502;
    font-size: 15px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 400;
    font-family: var(--fonts-secondary);
}

.style-two .single-input-box textarea {
    width: 100%;
    height: 167px;
    background: transparent;
    border-radius: 33px;
    border: 2px solid rgba(255,255,255,0.15);
    outline: 0;
    color: #fff;
    padding: 15px 23px 18px;
}

.style-two .single-input-box textarea::placeholder{
    opacity: 0.502;
    font-size: 15px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 400;
    font-family: var(--fonts-secondary);
}

.style-two .submit-button button {
    width: 100%;
    height: 59px;
    background: var(--primary-color);
    border: 1px solid var(--primary-color);
    outline: 0;
    font-size: 16px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-title);
    border-radius: 30px;
    transition: 0.5s;
    margin-top: 19px;
}

.style-two .submit-button button:hover{
    background: transparent;
    color:var(--primary-color);
}


.style-two .submit-button i {
    display: inline-block;
    position: relative;
    top: 1px;
    left: 6px;
}





/*
<!-- =====================================-->
<!-- Restu Text Brand Section Css Home Two  -->
<!-- =====================================-->*/
.restu-text-section {
    position: relative;
    background: var(--secondary-color);
    z-index: 1;
    padding: 104px 0 97px;
}

.restu-text-section .inner-container {
    max-width: 1812px;
    margin: 0 auto;
}

.restu-text-section .marquee {
    position: relative;
    --duration: 30s;
    --gap: 0px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    gap:0px;
}

.restu-text-section .marquee-block {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    gap: 0;
    min-width: 87%;
    -webkit-animation: scroll 30s linear infinite;
    animation: scroll 30s linear infinite;
}

.restu-text-section .marquee-block .content-box {
    position: relative;
    margin-right: 0px;
    padding: 7px 0 0;
}

.restu-text-section .marquee-block .content-box:last-child {
    margin-right:0px;
}

.restu-text-section .marquee-block .content-box:last-child::before {
    display: none;
}

.restu-text-section .marquee-block .content-box .title{
    margin:0;
}

.restu-text-section .marquee-block .content-box h6.title {
    display: inline-block;
    padding: 0 48px;
    opacity: 0.702;
    font-size: 40px;
    line-height: 26px;
    color: #ffffff;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--fonts-title);
}

.restu-text-section .marquee-block .content-box h6.title img {
    position: relative;
    left: -49px;
    top: -6px;
}

  @-webkit-keyframes scroll {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(calc(-100% - var(--gap)));
      transform: translateX(calc(-100% - var(--gap)));
    }
  }
  @keyframes scroll {
    0% {
      -webkit-transform: translateX(0);
      transform: translateX(0);
    }
    100% {
      -webkit-transform: translateX(calc(-100% - var(--gap)));
      transform: translateX(calc(-100% - var(--gap)));
    }
  }


/*
<!-- =====================================-->
<!-- Restu Blog Area Css Home Two  -->
<!-- =====================================-->*/
.style-two.blog-area {
    background: #1c1c1c;
    padding: 120px 0 96px;
}

.style-two.blog-area .section-title h1 {
    color: #ffff;
}

.style-two.blog-area .single-blog-box {
    margin-bottom: 20px;
}

.style-two.blog-area .single-blog-thumb{
    overflow: hidden;
}

.style-two.blog-area .single-blog-thumb img {
    width: 100%;
    transition: 0.5s;
}

.style-two.blog-area .single-blog-box:hover .single-blog-thumb img{
    transform: scale(1.1);
} 

.style-two.blog-area .blog-content {
    border-top: transparent;
    padding: 31px 31px 24px;
    background: transparent;
    border: 1px solid rgba(255,255,255,0.1);
}

.style-two.blog-area .meta-blog span {
    display: inline-block;
    margin-right: 28px;
    margin-left: 14px;
    margin-bottom: 2px;
    position: relative;
    font-size: 16px;
    line-height: 26px;
    text-transform: uppercase;
    color: #acacac;
    font-weight: 400;
}

.style-two.blog-area .meta-blog span:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    background-color: #af9556;
    left: -15px;
    top: 9px;
}

.style-two.blog-area .blog-content a {
    display: inline-block;
    font-family: var(--fonts-title);
    transition: 0.5s;
    font-size: 26px;
    line-height: 34px;
    color: #ffffff;
    font-weight: 600;
    padding-right: 40px;
}

.style-two.blog-area .blog-content a:hover{
    text-decoration: underline;
    color:var(--primary-color);
}

.style-two.blog-area .blog-button {
    border: 1px solid rgba(255,255,255,0.1);
    border-top: transparent;
    padding: 20px 29px;
    margin: 0;
}

.style-two.blog-area .blog-button a {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    text-transform: uppercase;
    color: #acacac;
    font-weight: 500;
    font-family: var(--fonts-title);
    transition: 0.5s;
}

.style-two.blog-area .blog-button a:hover{
   color:var(--primary-color);
}

.style-two.blog-area .blog-button i {
    display: inline-block;
    font-size: 20px;
    transition: 0.5s;
    color: #acacac;
}

.style-two.blog-area .blog-button a:hover i{
   color:var(--primary-color);
}








/*Inner Pages All Css*/


.breadcumb-area {
    background: url(../images/inner/breadcumb-bg1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    padding: 157px 0 172px;
}

.breadcumb-content {
    text-align: center;
}

.breadcumb-content h4 {
    font-size: 60px;
    color: #ffff;
    text-transform: uppercase;
    margin: 0 0 9px;
}

.breadcumb-content ul li {
    display: inline-block;
    color: #ffff;
    font-family: var(--fonts-body);
    text-transform: uppercase;
}

.breadcumb-content ul li a {
    display: inline-block;
    color: var(--primary-color);
}

/*header-inner-style*/
.header-area.inner-style {
    background: #fff;
}

.inner-style.sticky {
    background:#fff !important;
}

.inner-style .header-menu {
    text-align: right;
}

.inner-style .header-menu ul {
    display: inline-block;
}

.inner-style .header-menu ul li{
    margin-right: 50px;
}

.inner-style .header-menu ul li i {
    color: var(--body-color);
}

.inner-style .header-menu ul li a {
    color: #686868;
}

.inner-style .header-sidbar i {
    display: inline-block;
    color: var(--primary-color);
    font-size: 36px;
    margin-right: 0;
    position: relative;
    top: 10px;
    margin-left: 23px;
}

.inner-style .header-button a {
    border-radius: 2px;
    position: relative;
    border: 1px solid var(--primary-color);
}

.inner-style .header-button a:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    z-index: -1;
    border-radius: 2px;
    transition: 0.5s;
}

.inner-style .header-button a:hover:before{
    width: 100%;
    left: 0;
}



/*---======================================
   <!--Restu About Area Css Inner Pages-->
=======================================---*/
.about-area.inner-style {
    padding: 109px 0 120px;
}

.inner-style .about-right {
    margin-left: 0;
    margin-top: 0;
}

.inner-style .section-title {
    margin-bottom: 25px;
}

.inner-style .section-title p {
    width: 94%;
    margin: 26px 0 0;
}

.inner-style p.about-inner-desc {
    margin: 0;
    width: 90%;
}

.inner-style .about-address p {
    background-color: #f8f6f3;
    margin: 0;
    padding: 14px 145px 17px 30px;
    margin-top: 37px;
    color: #1e1e1e;
    font-weight: 500;
}


/*Luxury-button-css*/

.luxury-button {
    margin-top: 38px;
    position: relative;
    display: inline-block;
}

.luxury-button:before {
    position: absolute;
    content: "";
    width: 30px;
    height: 1px;
    left: 0;
    bottom: -11px;
    background:var(--primary-color);
    margin: auto;
}

.luxury-button a {
    display: inline-block;
    background: var(--primary-color);
    padding: 13px 28px;
    font-size: 16px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family: var(--fonts-body);
    position: relative;
    z-index: 1;
    border: 1px solid var(--primary-color);
    transition: 0.5s;
}

.luxury-button a:hover{
    color: #c19d68;
}

.luxury-button a:before{
    position: absolute;
    content: "";
    width: 0;
    height: 100%;
    left: 50%;
    top:0;
    background:#fff;
    z-index: -1;
    transition: 0.5s;
}


.luxury-button a:hover:before{
    width: 100%;
    left:0;
}


/*---============================================
   <!-- Restu Room List Area Css -->
===========================================---*/
.room-list-area.inner-style {
    padding: 119px 0 27px;
}

.single-room-list-box {
    margin-right: 41px !important;
    margin-bottom: 90px;
}

.inner-style .room-list-thumb {
    position: relative;
}

.inner-style .room-list-thumb img {
    width: 100%;
}

.inner-style .room-list-info {
    background: #f7f6f2;
    padding: 9px 24px;
    width: 59%;
    position: absolute;
    right: 0;
    bottom: 0;
}

.inner-style .room-list-info span {
    display: inline-block;
    color: var(--primary-color);
    margin-right: 21px;
}

.inner-style .room-list-info strong {
    color: var(--body-color);
    font-family: var(--fonts-body);
    font-weight: 400;
}

.inner-style .room-list-content {
    padding: 0 0 0 30px;
}

.inner-style .room-list-content h4 {
    color: #000000;
    text-transform: uppercase;
    font-size: 32px;
    font-weight: 500;
    margin: 25px 0 18px;
}

.inner-style a.room-list-button {
    display: inline-block;
    background: var(--primary-color);
    color: #fff;
    font-family: var(--fonts-title);
    text-transform: uppercase;
    padding: 14px 25px;
    font-weight: 500;
    border-radius: 30px;
    margin-top: 22px;
}


/*
<!-- ========================================-->
<!-- Restu Find Room Area Css-->
<!-- ========================================-->*/

.find-room-area {
    background: #f8f6f3;
    padding: 102px 0 104px;
}

.find-room-area .row.add-bg {
    background: #1E1E1E;
    position: relative;
    padding: 35px 15px 38px;
    border-top: 4px solid #c19d68;
    margin-bottom: 85px;
    margin-top: 0;
}

.find-room-area .room-single-box {
    position: relative;
    margin: 0 0;
    margin-bottom: 20px;
}

.find-room-area .room-bottom {
    background: #fff;
}

.room-single-box {
    position: relative;
    margin: 0 15px;
}

.room-thumb {
    position: relative;
    overflow: hidden;
}

.room-thumb img {
    width: 100%;
    transition: 0.5s;
}

.room-single-box:hover .room-thumb img{
    transform: scale(1.1);
}

.room-details-button {
    position: absolute;
    bottom: 0;
    left: -200px;
    transition: 0.5s;
}

.room-single-box:hover .room-details-button{
    left:0;
} 

.room-details-button a {
    display: inline-block;
    background: #1E1E1E;
    font-size: 15px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family:var(--fonts-title);
    padding: 9px 30px;
    position: relative;
    z-index: 1;
}

.room-details-button a:before{
    position: absolute;
    content: "";
    width:0;
    height:100%;
    left: 50%;
    top: 0;
    background:var(--primary-color);
    z-index: -1;
    transition: 0.5s;
}

.room-details-button a:hover:before{
  width: 100%;
  left:0;
}

.room-details-button i {
    display: inline-block;
    font-size: 14px;
    position: relative;
    left: 7px;
    top: 1px;
}

.room-pricing {
    background: var(--primary-color);
    display: inline-block;
    padding: 3px 21px;
    position: absolute;
    top: 10px;
    right: 10px;
}

.room-pricing span {
    display: inline-block;
    font-size: 14px;
    color: #ffffff;
    font-weight: 400;
    font-family: "Lora";
    text-transform: uppercase;
    padding-right: 18px;
    position: relative;
}

.room-pricing span:last-child{
    padding-right: 0;
}


.room-pricing span:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 10px;
    top: 8px;
    left: -11px;
    background: #fff;
}

.room-pricing span.dolar:before{
   background:transparent;
}

.room-content {
    padding: 16px 32px 7px;
    border: 1px solid rgba(30,30,30,0.1);
    border-top: transparent;
    background:#fff;
}

.room-content h4 {
    font-size: 14px;
    color: var(--primary-color);
    font-weight: 600;
    text-transform: uppercase;
}

.room-content a {
    display: inline-block;
    font-size: 28px;
    color: #1e1e1e;
    font-weight: 600;
    font-family:var(--fonts-title);
    margin: 14px 0 17px;
    transition: 0.5s;
}

.room-content a:hover{
  color:#C29D69;
}

.room-content p {
    font-size: 15px;
    font-weight: 400;
    font-family: var(--fonts-body);
    color: #686868;
    text-transform: uppercase;
}

.room-bottom {
    border: 1px solid rgba(30,30,30,0.1);
    border-top: none;
    padding: 15px 25px 18px;
    display: flex;
    justify-content: space-between;
}

.room-bottom-icon span {
    display: inline-block;
    font-size: 16px;
    color: #616161;
    font-weight: 400;
    font-family:var(--fonts-body);
    position: relative;
}

.room-bottom-icon span:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 24px;
    right: -74px;
    top: 4px;
    background: rgba(30,30,30,0.1);
}

.room-bottom-icon img {
    margin-right: 10px;
    display: inherit !important;
}

.coustomar-rating ul li {
    display: inline-block;
}

.coustomar-rating ul li i {
    display: inline-block;
    color: var(--primary-color);
    margin-left: 3px;
}


/*
<!-- ========================================-->
<!-- Restu Contact Area Css-->
<!-- ========================================-->*/
.inner-style.contact-area {
    padding: 120px 0 120px;
}

.inner-style .row.add-backgroun {
    background-color: #f8f6f3;
    padding: 98px 67px 101px;
}

.inner-style .single-contact-box {
    display: flex;
    align-items: center;
    gap: 18px;
    margin-bottom: 41px;
    position: relative;
}

.inner-style .single-contact-box:before {
    position: absolute;
    content: "";
    width: 95%;
    height: 1px;
    left: 5px;
    bottom: -19px;
    background: #6161612b;
}

.inner-style .single-contact-box:last-child:before{
    background: transparent;
}

.inner-style .contact-icon i {
    background: #ffff;
    color: var(--primary-color);
    width: 65px;
    height: 65px;
    text-align: center;
    line-height: 65px;
    border-radius: 50%;
    display: inline-block;
}

.inner-style .contact-title h4 {
    font-size: 15px;
    line-height: 26px;
    color: #616161;
    font-weight: 400;
    font-family:var(--fonts-body);
}

.inner-style .contact-title p {
    font-size: 22px;
    color: #1e1e1e;
    font-weight: 500;
    font-family:var(--fonts-title);
}

.inner-style .single-contact-form {
    background-color: #272727;
    padding: 42px 53px 60px;
    text-align: center;
}

.inner-style .contact-content h4 {
    font-size: 28px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 600;
    margin-bottom: 26px;
}

.inner-style .single-input-box input {
    background: transparent !important;
    border: 1px solid #acacac4f;
    color: #ffff;
    outline: 0;
    width: 100%;
    height: 60px;
    position: relative;
    margin-bottom: 11px;
    padding: 0 21px;
}

.inner-style .single-input-box input::placeholder{
    color: #acacac;
}

.inner-style .single-input-box select {
    background: transparent !important;
    border: 1px solid #acacac4f;
    color: #acacac;
    outline: 0;
    width: 100%;
    height: 60px;
    position: relative;
    padding: 0 19px;
    margin-top: 5px;
    text-transform: capitalize;
}

.inner-style .single-input-box textarea {
    background: transparent !important;
    border: 1px solid #acacac4f;
    color: #acacac;
    outline: 0;
    width: 100%;
    height: 120px;
    position: relative;
    padding: 9px 19px;
    margin-top: 17px;
}

.inner-style .single-input-box textarea::placeholder{
    color: #acacac;
}

.inner-style .single-input-box button {
    background:var(--primary-color);
    font-size: 16px;
    text-transform: uppercase;
    color: #ffffff;
    font-weight: 500;
    font-family:var(--fonts-title);
    width: 100%;
    border: transparent;
    padding: 16px 0;
    margin-top: 13px;
    position:relative;
    z-index:1;
    transition:0.5s;
}

.inner-style .single-input-box button:hover {
    color: var(--primary-color);
}

.inner-style .single-input-box button:before{
    position:absolute;
    content:"";
    width:0;
    height:100%;
    left:50%;
    top:0;
    background:#fff;
    z-index:-1;
    transition:0.5s;
}

.inner-style .single-input-box button:hover:before{
    width:100%;
    left:0;
}


/*inner Place Area*/
.place-area.inner-pages {
    margin-bottom: 0;
    padding: 119px 0 0;
    background: #fff;
}

.inner-pages .place-images-area {
    padding: 0 278px 119px 39px;
}

.place-images-area.two {
    padding: 0 44px 118px 285px;
}

.inner-pages .single-place-box {
    margin-left: 0;
}



/*
<!-- ========================================-->
<!-- Restu Team Area Css -->
<!-- ========================================-->*/
.team-area {
    padding: 103px 0 94px;
}

.team-area .single-team-box {
    background: #f7f6f2;
    padding: 0 0 40px;
    text-align: center;
    border-radius: 170px;
    margin-bottom: 26px;
}

.team-area .team-thumb img {
    width: 100%;
}

.team-content {
    padding: 0 46px 0;
}

.team-area .team-content h4 {
    font-size: 22px;
    text-transform: uppercase;
    margin: 27px 0 0;
}

.team-area .team-content p {
    color: #686868;
    margin: 8px 0 22px;
    font-size: 18px;
    font-family: var(--fonts-title);
    border-bottom: 1px solid var(--primary-color);
    padding-bottom: 16px;
}

.team-area .team-social-icon ul li {
    display: inline-block;
}

.team-area .team-social-icon ul li i {
    display: inline-block;
    background: #fff;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border-radius: 50%;
    font-size: 15px;
    color: var(--primary-color);
    margin: 0 2px 0;
    border: 1px solid #6868686e;
    transition: 0.5s;
}

.team-area .team-social-icon ul li i:hover{
    background:var(--primary-color);
    color:#fff;
}

/*
<!-- ========================================-->
<!-- Restu Pricing Area Css -->
<!-- ========================================-->*/
.pricing-area {
    padding: 102px 0 85px;
}

.single-pricing-box {
    background: #f7f6f2;
    padding: 13px 30px 42px;
    margin-bottom: 30px;
}

.single-pricing-title h4 {
    background: var(--primary-color);
    margin: 0;
    text-align: right;
    padding: 8px 19px;
    font-size: 18px;
    color: #fff;
    text-transform: uppercase;
    font-weight: 600;
    position: relative;
    font-family: var(--fonts-title);
}

.single-pricing-title h4:before {
    position: absolute;
    content: "";
    width: 60%;
    height: 100%;
    left: 0;
    top: -13px;
    background: #fff;
    clip-path: polygon(0% 20%, 60% 20%, 79% 20%, 88% 50%, 78% 82%, 82% 82%, 0% 82%);
    padding: 32px 0;
}

.pricing-body {
    background: #fff;
    padding: 35px 36px 26px;
    margin-top: 17px;
}

.pricing-body-title h4 {
    font-size: 20px;
    text-transform: uppercase;
    margin: 0 0 17px;
    font-weight: 600;
}

.single-price {
    border-bottom: 1px solid #af955659;
    margin-bottom: 26px;
    padding-bottom: 32px;
}

.single-price h4 {
    font-size: 40px;
    font-weight: 600 !important;
    text-transform: uppercase;
    margin: 0;
    font-family: var(--fonts-body);
    font-weight: 400;
}

.single-price span {
    display: inline-block;
    font-size: 16px !important;
    text-transform: uppercase;
}

.pricing-list-item ul li {
    color: var(--body-color);
    font-family: var(--fonts-body);
    margin-bottom: 13px;
    margin-left: 24px;
    position: relative;
}

.pricing-list-item ul li:before {
    position: absolute;
    content: "";
    width: 10px;
    height: 10px;
    left: -25px;
    top: 9px;
    background: var(--primary-color);
    border-radius: 50%;
}

.pricing-button a {
    display: inline-block;
    text-transform: uppercase;
    color: var(--primary-color);
    font-family: var(--fonts-title);
    border: 1px solid var(--primary-color);
    padding: 15px 0px;
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    margin-top: 40px;
    transition: 0.5s;
}

.pricing-button a:hover{
    background:var(--primary-color);
    color:#fff;
}

.google-map iframe {
    width: 100%;
    height: 600px;
}

/*
<!-- ========================================-->
<!--Restu Contact Info Area Css-->
<!-- ========================================-->*/
.contact-info-area {
    padding: 118px 0 0;
}

.single-info-box {
    display: flex;
    align-items: center;
    gap: 25px;
    border: 1px solid rgba(30,30,30,0.15);
    padding: 29px 30px 29px;
    border-radius: 5px;
    position: relative;
    z-index: 1;
}

.single-info-box:before{
    position: absolute;
    content: "";
    width:0;
    height: 100%;
    left: 0;
    top: 0;
    background: var(--primary-color);
    border-radius: 5px;
    z-index: -1;
    transition: 0.5s;
}

.single-info-box:hover:before{
    width: 100%;
}

.single-info-icon i {
    display: inline-block;
    color: var(--primary-color);
    border: 2px solid var(--primary-color);
    width: 70px;
    height: 70px;
    border-radius: 50%;
    text-align: center;
    line-height: 70px;
    font-size: 20px;
    transition: 0.5s;
}

.single-info-box:hover .single-info-icon i{
    color: #fff;
    border: 2px solid #fff;
}

.single-info-content h4 {
    font-size: 20px;
    margin: 0;
    color: #383838;
    transition: 0.5s;
}

.single-info-box:hover .single-info-content h4{
    color:#fff;
}

.single-info-content p {
    font-size: 24px;
    color: #1e1e1e;
    font-weight: 500;
    margin: 12px 0 0;
    transition: 0.5s;
}

.single-info-box:hover .single-info-content p{
    color:#fff;
}


/*
<!-- ========================================-->
<!--Restu Room Details Area Css-->
<!-- ========================================-->*/
.room-details-area {
    padding: 100px 0 100px;
}

.room-details-thumb img {
    width: 100%;
}

.room-details-content {
    margin-top: 38px;
}

.room-details-content h4 {
    font-size: 16px;
    line-height: 14px;
    color: #C29D68;
    font-weight: 600;
    text-transform: uppercase;
}

.room-details-content h1 {
    font-size: 40px;
    color: #1e1e1e;
    font-weight: 600;
}

.room-details-item {
    border: 1px solid rgba(30,30,30,0.10196078431372549);
    padding: 14px 0;
    border-left: transparent;
    border-right: transparent;
    margin: 30px 0 28px;
}

.room-details-item span {
    display: inline-block;
    margin-right: 54px;
}

.room-details-item img {
    margin-right: 8px;
}

p.room-detils-desc {
    width: 93%;
    margin-top: 15px;
}

.room-details-check-box {
    display: inline-block;
    margin-right: 145px;
    margin-bottom: 29px;
}

.room-details-check-box.upper{
    margin-right: 0;
}

.room-details-check-content span {
    display: inline-block;
    font-size: 26px;
    line-height: 26px;
    color: #1e1e1e;
    font-weight: 600;
    font-family: "Cormorant Garamond";
    margin: 38px 0 24px 0;
}

.room-details-check-content img {
    margin-right: 9px;
    margin-bottom: 5px;
}

p.check-item {
    margin-bottom: 9px;
}

p.check-item i {
    display: inline-block;
    color: #c19d68;
    font-size: 22px;
    position: relative;
    top: 3px;
    margin-right: 10px;
}

.room-details-area .room-rules {
    background: #f8f6f3;
    padding: 78px 37px 8px;
    position: relative;
}

.room-details-area .room-rules a {
    display: inline-block;
    background: var(--primary-color);
    color: #fff;
    font-family: var(--fonts-title);
    text-transform: uppercase;
    padding: 10px 31px;
    position: absolute;
    top: 0;
    left: 75px;
}

.room-details-area .room-rules p {
    margin-bottom: 27px;
}

.room-details-area .rules {
    display: flex;
    gap: 134px;
    align-items: center;
}

.room-details-area .rules ul li {
    line-height: 40px;
}

.room-details-area  .room-rules h4 {
    font-size: 26px;
    text-transform: capitalize;
    color: #1e1e1e;
    margin: 26px 0 29px;
}

h4.cleandear-content {
    color: #1e1e1e;
    font-size: 40px;
    text-transform: capitalize;
    margin: 68px 0 12px;
}




.room-details-sidbar-form {
    background: #F7F5F3;
    padding: 44px 30px 34px;
}

.room-sidbar-title {
    display: flex;
    justify-content: space-between;
    margin-bottom: 19px;
}

.room-sidbar-title span {
    display: inline-block;
    color: #1e1e1e;
    font-size: 22px;
    font-weight: 500;
}

.room-sidbar-title p {
    display: inline-block;
    color: #1e1e1e;
    font-size: 22px;
    font-weight: 500;
}

.room-sidbar-title span.two{
    display: inline-block;
    margin: 0;
    color: #1e1e1e;
    font-size: 14px;
    text-transform: capitalize; 
}

.single-input-box input {
    width: 100%;
    height: 50px;
    border: 1px solid var(--primary-color);
    background: transparent;
    padding: 6px 16px;
    text-transform: uppercase;
    border-radius: 4px;
    margin-bottom: 14px;
}

.single-input-box input[type="date"]::-webkit-calendar-picker-indicator {
    filter: brightness(0) invert(0);
}

.single-input-box label {
    color: #616161;
    font-size: 15px;
    margin-bottom: 8px;
}

.single-input-box select {
    width: 100%;
    border: 1px solid var(--primary-color);
    height: 50px;
    padding: 0 6px;
    outline: 0;
    border-radius: 5px;
}

.room-details-extra-service h4 {
    color: #1e1e1e;
    font-size: 30px;
    font-weight: 600;
    margin: 49px 0 8px;
}

.extra-check input {
    width: 15px;
    height: 15px;
}

.extra-check label {
    color: #1e1e1e;
    font-size: 14px;
    margin-left: 11px;
    position: relative;
    top: -3px;
}

.single-extra-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid rgba(30,30,30,0.1);
    margin-top: 14px;
    padding-top: 18px;
}

.single-extra-box.two {
    border-top: 2px solid rgba(30,30,30,0.10196078431372549);
    margin-top: 50px;
}

.txtra-title h4 {
    color: #1e1e1e;
    font-weight: 400;
    font-family: "Lora";
    font-size: 14px;
    margin: 0;
}

.txtra-title label {
    font-size: 14px;
    line-height: 26px;
    color: #1e1e1e;
    font-weight: 400;
    font-family: "Lora";
    margin-right: 14px;
}

.txtra-title select {
    width: 64px;
    height: 26px;
    border: 1px solid var(--primary-color);
    outline: 0;
    font-size: 15px;
}

.extra-check h4 {
    color: #1e1e1e;
    font-weight: 600;
    font-size: 24px;
}

.txtra-price span {
    color: #1e1e1e;
    font-size: 24px;
    text-transform: uppercase;

}

.info-submit-button button {
    display: inline-block;
    background: var(--primary-color);
    color: #fff;
    text-align: center;
    width: 100%;
    padding: 12px 0;
    text-transform: uppercase;
    font-size: 15px;
    margin-top: 32px;
    transition: 0.5s;
     border: 1px solid var(--primary-color);
}

.info-submit-button a:hover{
    background: transparent;
    border: 1px solid var(--primary-color);
    color:var(--primary-color);
}

.room-details-amenities-content h4 {
    font-size: 30px;
    font-weight: 600;
    padding-bottom: 13px;
    margin-top: 41px;
}

.room-amenities-item ul li {
    color: #616161;
    font-size: 15px;
    border-bottom: 1px solid #61616129;
    padding-bottom: 15px;
    padding-top: 15px;
}

.room-amenities-item ul li:last-child{
    border: transparent;
}

.room-amenities-item ul li img {
    margin-right: 14px;
    margin-bottom: 6px;
}


/*
<!-- ========================================-->
<!--Restu Service Details Area Css-->
<!-- ========================================-->*/
.service-details-area {
    padding: 120px 0 61px;
}
.service-details-thumb img {
    width: 100%;
}
.services-details-title-box {
    margin-bottom: 51px;
}

.services-details-title-box h4 {
    color: #c19d68 !important;
    text-transform: uppercase;
    font-size: 16px !important;
}

.services-details-title-box h1 {
    font-size: 40px;
    color: #1e1e1e;
}

.services-details-title-box h2 {
    font-size: 32px;
}

.services-details-title-box p {
    width: 96%;
    margin: 16px 0 0;
}

.service-details-item {
    margin-top: 18px;
}

.service-details-item ul li {
    margin-bottom: 10px;
}

.service-details-item ul li i {
    display: inline-block;
    color: #c19d68;
    font-size: 22px;
    position: relative;
    top: 3px;
    margin-right: 6px;
}

.service-details-right {
    background: #f8f6f3;
    padding: 24px 38px 45px;
}

.service-details-content h4 {
    font-size: 30px;
    color: #1e1e1e;
    font-weight: 600;
    margin: 14px 0 27px;
}

.service-input-box {
    margin-bottom: 26px;
}

.service-details-right input[type="date"]::-webkit-calendar-picker-indicator {
    filter: brightness(0) invert(0);
}

.service-input-box input {
    width: 100%;
    height: 46px;
    border: 1px solid #151515;
    text-transform: uppercase;
    padding: 0 13px;
    outline: 0;
    font-size: 14px;
    opacity: 0.8;
}

.service-input-box label {
    color: #1e1e1e;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--fonts-title);
    margin: 0 0 7px;
}

.service-input-box select {
    width: 100%;
    height: 46px;
    border: 1px solid #151515;
    text-transform: uppercase;
    padding: 0 13px;
    outline: 0;
    font-size: 14px;
    opacity: 0.8;
}

h4.text-service {
    font-size: 30px;
    color: #1e1e1e;
    font-weight: 600;
    margin: 38px 0 29px;
}

.extra-service-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.extra-service-box input {
    width: 15px;
    height: 15px;
    position: relative;
    top: 3px;
}

.extra-service-box h4 span{
    color: #686868;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 400;
    margin: 0;
    display: inline-block;
    padding-left: 13px;
}

.servie-book-button button {
    width: 100%;
    border: 1px solid #1515154f;
    background: transparent;
    border-radius: 30px;
    padding: 12px 0;
    color: #151515;
    text-transform: uppercase;
    font-family: var(--fonts-title);
    margin-top: 46px;
    transition: 0.5s;
}

.servie-book-button button:hover{
    background:var(--primary-color);
    color: #fff;
    border: 1px solid var(--primary-color);
}

.service-details-side-thumb img {
    width: 100%;
    margin-top: 31px;
}


/*
<!-- ========================================-->
<!-- Restu Blog Details Area Css -->
<!-- ========================================-->*/
.blog-details-area {
    padding: 118px 0 122px;
}

.blog-details-thumb img {
    width: 100%;
}

.blog-details-content {
    margin-top: 35px;
}

.blog-details-area .meta-blog ul li {
    display: inline-block;
    color: #616161;
    font-weight: 400;
    text-transform: uppercase;
    font-size: 16px;
    margin-right: 4px;
}

.blog-details-title a {
    display: inline-block;
    font-size: 32px;
    color: #1e1e1e;
    font-weight: 700;
    font-family:var(--fonts-title);
    padding-top: 20px;
}

.blog-details-desc p {
    width: 97%;
    margin: 20px 0 27px;
}

.blog-details-title h4 {
    font-size: 28px;
    margin-bottom: 14px;
    margin-top: 48px;
}

.blog-details-rules-item {
    margin-top: 34px;
}

.blog-details-rules-item ul li {
    color: #1e1e1e;
    font-size: 16px;
    margin-bottom: 14px;
}

.blog-details-rules-item ul li i {
    color:var(--primary-color);
    font-size: 16px;
    margin-right: 9px;
}

.blog-details-thumb-2 img {
    width: 100%;
    margin-top: 39px;
    margin-bottom: 8px;
}

.row.akta-boder-add-korlam {
    border-top: 1px solid #22222214;
    padding-top: 26px;
    border-bottom: 1px solid #22222214;
    padding-bottom: 26px;
    margin-bottom: 66px;
}

.blog-details-tag ul li {
    display: inline-block;
    color: #101010;
    font-size: 20px;
    font-family: var(--fonts-title);
    margin-right: 13px;
    font-weight: 600;
}

.blog-details-tag ul li a {
    display: inline-block;
    color: #616161;
    font-size: 15px;
    font-family:var(--fonts-body);
    border: 2px solid  #f8f6f3;
    padding: 2px 20px;
    transition: 0.5s;
}

.blog-details-tag ul li a:hover{
    background:#C29D68;
    color:#fff;
}

.blog-details-social {
    text-align: right;
}

.blog-details-social ul li {
    display: inline-block;
    color: #101010;
    font-size: 20px;
    font-family: var(--fonts-title);
    font-weight: 600;
}

.blog-details-social ul li a {
    display: inline-block;
    color: #1e1e1e;
    font-weight: 400;
    font-family: var(--fonts-title);
    text-transform: uppercase;
    font-size: 16px;
    margin-left: 14px;
    transition: 0.5s;
    position: relative;
}

.blog-details-social ul li a:hover{
    color:var(--primary-color);;
}

.blog-details-social ul li a:before {
    position: absolute;
    content: "";
    width: 0;
    height: 2px;
    left: 0;
    bottom: 2px;
    background: #C29D68;
    transition: 0.5s;
}

.blog-details-social ul li a:hover:before{
    width: 100%;
}

.blog-related-box {
    display: flex;
    background: #f8f6f3;
    align-items: center;
    padding: 30px 21px 31px 70px;
    gap: 19px;
}

.blog-related-box.style-two {
    text-align: right;
    padding: 30px 63px 31px 21px;
}

.blog-related-content a {
    display: inline-block;
    font-size: 19px;
    line-height: 24px;
    color: #1e1e1e;
    font-weight: 600;
    font-family:var(--fonts-title);
}

.blog-related-content p {
    font-size: 14px;
    margin: 0;
}


/* Comment CSS */

.blog-details-comment-title h4 {
    font-size: 32px;
    margin: 83px 0 28px;
}

.blog-details-comment {
    margin-bottom: 19px;
    position: relative;
    border: 1px solid #22222214;
    padding: 29px 29px 25px;
}

.blog-details-comment.style-two {
    margin-left: 105px;
}

.blog-details-comment-thumb {
    float: left;
    margin-right: 30px;
}

.blog-details-comment-content {
    overflow: hidden;
}

.blog-details-comment-content h2 {
    font-size: 20px;
    margin-top: 0;
    display: inline-block;
    font-weight: 700;
    margin-right: 30px;
}

.blog-details-comment-content p {
    font-size: 15px;
    margin: 13px 0 0;
}

.blog-details-comment-reply {
    position: absolute;
    right: 22px;
    top: 21px;
}

.blog-details-comment-reply a {
    background:var(--primary-color);
    padding: 3px 20px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    border-radius: 2px;
    display: inline-block;
}

.blog-details-comment.reply {
    margin-left: 70px;
    padding-top: 35px;
    border-top: 2px solid rgba(255,255,255,0.2);
}

.blog-details-contact-title h4 {
    font-size: 32px;
    font-weight: 600;
    padding-bottom: 22px;
}

.blog-details-area .contact-input-box input {
    background: #f8f8f8;
    border: transparent;
    width: 100%;
    height: 60px;
    padding: 22px;
    outline: 0;
    margin-bottom: 11px;
}

.blog-details-area .contact-input-box textarea {
    background: #f8f8f8;
    border: transparent;
    width: 100%;
    height: 170px;
    padding: 12px 22px 0;
    outline: 0;
    margin-top: 11px;
    margin-bottom: 20px;
}

.input-check-box span {
    font-size: 15px;
    margin-left: 7px;
}

.blog-details-submi-button button {
    background:var(--primary-color);
    color: #fff;
    text-transform: uppercase;
    border: transparent;
    padding: 12px 26px;
    font-size: 15px;
    margin-top: 34px;
    position: relative;
    z-index: 1;
    transition: 0.5s;
    border: 1px solid var(--primary-color);
}

.blog-details-submi-button button:hover{
    color:var(--primary-color);
}

.blog-details-submi-button button:before{
    position: absolute;
    content: "";
    width: 0;
    height: 100%;
    left: 50%;
    top: 0;
    background:#fff;
    transition: 0.5s;
    z-index: -1;
}

.blog-details-submi-button button:hover:before{
    width: 100%;
    left: 0;
}


/*Blog-details-sidbar*/

.widget_search {
    padding: 13px 40px 37px;
    border-radius: 4px;
    margin-bottom: 30px;
    background: #F8F6F3;
}

.widget_search form {
    position: relative;
    margin-top: 25px;
}

.widget_search input {
    border-radius: 4px;
    padding-left: 20px !important;
    height: 60px;
    width: 100% !important;
    position: relative;
    color: #012549;
    outline: 0 !important;
    border: transparent !important;
}


button.icons {
    border: 0;
    font-size: 16px;
    position: absolute;
    right: 14px;
    top: 18px;
    color: #1e1e1e;
    background: transparent;
    opacity: 0.7;
}


/* Sidber Recent Post */

.widget-categories-box {
    background: #F8F6F3;
    padding: 21px 37px 15px;
    margin-bottom: 32px;
}

.categories_title h4 {
    font-size: 24px;
    color: #1e1e1e;
    font-weight: 600;
    margin-bottom: 42px;
    position: relative;
}

.categories_title h4:before {
    position: absolute;
    content: "";
    width: 55px;
    height: 1px;
    left: 0;
    bottom: -6px;
    background: #1e1e1e;
}

.sidber-widget-recent-post {
    margin-bottom: 27px;
    display: flex;
    align-items: center;
    gap: 22px;
}

.recent-widget-content a {
    transition: 0.5s;
    color: #101010 !important;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
}

.sidber-widget-recent-post:hover .recent-widget-content a{
    color: var(--primary-color) !important;
}

.recent-widget-content p {
    font-size: 14px;
    margin: 0;
}

.widget-catefories-list ul li {
    border-bottom: 1px solid rgba(16,16,16,0.1);
    margin-bottom: 11px;
    padding-bottom: 14px;
}

.widget-catefories-list ul li:last-child{
    border: transparent;
}

.widget-catefories-list ul li a {
    display: inline-block;
    color: #1e1e1e;
    font-weight: 700;
    font-family:var(--fonts-title);
    font-size: 18px;
    transition: 0.5s;
}

.widget-catefories-list ul li a:hover{
    color:var(--primary-color);
}

.widget-catefories-list ul li i {
    display: inline-block;
    font-size: 14px;
    margin-right: 9px;
    transition: 0.5s;
}

.widget-catefories-list ul li a:hover i{
    color:var(--primary-color);
}

.widget-catefories-tags a {
    display: inline-block;
    color: #101010;
    font-weight: 700;
    font-family:var(--fonts-title);
    background: #fff;
    padding: 6px 19px;
    margin: 6px 3px;
    position: relative;
    z-index: 1;
}

.widget-catefories-tags a:hover{
    color:#fff;
}

.widget-catefories-tags a:before{
    position: absolute;
    content: "";
    width: 0;
    height: 100%;
    left: 50%;
    top: 0;
    background:var(--primary-color);
    transition: 0.5s;
    z-index: -1;
}

.widget-catefories-tags a:hover:before{
    width: 100%;
    left: 0;
}


.blog-side-bar-thumb {
    padding: 28px 54px 6px;
    background: #F8F6F3;
    margin-bottom: 31px;
}

.single-blog-sibar-box {
    background: #ffff;
    padding: 0 0 40px;
    text-align: center;
    border-radius: 170px;
    margin-bottom: 26px;
}

.sibar-thumb img {
    width: 100%;
}

.sidbar-team-content {
    padding: 0 46px 0;
}

.sidbar-team-contentt h4 {
    font-size: 22px;
    text-transform: uppercase;
    margin: 27px 0 0;
}

.sidbar-team-content p {
    color: #686868;
    margin: 8px 0 22px;
    font-size: 18px;
    font-family: var(--fonts-title);
    border-bottom: 1px solid var(--primary-color);
    padding-bottom: 16px;
}

.seibar-social-icon ul li {
    display: inline-block;
}

.seibar-social-icon ul li i {
    display: inline-block;
    background: #fff;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border-radius: 50%;
    font-size: 15px;
    color: var(--primary-color);
    margin: 0 2px 0;
    border: 1px solid #6868686e;
    transition: 0.5s;
}

.seibar-social-icon ul li i:hover{
    background:var(--primary-color) ;
    color:#fff;
}



/*
<!-- ========================================-->
<!-- Restu Blog List Area Css -->
<!-- ========================================-->*/

.blog-list-area {
    padding: 118px 0 86px;
}

.blog-list-box {
    margin-bottom: 34px;
}

.blog-list-thumb{
    overflow: hidden;
}

.blog-list-thumb img {
    width: 100%;
    transition: 0.5s;
}

.blog-list-box:hover .blog-list-thumb img{
    transform: scale(1.1);
} 

.blog-list-content {
    border: 1px solid rgba(30,30,30,0.1);
    border-top: transparent;
    padding: 22px 31px 24px;
}

.blog-list-area .meta-blog span {
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
    text-transform: uppercase;
    color: #616161;
    font-weight: 400;
    margin-right: 28px;
    margin-left: 13px;
    margin-bottom: 15px;
    position: relative;
}

.blog-list-area .meta-blog {
    margin-bottom: 0;
}

.blog-list-area .meta-blog span:before {
    position: absolute;
    content: "";
    width: 7px;
    height: 7px;
    left: -13px;
    top: 10px;
    background: #D1D1D1;
}

.blog-list-content a {
    display: inline-block;
    font-size: 30px;
    line-height: 40px;
    color: #1e1e1e;
    font-weight: 600;
    font-family: var(--fonts-title);
    transition: 0.5s;
}

.blog-list-content a:hover{
    text-decoration: underline;
}

.blog-list-area p.blog-list {
    margin: 18px 0 8px;
}

.blog-list-button {
    border: 1px solid rgba(30,30,30,0.1);
    border-top: transparent;
    padding: 14px 31px;
}

.blog-list-button a {
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    text-transform: uppercase;
    color: #1e1e1e;
    font-weight: 500;
    font-family: "Cormorant Garamond";
    transition: 0.5s;
}

.blog-list-button a:hover{
   color:#C19E68;
}

.blog-list-button i {
    display: inline-block;
    font-size: 20px;
    transition: 0.5s;
}

.blog-list-button a:hover i{
   color:#C19E68;
}













/*
<!-- ============================================================== -->
<!-- ReScrollup Button Cssstu  -->
<!-- ============================================================== -->*/

/*------back-to-top------------*/
.prgoress_indicator {
    position: fixed;
    right: 26px;
    bottom: 35px;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    border-radius: 50px;
    box-shadow: inset 0 0 0 2px rgba(22, 93, 245, 0.2);
    z-index: 9999999999;
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transform: translateY(15px) !important;
    transition: all 200ms linear !important;
}

.prgoress_indicator.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) !important;
}

.prgoress_indicator::after {
    position: absolute;
    content: "\f106";
    font-family: "Font Awesome 5 Free";
    text-align: center;
    line-height: 46px;
    font-size: 18px;
    color: #c19d68;
    left: 0;
    top: 0;
    height: 46px;
    width: 46px;
    cursor: pointer;
    display: block;
    font-weight: 900;
    z-index: 1;
    transition: all 200ms linear !important;
}

.prgoress_indicator::before {
  position: absolute;
  content: "\f106";
  font-family: "Font Awesome 5 Free";
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  font-weight: 900;
  opacity: 0;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear !important;
}
.prgoress_indicator:hover ::after {
  color: #c19d68;
}
.prgoress_indicator:hover ::before {
  opacity: 1;
}
.prgoress_indicator svg path {
  fill: none;
}
.prgoress_indicator svg.progress-circle path {
  stroke:var(--primary-color);
  stroke-width: 4;
  box-sizing: border-box;
  transition: all 200ms linear !important;
}




/*** 
====================================================================
   Restu Search Box Css
====================================================================
***/
.search-popup{
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: rgba(0,0,0,0.90);
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
}

.search-popup{
    width: 100%;
}

.search-active .search-popup{
    transform: translateY(0%);
    margin-top: 0;
}

.search-popup .close-search {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    margin-top: -200px;
    border-radius: 50%;
    text-align: center;
    background-color:var(--primary-color);
    width: 70px;
    cursor: pointer;
    box-shadow: 0 0 10px rgba(0,0,0,0.05);
    border-bottom: 3px solid #fff;
    border-top: 3px solid #fff;
    border-right: 3px solid #062462;
    border-left: 3px solid #062462;
    -webkit-transition: all 500ms ease;
    height: 70px;
    line-height: 70px;
    text-align: center;
}

.search-active .search-popup .close-search{
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.search-popup form{
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin:-35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: #111111;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.search-active .search-popup form{
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
}

.search-popup .form-group{
    position:relative;
    margin:0px; 
    overflow: hidden;
}
.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"]{
    position:relative;
    display:block;
    font-size:18px;
    line-height: 50px;
    color:#000000;
    height:70px;
    width:100%;
    padding: 10px 30px;
    background-color: #ffffff;
    -webkit-transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease;
    font-weight:500;
    text-transform:capitalize;
}

.search-popup .form-group input[type="submit"], .search-popup .form-group button {
    position: absolute;
    right: 30px;
    top: 0px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    text-align: center;
    font-size: 24px;
    color:var(--primary-color);
    padding: 0;
    cursor: pointer;
    -webkit-transition: all 500ms ease;
    border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover{
    color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder{
    color:#000000;
}

.search-popup .close-search.style-two{
    position: absolute;
    right: 25px;
    left: auto;
    color:#ffffff;
    width:auto;
    height:auto;
    top:25px;
    margin:0px;
    border:none;
    background:none !important;
    box-shadow:none !important;
    -webkit-transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease;
}

.search-box-btn {
    display: inline-block;
    padding-left: 22px;
}

.search-box-btn i {
    display: inline-block;
    color: #fff;
    line-height: 30px;
    text-align: center;
    font-size: 18px;
    cursor: pointer;
    transition: .5s;
}

.upp.search-box-btn i {
    color: #9E9FA1;
}

.search-box-btn.search-box-outer span i {
    font-size: 20px;
    display: inline-block;
    color: #fff;
    padding-left: 17px;
    position: relative;
    z-index: 1;
}

.upp.search-box-btn.search-box-outer span i {
    color: #9E9FA1;
}

.search-box-btn.search-box-outer span i:after {
    position: absolute;
    content: "0";
    right: -10px;
    top: -4px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    background:var(--primary-color);
    color: #fff;
    border-radius: 50%;
    display: inline-block;
    font-size: 12px;
}

.flaticon-multiply:before {
    content: inherit;
}

button.close-search i {
    font-size: 25px;
    color: #fff;
    display: inline-block;
}


span.flaticon-multiply i {
    display: inline-block;
    color: #c19d68;
}

.header-search-button.search-box-outer {
    padding: 0px 8px 0 0;
    display: inline-block;
}

.header-search-button.search-box-outer a {
    color: #062462;
    display: inline-block;
    position: relative;
    left: 16px;
}


/*===========================
<-- Restu Sidbar Css -->
=============================*/
.nav-btn.navSidebar-button {
    display: inline-block;
}

.nav-btn.navSidebar-button a i {
    font-size: 24px;
    display: inline-block;
    color:var(--primary-color);
    transition: .5s;
}

.xs-sidebar-group .xs-overlay {
    left: 100%;
    top: 0;
    position: fixed;
    z-index: 101;
    height: 100%;
    opacity: 0;
    width: 100%;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in 0.8s;
    -o-transition: all 0.4s ease-in 0.8s;
    transition: all 0.4s ease-in 0.8s;
}

.xs-sidebar-group .widget-heading {
    position: absolute;
    top: 23px;
    right: 0;
    padding: 25px;
}

.xs-sidebar-widget {
    position: fixed;
    right: -100%;
    top: 0;
    bottom: 0;
    width: 100%;
    max-width: 360px;
    z-index: 999999;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #272727;
    -webkit-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    -o-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    visibility: hidden;
    opacity: 0;
}

.xs-sidebar-group.isActive .xs-overlay {
    opacity: 0.7;
    visibility: visible;
    -webkit-transition: all 0.8s ease-out 0s;
    -o-transition: all 0.8s ease-out 0s;
    transition: all 0.8s ease-out 0s;
    left: 0;
}

.xs-sidebar-group.isActive .xs-sidebar-widget {
    opacity: 1;
    visibility: visible;
    right: 0;
    -webkit-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
    -o-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
    transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
}

.sidebar-textwidget {
    padding: 40px 32px;
}

.close-side-widget i {
    color:var(--primary-color);
    font-size: 28px;
    display: block;
}

.sidebar-widget-container {
    position: relative;
    top: 150px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-in 0.3s;
    -o-transition: all 0.3s ease-in 0.3s;
    transition: all 0.3s ease-in 0.3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.xs-sidebar-group.isActive .sidebar-widget-container {
    top: 0px;
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 1s ease-out 1.2s;
    -o-transition: all 1s ease-out 1.2s;
    transition: all 1s ease-out 1.2s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.xs-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    z-index: 0;
}

.xs-bg-black {
    background-color:var(--primary-color);
}

/*html css*/
.nav-logo {
    margin: 0 0 50px;
}

.content-box h2 {
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    text-transform: uppercase;
}

.content-box p {
    display: inline-block;
    color: #fff;
    padding: 15px 0 0;
}

a.theme-btn.btn-style-two span {
    color: #fff;
    font-size: 20px;
}

a.theme-btn.btn-style-two i {
    color:var(--primary-color);
}

.contact-info h2 {
    color: #fff;
    font-size: 26px;
    margin-bottom: 15px;
    font-weight: 600;
}

ul.list-style-one li {
    display: block;
    list-style: none;
    color: #fff;
    padding: 16px 0 0;
    overflow: hidden;
}

ul.list-style-one li span {
    font-size: 20px;
    font-weight: 600;
    color:var(--primary-color);
    margin: 0 10px 0 0px;
}

ul.social-box {
    margin: 30px 0 0;
}

ul.social-box li {
    display: inline-block;
    list-style: none;
    margin: 0 6px 0 0;
}

ul.social-box li a {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    background: #fff;
    color:var(--primary-color);
    transition: .5s;
    font-size: 18px;
    border-radius: 3px;
}

ul.social-box li a:hover {
    background:var(--primary-color);
    color: #fff;
}