//IMPORT MAIN CSS
@import "main-variables.less";

//GENERAL BOOTSTRAP CHANGE NON RESPONSIVE
html, body {
    font-family: @font-family-default;
    font-size: @font-size-default;
    color: @font-color-default;
}

//HOTEX CONTAINER
.hotex-container {
    background: @hotex-container-background;
}

.carousel-indicators {
    display: @carousel-indicators-display;
}

//STICKY FOOTER
.wrapper {
    background-color: @content-background-color;
    background-image: @content-background-image;
}

//GENERAL ATTRIBUTE
hr {
    border-top: @hr-border-width @hr-border-style @hr-color;
}


//GENERAL MENU
.navbar-default .navbar-nav > li > a {
    color: @menu-color;
    text-decoration: @menu-text-decoration;
    font-family: @menu-font-family;
    font-size: @menu-font-size;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a :focus {
    color: @menu-color-hover;
    text-decoration: @menu-text-decoration-hover;
    font-size: @menu-font-size-hover;
    text-shadow: @menu-text-shadow-hover;
    background-color: @menu-background-color-hover;
}

.hotex-menu {
    background-color: @menu-background-color;
    background-image: @menu-background-image;

    ul {
        text-transform: @menu-item-text-transform;
    }

    .navbar-right {
        a {
            text-transform: @menu-item-right-text-transform;
        }
    }
}

//GENERAL MENU HOME BUTTON
.hotex-menu-box-button-home {
    font-family: @menu-home-font-family;

    span {
        font-family: @menu-home-font-family;
    }

    .hotex-menu-home {
        background-color: @menu-home-background-color;
        text-align: @menu-home-text-align;
        color: @menu-home-color;
        line-height: @menu-home-line-height;
    }

    .hotex-menu-home:hover,
    .hotex-menu-home:focus {
        color: @menu-home-color-hover;
        background-color: @menu-home-background-color-hover;
    }
}

.hotex-glyphicon-home {
    color: @glyphicon-home-color;
}

.hotex-glyphicon-home:hover {
    color: @glyphicon-home-color-hover;
}

//GENERAL LINK & BUTTON
a {
    color: @a-color;
    text-decoration: @a-text-decoration;
    cursor: @a-cursor;
}

a:hover, a:focus {
    color: @a-color-hover;
    text-decoration: @a-text-decoration-hover;
}

.btn {
    font-size: @btn-font-size;
    line-height: @btn-line-height;
    border-radius: @btn-border-radius;
    -webkit-user-select: @btn-user-select;
    -moz-user-select: @btn-user-select;
    -ms-user-select: @btn-user-select;
    user-select: @btn-user-select;
}

.btn-search {
    background-color: @btn-search-background;
    color: @btn-search-color;
}

.btn-search:hover, .btn-search:focus {
    color: @btn-search-color-hover;
    background-color: @btn-search-background-hover;
}

.btn-continued {
    color: @btn-continued-color;
    background-color: @btn-continued-background;
    opacity: @btn-continued-opacity;
}

.btn-continued:hover {
    color: @btn-continued-color-hover;
    background-color: @btn-continued-background-hover;
    opacity: @btn-continued-opacity-hover;
    text-shadow: @btn-continued-text-shadow-hover;
    text-decoration: @btn-continued-text-decoration-hover;
}

.btn-back {
    background-color: @btn-back-background;
    color: @btn-back-color;
}

.btn-back:hover {
    color: @btn-back-color-hover;
    text-decoration: @btn-back-text-decoration-hover;
}

.btn-packages {
    background: @btn-packages-background;
    font-size: @btn-packages-font-size;
    color: @btn-packages-color;
    font-weight: @btn-packages-font-weight;
}

.btn-packages:hover {
    color: @btn-packages-color-hover;
    text-decoration: @btn-packages-text-decoration-hover;
}

//GENERAL MODAL
.modal-title {
    text-transform: @modal-title-text-transform;
    font-family: @modal-title-font-family;
    font-size: @modal-title-font-size;
    color: @modal-title-color;
}

.hotex-modal-content, .modal-body {
    background-color: @modal-body-background;
    border-radius: @modal-body-boder-radius;
}

//GENERAL LINE BORDER
.hotex-border {
    border-bottom: @border-style;
}

//GENERAL SHADOW MENU
.hotex-shadow-menu {
    -moz-box-shadow: @shadow-menu;
    -webkit-box-shadow: @shadow-menu;
    box-shadow: @shadow-menu;
}

//GENERAL SHADOW RESERVATION INFO
.hotex-shadow-reservation-info {
    -moz-box-shadow: @shadow-reservation-info;
    -webkit-box-shadow: @shadow-reservation-info;
    box-shadow: @shadow-reservation-info;
}

//GENERAL SHADOW SECTION LINE
.hotex-shadow-in-top {
    -moz-box-shadow: @shadow-in-top;
    -webkit-box-shadow: @shadow-in-top;
    box-shadow: @shadow-in-top;
}

.hotex-shadow-in-top:after {
    background: @shadow-in-top-background-webkit-after;
    background: @shadow-in-top-background-after;
    -webkit-transform: @shadow-in-top-transform-after;
    -moz-transform: @shadow-in-top-transform-after;
    -o-transform: @shadow-in-top-transform-after;
    -ms-transform: @shadow-in-top-transform-after;
    transform: @shadow-in-top-transform-after;
}

//GENERAL BOBD
.hotex-bobd {
    .hotex-box-tooltip {
        background-color: @tooltip-background-color;
        letter-spacing: @tooltip-letter-spacing;

        .hotex-box-bobd {
            text-transform: @bobd-label-text-transform;

            .hotex-plus-button {
                background: url('icon/benefit.png');
                background-repeat: @bobd-icon-plus-background-repeat;
                background-position: @bobd-icon-plus-background-position;
            }

            .hotex-minus-button {
                background: url('icon/benefit1.png');
                background-repeat: @bobd-icon-minus-background-repeat;
                background-position: @bobd-icon-minus-background-position;
            }

            #hotex-link-benefit {
                font-family: @bobd-label-font-family;
                font-size: @bobd-label-font-size;
            }
        }

        a {
            text-shadow: @bobd-link-text-shadow;
            color: @bobd-link-color;
        }

        a :hover, a :focus {
            color: @bobd-link-hover-color;
            text-decoration: @bobd-link-hover-text-decoration;
        }
    }
}

//GENERAL BORDER RESERVATION INFO
.hotex-reservation-border {
    border-bottom: @reservation-info-border-bottom;
}

//GENERAL HEADER1
.hotex-box-logo {
    text-align: @header1-logo-text-align;
}

.hotex-box-bobd-header1 {
    .hotex-btn-dropdownlist {
        float: @header1-dropdownlist-float;
    }
}

//GENERAL HEADER2
.hotex-box2-header2 {
    background-color: @header2-background-color;
    color: @header2-color;

    h4 {
        font-size: @header2-label-hotel-name-font-size;
        font-family: @header2-label-hotel-name-font-family;
        color: @header2-label-hotel-name-color;
    }

    h6 {
        font-size: @header2-label-address-font-size;
        font-family: @header2-label-address-font-family;
        color: @header2-label-address-color;
    }
}

//GENERAL TOOLTIP CONTENT
.popover.bottom .arrow {
    display: @tooltip-over-arrow-display;
}

.popover.bottom .arrow:after {
    display: @tooltip-over-arrow-display;
}

.popover-title {
    background-color: @tooltip-over-title-background-color;
    border: @tooltip-over-title-border;
    border-radius: @tooltip-over-title-border-radius;
}

.popover {
    background-color: @tooltip-over-body-background-color;
    border: @tooltip-over-body-border;
    border-radius: @tooltip-over-body-border-radius;
}

.hotex-benefit {
    opacity: @tooltip-over-box-img-opacity;
    background-color: @tooltip-over-box-img-background-color;
}

//GENERAL POPUP SEARCH
#searchModal {
    .hotex-box-search {
        .input-label {
            display: @popup-search-input-display;
            text-align: @popup-search-input-text-align;
        }

        .inline-label {
            display: @popup-search-label-display;
            vertical-align: @popup-search-label-vertical-align;
        }
    }
}

//GENERAL CAROUSEL SLIDER
.hotex-carousel-control .btn-prev,
.hotex-carousel-control .btn-next {
    z-index: @carousel-button-z-index;
    display: @carousel-button-display;
}

//GENERAL FOOTER 1
.hotex-box-footer {
    color: @footer1-color;
    background-color: @footer1-background-color;
    font-size: @footer1-font-size;
    font-family: @footer1-font-family;

    .hotex-powered {
        text-align: @footer1-powered-box-text-align;

        a {
            color: @footer1-link-color;
            font-size: @footer1-link-font-size;
            font-family: @footer1-link-font-family;
        }

        a:hover {
            color: @footer1-link-hover-color;
            font-size: @footer1-link-hover-font-size;
            font-family: @footer1-link-hover-font-family;
            text-decoration: @footer1-link-hover-text-decoration;
        }

        .hotex-footer-small-text {
            font-size: @footer1-small-text-font-size;
            vertical-align: @footer1-small-text-vertical-align;
        }
    }
}

//GENERAL FOOTER 2
.hotex-box2-footer {
    color: @footer2-color;
    background-color: @footer2-background-color;

    .hotex-box2-footer-center {
        color: @footer2-center-color;
        font-size: @footer2-center-font-size;
        font-family: @footer2-center-font-family;
    }

    .hotex-box2-footer-right {
        color: @footer2-right-color;
        font-size: @footer2-right-font-size;
        font-family: @footer2-right-font-family;

        a {
            color: @footer2-right-link-color;
            font-size: @footer2-right-link-font-size;
            font-family: @footer2-right-link-font-family;
        }

        a:hover {
            color: @footer2-right-link-hover-color;
            font-size: @footer2-right-link-hover-font-size;
            font-family: @footer2-right-link-hover-font-family;
            text-decoration: @footer2-right-link-hover-text-decoration;
        }
    }
}


//GENERAL FOOTER DETAIL
.hotex-box-footer-validation-detail {
    .btn-continued {
        color: @footer-detail-btn-continued-color;
        font-size: @footer-detail-btn-continued-font-size;
        font-family: @footer-detail-btn-continued-font-family;
    }

    .btn-back {
        color: @footer-detail-btn-back-color;
        font-size: @footer-detail-btn-back-font-size;
        font-family: @footer-detail-btn-back-font-family;
    }
}


//GENERAL FOOTER DETAIL
.hotex-box-footer-validation {
    .hotex-footer-terms {
        a {
            color: @footer-payment-terms-color;
            font-size: @footer-payment-terms-font-size;
            font-family: @footer-payment-terms-font-family;
            font-weight: @footer-payment-terms-font-weight;
        }

        a:hover, align-content:focus {
            color: @footer-payment-terms-color;
            font-size: @footer-payment-terms-font-size;
            font-family: @footer-payment-terms-font-family;
            font-weight: @footer-payment-terms-font-weight;
            text-decoration: @footer-payment-terms-text-decoration;
        }
    }

    .policy-information-button {
        color: @footer-payment-link-color;
        font-size: @footer-payment-link-font-size;
        font-family: @footer-payment-link-font-family;
    }

    .policy-information-button:hover,
    .policy-information-button:focus {
        text-decoration: @footer-payment-link-hover-text-decoration;
        color: @footer-payment-link-hover-color;
        font-size: @footer-payment-link-hover-font-size;
        font-family: @footer-payment-link-hover-font-family;
    }
}

//PAGE INDEX : SEARCH BOX
.hotex-box-search {
    .input-label {
        display: @index-search-input-display;
        text-align: @index-search-input-text-align;
    }

    .inline-label {
        display: @index-search-label-display;
        vertical-align: @index-search-label-vertical-align;
    }

    h4 {
        vertical-align: @index-search-label-reservation-vertical-align;
    }

    .btn-search {
        line-height: @index-search-button-line-height;
    }
}
//PAGE INDEX : INTRO
.hotex-info {
    background: @index-info-background-color;

    .hotex-box-index-intro {
        background-color: @index-intro-background-color;

        h3 {
            text-transform: @index-intro-title-text-transform;
            color: @index-intro-title-text-color;
            font-size: @index-intro-title-text-font-size;
            font-family: @index-intro-title-text-font-family;
        }

        p {
            text-align: @index-intro-decs-text-align;
            font-family: @index-intro-decs-font-family;
            font-size: @index-intro-decs-font-size;
            color: @index-intro-decs-color;
        }
    }
}
//PAGE INDEX : SLIDER
.hotex-slider-index {
    h3 {
        text-transform: @index-slide-title-text-transform;
        color: @index-slide-title-text-color;
        font-size: @index-slide-title-text-font-size;
        font-family: @index-slide-title-text-font-family;
    }
}

.hotex-box-slide-room {
    label {
        font-family: @index-slide-title-font-family;
        font-size: @index-slide-title-font-size;
        color: @index-slide-title-font-color;
    }

    p {
        font-family: @index-slide-decs-font-family;
        font-size: @index-slide-decs-font-size;
        color: @index-slide-decs-font-color;
    }
}

.hotex-box-slide-rate {
    font-family: @index-slide-box-rate-font-family;
    font-size: @index-slide-box-rate-font-size;
    color: @index-slide-box-rate-font-color;

    .hotex-slide-currancy {
        text-decoration: @index-slide-currancy-text-decoration;
        color: @index-slide-currancy-color;
        font-size: @index-slide-currancy-font-size;
        font-family: @index-slide-currancy-font-family;
    }

    .hotex-slide-discount {
        color: @index-slide-discount-color;
        font-size: @index-slide-discount-font-size;
        font-family: @index-slide-discount-font-family;
    }

    a {
        font-size: @index-slide-rate-link-font-size;
        color: @index-slide-rate-link-color;
        text-decoration: @index-slide-rate-link-hover-text-decoration;
    }

    a:hover, a:focus {
        color: @index-slide-rate-link-hover-color;
        text-decoration: @index-slide-rate-link-hover-text-decoration;
    }
}

//PAGE RATES : WARNING BOX
.hotex-rates-warning {
    color: @rates-warning-color;
    font-family: @rates-warning-font-family;
    font-size: @rates-warning-font-size;
}

//PAGE RATES : RESERVATION INFO
.hotex-reservation-info {
    background: @rates-reservation-info-background;
    text-align: @rates-reservation-info-text-align;
    font-size: @rates-reservation-info-font-size;
    color: @rates-reservation-info-color;
    font-family: @rates-reservation-info-font-family;

    a {
        color: @rates-reservation-info-link-color;
        text-decoration: @rates-reservation-info-link-text-decoration;
    }

    a:hover, a:focus {
        color: @rates-reservation-info-link-hover-color;
        text-decoration: @rates-reservation-info-link-hover-text-decoration;
    }
}

//PAGE RATES : COMPARASION
.hotex-comparasion-box {
    .hotex-comparasion-link {
        a {
            font-family: @rates-comaparision-link-font-family;
            font-size: @rates-comaparision-link-font-size;
            color: @rates-comaparision-link-color;
        }

        a:hover, a:focus {
            font-size: @rates-comaparision-link-hover-font-size;
            color: @rates-comaparision-link-hover-color;
            text-decoration: @rates-comaparision-link-hover-text-decoration;
        }
    }
}

//PAGE RATES : ROOM TYPE COMPARASION POPUP
.hotex-room-type-comparison {
    .animate-hide {
        -webkit-transition: @rates-room-comparasion-popup-hide-transition;
        transition: @rates-room-comparasion-popup-hide-transition;
        line-height: @rates-room-comparasion-popup-hide-line-height;
        opacity: @rates-room-comparasion-popup-hide-opacity;
    }

    .animate-hide.ng-hide-add,
    .animate-hide.ng-hide-remove {
        display: @rates-room-comparasion-popup-hide-display !important;
    }

    .animate-hide.ng-hide {
        line-height: @rates-room-comparasion-popup-ng-hide-line-height;
        opacity: @rates-room-comparasion-popup-ng-hide-opacity;
    }

    .hotex-glyphicon-ok {
        color: @rates-room-comparasion-popup-icon-color;
        font-size: @rates-room-comparasion-popup-icon-font-size;
    }

    .hotex-border {
        color: @rates-room-comparasion-popup-border-color;
    }

    .hotex-room-comparasion-decs {
        font-family: @rates-room-comparasion-popup-decs-font-family;
        font-size: @rates-room-comparasion-popup-decs-font-size;
    }

    .hotex-room-comparasion-title {
        text-transform: @rates-room-comparasion-popup-title-text-transform;
        font-size: @rates-room-comparasion-popup-title-font-size;
        font-family: @rates-room-comparasion-popup-title-font-family;
        color: @rates-room-comparasion-popup-title-color;
    }

    .hotex-room-comparasion-link {
        text-transform: @rates-room-comparasion-popup-link-text-transform;
        font-size: @rates-room-comparasion-popup-link-font-size;
        font-family: @rates-room-comparasion-popup-link-font-family;
        color: @rates-room-comparasion-popup-link-color;
    }

    .hotex-room-comparasion-currency {
        text-transform: @rates-room-comparasion-popup-currency-text-transform;
        font-size: @rates-room-comparasion-popup-currency-font-size;
        font-family: @rates-room-comparasion-popup-currency-font-family;
        color: @rates-room-comparasion-popup-currency-color;
    }

    .hotex-room-comparasion-size {
        text-transform: @rates-room-comparasion-popup-size-text-transform;
        font-size: @rates-room-comparasion-popup-size-font-size;
        font-family: @rates-room-comparasion-popup-size-font-family;
        color: @rates-room-comparasion-popup-size-color;
    }

    .hotex-room-comparison-button {
        a {
            opacity: @rates-room-comparasion-popup-button-opacity;
        }

        a:hover, a:focus {
            opacity: @rates-room-comparasion-popup-button-hover-opacity;
        }
    }
}

//PAGE RATES : RATE COMPARASION POPUP
.hotex-rate-comparison {
    .animate-hide {
        -webkit-transition: @rates-rate-comparasion-popup-hide-transition;
        transition: @rates-rate-comparasion-popup-hide-transition;
        line-height: @rates-rate-comparasion-popup-hide-line-height;
        opacity: @rates-rate-comparasion-popup-hide-opacity;
    }

    .animate-hide.ng-hide-add,
    .animate-hide.ng-hide-remove {
        display: @rates-rate-comparasion-popup-hide-display !important;
    }

    .animate-hide.ng-hide {
        line-height: @rates-rate-comparasion-popup-ng-hide-line-height;
        opacity: @rates-rate-comparasion-popup-ng-hide-opacity;
    }

    .hotex-glyphicon-ok {
        color: @rates-rate-comparasion-popup-icon-color;
        font-size: @rates-rate-comparasion-popup-icon-font-size;
    }

    .hotex-border {
        color: @rates-rate-comparasion-popup-border-color;
    }

    .hotex-rate-comparasion-decs {
        font-family: @rates-rate-comparasion-popup-decs-font-family;
        font-size: @rates-rate-comparasion-popup-decs-font-size;
    }

    .hotex-rate-comparasion-title {
        text-transform: @rates-rate-comparasion-popup-title-text-transform;
        font-size: @rates-rate-comparasion-popup-title-font-size;
        font-family: @rates-rate-comparasion-popup-title-font-family;
        color: @rates-rate-comparasion-popup-title-color;
    }

    .hotex-rate-comparasion-link {
        text-transform: @rates-rate-comparasion-popup-link-text-transform;
        font-size: @rates-rate-comparasion-popup-link-font-size;
        font-family: @rates-rate-comparasion-popup-link-font-family;
        color: @rates-rate-comparasion-popup-link-color;
    }

    .hotex-rate-comparasion-currency {
        text-transform: @rates-rate-comparasion-popup-currency-text-transform;
        font-size: @rates-rate-comparasion-popup-currency-font-size;
        font-family: @rates-rate-comparasion-popup-currency-font-family;
        color: @rates-rate-comparasion-popup-currency-color;
    }

    .hotex-rate-comparasion-size {
        text-transform: @rates-rate-comparasion-popup-size-text-transform;
        font-size: @rates-rate-comparasion-popup-size-font-size;
        font-family: @rates-rate-comparasion-popup-size-font-family;
        color: @rates-rate-comparasion-popup-size-color;
    }

    .hotex-rate-comparison-button {
        a {
            opacity: @rates-rate-comparasion-popup-button-opacity;
        }

        a:hover, a:focus {
            opacity: @rates-rate-comparasion-popup-button-hover-opacity;
        }
    }
}

//PAGE RATES : PACKAGE COMPARASION POPUP
.hotex-package-comparison {
    .animate-hide {
        -webkit-transition: @rates-package-comparasion-popup-hide-transition;
        transition: @rates-package-comparasion-popup-hide-transition;
        line-height: @rates-package-comparasion-popup-hide-line-height;
        opacity: @rates-package-comparasion-popup-hide-opacity;
    }

    .animate-hide.ng-hide-add,
    .animate-hide.ng-hide-remove {
        display: @rates-package-comparasion-popup-hide-display !important;
    }

    .animate-hide.ng-hide {
        line-height: @rates-package-comparasion-popup-ng-hide-line-height;
        opacity: @rates-package-comparasion-popup-ng-hide-opacity;
    }

    .hotex-glyphicon-ok {
        color: @rates-package-comparasion-popup-icon-color;
        font-size: @rates-package-comparasion-popup-icon-font-size;
    }

    .hotex-border {
        color: @rates-package-comparasion-popup-border-color;
    }

    .hotex-package-comparasion-decs {
        font-family: @rates-package-comparasion-popup-decs-font-family;
        font-size: @rates-package-comparasion-popup-decs-font-size;
    }

    .hotex-package-comparasion-title {
        text-transform: @rates-package-comparasion-popup-title-text-transform;
        font-size: @rates-package-comparasion-popup-title-font-size;
        font-family: @rates-package-comparasion-popup-title-font-family;
        color: @rates-package-comparasion-popup-title-color;
    }

    .hotex-package-comparasion-link {
        text-transform: @rates-package-comparasion-popup-link-text-transform;
        font-size: @rates-package-comparasion-popup-link-font-size;
        font-family: @rates-package-comparasion-popup-link-font-family;
        color: @rates-package-comparasion-popup-link-color;
    }

    .hotex-package-comparasion-currency {
        text-transform: @rates-package-comparasion-popup-currency-text-transform;
        font-size: @rates-package-comparasion-popup-currency-font-size;
        font-family: @rates-package-comparasion-popup-currency-font-family;
        color: @rates-package-comparasion-popup-currency-color;
    }

    .hotex-package-comparasion-size {
        text-transform: @rates-package-comparasion-popup-size-text-transform;
        font-size: @rates-package-comparasion-popup-size-font-size;
        font-family: @rates-package-comparasion-popup-size-font-family;
        color: @rates-package-comparasion-popup-size-color;
    }

    .hotex-package-comparison-button {
        a {
            opacity: @rates-package-comparasion-popup-button-opacity;
        }

        a:hover, a:focus {
            opacity: @rates-package-comparasion-popup-button-hover-opacity;
        }
    }

    .hotex-package-comparasion-rate {
        text-transform: @rates-package-comparasion-popup-rate-text-transform;
        color: @rates-package-comparasion-popup-rate-color;
        text-align: @rates-package-comparasion-popup-rate-text-align;
        font-family: @rates-package-comparasion-popup-rate-font-family;
        font-size: @rates-package-comparasion-popup-rate-font-size;
    }
}

//PAGE RATES : ROOM REQUEST
.hotex-room-request-box {
    .hotex-room-request-item {
        .hotex-room-request-title {
            font-weight: @rates-room-request-item-title-font-weight;
            font-size: @rates-room-request-item-title-font-size;
            font-family: @rates-room-request-item-title-font-family;
            color: @rates-room-request-item-title-color;
        }

        .hotex-room-request-label {
            font-weight: @rates-room-request-item-label-font-weight;
            font-size: @rates-room-request-item-label-font-size;
            font-family: @rates-room-request-item-label-font-family;
            color: @rates-room-request-item-label-color;
        }

        .hotex-room-request-captcha-label {
            font-weight: @rates-room-request-item-captcha-label-font-weight;
            font-size: @rates-room-request-item-captcha-label-font-size;
            font-family: @rates-room-request-item-captcha-label-font-family;
            color: @rates-room-request-item-captcha-label-color;
        }
    }
}

//PAGE RATES : RESERVATION MENU
.hotex-reservation-menu {
    text-transform: @rates-reservation-menu-text-text-transform;

    .active .arrow-down {
        text-align: @rates-reservation-menu-arrow-text-align;
        border-left: @rates-reservation-menu-arrow-border-left;
        border-right: @rates-reservation-menu-arrow-border-right;
        border-top: @rates-reservation-menu-arrow-border-top;
    }

    .hotex-menu-btn {
        cursor: @rates-reservation-menu-button-cursor;

        a {
            color: @rates-reservation-menu-button-link-color;
            text-decoration: @rates-reservation-menu-button-link-text-decoration;
            font-size: @rates-reservation-menu-button-link-font-size;
            font-family: @rates-reservation-menu-button-link-font-family;
        }

        a:hover, a:focus {
            color: @rates-reservation-menu-button-link-hover-color;
            text-decoration: @rates-reservation-menu-button-link-hover-text-decoration;
            font-size: @rates-reservation-menu-button-link-hover-font-size;
            font-family: @rates-reservation-menu-button-link-hover-font-family;
        }
    }

    .active .hotex-menu-btn {
        background-color: @rates-reservation-menu-active-button-background-color;
        cursor: @rates-reservation-menu-active-button-cursor;

        a {
            color: @rates-reservation-menu-active-button-link-color;
            text-decoration: @rates-reservation-menu-active-button-link-text-decoration;
            font-size: @rates-reservation-menu-active-button-link-font-size;
            font-family: @rates-reservation-menu-active-button-link-font-family;
        }

        a:hover, a:focus {
            color: @rates-reservation-menu-active-button-link-hover-color;
            text-decoration: @rates-reservation-menu-active-button-link-hover-text-decoration;
            font-size: @rates-reservation-menu-active-button-link-hover-font-size;
            font-family: @rates-reservation-menu-active-button-link-hover-font-family;
        }
    }
}

//PAGE RATES : RATE LIST CONTENT
.hotex-box-rates {
    .hotex-box-rates-content {
        .hotex-rates-title {
            .room-information-button {
                color: @rates-link-title-color;
                text-decoration: @rates-link-title-text-decoration;
                font-size: @rates-link-title-font-size;
                font-family: @rates-link-title-font-family;
            }

            .room-information-button:hover {
                color: @rates-link-hover-title-color;
                text-decoration: @rates-link-hover-title-text-decoration;
                font-size: @rates-link-hover-title-font-size;
                font-family: @rates-link-hover-title-font-family;
            }
        }

        .hotex-rates-info {
            .hotex-box-slide-rates {
                .hotex-slide-rates-image {
                    text-align: @rates-info-box-img-text-align;
                }
            }

            .hotex-carousel-control-rates .btn-prev-rates,
            .hotex-carousel-control-rates .btn-next-rates {
                position: @rates-info-carousel-position;
                color: @rates-info-carousel-color;
                font-size: @rates-info-carousel-font-size;
                z-index: @rates-info-carousel-z-index;
                display: @rates-info-carousel-display;
            }

            .hotex-carousel-control-rates .btn-prev-rates {
                text-align: @rates-info-carousel-prev-text-align;
                text-shadow: @rates-info-carousel-prev-text-shadow;
            }

            .hotex-carousel-control-rates .btn-next-rates {
                text-align: @rates-info-carousel-next-text-align;
                text-shadow: @rates-info-carousel-next-text-shadow;
            }
        }

        .hotex-table-rates {
            .hotex-table-rates-title {
                font-family: @rates-table-title-font-family;
                font-size: @rates-table-title-font-size;
                font-weight: @rates-table-title-font-weight;
                color: @rates-table-title-color;
            }

            .hotex-table-rates-content {
                .hotex-table-rates-content1 {
                    .badge {
                        background-color: @rates-table-content1-badge-background-color;
                        color: @rates-table-content1-badge-color;
                        font-size: @rates-table-content1-badge-font-size;
                        min-height: @rates-table-content1-badge-min-height;
                    }

                    span {
                        font-family: @rates-table-content1-span-font-family;
                        font-size: @rates-table-content1-span-font-size;
                        font-weight: @rates-table-content1-span-font-weight;
                        color: @rates-table-content1-span-color;
                    }

                    p {
                        font-family: @rates-table-content1-p-font-family;
                        font-size: @rates-table-content1-p-font-size;
                        color: @rates-table-content1-p-color;
                    }

                    a {
                        font-family: @rates-table-content1-a-font-family;
                        font-size: @rates-table-content1-a-font-size;
                        color: @rates-table-content1-a-color;
                        text-decoration: @rates-table-content1-a-text-decoration;
                    }

                    a:hover, a:focus {
                        font-size: @rates-table-content1-a-hover-font-size;
                        color: @rates-table-content1-a-hover-color;
                        text-decoration: @rates-table-content1-a-hover-text-decoration;
                    }
                }

                .hotex-table-rates-content2 {
                    text-align: @rates-table-content2-text-align;
                }

                .hotex-table-rates-content3 {
                    a {
                        font-family: @rates-table-content3-a-font-family;
                        font-size: @rates-table-content3-a-font-size;
                        color: @rates-table-content3-a-color;
                        font-weight: @rates-table-content3-a-font-weight;
                        text-decoration: @rates-table-content3-a-text-decoration;
                    }

                    a:hover, a:focus {
                        font-size: @rates-table-content3-a-hover-font-size;
                        color: @rates-table-content3-a-hover-color;
                        text-decoration: @rates-table-content3-a-hover-text-decoration;
                    }
                    //251114
                    p {
                        font-family: @rates-table-content1-p-font-family;
                        font-size: @rates-table-content1-p-font-size;
                        color: @rates-table-content1-p-color;
                    }

                    span {
                        font-family: @rates-table-content3-span-font-family;
                        font-size: @rates-table-content3-span-font-size;
                        font-weight: @rates-table-content3-span-font-weight;
                        color: @rates-table-content3-span-color;
                        text-decoration: @rates-table-content3-span-text-decoration;
                    }
                }

                .hotex-table-rates-content4 {
                    text-align: @rates-table-content4-text-align;
                }
            }

            .hotex-open-tab-packages {
                a {
                    font-style: @rates-table-open-packages-font-style;
                    font-size: @rates-table-open-packages-font-size;
                    color: @rates-table-open-packages-color;
                    text-decoration: @rates-table-open-packages-text-decoration;
                    cursor: @rates-table-open-packages-cursor;
                }

                a:hover, a:focus {
                    color: @rates-table-open-packages-hover-color;
                    text-decoration: @rates-table-open-packages-hover-text-decoration;
                }
            }
        }
    }
}

//PAGE RATES : ROOM INFORMATION POPUP
.hotex-room-information {
    .hotex-room-information-image {

        .hotex-carousel-control-rates .btn-prev-rates,
        .hotex-carousel-control-rates .btn-next-rates {
            color: @rates-room-information-popup-carousel-color;
            font-size: @rates-room-information-popup-carousel-font-size;
            z-index: @rates-room-information-popup-carousel-z-index;
            display: @rates-room-information-popup-carousel-display;
        }

        .hotex-carousel-control-rates .btn-prev-rates {
            text-align: @rates-room-information-popup-carousel-prev-text-align;
            text-shadow: @rates-room-information-popup-carousel-prev-text-shadow;
        }

        .hotex-carousel-control-rates .btn-next-rates {
            text-align: @rates-room-information-popup-carousel-next-text-align;
            text-shadow: @rates-room-information-popup-carousel-next-text-shadow;
        }
    }

    .hotex-room-information-box-desc {
        .hotex-room-information-title {
            label {
                font-family: @rates-room-information-popup-title-font-family;
                font-size: @rates-room-information-popup-title-font-size;
                color: @rates-room-information-popup-title-color;
                text-transform: @rates-room-information-popup-title-text-transform;
            }
        }

        .hotex-room-information-desc {
            p {
                font-family: @rates-room-information-popup-desc-font-family;
                font-size: @rates-room-information-popup-desc-font-size;
                color: @rates-room-information-popup-desc-color;
            }
        }

        .hotex-room-information-amenities {
            .hotex-room-information-amenities-title {
                font-family: @rates-room-information-popup-amenities-title-font-family;
                font-size: @rates-room-information-popup-amenities-title-font-size;
                color: @rates-room-information-popup-amenities-title-color;
                font-weight: @rates-room-information-popup-amenities-title-font-weight;
            }

            .hotex-room-information-amenities-content {
                font-family: @rates-room-information-popup-amenities-content-font-family;
                font-size: @rates-room-information-popup-amenities-content-font-size;
                color: @rates-room-information-popup-amenities-content-color;
            }
        }
    }
}

//PAGE RATES : TERMS AND CONDITION POPUP
.hotex-rates-terms {
    .hotex-rates-terms-hotel-name {
        text-transform: @rates-terms-popup-hotel-name-text-transform;
        color: @rates-terms-popup-hotel-name-color;
        font-size: @rates-terms-popup-hotel-name-font-size;
        font-family: @rates-terms-popup-hotel-name-font-family;
        font-weight: @rates-terms-popup-hotel-name-font-weight;
    }

    b {
        color: @rates-terms-popup-title-color;
        font-size: @rates-terms-popup-title-font-size;
        font-family: @rates-terms-popup-title-font-family;
    }

    ul {
        color: @rates-terms-popup-item-color;
        font-size: @rates-terms-popup-item-font-size;
        font-family: @rates-terms-popup-item-font-family;
    }
}

//PAGE RATES : RATES DETAIL POPUP
.hotex-rate-detail-hotel {
    .hotex-rate-detail-hotel-name {
        text-transform: @rates-rate-detail-popup-hotel-name-text-transform;
        color: @rates-rate-detail-popup-hotel-name-color;
        font-size: @rates-rate-detail-popup-hotel-name-font-size;
        font-family: @rates-rate-detail-popup-hotel-name-font-family;
        font-weight: @rates-rate-detail-popup-hotel-name-font-weight;
    }

    .hotex-rate-detail-date {
        color: @rates-rate-detail-popup-date-color;
        font-size: @rates-rate-detail-popup-date-font-size;
        font-family: @rates-rate-detail-popup-date-font-family;
    }

    .hotex-rate-detail-table {
        .hotex-rate-detail-table-title {
            color: @rates-rate-detail-popup-table-title-color;
            font-size: @rates-rate-detail-popup-table-title-font-size;
            font-family: @rates-rate-detail-popup-table-title-font-family;
        }

        .hotex-rate-detail-table-item {
            color: @rates-rate-detail-popup-table-title-color;
            font-size: @rates-rate-detail-popup-table-title-font-size;
            font-family: @rates-rate-detail-popup-table-title-font-family;
            background-color: @rates-rate-detail-popup-table-title-background-color;
        }
    }
}

//PAGE RATES : PACKAGE CONTENT
.hotex-box-rates-packages {
    .hotex-box-packages-content {
        .hotex-packages-title {
            text-transform: @packages-title-text-transform;

            .package-information-button {
                color: @packages-link-title-color;
                text-decoration: @packages-link-title-text-decoration;
                font-size: @packages-link-title-font-size;
                font-family: @packages-link-title-font-family;
            }

            .package-information-button:hover {
                color: @packages-link-hover-title-color;
                text-decoration: @packages-link-hover-title-text-decoration;
                font-size: @packages-link-hover-title-font-size;
                font-family: @packages-link-hover-title-font-family;
            }
        }

        .hotex-package-content1 {
            .hotex-package-addon {
                p {
                    font-family: @packages-content1-addon-p-font-family;
                    font-size: @packages-content1-addon-p-font-size;
                    font-weight: @packages-content1-addon-p-font-weight;
                }

                ul {
                    font-family: @packages-content1-addon-p-font-family;
                    font-size: @packages-content1-addon-ul-font-size;
                    padding: @packages-content1-addon-ul-padding;
                }
            }

            .hotex-package-more {
                a {
                    font-family: @packages-content1-more-link-font-family;
                    font-size: @packages-content1-more-link-font-size;
                    color: @packages-content1-more-link-color;
                    text-decoration: @packages-content1-more-link-text-decoration;
                }

                a:hover {
                    font-family: @packages-content1-more-link-hover-font-family;
                    font-size: @packages-content1-more-link-hover-font-size;
                    color: @packages-content1-more-link-hover-color;
                    text-decoration: @packages-content1-more-link-hover-text-decoration;
                }
            }
        }

        .hotex-package-content2 {
            .hotex-packages-desc {
                .hotex-package-information-promo {
                    font-size: @packages-content2-promo-font-size;
                }
            }

            .hotex-package-table-rates {
                .hotex-package-table-rates-title {
                    .hotex-package-rates-name {
                        font-family: @packages-content2-table-title-name-font-family;
                        font-size: @packages-content2-table-title-name-font-size;
                        color: @packages-content2-table-title-name-color;
                    }

                    .hotex-package-rates-terms {
                        text-align: @packages-content2-table-title-terms-text-align;

                        a {
                            font-family: @packages-content2-table-title-terms-font-family;
                            font-size: @packages-content2-table-title-terms-font-size;
                            color: @packages-content2-table-title-terms-color;
                        }

                        a:hover, a:focus {
                            font-family: @packages-content2-table-title-terms-hover-font-family;
                            font-size: @packages-content2-table-title-terms-hover-font-size;
                            color: @packages-content2-table-title-terms-hover-color;
                        }
                    }
                }

                .hotex-package-table-rates-content {
                    .hotex-package-name {
                        .room-information-button {
                            font-family: @packages-content2-table-content-name-font-family;
                            font-size: @packages-content2-table-content-name-font-size;
                            color: @packages-content2-table-content-name-color;
                        }

                        .room-information-button:hover {
                            font-family: @packages-content2-table-content-name-hover-font-family;
                            font-size: @packages-content2-table-content-name-hover-font-size;
                            color: @packages-content2-table-content-name-hover-color;
                        }
                    }

                    .hotex-package-price {
                        font-family: @packages-content2-table-content-price-font-family;
                        font-size: @packages-content2-table-content-price-font-size;
                        color: @packages-content2-table-content-price-color;
                    }
                }
            }
        }
    }
}

//PAGE RATES : PACKAGE INFORMATION POPUP
.hotex-package-information {
    .hotex-package-information-box-decs {
        .hotex-package-information-title {
            .hotex-package-information-title-name {
                text-transform: @packages-room-information-popup-title-text-transform;
                font-size: @packages-room-information-popup-title-font-size;
                font-family: @packages-room-information-popup-title-font-family;
                font-weight: @packages-room-information-popup-title-font-weight;
                color: @packages-room-information-popup-title-color;
            }

            .hotex-package-information-title-promo {
                font-size: @packages-room-information-popup-promo-font-size;
                font-family: @packages-room-information-popup-promo-font-family;
                font-weight: @packages-room-information-popup-promo-font-weight;
                color: @packages-room-information-popup-promo-color;
            }
        }

        .hotex-package-information-validity {
            font-size: @packages-room-information-popup-validity-font-size;
            font-family: @packages-room-information-popup-validity-font-family;
            font-weight: @packages-room-information-popup-validity-font-weight;
            color: @packages-room-information-popup-validity-color;
        }

        .hotex-package-information-desc {
            font-size: @packages-room-information-popup-decs-font-size;
            font-family: @packages-room-information-popup-decs-font-family;
            font-weight: @packages-room-information-popup-decs-font-weight;
            color: @packages-room-information-popup-decs-color;
            text-align: @packages-room-information-popup-decs-text-align;
        }

        .hotex-package-information-include {
            text-align: @packages-room-information-popup-include-text-align;

            p {
                font-size: @packages-room-information-popup-include-p-font-size;
                font-family: @packages-room-information-popup-include-p-font-family;
                color: @packages-room-information-popup-include-p-color;
                font-weight: @packages-room-information-popup-include-p-font-weight;
            }

            ul {
                font-size: @packages-room-information-popup-include-p-font-size;
                font-family: @packages-room-information-popup-include-p-font-family;
                color: @packages-room-information-popup-include-p-color;
            }
        }
    }

    .hotex-package-information-policy {
        text-align: @packages-room-information-popup-policy-text-align;

        p {
            font-size: @packages-room-information-popup-policy-p-font-size;
            font-family: @packages-room-information-popup-policy-p-font-family;
            color: @packages-room-information-popup-policy-p-color;
            font-weight: @packages-room-information-popup-policy-p-font-weight;
        }

        ul {
            font-size: @packages-room-information-popup-policy-p-font-size;
            font-family: @packages-room-information-popup-policy-p-font-family;
            color: @packages-room-information-popup-policy-p-color;
        }
    }
}

//PAGE DETAIL : RESERVATION INFO
.hotex-reservation-info-detail {
    background: @detail-reservation-info-background;
    font-size: @detail-reservation-info-font-size;
    font-family: @detail-reservation-info-font-family;
    color: @detail-reservation-info-color;

    .hotex-reservation-info-detail-content1 {
        font-size: @detail-reservation-info-content1-font-size;
        font-family: @detail-reservation-info-content1-font-family;
        color: @detail-reservation-info-content1-color;
    }

    .hotex-reservation-info-detail-content2 {
        border-left: @detail-reservation-info-content2-border-left;

        .hotex-info-content2-box-decs {
            .hotex-info-content2-item {
                .hotex-modify-search {
                    font-family: @detail-reservation-info-content2-decs-link-modify-font-family;
                    font-size: @detail-reservation-info-content2-decs-link-modify-font-size;
                    color: @detail-reservation-info-content2-decs-link-modify-color;
                    text-decoration: @detail-reservation-info-content2-decs-link-modify-text-decoration;
                }

                .hotex-modify-search:hover, .hotex-modify-search:focus {
                    font-family: @detail-reservation-info-content2-decs-link-modify-hover-font-family;
                    font-size: @detail-reservation-info-content2-decs-link-modify-hover-font-size;
                    color: @detail-reservation-info-content2-decs-link-modify-hover-color;
                    text-decoration: @detail-reservation-info-content2-decs-link-modify-hover-text-decoration;
                }

                .terms-condition-label {
                    font-family: @detail-reservation-info-content2-decs-label-terms-font-family;
                    font-size: @detail-reservation-info-content2-decs-label-terms-font-size;
                    color: @detail-reservation-info-content2-decs-label-terms-color;
                }

                .terms-condition-link {
                    text-transform: @detail-reservation-info-content2-decs-link-terms-text-transform;
                    font-family: @detail-reservation-info-content2-decs-link-terms-font-family;
                    font-size: @detail-reservation-info-content2-decs-link-terms-font-size;
                    color: @detail-reservation-info-content2-decs-link-terms-color;
                    text-decoration: @detail-reservation-info-content2-decs-link-terms-text-decoration;
                }

                .terms-condition-link:hover, .terms-condition-link:focus {
                    font-family: @detail-reservation-info-content2-decs-link-terms-hover-font-family;
                    font-size: @detail-reservation-info-content2-decs-link-terms-hover-font-size;
                    color: @detail-reservation-info-content2-decs-link-terms-hover-color;
                    text-decoration: @detail-reservation-info-content2-decs-link-terms-hover-text-decoration;
                }
            }
        }

        .hotex-info-content2-item {
            .hotex-info-package-title {
                span {
                    font-family: @detail-reservation-info-content2-item-title-font-family;
                    font-size: @detail-reservation-info-content2-item-title-font-size;
                    color: @detail-reservation-info-content2-item-title-color;
                }
            }

            .hotex-acumulasi-label {
                text-align: @detail-reservation-info-content2-item-acumulasi-text-align;

                a {
                    font-family: @detail-reservation-info-content2-item-link-acumulasi-font-family;
                    font-size: @detail-reservation-info-content2-item-link-acumulasi-font-size;
                    /*color: @detail-reservation-info-content2-item-link-acumulasi-color;*/
                    text-decoration: @detail-reservation-info-content2-item-link-acumulasi-text-decoration;
                }

                a:hover, a:focus {
                    font-family: @detail-reservation-info-content2-item-link-acumulasi-hover-font-family;
                    font-size: @detail-reservation-info-content2-item-link-acumulasi-hover-font-size;
                    /*color: @detail-reservation-info-content2-item-link-acumulasi-hover-color;*/
                    text-decoration: @detail-reservation-info-content2-item-link-acumulasi-hover-text-decoration;
                }
            }

            .hotex-info-content2-average {
                .rate-details-button {
                    font-style: @detail-reservation-info-rate-details-button-font-style;
                    font-size: @detail-reservation-info-rate-details-button-font-size;
                    color: @detail-reservation-info-rate-details-button-color;
                    text-decoration: @detail-reservation-info-rate-details-button-text-decoration;
                    cursor: @detail-reservation-info-rate-details-button-cursor;
                }

                .rate-details-button:hover, .rate-details-button:focus {
                    color: @detail-reservation-info-rate-details-button-hover-color;
                    text-decoration: @detail-reservation-info-rate-details-button-hover-text-decoration;
                }
            }
        }

        .hotex-box-detail-title {
            background-color: @detail-reservation-info-content2-box-title-background-color;
            color: @detail-reservation-info-content2-box-title-color;
            opacity: @detail-reservation-info-content2-box-title-opacity;
            line-height: @detail-reservation-info-content2-box-title-line-height;
            font-size: @detail-reservation-info-content2-box-title-font-size;
            font-family: @detail-reservation-info-content2-box-title-font-family;
        }
    }
}

//PAGE DETAIL : COLLAPSE BOX
.hotex-all-collapse-box {
    .arrow-down {
        text-align: @detail-collapse-arrow-text-align;
        border-left: @detail-collapse-arrow-border-left;
        border-right: @detail-collapse-arrow-border-right;
        border-top: @detail-collapse-arrow-border-top;
    }

    .panel-heading {
        text-align: @detail-collapse-panel-heading-text-align;
        text-transform: @detail-collapse-panel-heading-text-transform;

        a {
            font-size: @detail-collapse-button-text-font-size;
            font-family: @detail-collapse-button-text-font-family;
            color: @detail-collapse-button-text-color;
            border-bottom: @detail-collapse-button-border-bottom;
            text-decoration: @detail-collapse-button-text-decoration;
        }

        a:hover {
            font-size: @detail-collapse-button-hover-text-font-size;
            font-family: @detail-collapse-button-hover-text-font-family;
            color: @detail-collapse-button-hover-text-color;
            text-decoration: @detail-collapse-button-text-decoration;
        }
    }
}

//PAGE DETAIL : COLLAPSE ADDON
.hotex-addon-body {
    .hotex-group-addon {
        .hotex-group-addon-title {
            text-transform: @detail-collapse-addon-group-title-text-transform;
            color: @detail-collapse-addon-group-title-color;
            font-family: @detail-collapse-addon-group-title-font-family;
            font-size: @detail-collapse-addon-group-title-font-size;
        }

        .hotex-group-addon-item {
            .hotex-box-addon-item {
                .hotex-box-addon {
                    .hotex-box-addon-image {
                        .hotex-box-addon-currency {
                            background-color: @detail-collapse-addon-currency-background-color;
                            color: @detail-collapse-addon-currency-color;
                            font-family: @detail-collapse-addon-currency-font-family;
                            font-size: @detail-collapse-addon-currency-font-size;
                            font-weight: @detail-collapse-addon-currency-font-weight;
                            text-align: @detail-collapse-addon-currency-text-align;
                        }
                    }

                    .hotex-box-addon-input {
                        .hotex-addon-title {
                            a {
                                font-size: @detail-collapse-addon-input-title-font-size;
                                font-weight: @detail-collapse-addon-input-title-font-weight;
                                font-family: @detail-collapse-addon-input-title-font-family;
                                text-decoration: @detail-collapse-addon-input-title-text-decoration;
                                color: @detail-collapse-addon-input-title-color;
                            }

                            a:hover, a:focus {
                                font-size: @detail-collapse-addon-input-title-hover-font-size;
                                font-weight: @detail-collapse-addon-input-title-hover-font-weight;
                                font-family: @detail-collapse-addon-input-title-hover-font-family;
                                text-decoration: @detail-collapse-addon-input-title-hover-text-decoration;
                                color: @detail-collapse-addon-input-title-hover-color;
                            }
                        }

                        .hotex-addon-quantity-label {
                            label {
                                font-size: @detail-collapse-addon-input-quantity-label-font-size;
                                font-weight: @detail-collapse-addon-input-quantity-label-font-weight;
                                color: @detail-collapse-addon-input-quantity-label-color;
                                font-family: @detail-collapse-addon-input-quantity-label-font-family;
                            }
                        }

                        .hotex-addon-input-quantity {
                            .hotex-addon-item-min, .hotex-addon-item-max {
                                font-size: @detail-collapse-addon-quantity-button-font-size;
                                font-family: @detail-collapse-addon-quantity-button-font-family;
                                color: @detail-collapse-addon-quantity-button-color;
                                background-color: @detail-collapse-addon-quantity-button-background-color;
                            }

                            .hotex-addon-item-min:hover, .hotex-addon-item-min:focus,
                            .hotex-addon-item-max:hover, .hotex-addon-item-max:focus {
                                font-size: @detail-collapse-addon-quantity-button-hover-font-size;
                                font-family: @detail-collapse-addon-quantity-button-hover-font-family;
                                color: @detail-collapse-addon-quantity-button-hover-color;
                                background-color: @detail-collapse-addon-quantity-button-hover-background-color;
                            }

                            input {
                                font-size: @detail-collapse-addon-quantity-input-hover-font-size;
                                font-family: @detail-collapse-addon-quantity-input-hover-font-family;
                                color: @detail-collapse-addon-quantity-input-hover-color;
                                background-color: @detail-collapse-addon-quantity-input-hover-background-color;
                            }
                        }

                        .hotex-box-addon-cost {
                            .hotex-addon-cost-glyphicon {
                                span {
                                    color: @detail-collapse-addon-cost-glyphicon-color;
                                    font-size: @detail-collapse-addon-cost-glyphicon-font-size;
                                }
                            }

                            .hotex-addon-cost {
                                font-size: @detail-collapse-addon-cost-font-size;
                                font-family: @detail-collapse-addon-cost-font-family;
                                color: @detail-collapse-addon-cost-color;
                                text-align: @detail-collapse-addon-cost-text-align;
                            }
                        }
                    }
                }
            }
        }
    }
}

//PAGE DETAIL : COLLAPSE ADDON POPUP
.hotex-addon-information {
    .hotex-addon-information-title {
        text-transform: @detail-collapse-addon-information-title-font-transform;
        color: @detail-collapse-addon-information-title-color;
        font-family: @detail-collapse-addon-information-title-font-family;
        font-size: @detail-collapse-addon-information-title-font-size;
        font-weight: @detail-collapse-addon-information-title-font-weight;
    }

    .hotex-addon-information-desc {
        color: @detail-collapse-addon-information-desc-color;
        font-family: @detail-collapse-addon-information-desc-font-family;
        font-size: @detail-collapse-addon-information-desc-font-size;
        text-align: @detail-collapse-addon-information-desc-text-align;
    }
}

//PAGE DETAIL : COLLAPSE GUEST DETAIL
.hotex-guest-details {
    .hotex-guest-details-item {
        label {
            color: @detail-collapse-guest-item-color;
            font-family: @detail-collapse-guest-item-font-family;
            font-size: @detail-collapse-guest-item-font-size;
            font-weight: @detail-collapse-guest-item-font-weight;
        }

        .hotex-input-no-visible {
            background-color: @detail-collapse-guest-item-input-no-visible-background-color;
            color: @detail-collapse-guest-item-input-no-visible-color;
            cursor: @detail-collapse-guest-item-input-no-visible-cursor;
        }

        .help-block {
            color: @detail-collapse-guest-item-help-block-color;
            font-family: @detail-collapse-guest-item-help-block-font-family;
            font-size: @detail-collapse-guest-item-help-block-font-size;
        }
    }
}

//PAGE DETAIL : COLLAPSE GUEST DETAIL
.hotex-flight-details {
    .hotex-arrival {
        .hotex-arrival-item {
            strong {
                font-family: @detail-collapse-flight-arrival-title-font-family;
                font-size: @detail-collapse-flight-arrival-title-font-size;
                font-weight: @detail-collapse-flight-arrival-title-font-weight;
                color: @detail-collapse-flight-arrival-title-color;
            }

            label {
                font-family: @detail-collapse-flight-arrival-label-font-family;
                font-size: @detail-collapse-flight-arrival-label-font-size;
                font-weight: @detail-collapse-flight-arrival-label-font-weight;
                color: @detail-collapse-flight-arrival-label-color;
            }
        }
    }

    .hotex-depature {
        .hotex-depature-item {
            strong {
                font-family: @detail-collapse-flight-depature-title-font-family;
                font-size: @detail-collapse-flight-depature-title-font-size;
                font-weight: @detail-collapse-flight-depature-title-font-weight;
                color: @detail-collapse-flight-depature-title-color;
            }

            label {
                font-family: @detail-collapse-flight-depature-label-font-family;
                font-size: @detail-collapse-flight-depature-label-font-size;
                font-weight: @detail-collapse-flight-depature-label-font-weight;
                color: @detail-collapse-flight-depature-label-color;
            }
        }
    }
}

//PAGE DETAIL : COLLAPSE SPECIAL REQUEST
.hotex-box-special {
    font-family: @detail-collapse-box-special-font-family;
    font-size: @detail-collapse-box-special-font-size;
    color: @detail-collapse-box-special-color;
}

//PAGE PAYMENT : RESERVATION INFO
.hotex-reservation-info-payment {
    background: @payment-reservation-info-background;

    .hotex-reservation-info-payment-content1 {
        font-size: @payment-reservation-info-content1-font-size;
        font-family: @payment-reservation-info-content1-font-family;
        color: @payment-reservation-info-content1-color;
    }

    .hotex-reservation-info-payment-content2 {
        border-left: @payment-reservation-info-content2-border-left;

        .hotex-box-payment-title {
            background-color: @payment-reservation-info-content2-title-background-color;
            color: @payment-reservation-info-content2-title-color;
            opacity: @payment-reservation-info-content2-title-opacity;
            line-height: @payment-reservation-info-content2-title-line-height;
        }
    }
}

//PAGE PAYMENT : COLLAPSE BOX
.hotex-all-collapse-box {
    .arrow-down {
        text-align: @detail-collapse-arrow-text-align;
        border-left: @detail-collapse-arrow-border-left;
        border-right: @detail-collapse-arrow-border-right;
        border-top: @detail-collapse-arrow-border-top;
    }

    .panel-heading {
        text-align: @detail-collapse-panel-heading-text-align;

        a {
            font-size: @detail-collapse-button-text-font-size;
            font-family: @detail-collapse-button-text-font-family;
            color: @detail-collapse-button-text-color;
            border-bottom: @detail-collapse-button-border-bottom;
            text-decoration: @detail-collapse-button-text-decoration;
        }

        a:hover {
            font-size: @detail-collapse-button-hover-text-font-size;
            font-family: @detail-collapse-button-hover-text-font-family;
            color: @detail-collapse-button-hover-text-color;
            text-decoration: @detail-collapse-button-text-decoration;
        }
    }
}

//PAGE PAYMENT : GUEST LIST BOX
.hotex-box-guestList {
    .hotex-guest-list-title {
        font-family: @payment-guest-box-title-font-family;
        font-size: @payment-guest-box-title-font-size;
        color: @payment-guest-box-title-color;
        text-transform: @payment-guest-box-title-text-transform;
    }

    .hotex-guest-form-title {
        text-align: @payment-guest-form-title-text-align;
        font-family: @payment-guest-form-title-font-family;
        font-size: @payment-guest-form-title-font-size;
        color: @payment-guest-form-title-color;
    }

    .hotex-room-request-label {
        font-family: @payment-guest-request-title-font-family;
        font-size: @payment-guest-request-title-font-size;
        font-weight: @payment-guest-request-title-font-weight;
        color: @payment-guest-request-title-color;
    }

    .hotex-note-label {
        font-family: @payment-guest-note-title-font-family;
        font-size: @payment-guest-note-title-font-size;
        font-weight: @payment-guest-note-title-font-weight;
        color: @payment-guest-note-title-color;
    }
}

//PAGE PAYMENT : GUEST LIST BOX
.hotex-pax-payment {
    .hotex-card-information {
        label {
            text-transform: @payment-pax-card-information-title-text-transform;
            font-size: @payment-pax-card-information-title-font-size;
            font-family: @payment-pax-card-information-title-font-family;
            color: @payment-pax-card-information-title-color;
        }

        ul {
            font-size: @payment-pax-card-information-ul-font-size;
            font-family: @payment-pax-card-information-ul-font-family;
            color: @payment-pax-card-information-ul-color;
        }
    }

    .hotex-payment-form {
        form-group {
            label {
                font-size: @payment-form-label-font-size;
                font-family: @payment-form-label-font-family;
                color: @payment-form-label-color;
            }
        }
    }
}

//PAGE ACCOMODATION : CONTENT 1 BOX
.hotex-accomodation-content1 {
    h3 {
        font-size: @accomodation-content1-h3-font-size;
        font-family: @accomodation-content1-h3-font-family;
        font-weight: @accomodation-content1-h3-font-weight;
        color: @accomodation-content1-h3-color;
        text-align: @accomodation-content1-h3-text-align;
        text-transform: @accomodation-content1-h3-text-transform;
    }

    .hotex-accomodation-box {
        .hotex-accomodation-box-item {
            border: @accomodation-box-item-border;

            .hotex-accomodation-title {
                text-transform: @accomodation-box-title-text-transform;
                font-size: @accomodation-box-title-font-size;
                font-family: @accomodation-box-title-font-family;
                color: @accomodation-box-title-color;
                border-bottom: @accomodation-box-title-border-bottom;
            }

            .hotex-accomodation-content {
                font-size: @accomodation-box-content-font-size;
                font-family: @accomodation-box-content-font-family;
                color: @accomodation-box-content-color;
            }
        }
    }
}

//PAGE ACCOMODATION : CONTENT 2 SLIDER AMENITIES
.hotex-accomodation-content2 {
    .hotex-box-amenities {
        .hotex-box-amenities-item {
            .hotex-box-slide-room {
                label {
                    font-size: @accomodation-content2-amenities-title-font-size;
                    font-family: @accomodation-content2-amenities-title-font-family;
                    color: @accomodation-content2-amenities-title-color;
                    text-transform: @accomodation-content2-amenities-title-text-transform;
                }

                p {
                    font-size: @accomodation-content2-amenities-decs-font-size;
                    font-family: @accomodation-content2-amenities-decs-font-family;
                    color: @accomodation-content2-amenities-decs-color;
                    text-align: @accomodation-content2-amenities-decs-text-align;
                }
            }

            .hotex-box-slide-amenities {
                label {
                    font-size: @accomodation-content2-amenities-label-font-size;
                    font-family: @accomodation-content2-amenities-label-font-family;
                    color: @accomodation-content2-amenities-label-color;
                }

                ul {
                    font-size: @accomodation-content2-amenities-ul-font-size;
                    font-family: @accomodation-content2-amenities-ul-font-family;
                    color: @accomodation-content2-amenities-ul-color;
                }
            }
        }
    }
}

//PAGE FACILITIES : CONTENT 1
.hotex-facilities-content1 {
    .hotex-facilities-title {
        text-transform: @facilities-content1-title-text-transform;

        label {
            font-size: @facilities-content1-title-label-font-size;
            font-family: @facilities-content1-title-label-font-family;
            color: @facilities-content1-title-label-color;
        }

        h4 {
            font-size: @facilities-content1-title-h4-font-size;
            font-family: @facilities-content1-title-h4-font-family;
            color: @facilities-content1-title-h4-color;
        }
    }

    .hotex-facilities-box {
        .hotex-facilities-group-entry {
            .hotex-facilities-entry {
                font-size: @facilities-content1-entry-font-size;
                font-family: @facilities-content1-entry-font-family;
                color: @facilities-content1-entry-color;
            }
        }
    }
}

//PAGE FACILITIES : CONTENT 2
.hotex-facilities-content2 {
    .hotex-facilities-title {
        text-transform: @facilities-content2-title-text-transform;

        h4 {
            font-size: @facilities-content2-title-h4-font-size;
            font-family: @facilities-content2-title-h4-font-family;
            color: @facilities-content2-title-h4-color;
        }
    }

    .hotex-facilities-box {
        .hotex-facilities-group {
            .hotex-facilities-item {
                .hotex-facilities-information-box {
                    border: @facilities-content2-information-box-border;

                    .hotex-information-name {
                        background-color: @facilities-content2-information-name-background-color;
                        color: @facilities-content2-information-name-color;
                        text-transform: @facilities-content2-information-name-text-transform;
                        font-family: @facilities-content2-information-name-font-family;
                        font-size: @facilities-content2-information-name-font-size;
                    }

                    .hotex-information-desc {
                        text-align: @facilities-content2-information-desc-text-align;
                        font-family: @facilities-content2-information-desc-font-family;
                        font-size: @facilities-content2-information-desc-font-size;
                        color: @facilities-content2-information-desc-color;
                    }
                }
            }
        }
    }
}

//PAGE LOCATION : CONTENT 1
.hotex-location-title {
    text-align: @location-content1-title-text-align;
    text-transform: @location-content1-title-text-transform;

    h3 {
        font-weight: @location-content1-title-h3-font-weight;
        font-size: @location-content1-title-h3-font-size;
        font-family: @location-content1-title-h3-font-family;
        color: @location-content1-title-h3-color;
    }
}

.hotex-point-interest {
    .hotex-point-interest-title {
        text-align: @location-content1-point-interest-title-text-align;
        text-transform: @location-content1-point-interest-title-text-transform;

        h4 {
            font-size: @location-content1-point-interest-title-h4-font-size;
            font-family: @location-content1-point-interest-title-h4-font-family;
            color: @location-content1-point-interest-title-h4-color;
        }
    }

    .hotex-point-interest-box {
        .hotex-point-interest-item {
            border: @location-content1-point-interest-item-border;

            .hotex-interest-name {
                font-size: @location-content1-point-interest-name-font-size;
                font-family: @location-content1-point-interest-name-font-family;
                color: @location-content1-point-interest-name-color;
                border-bottom: @location-content1-point-interest-name-border-bottom;
            }

            .hotex-interest-distance {
                font-size: @location-content1-point-interest-distance-font-size;
                font-family: @location-content1-point-interest-distance-font-family;
                color: @location-content1-point-interest-distance-color;
            }
        }
    }
}

//PAGE LOCATION : CONTENT 2
.hotex-map-direction-label {
    text-transform: @location-content2-title-text-transform;
    text-align: @location-content2-title-text-align;

    h4 {
        font-size: @location-content2-title-h4-font-size;
        font-family: @location-content2-title-h4-font-family;
        color: @location-content2-title-h4-color;
    }
}

.hotex-map-direction {
    text-align: @location-content2-map-text-align;

    #dvMap, img {
        font-weight: @location-content2-map-font-weight;
    }

    p {
        font-family: @font-family-default;
        text-align: @location-content2-decs-text-align;
    }
}

//PAGE PACKAGES : CONTENT 1
.hotex-box-packages {
    .hotex-package-information-content1 {
        .btn-packages {
            text-transform: @page-packages-content1-link-text-transform;
        }

        span {
            color: @page-packages-content1-span-color;
            font-size: @font-size-default - 2;
        }

        .hotex-package-minlos {
            color: @page-packages-content1-minlos-color;
            text-transform: @page-packages-content1-minlos-text-transform;
        }

        .hotex-package-information-desc {
            font-weight: @page-packages-content1-desc-font-weight;
            font-size: @page-packages-content1-desc-font-size;
            font-family: @page-packages-content1-desc-font-family;
            color: @page-packages-content1-desc-color;
            text-align: @page-packages-content1-desc-text-align;
        }
    }

    .hotex-package-information-price {
        .hotex-package-price-label {
            font-size: @page-packages-content1-price-label-font-size;
            font-family: @page-packages-content1-price-label-font-family;
            color: @page-packages-content1-price-label-color;
        }
    }
}

//PAGE PACKAGES : CONTENT 2
.hotex-packages-detail {
    background-color: @page-packages-content2-detail-background-color;

    label {
        color: @page-packages-content2-title-color;
        text-transform: @page-packages-content2-title-text-transform;
        font-size: @page-packages-content2-title-font-size;
        font-family: @page-packages-content2-title-font-family;
    }

    ul {
        font-size: @page-packages-content2-ul-font-size;
        font-family: @page-packages-content2-ul-font-family;
        color: @page-packages-content2-ul-color;
    }
}

//PAGE PACKAGES : CONTENT 3
.hotex-packages-information-content3 {
    .hotex-package-information-title {
        text-transform: @page-packages-content3-title-text-transform;
        font-size: @page-packages-content3-title-font-size;
        font-family: @page-packages-content3-title-font-family;
        color: @page-packages-content3-title-color;
    }

    .hotex-box-other-packages {
        .hotex-other-packages-content {
            .package-information-button {
                text-transform: @page-packages-content3-other-button-information-text-transform;
            }

            .hotex-other-packages-promo {
                label {
                    font-size: @page-packages-content3-other-promo-font-size;
                    font-family: @page-packages-content3-other-promo-font-family;
                    color: @page-packages-content3-other-promo-color;
                }
            }

            .hotex-other-packages-valid {
                font-family: @page-packages-content3-other-valid-font-family;
                font-style: @page-packages-content3-other-valid-font-style;
                font-size: @page-packages-content3-other-valid-font-size;
                color: @page-packages-content3-other-valid-color;
            }

            .hotex-package-information-desc {
                font-weight: @page-packages-content3-other-desc-font-weight;
                font-size: @page-packages-content3-other-desc-font-size;
                font-family: @page-packages-content3-other-desc-font-family;
                color: @page-packages-content3-other-desc-color;

                .package-information-button {
                    text-transform: @page-packages-content3-other-desc-button-text-transform;
                }
            }

            .hotex-other-packages-avarage {
                .hotex-rate-name {
                    color: @page-packages-content3-other-avarage-name-color;
                    font-size: @page-packages-content3-other-avarage-name-font-size;
                    font-family: @page-packages-content3-other-avarage-name-font-family;
                }

                .hotex-rate-currancy {
                    label {
                        color: @page-packages-content3-other-avarage-currancy-color;
                        font-size: @page-packages-content3-other-avarage-currancy-font-size;
                        font-family: @page-packages-content3-other-avarage-currancy-font-family;
                    }
                }
            }
        }
    }
}


//PAGE RETRIEVE RESERVATION : TABLE LIST RESERVATION
.hotex-retrieve-reservation {
    .hotex-mobile-retrieve-title {
        font-size: @retrieve-title-font-size;
        font-family: @retrieve-title-font-family;
        color: @retrieve-title-color;
        text-transform: @retrieve-title-text-transform;
    }

    .hotex-table > thead > tr > th,
    .hotex-table > tbody > tr > th,
    .hotex-table > tfoot > tr > th,
    .hotex-table > thead > tr > td,
    .hotex-table > tbody > tr > td,
    .hotex-table > tfoot > tr > td {
        line-height: @retrieve-table-line-height;
        vertical-align: @retrieve-table-vertical-align;
        border-top: @retrieve-table-border-top;
    }

    .hotex-no-reservation {
        font-size: @retrieve-no-reservation-font-size;
        font-family: @retrieve-no-reservation-font-family;
        color: @retrieve-no-reservation-color;
    }
}

//PAGE RETRIEVE RESERVATION : RESERVATION DETAIL
.hotex-reservation-detail {
    .hotex-reservation-detail-header {
        font-size: @retrieve-detail-header-font-size;
        font-family: @retrieve-detail-header-font-family;
        color: @retrieve-detail-header-color;
    }

    .hotex-box-retrieve-detail-title {
        background-color: @retrieve-detail-box-title-background-color;
        color: @retrieve-detail-box-title-color;
        font-size: @retrieve-detail-box-title-font-size;
        font-family: @retrieve-detail-box-title-font-family;
        text-transform: @retrieve-detail-box-title-text-transform;
        opacity: @retrieve-detail-box-title-opacity;
        line-height: @retrieve-detail-box-title-line-height;
    }

    .hotex-breakdown-detail {
        strong {
            font-size: @retrieve-detail-breakdown-name-font-size;
            font-family: @retrieve-detail-breakdown-name-font-family;
            color: @retrieve-detail-breakdown-name-color;
        }

        .hotex-breakdown-decs {
            font-size: @retrieve-detail-breakdown-decs-font-size;
            font-family: @retrieve-detail-breakdown-decs-font-family;
            color: @retrieve-detail-breakdown-decs-color;
        }
    }

    .hotex-reservation-detail-content {
        font-size: @retrieve-detail-content-font-size;
        font-family: @retrieve-detail-content-font-family;
        color: @retrieve-detail-content-color;
    }

    .hotex-reservation-terms {
        font-size: @retrieve-detail-terms-font-size;
        font-family: @retrieve-detail-terms-font-family;
        color: @retrieve-detail-terms-color;
    }
}

//PAGE RETRIEVE RESERVATION : RESERVATION CANCEL
.hotex-reservation-cancel {
    strong {
        font-size: @retrieve-cancel-title-font-size;
        font-family: @retrieve-cancel-title-font-family;
        color: @retrieve-cancel-title-color;
    }
}

//111914 PAGE DETAIL Tombol Back to Top
#buttonBackToTop {
    background-color: @button-back-to-top-background-color;
    font-family: @button-back-to-top-font-family;
    font-size: @button-back-to-top-font-size;

    .glyphicon {
        color: @button-back-to-top-glyphicon-color;
        font-size: @button-back-to-top-glyphicon-font-size;
    }

    span {
        color: @button-back-to-top-span-color;
    }
}