[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}
/* Fonts */

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Thin/Roboto-Thin.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Thin/Roboto-Thin.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Thin/Roboto-Thin.ttf?v=1.1.0") format("truetype");
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/ThinItalic/Roboto-ThinItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/ThinItalic/Roboto-ThinItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/ThinItalic/Roboto-ThinItalic.ttf?v=1.1.0") format("truetype");
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Light/Roboto-Light.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Light/Roboto-Light.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Light/Roboto-Light.ttf?v=1.1.0") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/LightItalic/Roboto-LightItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/LightItalic/Roboto-LightItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/LightItalic/Roboto-LightItalic.ttf?v=1.1.0") format("truetype");
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Regular/Roboto-Regular.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Regular/Roboto-Regular.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Regular/Roboto-Regular.ttf?v=1.1.0") format("truetype");
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Regular/Roboto-Regular.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Regular/Roboto-Regular.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Regular/Roboto-Regular.ttf?v=1.1.0") format("truetype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Italic/Roboto-Italic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Italic/Roboto-Italic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Italic/Roboto-Italic.ttf?v=1.1.0") format("truetype");
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Italic/Roboto-Italic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Italic/Roboto-Italic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Italic/Roboto-Italic.ttf?v=1.1.0") format("truetype");
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Medium/Roboto-Medium.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Medium/Roboto-Medium.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Medium/Roboto-Medium.ttf?v=1.1.0") format("truetype");
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/MediumItalic/Roboto-MediumItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/MediumItalic/Roboto-MediumItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/MediumItalic/Roboto-MediumItalic.ttf?v=1.1.0") format("truetype");
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Bold/Roboto-Bold.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Bold/Roboto-Bold.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Bold/Roboto-Bold.ttf?v=1.1.0") format("truetype");
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Bold/Roboto-Bold.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Bold/Roboto-Bold.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Bold/Roboto-Bold.ttf?v=1.1.0") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.ttf?v=1.1.0") format("truetype");
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/BoldItalic/Roboto-BoldItalic.ttf?v=1.1.0") format("truetype");
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/Black/Roboto-Black.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/Black/Roboto-Black.woff?v=1.1.0") format("woff"), url("../fonts/roboto/Black/Roboto-Black.ttf?v=1.1.0") format("truetype");
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: Roboto;
    src: url("../fonts/roboto/BlackItalic/Roboto-BlackItalic.woff2?v=1.1.0") format("woff2"), url("../fonts/roboto/BlackItalic/Roboto-BlackItalic.woff?v=1.1.0") format("woff"), url("../fonts/roboto/BlackItalic/Roboto-BlackItalic.ttf?v=1.1.0") format("truetype");
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'Oswald';
    src: url('../fonts/oswald/oswald-light-webfont.eot');
    src: url('../fonts/oswald/oswald-light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/oswald/oswald-light-webfont.woff') format('woff'), url('../fonts/oswald/oswald-light-webfont.ttf') format('truetype'), url('../fonts/oswald/oswald-light-webfont.svg#Oswald') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald';
    src: url('../fonts/oswald/oswald-regular-webfont.eot');
    src: url('../fonts/oswald/oswald-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/oswald/oswald-regular-webfont.woff') format('woff'), url('../fonts/oswald/oswald-regular-webfont.ttf') format('truetype'), url('../fonts/oswald/oswald-regular-webfont.svg#Oswald') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald';
    src: url('../fonts/oswald/oswald-bold-webfont.eot');
    src: url('../fonts/oswald/oswald-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/oswald/oswald-bold-webfont.woff') format('woff'), url('../fonts/oswald/oswald-bold-webfont.ttf') format('truetype'), url('../fonts/oswald/oswald-bold-webfont.svg#Oswald') format('svg');
    font-weight: 700;
    font-style: normal;
}
/* Default */

html {
    background-color: rgba(0, 0, 0, 1);
}

body {
    font-family: 'roboto';
    background: #ffffff;
    color: #333333;
}

a {
    color: #b6b3d2;
    text-decoration: none;
    cursor: pointer;
}

    a:focus,
    a:hover {
        color: #9f9cc1;
        text-decoration: none;
    }

b,
strong {
    font-weight: bold;
}
/* Scroll Bar */

::-webkit-scrollbar {
    width: 10px;
    height: 0;
}

::-webkit-scrollbar-button {
    display: none;
}

::-webkit-scrollbar-track {
    background-color: #999;
}

::-webkit-scrollbar-track-piece {
    background-color: #C1C1C1;
}

::-webkit-scrollbar-thumb {
    height: 10px;
    background-color: #121212;
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: #666;
    }

::-webkit-scrollbar-corner {
    background-color: #999;
}
/* Screen Cover */

#screenCover {
    position: fixed;
    height: 100%;
    width: 100%;
    /*background: rgba(255, 255, 255, 1);*/
    z-index: 11000;
}
/* Preloader */

#preloader {
    position: fixed;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.85);
    z-index: 10000;
}

    #preloader .preloader-inner {
        display: inline-block;
        left: 50%;
        margin-left: -54px;
        margin-top: -60px;
        padding: 15px;
        position: absolute;
        text-align: center;
        top: 50%;
        z-index: 1;
    }

    #preloader #rotater {
        position: relative;
        animation: rotate 1s infinite linear;
        border: 4px solid rgba(255, 255, 255, .25);
        width: 80px;
        height: 80px;
        border-radius: 999px;
    }

        #preloader #rotater span {
            position: absolute;
            width: 80px;
            height: 80px;
            border: 4px solid transparent;
            border-top: 4px solid #fff;
            top: -4px;
            left: -4px;
            border-radius: 999px;
        }

@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

#preloader #logo {
    position: absolute;
    top: 50%;
    margin-top: -30px;
    left: 50%;
    margin-left: -30px;
    width: 60px;
}
/* Listlodarer */

#listlodarer {
    width: 100%;
    text-align: center;
}

.listlodarer-inner {
    padding: 50px 0px;
    background-color: #fff;
}

    .listlodarer-inner b {
        display: block;
        font-size: 12px;
        letter-spacing: 2px;
        text-transform: uppercase;
    }
/* Go To Top */

#gotoTop {
    position: fixed;
    bottom: 15px;
    right: 15px;
    width: 44px;
    height: 34px;
    color: #fff;
    font-size: 30px;
    line-height: 1;
    padding: 0px;
    text-align: center;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

    #gotoTop:hover {
        background-color: rgba(0, 0, 0, 0.7);
        cursor: pointer;
    }
/* Horizontal Auto Scrolling Text */

@media (min-width: 992px) {
    .hoz-scroll {
        overflow: hidden;
    }

        .hoz-scroll > span,
        .hoz-scroll > div {
            white-space: nowrap;
            display: inline-block;
        }
}
/* Buttons */

.btn:hover,
.btn.active,
.btn:active,
.btn.focus,
.btn:focus,
.btn.active.focus,
.btn.active:focus,
.btn.active:hover,
.btn:active.focus,
.btn:active:focus,
.btn:active:hover {
    outline: none !important;
}

.btn-primary {
    background-color: #b6b3d2;
    border-color: transparent;
    color: #fff;
}

    .btn-primary:hover,
    .btn-primary.active,
    .btn-primary:active,
    .btn-primary.focus,
    .btn-primary:focus,
    .btn-primary.active.focus,
    .btn-primary.active:focus,
    .btn-primary.active:hover,
    .btn-primary:active.focus,
    .btn-primary:active:focus,
    .btn-primary:active:hover {
        background-color: #9f9cc1;
        border-color: transparent;
        color: #fff;
    }

    .btn-primary.disabled,
    .btn-primary[disabled],
    .btn-primary.disabled.focus,
    .btn-primary.disabled:focus,
    .btn-primary.disabled:hover,
    .btn-primary[disabled].focus,
    .btn-primary[disabled]:focus,
    .btn-primary[disabled]:hover {
        opacity: 0.5;
        background-color: #d8d7e7;
        color: #fff;
        border-color: transparent;
    }

.btn-white {
    color: #000000;
    background-color: rgba(255, 255, 255, 1);
}

    .btn-white:hover,
    .btn-white.active,
    .btn-white:active,
    .btn-white.focus,
    .btn-white:focus,
    .btn-white.active.focus,
    .btn-white.active:focus,
    .btn-white.active:hover,
    .btn-white:active.focus,
    .btn-white:active:focus,
    .btn-white:active:hover {
        color: #000000;
        background-color: rgba(255, 255, 255, 1);
    }

.btn-white-outline {
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 1);
    background: transparent;
}

.btn-white-outline {
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 1);
    background: transparent;
}

.btn-outlined {
    background-color: rgba(182, 179, 210, 0);
    border: 1px solid rgba(182, 179, 210, 1);
    color: rgba(182, 179, 210, 1);
}

    .btn-outlined:hover,
    .btn-outlined:active {
        background-color: rgba(182, 179, 210, 1);
        color: rgba(255, 255, 255, 1);
    }

.btn-black {
    color: #ffffff;
    background-color: rgba(0, 0, 0, 1);
}

    .btn-black:hover,
    .btn-black.active,
    .btn-black:active,
    .btn-black.focus,
    .btn-black:focus,
    .btn-black.active.focus,
    .btn-black.active:focus,
    .btn-black.active:hover,
    .btn-black:active.focus,
    .btn-black:active:focus,
    .btn-black:active:hover {
        color: #ffffff;
        background-color: rgba(0, 0, 0, 1);
    }

.btn-darkpurple {
    color: #ffffff;
    background-color: #6A5671;
}

    .btn-darkpurple:hover,
    .btn-darkpurple.active,
    .btn-darkpurple:active,
    .btn-darkpurple.focus,
    .btn-darkpurple:focus,
    .btn-darkpurple.active.focus,
    .btn-darkpurple.active:focus,
    .btn-darkpurple.active:hover,
    .btn-darkpurple:active.focus,
    .btn-darkpurple:active:focus,
    .btn-darkpurple:active:hover {
        color: #ffffff;
        background-color: #5b4165;
    }

.btn-yellow {
    color: #000000;
    background-color: rgba(236, 203, 8, 1);
}

    .btn-yellow:hover,
    .btn-yellow.active,
    .btn-yellow:active,
    .btn-yellow.focus,
    .btn-yellow:focus,
    .btn-yellow.active.focus,
    .btn-yellow.active:focus,
    .btn-yellow.active:hover,
    .btn-yellow:active.focus,
    .btn-yellow:active:focus,
    .btn-yellow:active:hover {
        color: #000000;
        background-color: rgba(236, 203, 8, 1);
    }

.btn-salmon {
    color: #ffffff;
    background-color: rgba(231, 197, 203, 1);
}

    .btn-salmon:hover,
    .btn-salmon.active,
    .btn-salmon:active,
    .btn-salmon.focus,
    .btn-salmon:focus,
    .btn-salmon.active.focus,
    .btn-salmon.active:focus,
    .btn-salmon.active:hover,
    .btn-salmon:active.focus,
    .btn-salmon:active:focus,
    .btn-salmon:active:hover {
        color: #ffffff;
        background-color: rgba(231, 197, 203, 1);
    }

.btn-plum {
    color: #ffffff;
    background-color: rgba(116, 112, 150, 1);
}

    .btn-plum:hover,
    .btn-plum.active,
    .btn-plum:active,
    .btn-plum.focus,
    .btn-plum:focus,
    .btn-plum.active.focus,
    .btn-plum.active:focus,
    .btn-plum.active:hover,
    .btn-plum:active.focus,
    .btn-plum:active:focus,
    .btn-plum:active:hover {
        color: #ffffff;
        background-color: rgba(116, 112, 150, 1);
    }


.btn-gray {
    color: #ffffff;
    background-color: #999999;
    border-color: #797979;
}

    .btn-gray:hover,
    .btn-gray.active,
    .btn-gray:active,
    .btn-gray.focus,
    .btn-gray:focus,
    .btn-gray.active.focus,
    .btn-gray.active:focus,
    .btn-gray.active:hover,
    .btn-gray:active.focus,
    .btn-gray:active:focus,
    .btn-gray:active:hover {
        color: #ffffff;
        background-color: #999999;
        border-color: #797979;
    }

.btn-green {
    color: #ffffff;
    background-color: #4e7b1a;
    border-color: #4e7b1a;
}
.btn-green:hover,
.btn-green.active,
.btn-green:active,
.btn-green.focus,
.btn-green:focus,
.btn-green.active.focus,
.btn-green.active:focus,
.btn-green.active:hover,
.btn-green:active.focus,
.btn-green:active:focus,
.btn-green:active:hover {
    color: #ffffff;
    background-color: #3a610d;
    border-color: #3a610d;
}
.btn-green.btn-outline {
    background-color: transparent !important;
    color: #4e7b1a !important;
}
.btn-green.btn-outline:hover,
.btn-green.btn-outline.active,
.btn-green.btn-outline:active,
.btn-green.btn-outline.focus,
.btn-green.btn-outline:focus,
.btn-green.btn-outline.active.focus,
.btn-green.btn-outline.active:focus,
.btn-green.btn-outline.active:hover,
.btn-green.btn-outline:active.focus,
.btn-green.btn-outline:active:focus,
.btn-green.btn-outline:active:hover {
    background-color: transparent !important;
    color: #3a610d !important;
}

.btn-imperial {
    color: #ffffff;
    background-color: #e68283;
    border-color: #e68283;
}
.btn-imperial:hover,
.btn-imperial.active,
.btn-imperial:active,
.btn-imperial.focus,
.btn-imperial:focus,
.btn-imperial.active.focus,
.btn-imperial.active:focus,
.btn-imperial.active:hover,
.btn-imperial:active.focus,
.btn-imperial:active:focus,
.btn-imperial:active:hover {
    color: #ffffff;
    background-color: #d77374;
    border-color: #d77374;
}
.btn-lilac {
    color: #ffffff;
    background-color: #aa76b7;
    border-color: #aa76b7;
}
.btn-lilac:hover,
.btn-lilac.active,
.btn-lilac:active,
.btn-lilac.focus,
.btn-lilac:focus,
.btn-lilac.active.focus,
.btn-lilac.active:focus,
.btn-lilac.active:hover,
.btn-lilac:active.focus,
.btn-lilac:active:focus,
.btn-lilac:active:hover {
    color: #ffffff;
    background-color: #9663a3;
    border-color: #9663a3;
}

.facebook-btn {
    color: #ffffff;
    background-color: #306199;
    -webkit-font-smoothing: antialiased;
    text-shadow: 0 -1px rgba(0, 0, 0, .5);
}

    .facebook-btn:hover,
    .facebook-btn:focus {
        color: #ffffff;
        background-color: #244872;
    }

.googleplus-btn {
    color: #ffffff;
    background-color: #e93f2e;
    -webkit-font-smoothing: antialiased;
    text-shadow: 0 -1px rgba(0, 0, 0, .5);
}

    .googleplus-btn:hover,
    .googleplus-btn:focus {
        color: #ffffff;
        background-color: #ce2616;
    }

.btn-active-circle {
    width: 25px;
    height: 25px;
    text-align: center;
    padding: 4px 1px 1px 2px;
    font-size: 12px;
    line-height: 1.428571429;
    border-radius: 15px;
}


/* Form */

select.form-control {
    background-image: url(../img/downarrow.png);
    background-position: 97% center;
    background-repeat: no-repeat;
    -webkit-appearance: none;
    -moz-appearance: none;
}

    select.form-control::-ms-expand {
        display: none;
    }

.form-control:focus {
    border-color: #af97ac;
    outline: 0;
    -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075), 0 0 0px rgba(102, 175, 233, .6);
    box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075), 0 0 0px rgba(102, 175, 233, .6);
}

.form-group {
    margin-bottom: 6px;
}

.input-group {
    width: 100%;
}

.input-group-addon {
    border: 1px solid rgb(210, 210, 210);
    background-color: rgb(209, 209, 209);
    width: 40px;
    max-width: 40px;
    text-align: center;
    overflow: hidden;
}

input[type=checkbox] {
    display: none;
}

    input[type=checkbox] + label {
        display: inline-block;
        cursor: pointer;
        position: relative;
        padding-left: 20px;
    }

        input[type=checkbox] + label:before {
            content: "";
            display: inline-block;
            width: 15px;
            height: 15px;
            margin-right: 8px;
            position: absolute;
            left: 0;
            bottom: 3px;
            background-color: #DDDADE;
            border-radius: 3px;
            border: 1px solid #CAC6CC;
        }

        input[type=checkbox] + label:hover:before {
            background-color: #C7C6C7;
        }

    input[type=checkbox]:checked + label:before {
        font-family: FontAwesome;
        content: "\f00c";
        background-color: #69125E;
        border: 2px solid #69125E;
        color: #FFF;
        font-size: 9px;
        text-align: center;
    }

    input[type=checkbox][disabled] + label {
        opacity: 0.8;
        cursor: not-allowed;
    }

    input[type=checkbox].jbsCheck.jbsCheckTile-top-left + label:before, input[type=checkbox].jbsCheck.jbsCheckTile-top-left + label:before, input[type=checkbox].jbsCheck.jbsCheckTile-bottom-left + label:before, input[type=checkbox].jbsCheck.jbsCheckTile-bottom-right + label:before {
        position: absolute;
    }

    input[type=checkbox].jbsCheck.jbsCheckTile-top-left + label:before {
        top: 5px;
        left: 5px;
    }

    input[type=checkbox].jbsCheck.jbsCheckTile-top-right + label:before {
        top: 5px;
        right: 5px;
    }

    input[type=checkbox].jbsCheck.jbsCheckTile-bottom-left + label:before {
        bottom: 5px;
        left: 5px;
    }

    input[type=checkbox].jbsCheck.jbsCheckTile-bottom-right + label:before {
        bottom: 5px;
        right: 5px;
    }

.form-group .form-control-error {
    display: inline-block;
    font-size: 12px;
    line-height: 1.2;
    color: #e84c4c;
    border: 1px solid #e84c4c;
    padding: 2px 5px;
    margin-top: 4px;
    position: relative;
    border-radius: 5px;
    z-index: 10;
    pointer-events: none;
}

    .form-group .form-control-error:before {
        content: "";
        position: absolute;
        top: -5px;
        left: 7px;
        border-bottom: 4px solid #e84c4c;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

    .form-group .form-control-error:after {
        content: "";
        position: absolute;
        top: -4px;
        left: 8px;
        border-bottom: 4px solid #ffffff;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }

.form-group .input-group ~ .form-control-error {
    margin-left: 40px;
}

.form-group .form-control-error:empty {
    display: none;
}

.form-msg {
    padding: 15px;
    margin-bottom: 10px;
    background-color: #F5F5DE;
    font-size: 14px;
    font-weight: bold;
}

    .form-msg.success {
        border: 1px solid #1CB300;
        color: #1CB300;
    }

    .form-msg.error {
        border: 1px solid #e84c4c;
        color: #e84c4c;
    }

.required {
    color: #e84c4c;
}

.refresh-results {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 14px;
    color: #999999;
    z-index: 10;
    -webkit-animation: rotating 1s linear infinite;
    -moz-animation: rotating 1s linear infinite;
    -ms-animation: rotating 1s linear infinite;
    -o-animation: rotating 1s linear infinite;
    animation: rotating 1s linear infinite;
}

@-webkit-keyframes rotating {
    from {
        -ms-transform: rotate(0);
        -moz-transform: rotate(0);
        -webkit-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0);
        -moz-transform: rotate(0);
        -webkit-transform: rotate(0);
        -o-transform: rotate(0);
        transform: rotate(0);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
/** Validation **/

.form-group.error input {
    border-color: #d65b5b !important;
    color: #d65b5b !important;
}

.form-group.error .input-ico {
    color: #d65b5b !important;
}
/* Common Search Box */

.search-box .no-results {
    text-align: left;
    padding-left: 10px;
    font-size: 13px;
    font-weight: bold;
    color: #e84c4c;
}

.search-box .dropdown-menu {
    padding: 15px 10px 15px 15px;
    max-height: 260px;
    min-width: 100%;
    overflow-y: scroll;
}

.search-box::-webkit-scrollbar {
    width: 5px;
    height: 0;
}

.search-box::-webkit-scrollbar-button {
    display: none;
}

.search-box::-webkit-scrollbar-track {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #ffffff !important;
}

.search-box::-webkit-scrollbar-track-piece {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #ffffff !important;
}

.search-box::-webkit-scrollbar-thumb {
    height: 10px;
    border-radius: 4px;
    background-color: #cccccc !important;
}

    .search-box::-webkit-scrollbar-thumb:hover {
        border-radius: 4px;
        background-color: #999999 !important;
    }

.search-box::-webkit-scrollbar-corner {
    background-color: #ffffff !important;
}

.search-box .dropdown-menu > li > a {
    padding: 3px 10px;
    cursor: pointer;
}

.search-box .dropdown-menu > .active > a,
.search-box .dropdown-menu > .active > a:focus,
.search-box .dropdown-menu > .active > a:hover {
    background-color: #970067;
}

.search-box .typeahead-group-header {
    font-size: 18px;
    font-weight: normal;
    text-transform: uppercase;
    margin-top: 10px;
    color: #999999;
}

.search-box .selectize-dropdown {
    right: 0px;
    padding: 15px;
    max-height: 260px;
    overflow-y: scroll;
}

@-moz-document url-prefix() {
    .search-box .country-select select.form-control {
        padding-left: 8px;
    }
}

@media (min-width: 992px) {
    .search-box .country-select {
        padding-right: 18px;
    }

    .search-box .city-select {
        padding-left: 18px;
    }
}
/* Header */

header {
    position: fixed;
    width: 100%;
    z-index: 999;
}

@media (max-width: 767px) {
    header {
        position: relative;
        padding-top: 45px;
    }
}

header .search-box {
    position: relative;
    top: 40px;
    width: 100%;
    background-color: #747096;
    border: none;
    text-align: center;
    z-index: 4;
    height: 0px;
    padding: 0px;
    overflow: hidden;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
}

    header .search-box.en {
        height: auto;
        padding: 15px 0px;
        overflow: visible;
    }

    header .search-box .serach-field {
        position: relative;
        vertical-align: top;
    }

        header .search-box .serach-field input {
            position: relative;
            width: 280px;
            vertical-align: top;
        }

@media (max-width: 767px) {
    header .search-box {
        position: fixed;
        top: 45px;
    }

        header .search-box .serach-field input {
            width: 100%;
        }
}
/* Primary Navbar */

.jbs-primary-navbar {
    position: fixed;
    top: 0;
    width: 100%;
    border: none;
    min-height: 40px;
    height: 40px;
    border-radius: 0;
    margin: 0;
    background: rgba(200,185,203,1);
    background: -moz-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(200,185,203,1)), color-stop(100%, rgba(182,179,210,1)));
    background: -webkit-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -o-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -ms-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c8b9cb', endColorstr='#b6b3d2', GradientType=1 );
    z-index: 3;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
}

    .jbs-primary-navbar .logo-box {
        background-color: #fff;
        border-top: none;
        border-radius: 0 0 20px 20px;
        width: 160px;
        height: 135px;
        position: absolute;
        cursor: pointer;
        -webkit-box-shadow: 0px 0px 12px -2px rgba(0, 0, 0, 0.35);
        -moz-box-shadow: 0px 0px 12px -2px rgba(0, 0, 0, 0.35);
        box-shadow: 0px 0px 12px -2px rgba(0, 0, 0, 0.35);
    }

        .jbs-primary-navbar .logo-box .site-logo {
            width: 125px;
            margin: 0 auto;
            display: block;
        }

    .jbs-primary-navbar .logo-box-name {
        border-top: none;
        height: 40px;
        position: absolute;
        padding: 10px 0;
    }

        .jbs-primary-navbar .logo-box-name .site-logo-name {
            height: 20px;
            margin: 0 auto;
        }

    .jbs-primary-navbar .navbar-nav {
        float: right;
    }

        .jbs-primary-navbar .navbar-nav li {
            border-left: 1px solid rgba(255, 255, 255, 0.1);
            border-right: 1px solid rgba(0, 0, 0, 0.1);
            padding: 6px 10px;
            color: #FFF;
            height: 40px;
        }

            .jbs-primary-navbar .navbar-nav li:first-child {
                padding-left: 0px;
                border-left: none;
            }

            .jbs-primary-navbar .navbar-nav li:last-child {
                padding-right: 0px;
                border-right: none;
            }

            .jbs-primary-navbar .navbar-nav li > span {
                vertical-align: middle;
                padding: 4px;
            }

            .jbs-primary-navbar .navbar-nav li a {
                padding: 4px;
                color: #ffffff;
            }

                .jbs-primary-navbar .navbar-nav li a:hover {
                    color: #ffffff;
                }

            .jbs-primary-navbar .navbar-nav li .btn {
                height: 27px;
                padding: 4px 8px;
                font-weight: bold;
                font-size: 12px;
                border-radius: 20px;
                text-transform: uppercase;
            }

                .jbs-primary-navbar .navbar-nav li .btn.btn-hoverFX:after {
                    border-radius: 18px;
                }

            .jbs-primary-navbar .navbar-nav li.social {
                padding: 8px;
            }

                .jbs-primary-navbar .navbar-nav li.social a {
                    display: inline-block;
                    height: 23px;
                    width: 23px;
                    padding: 2px;
                    text-align: center;
                    background-color: rgba(255, 255, 255, 0.7);
                    border-radius: 50%;
                    color: #b6b3d1;
                }

                    .jbs-primary-navbar .navbar-nav li.social a:hover {
                        background-color: rgba(255, 255, 255, 1);
                    }

            .jbs-primary-navbar .navbar-nav li.search .search-drop {
                height: 27px;
                text-transform: uppercase;
                font-weight: bold;
                padding: 4px;
                cursor: pointer;
            }

                .jbs-primary-navbar .navbar-nav li.search .search-drop span i {
                    margin-left: 5px;
                }

            .jbs-primary-navbar .navbar-nav li.loged .profile {
                position: relative;
                width: 28px;
                height: 28px;
                cursor: pointer;
            }

                .jbs-primary-navbar .navbar-nav li.loged .profile:after {
                    font-family: FontAwesome;
                    content: "\f00c";
                    font-size: 9px;
                    color: #ffffff;
                    position: absolute;
                    bottom: 0;
                    right: 0;
                    width: 12px;
                    height: 12px;
                    padding: 1px;
                    text-align: center;
                    overflow: hidden;
                    border-radius: 50%;
                    background-color: #22ce00;
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile img {
                    width: 28px;
                    height: 28px;
                    border-radius: 50%;
                }

            .jbs-primary-navbar .navbar-nav li.loged .profile-details li {
                padding: 10px;
                height: auto;
                color: #000000;
                text-align: center;
            }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li img {
                    width: 100px;
                    height: 100px;
                    border-radius: 50%;
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li h3 {
                    margin-top: 10px;
                    font-size: 16px;
                    font-weight: bold;
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li a {
                    color: #666666;
                    cursor: pointer;
                }

                    .jbs-primary-navbar .navbar-nav li.loged .profile-details li a:hover {
                        color: #747096;
                        background-color: transparent;
                    }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li .btn {
                    margin-top: 10px;
                }
.jbs-primary-navbar .navbar-nav li.gvr {
    background-color: rgba(255,255,255,0.4);
}
.jbs-primary-navbar .navbar-nav li.gvr button img {
    height: 22px;
    margin-top: -3px;
}

@media (max-width: 767px) {
    .jbs-primary-navbar {
        position: fixed;
        top: 0px;
        height: auto;
    }

        .jbs-primary-navbar .navbar-nav {
            float: none;
            display: block;
            margin: 0px -15px 0px -15px;
            background-color: #58064e;
        }

            .jbs-primary-navbar .navbar-nav li {
                border: none !important;
                padding: 0 !important;
                height: 0px;
                overflow: hidden;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

                .jbs-primary-navbar .navbar-nav li.service-number.display {
                    padding: 25px 0px 5px 0px !important;
                    height: auto;
                }

                .jbs-primary-navbar .navbar-nav li.service-number a {
                    text-align: center;
                    font-size: 20px;
                }

                .jbs-primary-navbar .navbar-nav li.service-number i {
                    text-align: center;
                    font-size: 50px;
                }

                .jbs-primary-navbar .navbar-nav li.social.display {
                    padding: 5px 0px 25px 0px !important;
                    height: auto;
                }

                .jbs-primary-navbar .navbar-nav li.social {
                    text-align: center;
                }

                    .jbs-primary-navbar .navbar-nav li.social a {
                        height: 40px;
                        width: 40px;
                        font-size: 20px;
                        padding: 10px;
                        margin: 2px;
                    }

                .jbs-primary-navbar .navbar-nav li.loged.display {
                    padding: 15px 0px !important;
                    height: auto;
                }

                .jbs-primary-navbar .navbar-nav li.loged .dropdown-toggle {
                    display: none;
                }

                .jbs-primary-navbar .navbar-nav li.loged .dropdown-menu {
                    display: block;
                    position: relative;
                    width: 100%;
                    background-color: transparent;
                    border: none;
                    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0);
                    box-shadow: 0 6px 12px rgba(0, 0, 0, 0);
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li h3 {
                    color: #ffffff;
                    font-size: 20px;
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li a {
                    color: rgba(255, 255, 255, 0.5);
                    font-size: 16px;
                }

                .jbs-primary-navbar .navbar-nav li.loged .profile-details li .btn {
                    font-size: 16px;
                    height: auto;
                    padding: 5px 40px;
                }

                .jbs-primary-navbar .navbar-nav li.search .search-box {
                    position: static;
                    display: block;
                    margin: 0;
                    padding: 15px 0;
                    text-align: center;
                    background: transparent;
                    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0);
                    box-shadow: 0 6px 12px rgba(0, 0, 0, 0);
                }

        .jbs-primary-navbar .navbar-header {
            border-top: 1px solid rgba(255, 255, 255, 0.2);
        }

        .jbs-primary-navbar .logo-box-name {
            padding: 12px 0 12px 15px;
            position: relative;
            overflow: hidden;
            display: inline-block;
        }

            .jbs-primary-navbar .logo-box-name .site-logo-name {
                height: 18px;
            }

        .jbs-primary-navbar .mobile-nav {
            margin: 0;
            padding: 0;
            display: inline-block;
            float: right;
        }

            .jbs-primary-navbar .mobile-nav li {
                list-style: none;
                display: inline-block;
                width: 36px;
                height: 36px;
                color: #ffffff;
                margin: 4px 0px;
                text-align: center;
                font-size: 18px;
                padding: 6px 0px;
                border-left: 1px solid rgba(255, 255, 255, 0.2);
            }

        .jbs-primary-navbar .logo-box {
            width: 140px;
            height: 110px;
            left: 15px;
            margin-top: -1px;
        }

            .jbs-primary-navbar .logo-box .site-logo {
                width: 96px;
                margin-top: 5px;
            }
}
/* Salon Navbar */

.jbs-salon-navbar {
    position: relative;
    top: 40px;
    width: 100%;
    height: 80px;
    background: #ffffff;
    border: none;
    border-bottom: 1px solid #cccccc;
    border-radius: 0;
    z-index: 2;
}

    .jbs-salon-navbar .navbar-header {
        width: 40%;
    }

        .jbs-salon-navbar .navbar-header table.salon-title {
            width: 100%;
        }

            .jbs-salon-navbar .navbar-header table.salon-title td {
                padding: 5px 0;
                vertical-align: middle;
                text-align: left;
            }

            .jbs-salon-navbar .navbar-header table.salon-title tr td:first-child {
                width: 1px;
            }

    .jbs-salon-navbar .salon-title img {
        height: 70px;
    }

    .jbs-salon-navbar .salon-title h1 {
        margin: 0;
        font-size: 18px;
        font-weight: bold;
        color: #000000;
        margin-left: 8px;
        padding-left: 8px;
        border-left: 1px solid #cccccc;
    }

    .jbs-salon-navbar .navbar-collapse {
        padding: 0px;
    }

    .jbs-salon-navbar .navbar-nav {
        float: right;
        padding: 15px 0px;
    }

        .jbs-salon-navbar .navbar-nav li {
            padding: 5px 0;
        }


            .jbs-salon-navbar .navbar-nav li a {
                margin: 0 5px;
                padding: 5px 6px;
                border-radius: 20px;
                font-size: 12px;
                text-transform: uppercase;
                color: #000000;
                cursor: pointer;
            }

            .jbs-salon-navbar .navbar-nav li:last-child a {
                margin-right: 0px;
            }

            .jbs-salon-navbar .navbar-nav li a:hover {
                color: #747096;
            }

            .jbs-salon-navbar .navbar-nav li.current a {
                border: 2px solid #b6b3d2;
                color: #b6b3d2;
            }

@media (min-width: 992px) and (max-width: 1199px) {
    .jbs-salon-navbar .navbar-header {
        width: 34%;
    }

    .jbs-salon-navbar .salon-title img {
        height: 60px;
        margin-top: 3px;
    }

    .jbs-salon-navbar .salon-title h1 {
        font-size: 16px;
    }
}

@media (max-width: 991px) {
    .jbs-salon-navbar > .container {
        position: relative;
    }

    .jbs-salon-navbar .navbar-collapse {
        display: none !important;
        position: absolute;
        width: 170px;
        right: 15px;
        top: 67px;
        border: none;
        opacity: 0;
    }

        .jbs-salon-navbar .navbar-collapse.collapsing {
            display: block !important;
            position: absolute;
            height: auto;
            overflow: visible;
            opacity: 1;
            -webkit-transition-timing-function: ease;
            -o-transition-timing-function: ease;
            transition-timing-function: ease;
            -webkit-transition-duration: .3s;
            -o-transition-duration: .3s;
            transition-duration: .3s;
            -webkit-transition-property: opacity;
            -o-transition-property: opacity;
            transition-property: opacity;
        }

        .jbs-salon-navbar .navbar-collapse.collapse.in {
            display: block !important;
            overflow: visible;
            opacity: 1;
        }

    .jbs-salon-navbar .navbar-header .collapse,
    .jbs-salon-navbar .navbar-toggle {
        display: block !important;
        position: absolute;
        top: 22px;
        right: 0;
        margin: 0;
        background-color: rgba(255, 255, 255, 0.5);
        border-color: #000000;
    }

    .jbs-salon-navbar.navbar-default .navbar-toggle .icon-bar {
        background-color: #000000;
    }

    .jbs-salon-navbar.navbar-default .navbar-toggle:focus,
    .jbs-salon-navbar.navbar-default .navbar-toggle:hover {
        background-color: rgba(255, 255, 255, 0.5);
    }

    .jbs-salon-navbar .navbar-header {
        position: relative;
        float: none;
        width: 100%;
        padding-right: 50px;
    }

    .jbs-salon-navbar .navbar-nav {
        position: relative;
        background-color: #eaeaea;
        border: 1px solid #cccccc;
        border-radius: 5px;
        margin: 0px;
        padding: 10px 0px;
        width: 100%;
        float: none;
    }

        .jbs-salon-navbar .navbar-nav:before {
            content: "";
            position: absolute;
            top: -9px;
            right: 15px;
            border-bottom: 8px solid #cccccc;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
        }

        .jbs-salon-navbar .navbar-nav:after {
            content: "";
            position: absolute;
            top: -7px;
            right: 16px;
            border-bottom: 7px solid #eaeaea;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
        }

        .jbs-salon-navbar .navbar-nav li {
            padding: 0px 15px;
            display: block;
            float: none;
            width: 100%;
        }


            .jbs-salon-navbar .navbar-nav li a {
                margin: 5px 0;
                text-align: center;
            }

            .jbs-salon-navbar .navbar-nav li:last-child a {
                margin: 0 5px;
            }
}

@media (max-width: 767px) {
    .jbs-salon-navbar {
        position: relative;
        top: 0px;
        height: auto;
        margin-bottom: 0;
    }

        .jbs-salon-navbar .navbar-collapse {
            position: fixed;
            right: 30px;
            top: 105px;
        }

            .jbs-salon-navbar .navbar-collapse.collapsing {
                position: fixed;
            }

        .jbs-salon-navbar .navbar-header {
            margin: 0px;
        }

            .jbs-salon-navbar .navbar-header .collapse,
            .jbs-salon-navbar .navbar-toggle {
                position: fixed;
                top: 60px;
                right: 15px;
            }

            .jbs-salon-navbar .navbar-header table.salon-title td {
                padding: 10px 0;
            }

        .jbs-salon-navbar .salon-title img {
            height: 50px;
        }

        .jbs-salon-navbar .salon-title h1 {
            font-size: 16px;
        }
}
/* Footer */

footer {
    position: relative;
    background-color: #ffffff;
    border-top: 2px solid #D2D2D2;
    padding: 25px 0;
}

    footer h4 {
        font-size: 18px;
        line-height: 20px;
        text-transform: uppercase;
        font-weight: bold;
        margin-top: 0px;
    }

    footer ul {
        list-style: none;
        padding: 0;
    }

        footer ul li {
            padding: 3px 0;
        }

    footer a {
        color: #666;
        cursor: pointer;
        font-weight: normal;
    }

        footer a:hover {
            color: #333;
        }

    footer .logos {
        text-align: right;
    }

    footer .btn-default {
        font-size: 16px;
        font-weight: bold;
        text-transform: uppercase;
        padding: 20px 15px;
        background-color: #ECCB08;
        border: none;
        color: #000;
        text-shadow: 0 0 rgba(0, 0, 0, 0);
        -webkit-animation-name: Pulse;
        -moz-animation-name: Pulse;
        animation-name: Pulse;
        -webkit-animation-duration: 2s;
        -moz-animation-duration: 2s;
        animation-duration: 2s;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-iteration-count: infinite;
        animation-iteration-count: infinite;
    }

        footer .btn-default:hover {
            background-color: #ECCB08;
            color: #4B1163;
        }

@-webkit-keyframes Pulse {
    from {
    }

    50% {
        transform: translateY(3px);
    }

    to {
    }
}

footer .google-play,
footer .app-store {
    width: 100%;
    margin-bottom: 5px;
}

footer .share ul li {
    height: 25px;
    overflow: hidden;
}

@media (max-width: 991px) {
    footer .btn-default {
        font-size: 14px;
        padding: 15px 5px;
    }
}

@media (max-width: 991px) {
    footer h4 {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    footer {
        padding-bottom: 10px;
    }

        footer h4 {
            font-size: 16px;
        }

        footer .footer-nav {
            margin-top: 20px;
        }

        footer .share {
            margin-top: 20px;
        }

        footer .logos {
            margin-top: 10px;
            text-align: center;
        }
}
/* Copyrights */

copyrights {
    position: relative;
    background-color: #FFFFFF;
    padding: 10px 0;
    color: #4a4a4a;
    display: block;
}

    copyrights .container {
        border-top: solid 5px #DEDEDE;
        padding: 20px 0;
    }

    copyrights a {
        color: #8C8C8C;
        cursor: pointer;
        font-weight: bold;
    }

        copyrights a:hover {
            color: #333;
        }
/* Common */

.main-body {
    padding-top: 120px;
    overflow: hidden;
}

@media (max-width: 767px) {
    .main-body {
        padding-top: 0px;
    }
}

.col-centered {
    text-align: center;
}

    .col-centered > [class*='col-'] {
        float: none;
        display: inline-block;
        vertical-align: top;
        margin-left: -1px;
        margin-right: -1px;
    }

.hp-title {
    -webkit-font-smoothing: antialiased;
    text-shadow: 0px 0px 8px rgba(0, 0, 0, 1);
}

    .hp-title h2 {
        font-size: 48px;
        color: #ffffff;
        font-weight: bold;
        text-transform: uppercase;
        margin: 0px;
    }

    .hp-title p {
        font-size: 20px;
        font-weight: 100;
        color: #ffffff;
    }

.hp-copyrights {
    position: absolute;
    left: 0px;
    bottom: 0;
    color: rgba(255, 255, 255, 0.3);
    padding: 15px;
}

.hp-title-black {
}

    .hp-title-black h2 {
        font-size: 48px;
        color: #000000;
        font-weight: bold;
        text-transform: uppercase;
        margin: 0px;
    }

    .hp-title-black p {
        font-size: 20px;
        color: #666666;
    }

.hp-block {
    display: inline-block;
    margin: 8px;
    width: 125px;
    height: 125px;
    padding: 5px;
    color: #000000;
    border: 1px solid #ffffff;
    border-radius: 10px;
    cursor: pointer;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
}

    .hp-block:hover {
        -webkit-box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.5);
        -moz-box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.5);
        box-shadow: 0px 0px 10px 0px rgba(255, 255, 255, 0.5);
        -webkit-transform: scale(1.05);
        -moz-transform: scale(1.05);
        -ms-transform: scale(1.05);
        -o-transform: scale(1.05);
        transform: scale(1.05);
    }

    .hp-block .hp-block-wrap {
        display: table-cell;
        vertical-align: middle;
        width: 112px;
        height: 112px;
        background-color: #ffffff;
        border-radius: 6px;
    }

    .hp-block .image img {
        width: 70px;
        height: auto;
        opacity: 0.5;
    }

    .hp-block h3 {
        font-size: 18px;
        font-weight: bold;
        text-transform: uppercase;
        margin: 0;
    }

@media (max-width: 991px) {
    .hp-title h2 {
        font-size: 36px;
    }

    .hp-title p {
        font-size: 18px;
    }

    .hp-title-black h2 {
        font-size: 36px;
    }

    .hp-title-black p {
        font-size: 18px;
    }
}

@media (max-width: 767px) {
    .hp-title h2 {
        font-size: 30px;
    }

    .hp-title p {
        font-size: 16px;
    }

    .hp-title-black h2 {
        font-size: 30px;
    }

    .hp-title-black p {
        font-size: 16px;
    }

    .hp-copyrights {
        padding: 5px;
        font-size: 12px;
        line-height: 1;
    }
}
/* Bootstrap Modal */

.modal-backdrop {
    background-color: rgba(0, 0, 0, 0.85);
}

    .modal-backdrop.in {
        filter: alpha(opacity=100);
        opacity: 1;
    }

.modal .modal-header {
    position: relative;
    background-color: #b6b3d2;
    color: #ffffff;
    border-bottom: none;
}

.modal .modal-content {
    position: relative;
    border-radius: 0px;
}

    .modal .modal-content .modal-close,
    .modal .modal-header .modal-close {
        position: absolute;
        top: 0;
        right: 0;
        background-color: #000000;
        font-size: 24px;
        line-height: 24px;
        font-weight: bold;
        border: none;
        outline: none;
        width: 30px;
        height: 30px;
        padding: 0;
        border-bottom-left-radius: 25px;
        z-index: 1;
    }

        .modal .modal-content .modal-close:after,
        .modal .modal-header .modal-close:after {
            color: #ffffff;
            content: "\f00d";
            font-size: 15px;
            position: absolute;
            right: 7px;
            top: -1px;
            font-family: FontAwesome;
            font-weight: normal;
        }

.modal-header .close {
    color: #ffffff;
    font-size: 30px;
    margin-top: -2px;
    opacity: 0.8;
    text-shadow: none;
}

.close:focus,
.close:hover {
    opacity: 1;
}

.modal .modal-content .modal-close:hover,
.modal .modal-content .modal-close:focus,
.modal .modal-header .modal-close:hover,
.modal .modal-header .modal-close:focus {
    background-color: #db4437;
}
/* Bootstrap Dialog */

.bootstrap-dialog .modal-header {
    position: relative;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.bootstrap-dialog-close-button {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #000000;
    font-size: 24px;
    line-height: 24px;
    font-weight: bold;
    border: none;
    outline: none;
    width: 30px;
    height: 30px;
    padding: 0;
    border-bottom-left-radius: 25px;
    z-index: 1;
}

    .bootstrap-dialog-close-button:after {
        content: "x";
        position: absolute;
        top: -1px;
        right: 8px;
        color: #ffffff;
        font-size: 16px;
    }

    .bootstrap-dialog-close-button:hover,
    .bootstrap-dialog-close-button:focus {
        background-color: #db4437;
    }

    .bootstrap-dialog-close-button .close {
        display: none;
    }
/* Popup Modal */

.popup {
    display: none;
    background-color: rgba(0, 0, 0, 0.8);
    bottom: 0;
    left: 0;
    overflow-y: auto;
    padding-bottom: 25px;
    padding-top: 25px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 9999;
}

    .popup .popup-dialog {
        width: 360px;
        background-color: #fff;
        position: absolute;
        right: 50%;
        margin-right: -180px;
        top: 100px;
        height: auto;
        padding-bottom: 15px;
        border-top: none;
        overflow: hidden;
        z-index: 990;
    }

        .popup .popup-dialog .popup-close {
            position: absolute;
            top: 0;
            right: 0;
            background-color: #000000;
            font-size: 24px;
            line-height: 24px;
            font-weight: bold;
            border: none;
            outline: none;
            width: 30px;
            height: 30px;
            padding: 0;
            border-bottom-left-radius: 25px;
        }

            .popup .popup-dialog .popup-close:after {
                content: "x";
                position: absolute;
                top: -1px;
                right: 8px;
                color: #ffffff;
                font-size: 16px;
            }

            .popup .popup-dialog .popup-close:hover,
            .popup .popup-dialog .popup-close:focus {
                background-color: #db4437;
            }

        .popup .popup-dialog .popup-header {
            padding: 15px 20px;
            border-bottom: 1px solid #ccc;
        }

            .popup .popup-dialog .popup-header h5 {
                text-transform: uppercase;
                color: #b6b3d2;
                font-weight: bold;
                text-align: center;
                font-size: 20px;
                margin: 5px 0;
            }

        .popup .popup-dialog .popup-message {
            padding: 0 15px;
            background: #F5F5DE;
        }

        .popup .popup-dialog .popup-content {
            padding: 15px;
            margin-bottom: -15px;
        }

@media (max-width: 768px) {
    .popup .popup-dialog {
        top: 50px;
    }
}

@media (max-width: 479px) {
    .popup .popup-dialog {
        width: auto;
        margin: 0;
        right: 15px;
        left: 15px;
    }
}
/* Message Box */
.success-box:not(:empty) {
    border-left: 3px solid #1CB300;
    margin: 5px 15px;
    padding: 5px 15px;
    position: relative;
}

.error-box:not(:empty) {
    border-left: 3px solid #e84c4c;
    margin: 5px 15px;
    padding: 5px 15px;
    position: relative;
}

.error-box > p {
    margin: 0;
}

.warning-box:not(:empty) {
    border-left: 3px solid #666;
    margin: 5px 15px;
    padding: 5px 15px;
    position: relative;
}

.success-box > ul,
.error-box > ul,
.warning-box > ul {
    margin: 5px 0 0 0;
    padding: 0;
}

    .success-box > ul li,
    .error-box > ul li,
    .warning-box > ul li {
        list-style: none;
        font-weight: bold;
        position: relative;
        padding-left: 25px;
    }

        .success-box > ul li:after,
        .error-box > ul li:after,
        .warning-box > ul li:after {
            font-family: FontAwesome;
            content: "\f192";
            position: absolute;
            top: 2px;
            left: 10px;
            font-size: 12px;
            opacity: 0.5;
        }

/* Message Block */
.success-block,
.error-block,
.warning-block {
    display: block;
    overflow: hidden;
    margin-bottom: 15px;
    padding: 5px 15px;
}

.success-block {
    background-color: #daffdc;
    border: 1px solid #8bb98c;
}

.error-block {
    background-color: #fde8e7;
    border: 1px solid #c58c87;
}

.warning-block {
    background-color: #f5f1cd;
    border: 1px solid #cec9a2;
}

    .success-block h3,
    .error-block h3,
    .warning-block h3 {
        font-weight: normal !important;
        font-size: 18px !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .success-block h4,
    .error-block h4,
    .warning-block h4 {
        font-weight: bold !important;
        font-size: 16px !important;
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .success-block p,
    .error-block p,
    .warning-block p {
        margin-top: 10px;
        margin-bottom: 10px;
    }

.success-block .message {
    color: #8bb98c;
}

.error-block .message {
    color: #c58c87;
}

.warning-block .message {
    color: #cec9a2;
}

/* Rating */
.rating {
    display: inline-block;
}

    .rating.block {
        display: block;
    }

    .rating .rating-count {
        display: inline-block;
        font-size: 12px;
        color: #fff;
        background-color: #adadad;
        border: 1px solid #adadad;
        padding: 0px 5px;
        border-radius: 4px;
    }

    .rating .rating-stars {
        display: inline-block;
    }

        .rating .rating-stars i {
            margin-right: 2px;
            color: #EC9108;
        }
/* UI-bootstrap Calander */

.calander .btn-default {
    width: 100%;
    background-color: #fff;
    color: #000;
    padding: 8px 14px;
    font-size: 14px;
    border-radius: 0;
    text-transform: uppercase;
}

    .calander .btn-default:hover,
    .calander .btn-default.active,
    .calander .btn-default.focus,
    .calander .btn-default:active,
    .calander .btn-default:focus,
    .calander .btn-default:hover .text-info,
    .calander .btn-default.active .text-info,
    .calander .btn-default:focus .text-info,
    .calander .btn-default:hover .text-muted,
    .calander .btn-default.active .text-muted,
    .calander .btn-default:focus .text-muted {
        background-color: #747096;
        color: #fff;
        border-color: #747096;
    }

.calander .btn-info {
    border: #CCC;
}

.calander .text-info {
    color: #747096;
}

.calander .text-muted {
    color: #626262;
}

.calander button span {
    background-color: transparent !important;
    border: none !important;
}

.datepick-box .selected-date {
    margin-top: 10px;
    font-weight: bold;
}

/* UI-bootstrap Datepicker */
.uib-datepicker {
    padding: 5px;
    outline: none !important;
}

    .uib-datepicker table {
        outline: none !important;
    }

    .uib-datepicker:focus table {
        outline: none !important;
    }

    .uib-datepicker .btn-default:hover {
        color: #fff;
        background-color: #ada9ce;
        border-color: #ada9ce;
    }

    .uib-datepicker .btn-default.btn-info.active,
    .uib-datepicker .btn-default.btn-info.active:hover,
    .uib-datepicker .btn-default.btn-info.active:focus {
        background-color: #747096 !important;
        border: 1px solid #747096 !important;
        color: #fff !important;
    }

    .uib-datepicker .btn-default.active .text-info,
    .uib-datepicker .btn-default.active:hover .text-info,
    .uib-datepicker .btn-default.active:focus .text-info {
        color: #fff;
    }

@media (max-width: 768px) {
    .calander .btn {
        padding: 5px !important;
    }
}

/* Return Messages (Payment) */
.return-msg {
    overflow: hidden;
    padding: 30px 15px;
    border-radius: 5px;
    border-style: solid;
    border-width: 1px;
    border-bottom-width: 5px;
    margin-bottom: 15px;
}

    .return-msg.success {
        background-color: #e3ffe4;
        border-color: #4CAF50;
    }

        .return-msg.success h2 {
            color: #4CAF50;
        }

    .return-msg.unsuccess {
        background-color: #f5e5e4;
        border-color: #F44336;
    }

        .return-msg.unsuccess h2 {
            color: #F44336;
        }

    .return-msg.cancel {
        background-color: #f5ece3;
        border-color: #FF5722;
    }

        .return-msg.cancel h2 {
            color: #FF5722;
        }

    .return-msg.invalid {
        background-color: #f9f2e2;
        border-color: #795548;
    }

        .return-msg.invalid h2 {
            color: #795548;
        }

    .return-msg.rejected {
        background-color: #f7eced;
        border-color: #ca434d;
    }

        .return-msg.rejected h2 {
            color: #ca434d;
        }

@media (max-width: 767px) {
    .return-msg {
        text-align: center;
    }
}


/* Inner Page Common */

.inner-page {
    margin-top: -80px;
}

    .inner-page .header-title {
        height: 125px;
        margin-bottom: 20px;
        padding: 0px;
    }

        .inner-page .header-title .header-img {
            position: absolute;
            top: 0;
            overflow: hidden;
            height: 165px;
            width: 100%;
            background: #3a2237;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center bottom;
        }

        .inner-page .header-title h1 {
            font-family: "Oswald";
            font-weight: normal;
            color: #fff;
            text-align: center;
            text-transform: uppercase;
            padding-top: 20px;
            font-size: 48px;
            position: relative;
            text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
        }

            .inner-page .header-title h1:before {
                margin-right: 25px;
            }

            .inner-page .header-title h1:after {
                margin-left: 25px;
            }

            .inner-page .header-title h1:before,
            .header-title h1:after {
                background-color: #ffffff;
                content: "";
                display: inline-block;
                height: 8px;
                margin-bottom: 15px;
                position: relative;
                width: 40px;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
            }

    .inner-page h2 {
        color: #747096;
        font-size: 24px;
        font-weight: 400;
    }

    .inner-page h3 {
        font-size: 20px;
    }

    .inner-page h4 {
        font-size: 16px;
    }

@media (max-width: 767px) {
    .inner-page {
        margin-top: 0px;
    }

        .inner-page .header-title h1 {
            font-size: 30px;
        }

            .inner-page .header-title h1:before,
            .header-title h1:after {
                height: 4px;
                margin-bottom: 10px;
                width: 20px;
            }

            .inner-page .header-title h1:before {
                margin-right: 5px;
            }

            .inner-page .header-title h1:after {
                margin-left: 5px;
            }
}
/* Flexslider Common */

.flexslider .flex-direction-nav a {
    margin: -35px 0 0;
    height: 70px;
    width: 30px;
    padding: 4px 5px;
    font-size: 0px;
}

.flexslider .flex-direction-nav .flex-prev {
    left: 0px !important;
}

.flexslider .flex-direction-nav .flex-next {
    right: 0px !important;
}

.flexslider .flex-direction-nav a:before {
    font-family: FontAwesome;
    font-size: 40px;
    display: inline-block;
    content: '\f104';
    color: #fff;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
}

.flexslider .flex-direction-nav a.flex-next:before {
    content: '\f105';
}

.flexslider .flex-control-nav {
    width: 100%;
    position: relative;
    margin-top: 10px;
    text-align: center;
}

    .flexslider .flex-control-nav li {
        margin: 0 3px;
    }

.flexslider .flex-control-paging li a {
    width: 12px;
    height: 12px;
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.8);
    -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.8);
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.8);
}

    .flexslider .flex-control-paging li a.flex-active {
        background: rgba(0, 0, 0, 0.3);
    }

.flexslider .flex-caption:empty {
    display: none;
}

.flex-centered .slides {
    width: 100% !important;
    text-align: center;
}

    .flex-centered .slides li {
        display: inline-block !important;
        *display: inline !important;
        float: none !important;
    }

/* Login Popup */
#commonLoginBox .social-login {
    margin: 15px 0;
    overflow: hidden;
}

#mobileNumberPopup.popup .popup-dialog {
    overflow: visible;
}


/****************************************************************************************************
#####################################################################################################
****************************** Landing Page *********************************************************
#####################################################################################################
****************************************************************************************************/
/***************************** Landing Common *****************************/

.landing h2 {
    font-size: 30px;
    text-transform: uppercase;
    position: relative;
    margin-bottom: 50px;
    color: #b1b1b1;
}

    .landing h2:after {
        content: "";
        position: absolute;
        width: 150px;
        border-bottom: 2px solid #b1b1b1;
        bottom: -12px;
        margin-left: -75px;
        left: 50%;
    }

@media (max-width: 767px) {
    .landing h2 {
        font-size: 18px;
        margin-bottom: 25px;
    }
}
/***************************** Landing Hero Section *****************************/
.land-hero {
    position: relative;
    margin-top: -120px;
}

    .land-hero:after {
        content: "";
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 2;
        background: rgba(200,185,203,1);
        background: -moz-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
        background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(200,185,203,1)), color-stop(100%, rgba(182,179,210,1)));
        background: -webkit-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
        background: -o-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
        background: -ms-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
        background: linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c8b9cb', endColorstr='#b6b3d2', GradientType=1 );
        opacity: 0.5;
    }

@media (max-width: 767px) {
    .land-hero {
        position: relative;
        margin-top: -40px;
    }
}

.land-hero #HeroSlider {
    position: relative;
}

    .land-hero #HeroSlider .slides-container {
        display: none;
    }

    .land-hero #HeroSlider .scrollable {
        *zoom: 1;
        position: relative;
        top: 0;
        left: 0;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        height: 100%;
    }

        .land-hero #HeroSlider .scrollable:after {
            content: "";
            display: table;
            clear: both;
        }

    .land-hero #HeroSlider .slides-navigation {
        display: none;
    }

    .land-hero #HeroSlider .slides-pagination {
        display: none;
    }

.land-hero .land-hero-wrap {
    position: absolute;
    top: 0;
    bottom: 0;
    width: 100%;
    z-index: 5;
    color: #ffffff;
}

    .land-hero .land-hero-wrap .filter-nav {
        position: relative;
        text-align: center;
        margin-top: 70px;
        padding-left: 160px;
        z-index: 1;
    }

        .land-hero .land-hero-wrap .filter-nav ul {
            margin: 0;
            padding: 0;
        }

        .land-hero .land-hero-wrap .filter-nav li {
            list-style: none;
            display: inline-block;
            vertical-align: middle;
            text-align: left;
            margin-right: 30px;
            cursor: pointer;
        }

            .land-hero .land-hero-wrap .filter-nav li svg {
                float: left;
                width: 40px;
                height: 40px;
                margin-right: 8px;
                fill: #492a61;
                -webkit-transform: scale(1.0);
                -moz-transform: scale(1.0);
                -o-transform: scale(1.0);
                -ms-transform: scale(1.0);
                transform: scale(1.0);
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

            .land-hero .land-hero-wrap .filter-nav li:hover svg {
                -webkit-transform: scale(1.1);
                -moz-transform: scale(1.1);
                -o-transform: scale(1.1);
                -ms-transform: scale(1.1);
                transform: scale(1.1);
            }

            .land-hero .land-hero-wrap .filter-nav li h3 {
                float: left;
                font-size: 14px;
                font-weight: bold;
                margin: 1px 0 0 0;
                color: #492a61;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

                .land-hero .land-hero-wrap .filter-nav li h3 span {
                    display: block;
                    font-size: 20px;
                    font-weight: 300;
                }

            .land-hero .land-hero-wrap .filter-nav li.promo h3 span {
                font-size: 26px;
                padding-top: 4px;
            }

@media (max-width: 991px) {
    .land-hero .land-hero-wrap .filter-nav li {
        margin-right: 18px;
    }

        .land-hero .land-hero-wrap .filter-nav li svg {
            width: 20px;
            height: 20px;
            margin-right: 5px;
        }

        .land-hero .land-hero-wrap .filter-nav li h3 {
            font-size: 12px;
        }

            .land-hero .land-hero-wrap .filter-nav li h3 span {
                font-size: 16px;
            }

        .land-hero .land-hero-wrap .filter-nav li.promo h3 span {
            font-size: 20px;
            padding-top: 0;
            margin-bottom: 7px;
        }
}

@media (max-width: 767px) {
    .land-hero .land-hero-wrap .filter-nav {
        margin-top: 125px;
        padding-left: 0;
    }

        .land-hero .land-hero-wrap .filter-nav li {
            margin: 0;
            text-align: center;
            width: 32%;
            vertical-align: top;
        }

            .land-hero .land-hero-wrap .filter-nav li svg {
                float: none;
                width: 30px;
                height: 30px;
                margin: 0 auto;
            }

            .land-hero .land-hero-wrap .filter-nav li h3 {
                float: none;
                text-align: center;
                width: 100px;
                margin: auto;
            }

            .land-hero .land-hero-wrap .filter-nav li.promo h3 span {
                padding-top: 0;
                margin-bottom: 7px;
            }

            .land-hero .land-hero-wrap .filter-nav li h3,
            .land-hero .land-hero-wrap .filter-nav li h3 span,
            .land-hero .land-hero-wrap .filter-nav li.promo h3,
            .land-hero .land-hero-wrap .filter-nav li.promo h3 span {
                font-size: 11px;
                font-weight: 500;
                text-transform: uppercase;
            }
}

.land-hero .land-hero-wrap .intro {
    position: absolute;
    top: 0px;
    width: 100%;
    height: 100%;
    display: table;
    text-align: center;
    padding-top: 115px;
    padding-bottom: 160px;
}

.land-hero .land-hero-wrap .intro-inner {
    display: table-cell;
    vertical-align: middle;
}

.land-hero .land-hero-wrap .intro .site-name {
    width: 350px;
    height: auto;
}

.land-hero .land-hero-wrap .intro p {
    margin: 0;
    font-weight: bold;
    font-size: 16px;
}

.land-hero .land-hero-wrap .intro h1 {
    font-size: 16px;
    line-height: 20px;
    font-weight: 300;
    width: 530px;
    margin: 10px auto;
}

.land-hero .land-hero-wrap .land-search {
    margin-top: 20px;
    padding: 20px 15px 15px 15px;
    border-radius: 5px;
    background: rgba(23, 22, 35, 0.32);
    color: #333333;
}

    .land-hero .land-hero-wrap .land-search .search-input {
        padding: 0 18px;
    }

        .land-hero .land-hero-wrap .land-search .search-input .form-group {
            position: relative;
        }

    .land-hero .land-hero-wrap .land-search .search-box .no-results {
        float: left;
        display: inline-block;
        left: 0;
        margin-top: 3px;
        margin-bottom: 3px;
        background: #b32121;
        color: #ffffff;
        padding: 1px 5px;
        border-radius: 5px;
        z-index: 1;
    }

        .land-hero .land-hero-wrap .land-search .search-box .no-results:before {
            content: "";
            position: absolute;
            left: 8px;
            margin-top: -8px;
            border-bottom: 8px solid #b32121;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
        }

@media (max-width: 767px) {
    .land-hero .land-hero-wrap .intro {
        padding-bottom: 0px;
    }

    .land-hero .land-hero-wrap .intro-inner {
        display: table-cell;
        padding-top: 15%;
    }

    .land-hero .land-hero-wrap .intro p {
        font-size: 14px;
    }

    .land-hero .land-hero-wrap .intro .site-name {
        width: 280px;
    }

    .land-hero .land-hero-wrap .intro h1 {
        font-size: 12px;
        line-height: 15px;
        font-weight: normal;
        width: auto;
        margin: 0px auto;
    }

    .land-hero .land-hero-wrap .land-search {
        margin-top: 15px;
        padding: 10px 5px 5px 5px;
    }
}

.land-hero .land-hero-wrap .category-nav {
    margin-top: 20px;
}

    .land-hero .land-hero-wrap .category-nav ul {
        margin: 0;
        padding: 0;
    }

    .land-hero .land-hero-wrap .category-nav li {
        list-style: none;
        display: inline-block;
        vertical-align: top;
        width: 90px;
        height: 90px;
        border-radius: 50%;
        border: 2px solid #492a61;
        margin: 0 5px;
        opacity: 0.5;
        cursor: pointer;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        -ms-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

        .land-hero .land-hero-wrap .category-nav li:hover {
            background-color: rgba(255, 255, 255, 0.5);
            -webkit-box-shadow: 0px 0px 0px 5px rgba(255,255,255,0.1);
            -moz-box-shadow: 0px 0px 0px 5px rgba(255,255,255,0.1);
            box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.5);
            opacity: 1;
        }

        .land-hero .land-hero-wrap .category-nav li .item-wrap {
            width: 90px;
            height: 90px;
            display: table;
            padding-bottom: 8px;
        }

            .land-hero .land-hero-wrap .category-nav li .item-wrap .item-inner {
                width: 60px;
                display: table-cell;
                vertical-align: middle;
            }

            .land-hero .land-hero-wrap .category-nav li .item-wrap img {
                width: 40px;
                height: auto;
            }

            .land-hero .land-hero-wrap .category-nav li .item-wrap h4 {
                font-weight: 500;
                font-size: 12px;
                line-height: 12px;
                margin: 0;
                color: #492a61;
                width: 80px;
                margin: 0 auto;
            }

@media (max-width: 991px) {
    .land-hero .land-hero-wrap .category-nav li {
        width: 75px;
        height: 75px;
        margin: 0 2px;
    }

        .land-hero .land-hero-wrap .category-nav li .item-wrap {
            width: 75px;
            height: 75px;
        }

            .land-hero .land-hero-wrap .category-nav li .item-wrap img {
                width: 30px;
            }

            .land-hero .land-hero-wrap .category-nav li .item-wrap h4 {
                width: 70px;
            }
}

@media (max-width: 767px) {
    .land-hero .land-hero-wrap .category-nav {
        display: none;
    }
}


/***************************** Landing Whats New Section *****************************/

.wts-new {
    padding: 60px 0px 30px 0px;
}

    .wts-new .wts-new-line {
        background-color: #e4e4e4;
        height: 40px;
        height: 40px;
        margin-bottom: 15px;
        overflow: hidden;
    }

        .wts-new .wts-new-line .modern-ticker {
            width: 100%;
            height: 40px;
            overflow: hidden;
        }

            .wts-new .wts-new-line .modern-ticker .mt-body {
                position: relative;
                z-index: 1;
            }

            .wts-new .wts-new-line .modern-ticker .mt-label {
                position: absolute;
                left: 0;
                height: 40px;
                padding: 10px 20px;
                margin-right: 10px;
                background-color: #000000;
                color: #ffffff;
            }

            .wts-new .wts-new-line .modern-ticker h4 {
                font-size: 18px;
                margin: 0;
            }

            .wts-new .wts-new-line .modern-ticker .mt-news {
                overflow: hidden;
                position: absolute;
            }

                .wts-new .wts-new-line .modern-ticker .mt-news ul {
                    margin: 0;
                    padding: 0;
                    list-style: none;
                    background-repeat: no-repeat;
                    background-position: -1000px;
                }

                .wts-new .wts-new-line .modern-ticker .mt-news li {
                    float: left;
                    font-size: 16px;
                    font-weight: 500;
                    padding: 8px 30px 8px 10px;
                }

                    .wts-new .wts-new-line .modern-ticker .mt-news li i {
                        color: #e84c4c;
                        margin-right: 5px;
                    }

            .wts-new .wts-new-line .modern-ticker .mt-controls {
                margin-left: 2px;
                position: absolute;
                right: 0;
                background-repeat: no-repeat;
                background-position: -1000px;
                padding: 3px 10px;
            }

            .wts-new .wts-new-line .modern-ticker .mt-next,
            .wts-new .wts-new-line .modern-ticker .mt-play,
            .wts-new .wts-new-line .modern-ticker .mt-prev {
                position: relative;
                margin: 2px;
                background-repeat: no-repeat;
                background-position: center;
                float: left;
                cursor: pointer;
                font-size: 20px;
                color: rgba(0, 0, 0, 0.3);
            }

                .wts-new .wts-new-line .modern-ticker .mt-next:hover,
                .wts-new .wts-new-line .modern-ticker .mt-play:hover,
                .wts-new .wts-new-line .modern-ticker .mt-prev:hover {
                    color: rgba(0, 0, 0, 0.5);
                }

                .wts-new .wts-new-line .modern-ticker .mt-next:after {
                    font-family: 'FontAwesome';
                    content: "\f138";
                }

                .wts-new .wts-new-line .modern-ticker .mt-play:after {
                    font-family: 'FontAwesome';
                    content: "\f144";
                }

                .wts-new .wts-new-line .modern-ticker .mt-play.mt-pause:after {
                    font-family: 'FontAwesome';
                    content: "\f28b";
                }

                .wts-new .wts-new-line .modern-ticker .mt-prev:after {
                    font-family: 'FontAwesome';
                    content: "\f137";
                }

@media (max-width: 767px) {
    .wts-new {
        padding: 30px 0px 10px 0px;
    }
}
/***************************** Landing Offers Section *****************************/
.landing.offers {
    position: relative;
    margin-top: -180px;
    padding-bottom: 50px;
    z-index: 2;
}

    .landing.offers .flexslider {
        background-color: transparent;
    }

    .landing.offers p.new {
        display: inline-block;
        margin: 0;
        padding: 2px 8px;
        color: #ffffff;
        font-size: 12px;
        letter-spacing: 2px;
        font-weight: bold;
        border-radius: 5px;
        background: rgba(124,0,0,1);
        background: -moz-linear-gradient(top, rgba(124,0,0,1) 0%, rgba(211,0,0,1) 51%, rgba(124,0,0,1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(124,0,0,1)), color-stop(51%, rgba(211,0,0,1)), color-stop(100%, rgba(124,0,0,1)));
        background: -webkit-linear-gradient(top, rgba(124,0,0,1) 0%, rgba(211,0,0,1) 51%, rgba(124,0,0,1) 100%);
        background: -o-linear-gradient(top, rgba(124,0,0,1) 0%, rgba(211,0,0,1) 51%, rgba(124,0,0,1) 100%);
        background: -ms-linear-gradient(top, rgba(124,0,0,1) 0%, rgba(211,0,0,1) 51%, rgba(124,0,0,1) 100%);
        background: linear-gradient(to bottom, rgba(124,0,0,1) 0%, rgba(211,0,0,1) 51%, rgba(124,0,0,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7c0000', endColorstr='#7c0000', GradientType=0 );
    }

    .landing.offers h2 {
        margin-top: 5px;
        color: #ffffff;
        margin-bottom: 30px;
    }

        .landing.offers h2:after {
            border-bottom: 2px solid #ffffff;
        }

    .landing.offers .offer-item-wrap {
        padding: 4px 4px 0 0;
        overflow: hidden;
    }

    .landing.offers .offer-item {
        position: relative;
        width: 100%;
        background-color: #ffffff;
        border: 1px solid #cccccc;
        cursor: pointer;
        -webkit-transition: all 0.1s ease-out;
        -moz-transition: all 0.1s ease-out;
        -o-transition: all 0.1s ease-out;
        -ms-transition: all 0.1s ease-out;
        transition: all 0.1s ease-out;
    }

        .landing.offers .offer-item .image {
            position: relative;
            display: inline-block;
            vertical-align: middle;
            z-index: 2;
            width: 50%;
            margin: -1px;
            overflow: hidden;
            padding: 5px;
        }

            .landing.offers .offer-item .image img {
                width: 100%;
                height: auto;
                -webkit-transition: all 0.1s ease-out;
                -moz-transition: all 0.1s ease-out;
                -o-transition: all 0.1s ease-out;
                -ms-transition: all 0.1s ease-out;
                transition: all 0.1s ease-out;
            }

        .landing.offers .offer-item .des {
            position: relative;
            z-index: 1;
            display: inline-block;
            vertical-align: middle;
            margin-left: -2px;
            width: 50%;
            padding: 15px;
            overflow: hidden;
        }

            .landing.offers .offer-item .des hr {
                border-top: 1px solid #e0d9df;
            }

            .landing.offers .offer-item .des .salon-wrap {
                display: table;
                width: 100%;
            }

                .landing.offers .offer-item .des .salon-wrap .salon-logo {
                    display: table-cell;
                    vertical-align: middle;
                    width: 1px;
                    background-color: #cccccc;
                }

                    .landing.offers .offer-item .des .salon-wrap .salon-logo img {
                        width: auto;
                        height: 40px;
                    }

                .landing.offers .offer-item .des .salon-wrap .salon-name {
                    display: table-cell;
                    vertical-align: middle;
                }

                    .landing.offers .offer-item .des .salon-wrap .salon-name h4 {
                        margin: 0;
                        color: #333333;
                        font-size: 15px;
                        font-weight: normal;
                        text-transform: uppercase;
                    }

                    .landing.offers .offer-item .des .salon-wrap .salon-name p {
                        margin: 0;
                        font-size: 14px;
                        font-weight: bold;
                        color: #999999;
                    }

            .landing.offers .offer-item .des .offer-title {
                color: #333333;
                font-size: 22px;
                line-height: 1.0;
                margin: 15px 30px 0 0;
            }

            .landing.offers .offer-item .des .offer-des {
                color: #666666;
                font-size: 14px;
                line-height: 1.2;
                margin: 5px 0 0 0;
            }

            .landing.offers .offer-item .des .price {
                background-color: #7e7e7e;
                border-radius: 5px;
                border: 1px solid #ffffff;
                margin: 10px 0 0 0;
                overflow: hidden;
                color: #ffffff;
                text-align: center;
                font-size: 14px;
                line-height: 1.2;
            }

                .landing.offers .offer-item .des .price .actual-price {
                    position: relative;
                    width: 50%;
                    float: left;
                    padding: 5px 0;
                }

                    .landing.offers .offer-item .des .price .actual-price:before,
                    .landing.offers .offer-item .des .price .actual-price:after {
                        content: "";
                        position: absolute;
                        top: 25px;
                        left: 10%;
                        right: 10%;
                        background: #ffffff;
                        height: 2px;
                    }

                    .landing.offers .offer-item .des .price .actual-price:before {
                        -webkit-transform: translateX(-1%) rotate(9deg);
                        -moz-transform: translateX(-1%) rotate(9deg);
                        -o-transform: translateX(-1%) rotate(9deg);
                        -ms-transform: translateX(-1%) rotate(9deg);
                        transform: translateX(-1%) rotate(9deg);
                    }

                    .landing.offers .offer-item .des .price .actual-price:after {
                        -webkit-transform: translateX(0%) rotate(-9deg);
                        -moz-transform: translateX(0%) rotate(-9deg);
                        -o-transform: translateX(0%) rotate(-9deg);
                        -ms-transform: translateX(0%) rotate(-9deg);
                        transform: translateX(0%) rotate(-9deg);
                    }

                .landing.offers .offer-item .des .price p {
                    font-size: 24px;
                    font-weight: 300;
                    margin: 0;
                }

                    .landing.offers .offer-item .des .price p span {
                        font-size: 16px;
                        margin-right: 5px;
                    }

                .landing.offers .offer-item .des .price .new-price {
                    position: relative;
                    width: 50%;
                    float: left;
                    background-color: #893f80;
                    padding: 5px 0;
                }

            .landing.offers .offer-item .des .valid {
                overflow: hidden;
                margin: 15px 0 0 0;
            }

                .landing.offers .offer-item .des .valid .from, .landing.offers .offer-item .des .valid .to, .landing.offers .offer-item .des .valid .remaining {
                    float: left;
                    width: 33.33%;
                    color: #970067;
                    font-size: 14px;
                    line-height: 1;
                    font-weight: bold;
                    text-align: center;
                    text-transform: uppercase;
                }

                    .landing.offers .offer-item .des .valid .from span, .landing.offers .offer-item .des .valid .to span, .landing.offers .offer-item .des .valid .remaining span {
                        display: block;
                        font-size: 20px;
                        line-height: 1;
                        font-weight: 300;
                    }

                .landing.offers .offer-item .des .valid .remaining {
                    color: #e60913;
                }

        .landing.offers .offer-item .rate {
            position: absolute;
            top: -4px;
            right: -4px;
            z-index: 10;
            width: 100px;
            height: 94px;
            background: url(../img/promo-rate-tag.png) no-repeat top right;
            background-size: cover;
            padding: 14px 5px;
            font-size: 20px;
            font-weight: bold;
            color: #ffffff;
            text-align: right;
        }

    .landing.offers .custom-navigation {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
    }

        .landing.offers .custom-navigation a {
            position: absolute;
            margin-top: -25px;
            font-size: 30px;
            color: #ffffff;
            background-color: #a7a7a7;
            height: 50px;
            width: 25px;
            padding: 3px 7px;
            border: 1px solid #8e8e8e;
            z-index: 1;
        }

            .landing.offers .custom-navigation a.prev {
                left: -25px;
                border-radius: 25px 0px 0px 25px;
                -moz-border-radius: 25px 0px 0px 25px;
                -webkit-border-radius: 25px 0px 0px 25px;
            }

            .landing.offers .custom-navigation a.next {
                right: -25px;
                border-radius: 0px 25px 25px 0px;
                -moz-border-radius: 0px 25px 25px 0px;
                -webkit-border-radius: 0px 25px 25px 0px;
            }

@media (max-width: 991px) {
    .landing.offers .offer-item .image {
        width: 100%;
        margin: 0px;
    }

    .landing.offers .offer-item .des {
        margin-left: 0px;
        width: 100%;
    }

        .landing.offers .offer-item .des .offer-title {
            margin: 15px 0 0 0;
        }
}

@media (max-width: 767px) {
    .landing.offers {
        margin-top: 10px;
        padding-bottom: 15px;
    }

        .landing.offers h2 {
            color: #747096;
        }

            .landing.offers h2:after {
                border-bottom: 2px solid #747096;
            }

        .landing.offers .offer-item .des .price p {
            font-size: 18px;
        }

        .landing.offers .offer-item .des .valid .from span, .landing.offers .offer-item .des .valid .to span, .landing.offers .offer-item .des .valid .remaining span {
            font-size: 14px;
            line-height: 1.5;
        }

        .landing.offers .offer-item .des .offer-title {
            font-size: 18px;
            margin: 8px 0 0 0;
        }

        .landing.offers .offer-item .des .offer-des {
            font-size: 12px;
        }

        .landing.offers .offer-item .des {
            z-index: 3;
            overflow: visible;
        }

            .landing.offers .offer-item .des .salon-wrap {
                margin-top: -55px;
            }

                .landing.offers .offer-item .des .salon-wrap .salon-logo {
                    display: inline-block;
                    margin-top: 0px;
                    margin-bottom: 10px;
                    width: auto;
                }

                .landing.offers .offer-item .des .salon-wrap .salon-name {
                    display: block;
                    padding-left: 0px;
                }

        .landing.offers .custom-navigation {
            display: none;
        }
}

/* Offer Popup */
#offerPopup .offer-popup h2 {
    margin: 0 0 15px 0;
    font-size: 24px;
    line-height: 1.0;
}

#offerPopup .offer-popup .offer-image {
    position: relative;
}

    #offerPopup .offer-popup .offer-image .rate {
        position: absolute;
        top: -4px;
        right: -4px;
        z-index: 10;
        width: 100px;
        height: 94px;
        background: url(../img/promo-rate-tag.png) no-repeat top right;
        background-size: cover;
        padding: 14px 5px;
        font-size: 20px;
        font-weight: bold;
        color: #ffffff;
        text-align: right;
    }

    #offerPopup .offer-popup .offer-image img {
        width: 100%;
        height: auto;
    }

#offerPopup .offer-popup .salon-details .salon-wrap {
    display: table;
    width: 100%;
    margin: 15px 0;
}

    #offerPopup .offer-popup .salon-details .salon-wrap .salon-logo {
        display: table-cell;
        vertical-align: middle;
        width: 1px;
        background-color: #cccccc;
    }

        #offerPopup .offer-popup .salon-details .salon-wrap .salon-logo img {
            width: auto;
            height: 40px;
        }

    #offerPopup .offer-popup .salon-details .salon-wrap .salon-name {
        display: table-cell;
        vertical-align: middle;
    }

        #offerPopup .offer-popup .salon-details .salon-wrap .salon-name h4 {
            margin: 0;
            color: #333333;
            font-size: 15px;
            font-weight: bold;
            text-transform: uppercase;
        }

#offerPopup .offer-popup .price {
    background-color: #7e7e7e;
    border-radius: 5px;
    border: 1px solid #ffffff;
    margin: 10px 0 0 0;
    overflow: hidden;
    color: #ffffff;
    text-align: center;
    font-size: 14px;
    line-height: 1.2;
}

    #offerPopup .offer-popup .price .actual-price {
        position: relative;
        width: 50%;
        float: left;
        padding: 5px 0;
    }

        #offerPopup .offer-popup .price .actual-price:before,
        #offerPopup .offer-popup .price .actual-price:after {
            content: "";
            position: absolute;
            top: 25px;
            left: 10%;
            right: 10%;
            background: #ffffff;
            height: 2px;
        }

        #offerPopup .offer-popup .price .actual-price:before {
            -webkit-transform: translateX(-1%) rotate(9deg);
            -moz-transform: translateX(-1%) rotate(9deg);
            -o-transform: translateX(-1%) rotate(9deg);
            -ms-transform: translateX(-1%) rotate(9deg);
            transform: translateX(-1%) rotate(9deg);
        }

        #offerPopup .offer-popup .price .actual-price:after {
            -webkit-transform: translateX(0%) rotate(-9deg);
            -moz-transform: translateX(0%) rotate(-9deg);
            -o-transform: translateX(0%) rotate(-9deg);
            -ms-transform: translateX(0%) rotate(-9deg);
            transform: translateX(0%) rotate(-9deg);
        }

    #offerPopup .offer-popup .price p {
        font-size: 24px;
        font-weight: 300;
        margin: 0;
    }

        #offerPopup .offer-popup .price p span {
            font-size: 16px;
            margin-right: 5px;
        }

    #offerPopup .offer-popup .price .new-price {
        position: relative;
        width: 50%;
        float: left;
        background-color: #893f80;
        padding: 5px 0;
    }

#offerPopup .offer-popup .valid {
    overflow: hidden;
    margin: 15px 0;
}

    #offerPopup .offer-popup .valid .from,
    #offerPopup .offer-popup .valid .to,
    #offerPopup .offer-popup .valid .remaining {
        float: left;
        width: 33.33%;
        color: #970067;
        font-size: 14px;
        line-height: 1;
        font-weight: bold;
        text-align: center;
        text-transform: uppercase;
    }

        #offerPopup .offer-popup .valid .from span,
        #offerPopup .offer-popup .valid .to span,
        #offerPopup .offer-popup .valid .remaining span {
            display: block;
            font-size: 20px;
            line-height: 1;
            font-weight: 300;
        }

    #offerPopup .offer-popup .valid .remaining {
        color: #e60913;
    }

#offerPopup .offer-popup hr {
    border-top: 3px solid #cccccc;
}

#offerPopup .offer-popup .sec h3 {
    font-size: 20px;
    color: #9b0a6c;
    text-transform: uppercase;
}

#offerPopup .offer-popup .terms ul {
    margin: 0;
    padding: 0;
}

    #offerPopup .offer-popup .terms ul li {
        list-style: none;
        padding: 0 0 5px 0;
        text-align: left;
    }

@media (max-width: 767px) {
    #offerPopup .offer-popup h2 {
        text-align: center;
    }

    #offerPopup .offer-popup .salon-details .salon-wrap {
        display: block;
        text-align: center;
    }

        #offerPopup .offer-popup .salon-details .salon-wrap .salon-logo {
            display: block;
            width: auto;
            margin: 0 0 10px 0;
        }

            #offerPopup .offer-popup .salon-details .salon-wrap .salon-logo img {
                height: 75px;
            }

        #offerPopup .offer-popup .salon-details .salon-wrap .salon-name {
            display: block;
            padding-left: 0px;
        }

    #offerPopup .offer-popup .price p {
        font-size: 18px;
    }

    #offerPopup .offer-popup .valid .from span, #offerPopup .offer-popup .valid .to span, #offerPopup .offer-popup .valid .remaining span {
        font-size: 14px;
        line-height: 1.5;
    }

    #offerPopup .offer-popup .sec {
        text-align: center;
    }
}


/***************************** Landing Ad Banner Section *****************************/
.add-banner {
    margin-top: -150px;
    position: relative;
    z-index: 2;
}

    .add-banner h2 {
        color: #ffffff;
        margin-bottom: 35px;
    }

        .add-banner h2:after {
            border-bottom: 2px solid #ffffff;
        }

    .add-banner .flexslider .flex-control-nav {
        margin-top: 0px;
    }

    .add-banner .ads-row {
        margin: 0px -3px 6px -3px;
        padding: 6px;
        overflow: hidden;
    }

        .add-banner .ads-row img {
            width: 100%;
            height: auto;
            border: 1px solid #cccccc;
        }

        .add-banner .ads-row .ads-col-half {
            float: left;
            width: 50%;
            padding: 0px 3px;
        }

@media (max-width: 767px) {
    .add-banner {
        margin-top: 5px;
    }

        .add-banner h2 {
            color: #333333;
            margin-bottom: 35px;
        }

            .add-banner h2:after {
                border-bottom: 2px solid #333333;
            }

        .add-banner .ads-row .ads-col-half {
            float: left;
            width: 100%;
            padding: 0px 3px;
            margin-bottom: 6px;
        }

        .add-banner .ads-row {
            pointer-events: none;
            margin: 0px -3px 0px -3px;
        }
}
/***************************** Landing News Section *****************************/

.news-land {
    margin-bottom: 30px;
}

    .news-land .slider-wrap {
        position: relative;
        margin: 0 -15px 0 -15px;
    }

    .news-land .news-block {
        position: relative;
        padding: 0px 15px;
    }

        .news-land .news-block .image {
            position: relative;
            width: 100%;
            height: 250px;
            background-repeat: no-repeat;
            background-position: top center;
            background-size: cover;
        }

            .news-land .news-block .image img {
                width: 100%;
            }

            .news-land .news-block .image:after {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0);
                background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.7)));
                background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
                background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
                background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
                background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
                filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
            }

        .news-land .news-block:hover .image:after {
            background: rgba(0, 0, 0, 0);
            background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%);
            background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.3)), color-stop(100%, rgba(0, 0, 0, 0.9)));
            background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%);
            background: -o-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%);
            background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%);
            background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0.9) 100%);
            filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
        }

        .news-land .news-block .desc {
            padding: 15px 15px 0px 15px;
            position: absolute;
            bottom: 0;
            left: 15px;
            right: 15px;
            margin-bottom: 0;
            color: #ffffff;
            text-align: center;
            -webkit-transition: all .25s ease-out;
            -moz-transition: all .25s ease-out;
            -ms-transition: all .25s ease-out;
            -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
        }

        .news-land .news-block:hover .desc {
            margin-bottom: 10%;
        }

        .news-land .news-block .desc h4 {
            position: relative;
            font-size: 18px;
            line-height: 1.3;
            margin: 0px 0px 10px 0px;
            font-weight: normal;
        }

            .news-land .news-block .desc h4:after {
                content: "";
                position: absolute;
                bottom: -10px;
                left: 50%;
                margin-left: -10%;
                width: 20%;
                border-bottom: 3px solid #ffffff;
                height: 10px;
            }

        .news-land .news-block .desc p {
            position: relative;
            margin: 0;
            font-size: 14px;
            font-weight: normal;
            height: 1px;
            opacity: 0;
            -webkit-transition: all .25s ease-out;
            -moz-transition: all .25s ease-out;
            -ms-transition: all .25s ease-out;
            -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
        }

        .news-land .news-block:hover .desc p {
            height: auto;
            margin: 20px 0;
            opacity: 1;
        }

        .news-land .news-block .desc button {
            opacity: 0;
            -webkit-transition: all .25s ease-out;
            -moz-transition: all .25s ease-out;
            -ms-transition: all .25s ease-out;
            -o-transition: all .25s ease-out;
            transition: all .25s ease-out;
        }

        .news-land .news-block:hover .desc button {
            opacity: 1;
        }

        .news-land .news-block a {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 1;
        }

    .news-land .custom-navigation {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
    }

        .news-land .custom-navigation a {
            position: absolute;
            margin-top: -25px;
            font-size: 30px;
            color: #ffffff;
            background-color: #a7a7a7;
            height: 50px;
            width: 25px;
            padding: 3px 7px;
            border: 1px solid #8e8e8e;
            z-index: 1;
        }

            .news-land .custom-navigation a.prev {
                left: -25px;
                border-radius: 25px 0px 0px 25px;
                -moz-border-radius: 25px 0px 0px 25px;
                -webkit-border-radius: 25px 0px 0px 25px;
            }

            .news-land .custom-navigation a.next {
                right: -25px;
                border-radius: 0px 25px 25px 0px;
                -moz-border-radius: 0px 25px 25px 0px;
                -webkit-border-radius: 0px 25px 25px 0px;
            }

@media (max-width: 991px) {
    .news-land .news-block .image:after {
        background: rgba(0, 0, 0, 0);
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.7) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.3)), color-stop(100%, rgba(0, 0, 0, 0.7)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.7) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.7) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.79) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.7) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
    }

    .news-land .news-block .desc {
        margin-bottom: 10%;
    }

        .news-land .news-block .desc h4 {
            font-size: 16px;
        }

        .news-land .news-block .desc p {
            height: auto;
            margin: 20px 0;
            opacity: 1;
        }

        .news-land .news-block .desc button {
            opacity: 1;
        }
}

@media (max-width: 767px) {
    .news-land .custom-navigation {
        display: none;
    }
}
/* News Popup */

#newsPopup .news-popup .news-image {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
    border: 1px solid #999999;
}

#newsPopup .news-popup .news-title {
    font-size: 24px;
    font-weight: normal;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 15px;
}

#newsPopup .news-popup .news-des {
    border: 1px solid #999999;
    padding: 15px;
    background-color: #f3f3f3;
}

@media (max-width: 767px) {
    #newsPopup .news-popup .news-title {
        font-size: 18px;
    }
}
/***************************** Landing News Section *****************************/

.event-land {
    margin-bottom: 30px;
}

    .event-land .slider-wrap {
        position: relative;
        margin: 0 -15px 0 -15px;
    }

    .event-land .event-block {
        padding: 0px 15px;
    }

        .event-land .event-block .event-block-wrap {
            display: table;
            width: 100%;
            position: relative;
            border: 1px solid #cccccc;
        }

            .event-land .event-block .event-block-wrap .image {
                display: table-cell;
                vertical-align: middle;
                position: relative;
                width: 50%;
                height: 250px;
                background-repeat: no-repeat;
                background-position: top center;
                background-size: cover;
            }

            .event-land .event-block .event-block-wrap:hover .image:before {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background: rgba(0, 0, 0, 0.5);
            }

            .event-land .event-block .event-block-wrap .image .datetag {
                position: absolute;
                top: 0;
                left: 15px;
                background-color: #000000;
                color: #ffffff;
                width: 60px;
                height: 50px;
                padding: 6px;
                text-align: center;
                border-bottom-left-radius: 10px;
                border-bottom-right-radius: 10px;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

                .event-land .event-block .event-block-wrap .image .datetag .month {
                    font-size: 14px;
                    font-weight: bold;
                    line-height: 1;
                    text-transform: uppercase;
                }

                .event-land .event-block .event-block-wrap .image .datetag .date {
                    font-size: 24px;
                    font-weight: 300;
                    line-height: 1;
                }

            .event-land .event-block .event-block-wrap .image button {
                position: absolute;
                left: 50%;
                top: 50%;
                margin-left: -46px;
                margin-top: -17px;
                opacity: 0;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

            .event-land .event-block .event-block-wrap:hover .image button {
                opacity: 1;
            }

            .event-land .event-block .event-block-wrap .desc {
                display: table-cell;
                width: 50%;
                padding: 10px;
                background-color: #dcdbd5;
            }

                .event-land .event-block .event-block-wrap .desc h4 {
                    font-size: 18px;
                    font-weight: normal;
                    color: #747096;
                }

                .event-land .event-block .event-block-wrap .desc .data p {
                    font-weight: bold;
                    margin-bottom: 3px;
                }

                .event-land .event-block .event-block-wrap .desc .data i {
                    background-color: #747096;
                    color: #ffffff;
                    width: 25px;
                    height: 25px;
                    border-radius: 50%;
                    border: 1px solid #ffffff;
                    font-size: 12px;
                    text-align: center;
                    padding: 6px;
                }

            .event-land .event-block .event-block-wrap a {
                content: "";
                position: absolute;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                z-index: 1;
            }

    .event-land .custom-navigation {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
    }

        .event-land .custom-navigation a {
            position: absolute;
            margin-top: -25px;
            font-size: 30px;
            color: #ffffff;
            background-color: #a7a7a7;
            height: 50px;
            width: 25px;
            padding: 3px 7px;
            border: 1px solid #8e8e8e;
            z-index: 1;
        }

            .event-land .custom-navigation a.prev {
                left: -25px;
                border-radius: 25px 0px 0px 25px;
                -moz-border-radius: 25px 0px 0px 25px;
                -webkit-border-radius: 25px 0px 0px 25px;
            }

            .event-land .custom-navigation a.next {
                right: -25px;
                border-radius: 0px 25px 25px 0px;
                -moz-border-radius: 0px 25px 25px 0px;
                -webkit-border-radius: 0px 25px 25px 0px;
            }

@media (max-width: 991px) {
    .event-land .event-block .event-block-wrap .image:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(0, 0, 0, 0.5);
    }

    .event-land .event-block .event-block-wrap .image button {
        opacity: 1;
    }
}

@media (max-width: 767px) {
    .event-land .event-block .event-block-wrap {
        display: block;
    }

        .event-land .event-block .event-block-wrap .image {
            display: block;
            width: 100%;
            height: 180px;
        }

        .event-land .event-block .event-block-wrap .desc {
            display: block;
            width: 100%;
        }

    .event-land .custom-navigation {
        display: none;
    }
}
/* Event Popup */

#eventPopup .event-popup .event-image {
    width: 100%;
    height: auto;
    margin-bottom: 15px;
    border: 1px solid #999999;
}

#eventPopup .event-popup .event-title {
    font-size: 24px;
    font-weight: normal;
    text-align: center;
    margin-top: 0px;
    margin-bottom: 15px;
}

#eventPopup .event-popup .event-des {
    border: 1px solid #999999;
    padding: 15px;
    background-color: #f3f3f3;
}

#eventPopup .event-popup .event-summery {
    background-color: #333333;
    color: #ffffff;
    padding: 15px;
}

    #eventPopup .event-popup .event-summery p {
        display: inline-block;
        vertical-align: top;
        margin: 5px 10px 5px 0px;
        font-size: 16px;
        line-height: 16px;
        font-weight: 300;
    }

        #eventPopup .event-popup .event-summery p i {
            background-color: #ffffff;
            color: #000000;
            width: 20px;
            height: 20px;
            border-radius: 50%;
            font-size: 12px;
            text-align: center;
            padding: 4px;
        }

@media (max-width: 767px) {
    #eventPopup .event-popup .event-title {
        font-size: 18px;
    }

    #eventPopup .event-popup .event-summery p {
        font-size: 14px;
        line-height: 14px;
    }
}
/***************************** Landing Top Salons Section *****************************/

.landing.top-salons {
    padding: 60px 0 100px 0;
    background: rgba(244,202,201,1);
    background: -moz-linear-gradient(45deg, rgba(244,202,201,1) 0%, rgba(184,180,210,1) 100%);
    background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(244,202,201,1)), color-stop(100%, rgba(184,180,210,1)));
    background: -webkit-linear-gradient(45deg, rgba(244,202,201,1) 0%, rgba(184,180,210,1) 100%);
    background: -o-linear-gradient(45deg, rgba(244,202,201,1) 0%, rgba(184,180,210,1) 100%);
    background: -ms-linear-gradient(45deg, rgba(244,202,201,1) 0%, rgba(184,180,210,1) 100%);
    background: linear-gradient(45deg, rgba(244,202,201,1) 0%, rgba(184,180,210,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4cac9', endColorstr='#b8b4d2', GradientType=1 );
}

    .landing.top-salons h2 {
        color: #ffffff;
    }

        .landing.top-salons h2:after {
            border-bottom: 2px solid #ffffff;
        }

    .landing.top-salons .salon-block {
        background: #fff;
        text-align: center;
        overflow: hidden;
        padding-bottom: 15px;
        margin-bottom: 10px;
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        -o-transform: translateY(0px);
        transform: translateY(0px);
        -webkit-transition: all 0.25s ease;
        -moz-transition: all 0.25s ease;
        -ms-transition: all 0.25s ease;
        -o-transition: all 0.25s ease;
        transition: all 0.3s ease;
    }

        .landing.top-salons .salon-block:hover {
            cursor: pointer;
            -webkit-transform: translateY(-8px);
            -moz-transform: translateY(-8px);
            -ms-transform: translateY(-8px);
            -o-transform: translateY(-8px);
            transform: translateY(-8px);
        }

        .landing.top-salons .salon-block .image {
            width: 100%;
            height: 140px;
            overflow: hidden;
        }

            .landing.top-salons .salon-block .image img {
                width: 100%;
                height: auto;
            }

        .landing.top-salons .salon-block .desc {
            display: block;
            margin: 15px;
            overflow: hidden;
        }

            .landing.top-salons .salon-block .desc h4 {
                color: #747096;
                font-size: 16px;
                font-weight: normal;
                text-transform: uppercase;
                margin: 5px 0px 10px 0px;
            }

            .landing.top-salons .salon-block .desc h5 {
                color: #b6b3d2;
                font-size: 14px;
                font-weight: bold;
                margin: 10px 0px 5px 0px;
            }

@media (max-width: 767px) {
    .landing.top-salons {
        padding: 15px 0 25px 0;
    }
}
/***************************** Landing Instragram Gallery Section *****************************/

.landing.insta-gallery {
    border-top: 10px solid #e7c5cb;
    padding: 120px 0 30px 0;
    text-align: center;
}

    .landing.insta-gallery img.insta-icon {
        position: absolute;
        top: -170px;
        width: 300px;
        left: 50%;
        margin-left: -150px;
    }

    .landing.insta-gallery p.insta-intro {
        font-size: 18px;
        margin-bottom: 30px;
    }

    .landing.insta-gallery .gal-item {
        overflow: hidden;
        position: relative;
    }

        .landing.insta-gallery .gal-item img {
            width: 100%;
            height: auto;
            object-fit: cover;
        }

        .landing.insta-gallery .gal-item .caption {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            top: 0;
            opacity: 0;
            padding: 15px;
            color: #fff;
            text-align: left;
            background-color: rgba(0, 0, 0, 0.6);
            z-index: 3;
            transition: all .3s ease-in-out;
        }

            .landing.insta-gallery .gal-item .caption:hover {
                opacity: 1;
                cursor: pointer;
            }

            .landing.insta-gallery .gal-item .caption .user {
            }

                .landing.insta-gallery .gal-item .caption .user .image {
                    display: inline-block;
                    vertical-align: middle;
                }

                    .landing.insta-gallery .gal-item .caption .user .image img {
                        width: 50px;
                        border-radius: 5px;
                    }

                .landing.insta-gallery .gal-item .caption .user .des {
                    display: inline-block;
                    vertical-align: middle;
                    padding-left: 10px;
                }

                    .landing.insta-gallery .gal-item .caption .user .des .name {
                        font-size: 16px;
                        font-weight: bold;
                        margin: 0;
                    }

                    .landing.insta-gallery .gal-item .caption .user .des .loc {
                        font-size: 12px;
                        margin: 0;
                    }

            .landing.insta-gallery .gal-item .caption .count {
                display: inline-block;
                margin-top: 5px;
                background-color: #fff;
                color: #333333;
                padding: 2px 0px 2px 10px;
                font-size: 12px;
                border-radius: 5px;
                font-weight: bold;
            }

                .landing.insta-gallery .gal-item .caption .count span {
                    padding-right: 10px;
                }

            .landing.insta-gallery .gal-item .caption .likes {
                margin: 10px 0;
                padding: 6px 0;
                border-top: 1px solid rgba(255, 255, 255, 0.5);
                border-bottom: 1px solid rgba(255, 255, 255, 0.5);
            }

                .landing.insta-gallery .gal-item .caption .likes .names {
                    font-size: 12px;
                    font-weight: bold;
                }

            .landing.insta-gallery .gal-item .caption .comments {
                margin-top: 10px;
                overflow-x: scroll;
                max-height: 110px;
            }

                .landing.insta-gallery .gal-item .caption .comments .comments-item {
                    margin-bottom: 10px;
                }

                    .landing.insta-gallery .gal-item .caption .comments .comments-item p {
                        margin: 0px;
                    }

                    .landing.insta-gallery .gal-item .caption .comments .comments-item span {
                        font-size: 12px;
                    }

@media (max-width: 767px) {
    .landing.insta-gallery {
        padding: 30px 0 10px 0;
    }

        .landing.insta-gallery img.insta-icon {
            top: -85px;
            width: 180px;
            margin-left: -90px;
        }
}
/***************************** Landing Contact Section *****************************/

.landing.land-contact {
    position: relative;
    padding: 20px 0;
    background: rgba(200,185,203,1);
    background: -moz-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -webkit-gradient(left bottom, right top, color-stop(0%, rgba(200,185,203,1)), color-stop(100%, rgba(182,179,210,1)));
    background: -webkit-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -o-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: -ms-linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    background: linear-gradient(45deg, rgba(200,185,203,1) 0%, rgba(182,179,210,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c8b9cb', endColorstr='#b6b3d2', GradientType=1 );
}

    .landing.land-contact p {
        font-size: 30px;
        line-height: 1;
        text-transform: uppercase;
        color: #fff;
        font-weight: bold;
        display: inline-block;
        vertical-align: middle;
        margin: 0;
    }

    .landing.land-contact .btn-default {
        display: inline-block;
        vertical-align: middle;
        font-size: 18px;
        font-weight: bold;
        text-transform: uppercase;
        padding: 7px 20px;
        background-color: #0D0D0D;
        border: none;
        border-radius: 0px;
        color: #fff;
        margin-left: 20px;
    }

        .landing.land-contact .btn-default:hover {
            background-color: #050505;
            color: #fff;
        }

@media (max-width: 991px) {
    .landing.land-contact p {
        font-size: 24px;
        display: block;
    }

    .landing.land-contact .btn-default {
        margin-top: 10px;
        display: inline-block;
        margin-left: 0px;
    }
}

@media (max-width: 767px) {
    .landing.land-contact {
        padding: 10px 0;
    }

        .landing.land-contact p {
            font-size: 20px;
        }
}



/****************************************************************************************************
#####################################################################################################
****************************** Search Results Page ***************************************************
#####################################################################################################
****************************************************************************************************/

.search-results {
    position: relative;
    padding-top: 20px;
    padding-bottom: 20px;
    background: #fff;
    margin-top: -80px;
    margin-bottom: 30px;
}

@media (max-width: 767px) {
    .search-results {
        padding-top: 0px;
        margin-top: 0px;
    }
}
/***************************** Search Section *****************************/

.search-results .left-panel {
    position: fixed;
    width: 292.5px;
    z-index: 10;
}

    .search-results .left-panel .google-map {
        margin-top: 15px;
    }

        .search-results .left-panel .google-map .angular-google-map-container {
            height: 300px;
        }

@media (min-width: 992px) and (max-width: 1199px) {
    .search-results .left-panel {
        width: 242.5px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .search-results .left-panel {
        width: 750px;
        top: 40px;
        padding: 15px;
        background-color: #ffffff;
    }

        .search-results .left-panel .search-box .country-select {
            padding-right: 18px;
        }

        .search-results .left-panel .search-box .city-select {
            padding-left: 18px;
        }

        .search-results .left-panel .search-box .service-select {
            padding: 0px 21px;
        }
}

@media (max-width: 767px) {
    .search-results .left-panel {
        width: 100%;
        padding: 15px;
        background-color: #dad3d9;
    }

        .search-results .left-panel .search-toggle {
            display: none !important;
            margin-bottom: 15px;
        }

            .search-results .left-panel .search-toggle .btn {
                font-size: 16px;
                font-weight: bold;
                text-transform: uppercase;
                background-color: #ffffff;
                border: 1px solid #a7a7a7;
                -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0);
                box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0);
            }

    .search-results.mob-hide .left-panel {
        padding: 15px 15px 0px 15px;
    }

        .search-results.mob-hide .left-panel .search-box {
            height: 0px;
            overflow: hidden;
        }

        .search-results.mob-hide .left-panel .search-toggle {
            display: block !important;
        }
}

@media (min-width: 992px) {
    .search-results .left-panel.roll {
        position: absolute;
        bottom: 0;
    }
}
/***************************** Results Section *****************************/

.search-results .right-panel .results-wrap {
    margin: 15px 0px;
}

    .search-results .right-panel .results-wrap .result-block {
        display: table;
        table-layout: fixed;
        width: 100%;
        height: 100%;
        margin-bottom: 20px;
        border: 2px solid #cccccc;
    }

        .search-results .right-panel .results-wrap .result-block .image {
            position: relative;
            display: table-cell;
            width: 45%;
            height: 100%;
            vertical-align: top;
            background-repeat: no-repeat;
            background-position: top center;
            background-size: cover;
        }

            .search-results .right-panel .results-wrap .result-block .image img {
                width: 100%;
                height: auto;
            }

            .search-results .right-panel .results-wrap .result-block .image .recommended {
                left: 0px;
                position: absolute;
                top: 0px;
                padding: 5px;
                width: 60px;
                height: 60px;
            }

                .search-results .right-panel .results-wrap .result-block .image .recommended:after {
                    content: "";
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 70px;
                    height: 70px;
                    border-top: 70px solid rgba(0, 0, 0, 0.73);
                    border-right: 70px solid transparent;
                }

                .search-results .right-panel .results-wrap .result-block .image .recommended > img {
                    height: 50px !important;
                    width: 40px !important;
                    position: relative;
                    z-index: 1;
                }

                .search-results .right-panel .results-wrap .result-block .image .recommended > span {
                    background-color: #171717;
                    border-radius: 3px;
                    color: #ffffff;
                    font-size: 12px;
                    left: 5px;
                    padding: 3px 5px;
                    position: absolute;
                    top: 15px;
                    transition: all 0.2s ease-in-out 0s;
                    visibility: hidden;
                    opacity: 0;
                }

                    .search-results .right-panel .results-wrap .result-block .image .recommended > span::before {
                        border-bottom: 4px solid rgba(0, 0, 0, 0);
                        border-right: 4px solid #171717;
                        border-top: 4px solid rgba(0, 0, 0, 0);
                        content: "";
                        height: 0;
                        left: -4px;
                        position: absolute;
                        top: 7px;
                        width: 0;
                    }

                .search-results .right-panel .results-wrap .result-block .image .recommended:hover > span {
                    visibility: visible;
                    left: 50px;
                    opacity: 1;
                }

        .search-results .right-panel .results-wrap .result-block .description {
            display: table-cell;
            width: 55%;
            height: 100%;
            vertical-align: top;
            padding: 15px;
        }

            .search-results .right-panel .results-wrap .result-block .description h2 {
                font-size: 20px;
                font-weight: 600;
                color: #747096;
                text-transform: uppercase;
                margin: 0;
                padding: 3px 0;
            }

            .search-results .right-panel .results-wrap .result-block .description .important {
                padding: 3px 0;
            }

            .search-results .right-panel .results-wrap .result-block .description .address {
                font-size: 14px;
                font-weight: bold;
                color: #000000;
                height: 25px;
                padding: 3px 0px;
            }

            .search-results .right-panel .results-wrap .result-block .description .intro {
                padding: 3px 0px;
                color: #999999;
                font-size: 14px;
                line-height: 1.2;
            }

            .search-results .right-panel .results-wrap .result-block .description .service-icons {
                list-style: none;
                margin: 10px 0;
                padding: 5px 0;
                border-top: 1px solid #cccccc;
                border-bottom: 1px solid #cccccc;
                overflow: hidden;
            }

                .search-results .right-panel .results-wrap .result-block .description .service-icons li {
                    float: left;
                    padding: 2px;
                }

                    .search-results .right-panel .results-wrap .result-block .description .service-icons li img {
                        width: 23px;
                        height: 23px;
                        border-radius: 50%;
                        opacity: 0.5;
                    }

                        .search-results .right-panel .results-wrap .result-block .description .service-icons li img:hover {
                            opacity: 0.8;
                        }

            .search-results .right-panel .results-wrap .result-block .description .populer {
                background-color: #e6e6e6;
                border: 1px solid #e6e6e6;
                border-radius: 5px;
                padding: 10px;
            }

                .search-results .right-panel .results-wrap .result-block .description .populer p {
                    font-size: 14px;
                    font-weight: bold;
                    color: #000000;
                    margin-bottom: 3px;
                }

                    .search-results .right-panel .results-wrap .result-block .description .populer p i {
                        color: #d69ba5;
                        margin-right: 3px;
                    }

            .search-results .right-panel .results-wrap .result-block .description .actions {
                padding: 5px 0;
                text-align: right;
            }

.search-results .right-panel .google-map {
    margin: 15px 0px;
    border: 1px solid #cccccc;
}

    .search-results .right-panel .google-map .angular-google-map-container {
        height: 400px;
    }

@media (min-width: 992px) and (max-width: 1199px) {
    .search-results .right-panel .results-wrap .result-block .description h2 {
        font-size: 18px;
    }

    .search-results .right-panel .results-wrap .result-block .description .address {
        font-size: 12px;
    }

    .search-results .right-panel .results-wrap .result-block .description .intro {
        font-size: 12px;
    }

    .search-results .right-panel .results-wrap .result-block .description .service-icons li img {
        width: 17px;
        height: 17px;
    }

    .search-results .right-panel .results-wrap .result-block .description .populer p {
        font-size: 12px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .search-results .right-panel {
        padding-top: 50px;
    }

        .search-results .right-panel .results-wrap .result-block .description {
            height: auto;
        }
}

@media (max-width: 767px) {
    .search-results .right-panel {
        margin-top: 200px;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        -ms-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

    .search-results.mob-hide .right-panel {
        margin-top: 100px;
    }

    .search-results .right-panel .btn-group {
        width: 100%;
    }

        .search-results .right-panel .btn-group .btn {
            width: 50%;
        }

    .search-results .right-panel .results-wrap .result-block {
        display: block;
    }

        .search-results .right-panel .results-wrap .result-block .image {
            display: block;
            width: 100%;
            height: 210px;
        }

        .search-results .right-panel .results-wrap .result-block .description {
            display: block;
            width: 100%;
            text-align: center;
        }

            .search-results .right-panel .results-wrap .result-block .description .address {
                height: auto;
            }

            .search-results .right-panel .results-wrap .result-block .description .intro {
                font-size: 12px;
            }

            .search-results .right-panel .results-wrap .result-block .description .service-icons li {
                display: inline-block;
                float: none;
                padding: 5px;
            }

                .search-results .right-panel .results-wrap .result-block .description .service-icons li img {
                    width: 28px;
                    height: 28px;
                }

            .search-results .right-panel .results-wrap .result-block .description .actions {
                text-align: center;
            }
}
/***************************** Add Section *****************************/

.search-results .add-panel img {
    width: 100%;
    height: auto;
    margin-bottom: 10px;
}

/****************************************************************************************************
#####################################################################################################
****************************** Salon Profile Page ***************************************************
#####################################################################################################
****************************************************************************************************/
/***************************** Salon Hero Section *****************************/
/*Salon Hero Banner*/

.salon-hero {
    position: relative;
    height: 512px;
    z-index: 1;
    background-color: #fff;
}

    .salon-hero > .container-fluid {
        pointer-events: none;
    }

    .salon-hero .hero-slider {
        position: absolute;
        top: 0px;
        left: 0;
        z-index: -1;
        height: 512px;
        width: 100%;
        overflow: hidden;
        pointer-events: all;
    }

        .salon-hero .hero-slider .flexslider .slides li {
            height: 512px;
            width: 100%;
        }

            .salon-hero .hero-slider .flexslider .slides li:after {
                content: "";
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                background-color: rgba(0, 0, 0, 0.3);
            }

            .salon-hero .hero-slider .flexslider .slides li .image {
                width: 100%;
                height: 100%;
                background-repeat: no-repeat;
                background-size: cover;
                background-position: top center;
            }

            .salon-hero .hero-slider .flexslider .slides li .dummy {
                height: auto;
                width: 100%;
                display: none;
            }

            .salon-hero .hero-slider .flexslider .slides li .caption {
                position: absolute;
                bottom: 50px;
                left: 0;
                right: 0;
                opacity: 0;
                -webkit-transition-delay: 1s;
                -moz-transition-delay: 1s;
                -ms-transition-delay: 1s;
                -o-transition-delay: 1s;
                transition-delay: 1s;
            }

            .salon-hero .hero-slider .flexslider .slides li.flex-active-slide .caption {
                bottom: 90px;
                opacity: 1;
                -webkit-transition-duration: 0.5s;
                -moz-transition-duration: 0.5s;
                -ms-transition-duration: 0.5s;
                -o-transition-duration: 0.5s;
                transition-duration: 0.5s;
            }

            .salon-hero .hero-slider .flexslider .slides li .caption .caption-wrap {
                float: right;
                background: rgba(0, 0, 0, 0.7);
                color: #ffffff;
                padding: 5px 20px;
                margin-top: 20px;
                text-align: center;
                max-width: 400px;
                border-radius: 20px;
            }

                .salon-hero .hero-slider .flexslider .slides li .caption .caption-wrap h2 {
                    font-size: 24px;
                    font-weight: 100;
                    margin-top: 10px;
                    margin-bottom: 0px;
                }

        .salon-hero .hero-slider .flexslider .flex-control-nav {
            display: none;
        }

@media (max-width: 767px) {
    .salon-hero .hero-slider .flexslider .slides li .caption {
        display: none;
    }
}
/*Radial Panel*/

.salon-hero .radial-panel {
    position: relative;
    height: 450px;
    width: 450px;
    margin-top: -75px;
    pointer-events: all;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
}

    .salon-hero .radial-panel.rhide {
        -webkit-transform-origin: 0% 0%;
        -moz-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        -o-transform-origin: 0% 0%;
        transform-origin: 0% 0%;
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
    }

    .salon-hero .radial-panel .radial-wrap {
        position: absolute;
        top: 0;
        left: 0;
        height: 450px;
        width: 450px;
        border-radius: 50%;
        background-color: rgba(255, 255, 255, 0.6);
        border: 3px solid #FFF;
    }

        .salon-hero .radial-panel .radial-wrap .amenities {
            position: relative;
            width: 444px;
            height: 444px;
        }

            .salon-hero .radial-panel .radial-wrap .amenities li {
                list-style-type: none;
                width: 60px;
                height: 60px;
                position: absolute;
                text-align: center;
                z-index: 1;
                cursor: pointer;
            }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(1) {
                    top: 14%;
                    right: 10%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(2) {
                    top: 29%;
                    right: 2%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(3) {
                    top: 46%;
                    right: 1%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(4) {
                    top: 62%;
                    right: 6%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(5) {
                    top: 76%;
                    right: 18%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(6) {
                    top: 83%;
                    right: 34%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(7) {
                    top: 83%;
                    left: 34%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(8) {
                    top: 76%;
                    left: 18%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(9) {
                    top: 62%;
                    left: 6%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(10) {
                    top: 46%;
                    left: 1%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(11) {
                    top: 29%;
                    left: 2%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li:nth-child(12) {
                    top: 14%;
                    left: 10%;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li img {
                    -moz-transform: scale(0.6);
                    -webkit-transform: scale(0.6);
                    -webkit-transition: .25s ease-in-out;
                    -moz-transition: .25s ease-in-out;
                    -o-transition: .25s ease-in-out;
                    transition: .25s ease-in-out;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li span {
                    position: absolute;
                    top: 16px;
                    left: 60px;
                    overflow: visible;
                    z-index: 999;
                    background-color: #000;
                    color: #FFF;
                    padding: 5px 10px;
                    border-radius: 3px;
                    margin-left: -10px;
                    opacity: 0;
                    -webkit-transition: opacity .3s ease-in-out;
                    -moz-transition: opacity .3s ease-in-out;
                    -o-transition: opacity .3s ease-in-out;
                    transition: opacity .3s ease-in-out;
                    white-space: nowrap;
                    pointer-events: none;
                }

                    .salon-hero .radial-panel .radial-wrap .amenities li span:after {
                        content: "";
                        width: 0;
                        height: 0;
                        border-top: 5px solid transparent;
                        border-right: 5px solid #000;
                        border-bottom: 5px solid transparent;
                        position: absolute;
                        left: -5px;
                        top: 50%;
                        margin-top: -4px;
                    }

                .salon-hero .radial-panel .radial-wrap .amenities li img:hover + span {
                    margin-left: 0px;
                    opacity: 1;
                }

                .salon-hero .radial-panel .radial-wrap .amenities li img:hover {
                    -moz-transform: scale(0.8);
                    -webkit-transform: scale(0.8);
                }

                .salon-hero .radial-panel .radial-wrap .amenities li.disabled {
                    pointer-events: none;
                    cursor: default;
                }

                    .salon-hero .radial-panel .radial-wrap .amenities li.disabled img {
                        -moz-transform: scale(0.6);
                        -webkit-transform: scale(0.6);
                        opacity: 0.3;
                        pointer-events: none;
                    }

        .salon-hero .radial-panel .radial-wrap .heighlight {
            position: absolute;
            margin-top: -160px;
            margin-left: -160px;
            top: 50%;
            left: 50%;
            width: 320px;
            height: 320px;
            padding: 50px 0 0 0;
            text-align: center;
            border-radius: 50%;
            background-color: rgba(255, 255, 255, 0.8);
            overflow: hidden;
        }

            .salon-hero .radial-panel .radial-wrap .heighlight .rating-num {
                display: block;
                margin: 0 auto;
                width: 75px;
                height: 75px;
                padding: 8px;
                border-radius: 50%;
                color: #fff;
                font-size: 36px;
                font-weight: bold;
                background: rgba(236, 202, 8, 1);
                background: -moz-linear-gradient(top, rgba(236, 202, 8, 1) 0%, rgba(236, 145, 8, 1) 100%);
                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(236, 202, 8, 1)), color-stop(100%, rgba(236, 145, 8, 1)));
                background: -webkit-linear-gradient(top, rgba(236, 202, 8, 1) 0%, rgba(236, 145, 8, 1) 100%);
                background: -o-linear-gradient(top, rgba(236, 202, 8, 1) 0%, rgba(236, 145, 8, 1) 100%);
                background: -ms-linear-gradient(top, rgba(236, 202, 8, 1) 0%, rgba(236, 145, 8, 1) 100%);
                background: linear-gradient(to bottom, rgba(236, 202, 8, 1) 0%, rgba(236, 145, 8, 1) 100%);
                filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ecca08', endColorstr='#ec9108', GradientType=0);
            }

            .salon-hero .radial-panel .radial-wrap .heighlight .links {
                padding: 15px 0px;
            }

                .salon-hero .radial-panel .radial-wrap .heighlight .links a {
                    cursor: pointer;
                    font-weight: 500;
                }

                .salon-hero .radial-panel .radial-wrap .heighlight .links .sep {
                    margin: 0 10px;
                    width: 1px;
                    border-left: 1px solid #b6b3d2;
                    height: 20px;
                }

            .salon-hero .radial-panel .radial-wrap .heighlight .btn {
                text-transform: uppercase;
            }

            .salon-hero .radial-panel .radial-wrap .heighlight .dummy-space {
                height: 34px;
            }

            .salon-hero .radial-panel .radial-wrap .heighlight .radial-hide {
                display: block;
                width: 100px;
                height: 100px;
                margin: 40px auto 0 auto;
                border-radius: 50%;
                background-color: #999999;
                color: #ffffff;
                font-size: 20px;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

                .salon-hero .radial-panel .radial-wrap .heighlight .radial-hide:hover {
                    margin-top: 35px;
                }

                .salon-hero .radial-panel .radial-wrap .heighlight .radial-hide i {
                    position: absolute;
                    bottom: 4px;
                    left: 50%;
                    margin-left: -6px;
                    -webkit-transition: all .15s ease-out;
                    -moz-transition: all .15s ease-out;
                    -ms-transition: all .15s ease-out;
                    -o-transition: all .15s ease-out;
                    transition: all .15s ease-out;
                }

                .salon-hero .radial-panel .radial-wrap .heighlight .radial-hide:hover i {
                    bottom: 9px;
                }

.salon-hero .radial-show {
    position: absolute;
    top: -1px;
    background-color: rgba(255, 255, 255, 0.6);
    border: 1px solid #ffffff;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    padding: 6px 15px;
    font-size: 14px;
    font-weight: bold;
    line-height: 10px;
    opacity: 1;
    pointer-events: all;
    -webkit-transition: all .25s ease-out;
    -moz-transition: all .25s ease-out;
    -ms-transition: all .25s ease-out;
    -o-transition: all .25s ease-out;
    transition: all .25s ease-out;
}

    .salon-hero .radial-show.bhide {
        opacity: 0;
        pointer-events: none;
    }

@media (max-width: 767px) {
    .salon-hero .radial-panel {
        margin-top: 0;
        width: 320px;
        margin: 0 auto;
        height: 512px;
        overflow: hidden;
    }

        .salon-hero .radial-panel .radial-wrap {
            top: auto;
            bottom: -140px;
            width: 320px;
            height: 320px;
        }

            .salon-hero .radial-panel .radial-wrap .amenities {
                display: none;
            }

            .salon-hero .radial-panel .radial-wrap .heighlight {
                padding-top: 15px;
            }

                .salon-hero .radial-panel .radial-wrap .heighlight .rating-num {
                    width: 50px;
                    height: 50px;
                    font-size: 24px;
                }

                .salon-hero .radial-panel .radial-wrap .heighlight .links {
                    padding: 5px 0px;
                }
}
/***************************** Salon Description Section *****************************/

.salon-desc {
    margin-top: -65px;
    position: relative;
    z-index: 1;
}

    .salon-desc .salon-desc-wrap {
        width: 100%;
        background-color: #747096;
        overflow: hidden;
        color: #ffffff;
        height: 130px;
    }

        .salon-desc .salon-desc-wrap .intro {
            float: left;
            display: table;
            vertical-align: middle;
            width: 50%;
            height: 130px;
            padding: 5px 15px;
            background-color: #54535a;
        }

            .salon-desc .salon-desc-wrap .intro p {
                display: table-cell;
                vertical-align: middle;
                font-size: 16px;
                font-weight: 100;
                font-style: italic;
                margin: 0;
                letter-spacing: 0.8px;
            }

            .salon-desc .salon-desc-wrap .intro .default {
                display: table-cell;
                vertical-align: middle;
            }

                .salon-desc .salon-desc-wrap .intro .default h2 {
                    margin: 0 0 10px 0;
                    font-size: 24px;
                }

                .salon-desc .salon-desc-wrap .intro .default p:not(.welcome) {
                    font-size: 14px;
                }

            .salon-desc .salon-desc-wrap .intro p a {
                color: #ffffff;
                font-weight: 500;
            }

                .salon-desc .salon-desc-wrap .intro p a:hover {
                    color: #ffffff;
                    margin-left: 5px;
                    -webkit-transition: all .25s ease-out;
                    -moz-transition: all .25s ease-out;
                    -ms-transition: all .25s ease-out;
                    -o-transition: all .25s ease-out;
                    transition: all .25s ease-out;
                }

        .salon-desc .salon-desc-wrap .contact {
            float: left;
            display: table;
            vertical-align: middle;
            width: 25%;
            height: 130px;
            overflow: hidden;
            margin: 0;
            padding: 5px 15px;
        }

            .salon-desc .salon-desc-wrap .contact .contact-wrap {
                display: table-cell;
                vertical-align: middle;
            }

                .salon-desc .salon-desc-wrap .contact .contact-wrap i {
                    float: left;
                    font-size: 120px;
                    line-height: 100px;
                }

                .salon-desc .salon-desc-wrap .contact .contact-wrap h3 {
                    font-size: 18px;
                    font-weight: bold;
                    color: #ffffff;
                    margin: 5px 0 0 60px;
                }

                .salon-desc .salon-desc-wrap .contact .contact-wrap h4 {
                    font-size: 20px;
                    font-weight: 100;
                    margin: 0px 0px 0px 60px;
                }

        .salon-desc .salon-desc-wrap .location {
            float: left;
            display: table;
            vertical-align: middle;
            width: 25%;
            height: 130px;
            overflow: hidden;
            padding: 15px 0px;
        }

            .salon-desc .salon-desc-wrap .location .location-wrap {
                display: table-cell;
                vertical-align: middle;
                border-left: 1px solid rgba(255, 255, 255, 0.25);
                padding: 5px 15px;
            }

                .salon-desc .salon-desc-wrap .location .location-wrap i {
                    font-size: 54px;
                    float: left;
                }

                .salon-desc .salon-desc-wrap .location .location-wrap h3 {
                    font-size: 20px;
                    font-weight: 100;
                    margin: 8px 0 0 42px;
                }

                .salon-desc .salon-desc-wrap .location .location-wrap h4 {
                    font-size: 14px;
                    font-weight: normal;
                    margin: 5px 0 0 42px;
                }

@media (min-width: 768px) and (max-width: 1199px) {
    .salon-desc .salon-desc-wrap .intro p {
        font-size: 14px;
    }

    .salon-desc .salon-desc-wrap .contact .contact-wrap i {
        font-size: 110px;
        line-height: 85px;
    }

    .salon-desc .salon-desc-wrap .contact .contact-wrap h3 {
        font-size: 16px;
    }

    .salon-desc .salon-desc-wrap .contact .contact-wrap h4 {
        font-size: 16px;
    }

    .salon-desc .salon-desc-wrap .location .location-wrap h3 {
        font-size: 18px;
    }
}

@media (max-width: 991px) {
    .salon-desc .salon-desc-wrap .contact .contact-wrap {
        position: relative;
    }

        .salon-desc .salon-desc-wrap .contact .contact-wrap i {
            position: absolute;
            top: 50%;
            margin-top: -42px;
            left: 50%;
            margin-left: -23px;
            color: rgba(255, 255, 255, 0.1);
        }

        .salon-desc .salon-desc-wrap .contact .contact-wrap h3 {
            margin: 0;
            text-align: center;
        }

        .salon-desc .salon-desc-wrap .contact .contact-wrap h4 {
            margin: 0;
            text-align: center;
        }

    .salon-desc .salon-desc-wrap .location .location-wrap {
        position: relative;
    }

        .salon-desc .salon-desc-wrap .location .location-wrap i {
            position: absolute;
            top: 50%;
            margin-top: -27px;
            left: 50%;
            margin-left: -15px;
            color: rgba(255, 255, 255, 0.1);
        }

        .salon-desc .salon-desc-wrap .location .location-wrap h3 {
            margin: 0;
            text-align: center;
        }

        .salon-desc .salon-desc-wrap .location .location-wrap h4 {
            margin: 0;
            text-align: center;
        }
}

@media (max-width: 767px) {
    .salon-desc {
        margin: 0px -15px 0 -15px;
    }

        .salon-desc .salon-desc-wrap {
            height: auto;
        }

            .salon-desc .salon-desc-wrap .intro {
                display: block;
                width: 100%;
                text-align: center;
                height: auto;
                padding: 15px 15px;
            }

                .salon-desc .salon-desc-wrap .intro p {
                    display: block;
                    font-size: 14px;
                    line-height: 1.2;
                    font-weight: normal;
                }

            .salon-desc .salon-desc-wrap .contact {
                width: 50%;
            }

            .salon-desc .salon-desc-wrap .location {
                width: 50%;
            }
}
/***************************** Salon Main Section ******************************/

.salon-main {
    padding: 30px 0px;
}
    /*Openning Hours*/

    .salon-main .op-hours {
        width: 245px;
        background-color: #bdbdbd;
        border-radius: 3px;
        padding: 8px;
        position: relative;
        font-size: 13px;
    }

        .salon-main .op-hours:before {
            position: absolute;
            top: 10px;
            left: 10px;
            z-index: 1;
            content: "";
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background-color: #eae5eb;
            -webkit-box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
            -moz-box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
            box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
        }

        .salon-main .op-hours:after {
            position: absolute;
            top: 10px;
            right: 10px;
            z-index: 1;
            content: "";
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background-color: #eae5eb;
            -webkit-box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
            -moz-box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
            box-shadow: inset 0px 0px 2px 1px rgba(0, 0, 0, 0.21);
        }

        .salon-main .op-hours h3 {
            margin: 5px 0 10px 0;
            text-transform: uppercase;
            font-size: 18px;
            font-weight: bold;
            color: #FFF;
            text-align: center;
        }

    .salon-main .op-hours-wrap {
        background-color: #909090;
        border-radius: 3px;
        padding: 8px 0px;
        color: #ffffff;
    }

    .salon-main .op-hours .day-row {
        height: 30px;
        padding: 0px 5px;
    }

        .salon-main .op-hours .day-row:nth-child(even) {
            background-color: #a9a9a9;
        }

        .salon-main .op-hours .day-row.today {
            background-color: #54535a;
            Color: #e7c5cb;
        }

        .salon-main .op-hours .day-row .open {
            display: inline-block;
        }

        .salon-main .op-hours .day-row .day,
        .op-hours .day-row .start-time,
        .op-hours .day-row .sep,
        .op-hours .day-row .end-time,
        .op-hours .day-row .closed {
            display: inline-block;
            padding: 6px 0px;
        }

        .salon-main .op-hours .day-row .day {
            width: 85px;
            text-transform: uppercase;
        }

        .salon-main .op-hours .day-row .start-time,
        .op-hours .day-row .end-time {
            width: 56px;
        }

        .salon-main .op-hours .day-row .sep {
            width: 12px;
            font-weight: bold;
        }

        .salon-main .op-hours .day-row .closed {
            text-align: center;
            text-transform: uppercase;
            color: #D04E45;
            font-weight: bold;
        }

@media (max-width: 767px) {
    .salon-main .op-hours {
        margin: 0 auto;
    }
}
/* Story Items*/

.salon-main .story {
    padding: 15px 0px;
    overflow: hidden;
    text-align: center;
}

    .salon-main .story .story-item {
        display: inline-block;
        width: 110px;
        height: 110px;
        border: 1px solid #b6b3d2;
        border-radius: 50%;
        margin: 8px 2%;
        padding: 5px;
        color: #b6b3d2;
        fill: #b6b3d2;
        text-align: center;
        cursor: pointer;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        -ms-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

        .salon-main .story .story-item .story-item-wrap {
            display: table-cell;
            vertical-align: middle;
            width: 100px;
            height: 100px;
            border-radius: 50%;
        }

            .salon-main .story .story-item .story-item-wrap h3 {
                font-size: 14px;
                text-transform: uppercase;
                margin: -6px 0 0 0px;
            }

        .salon-main .story .story-item:hover {
            border: 1px solid #b6b3d2;
            -webkit-transform: scale(1.1);
            -moz-transform: scale(1.1);
            -ms-transform: scale(1.1);
            -o-transform: scale(1.1);
            transform: scale(1.1);
        }

            .salon-main .story .story-item:hover .story-item-wrap {
                background: #b6b3d2;
                color: #ffffff;
                fill: #ffffff;
            }

@media (max-width: 991px) {
    .salon-main .story .story-item {
        width: 80px;
        height: 80px;
    }

        .salon-main .story .story-item .story-item-wrap {
            width: 80px;
            height: 72px;
        }

            .salon-main .story .story-item .story-item-wrap svg {
                zoom: 0.6;
            }

            .salon-main .story .story-item .story-item-wrap h3 {
                font-size: 12px;
                margin-top: 0px;
            }
}
/* Testimonial */

.salon-main .default-image img {
    width: 100%;
    height: auto;
}

.salon-main .testimonial .image {
    margin: 0 auto;
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 50%;
    border: 2px solid #cccccc;
}

    .salon-main .testimonial .image img {
        width: 147px;
        border-radius: 50%;
        border: 5px solid #ffffff;
    }

.salon-main .testimonial .comment {
    text-align: center;
    font-size: 16px;
    font-style: italic;
    margin-bottom: 0px;
}

    .salon-main .testimonial .comment i {
        color: #B9B9B9;
    }

.salon-main .testimonial .author {
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}

    .salon-main .testimonial .author span {
        font-size: 12px;
        font-weight: normal;
        color: #666666;
    }

.salon-main .testimonial .carousel-control {
    display: none;
}

.salon-main .testimonial .carousel-indicators {
    bottom: -20px;
}

    .salon-main .testimonial .carousel-indicators li {
        background-color: #b6b3d1;
    }

    .salon-main .testimonial .carousel-indicators .active {
        background-color: #b6b3d1;
    }
/***************************** Salon Services Section ******************************/

.salon-services {
    background-size: cover;
    background-position: top center;
    background-attachment: fixed;
    margin: 5px 0;
    text-align: center;
    overflow: hidden;
}

    .salon-services .salon-services-wrap {
        position: relative;
        padding: 100px 0px;
        background: rgba(0, 0, 0, 0.2) url(../img/pattern.png) center center repeat;
    }

        .salon-services .salon-services-wrap .services-list {
            padding: 30px 0px;
        }

@media (max-width: 767px) {
    .salon-services .salon-services-wrap {
        padding: 50px 0px;
    }

        .salon-services .salon-services-wrap .services-list {
            padding: 5px 0px;
        }
}
/***************************** Salon Products Section ******************************/

.salon-products {
    background-size: cover;
    background-position: top center;
    background-attachment: fixed;
    margin: 5px 0;
    text-align: center;
    overflow: hidden;
}

    .salon-products .salon-products-wrap {
        position: relative;
        padding: 100px 0px;
        background: rgba(0, 0, 0, 0.2) url(../img/pattern.png) center center repeat;
    }

        .salon-products .salon-products-wrap .products-list {
            padding: 30px 0px;
        }

@media (max-width: 767px) {
    .salon-products .salon-products-wrap {
        padding: 50px 0px;
    }

        .salon-products .salon-products-wrap .products-list {
            padding: 5px 0px;
        }
}
/***************************** Salon Promotions Section ******************************/

.salon-promotions {
    background-color: #ffffff;
    padding: 20px 0px 50px 0px;
    text-align: center;
}

    .salon-promotions .promotions-list {
        padding: 30px 0px 15px 0px;
    }

        .salon-promotions .promotions-list .promotions-item {
            border: 1px solid #cccccc;
            cursor: pointer;
            margin-bottom: 30px;
            overflow: hidden;
        }

            .salon-promotions .promotions-list .promotions-item .image {
                position: relative;
                height: 250px;
                background-repeat: no-repeat;
                background-size: cover;
                background-position: top center;
            }

                .salon-promotions .promotions-list .promotions-item .image:before {
                    content: "";
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    background: rgba(0, 0, 0, 0);
                    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
                    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.2)));
                    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
                    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
                    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
                    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
                    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
                }

            .salon-promotions .promotions-list .promotions-item:hover .image:before {
                background: rgba(0, 0, 0, 0.5);
                background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
                background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.5)));
                background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
                background: -o-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
                background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
                background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
                filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
            }

            .salon-promotions .promotions-list .promotions-item .image:after {
                content: "- View Details -";
                position: absolute;
                top: 50%;
                left: 50%;
                height: 30px;
                text-align: center;
                margin-left: -61px;
                margin-top: -300px;
                font-size: 18px;
                font-weight: bold;
                color: #ffffff;
                opacity: 0;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

            .salon-promotions .promotions-list .promotions-item:hover .image:after {
                margin-top: -10px;
                opacity: 1;
            }

            .salon-promotions .promotions-list .promotions-item .pro-rate {
                position: absolute;
                top: 201px;
                left: 50%;
                margin-left: -45px;
                height: 55px;
                width: 90px;
                padding: 8px 5px;
                color: #ffffff;
                font-size: 24px;
                font-weight: bold;
                border-radius: 90px 90px 0 0;
                -moz-border-radius: 90px 90px 0 0;
                -webkit-border-radius: 90px 90px 0 0;
                background: #747096;
                border: 5px solid #ffffff;
            }

            .salon-promotions .promotions-list .promotions-item .pro-title {
                display: table;
                width: 100%;
                height: 60px;
            }

                .salon-promotions .promotions-list .promotions-item .pro-title p {
                    display: table-cell;
                    vertical-align: middle;
                    font-size: 16px;
                    font-weight: bold;
                    margin: 0;
                    padding: 0 5px;
                }

@media (max-width: 767px) {
    .salon-promotions {
        padding: 50px 0px 50px 0px;
    }

        .salon-promotions .promotions-list {
            padding: 30px 0px 0px 0px;
        }
}
/***************************** Salon Team Section ******************************/

.salon-team {
    background-size: cover;
    background-position: top center;
    background-attachment: fixed;
    margin: 5px 0;
    text-align: center;
    overflow: hidden;
}

    .salon-team .salon-team-wrap {
        position: relative;
        padding: 100px 0px;
        background: rgba(0, 0, 0, 0.2) url(../img/pattern.png) center center repeat;
    }

        .salon-team .salon-team-wrap .team-slider {
            padding: 30px 0px;
        }

            .salon-team .salon-team-wrap .team-slider .flexslider {
                background-color: transparent;
            }

                .salon-team .salon-team-wrap .team-slider .flexslider li {
                    text-align: center;
                }

                    .salon-team .salon-team-wrap .team-slider .flexslider li img {
                        display: inline-block;
                        width: 220px;
                        height: 220px;
                        border-radius: 50%;
                        border: 5px solid #ffffff;
                    }

                    .salon-team .salon-team-wrap .team-slider .flexslider li h4 {
                        font-size: 24px;
                        font-weight: 100;
                        color: #ffffff;
                        margin-bottom: 5px;
                    }

                    .salon-team .salon-team-wrap .team-slider .flexslider li h5 {
                        font-size: 16px;
                        font-weight: bold;
                        color: #ffffff;
                        margin-top: 0px;
                    }

            .salon-team .salon-team-wrap .team-slider .flex-control-nav {
                display: none;
            }

            .salon-team .salon-team-wrap .team-slider .flex-direction-nav {
                display: none;
            }

@media (max-width: 767px) {
    .salon-team .salon-team-wrap {
        padding: 50px 0px;
    }

        .salon-team .salon-team-wrap .team-slider {
            padding: 5px 0px;
        }
}
/***************************** Salon Business Partners Section ******************************/

.salon-businessPartners {
    background-color: #ffffff;
    padding: 50px 0px;
    text-align: center;
}

    .salon-businessPartners marquee {
        margin-top: 30px;
    }

        .salon-businessPartners marquee img {
            height: 80px;
            width: auto;
            margin: 0px 15px;
        }

@media (max-width: 767px) {
    .salon-businessPartners {
        padding: 30px 0px;
    }

        .salon-businessPartners marquee {
            margin-top: 15px;
        }
}
/***************************** Salon Gallery Section ******************************/

.salon-gallery {
    background-color: #ffffff;
    padding: 0px;
    text-align: center;
}

    .salon-gallery .flexslider {
        margin-top: 30px;
    }

        .salon-gallery .flexslider .slides li {
            height: 300px;
            overflow: hidden;
        }

            .salon-gallery .flexslider .slides li .image {
                position: relative;
                width: 100%;
                height: 300px;
                background-repeat: no-repeat;
                background-size: cover;
                background-position: top center;
            }

                .salon-gallery .flexslider .slides li .image:before {
                    content: "";
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    background: rgba(0, 0, 0, 0.1);
                    pointer-events: none;
                    -webkit-transition: all .25s ease-out;
                    -moz-transition: all .25s ease-out;
                    -ms-transition: all .25s ease-out;
                    -o-transition: all .25s ease-out;
                    transition: all .25s ease-out;
                }

            .salon-gallery .flexslider .slides li:hover .image:before {
                background: rgba(0, 0, 0, 0.5);
            }

            .salon-gallery .flexslider .slides li .image:after {
                font-family: FontAwesome;
                content: "\f0b2";
                position: absolute;
                top: 50%;
                left: 50%;
                width: 50px;
                height: 50px;
                text-align: center;
                margin-left: -25px;
                margin-top: -25px;
                font-size: 40px;
                font-weight: bold;
                color: #ffffff;
                opacity: 0;
                pointer-events: none;
                -webkit-transition: all .25s ease-out;
                -moz-transition: all .25s ease-out;
                -ms-transition: all .25s ease-out;
                -o-transition: all .25s ease-out;
                transition: all .25s ease-out;
            }

            .salon-gallery .flexslider .slides li:hover .image:after {
                opacity: 1;
            }

            .salon-gallery .flexslider .slides li .image a {
                display: block;
                height: 300px;
            }

        .salon-gallery .flexslider .flex-control-nav {
            display: none;
        }

@media (max-width: 767px) {
    .salon-gallery .flexslider {
        margin-top: 15px;
    }

        .salon-gallery .flexslider .slides li {
            height: 200px;
        }

            .salon-gallery .flexslider .slides li .image {
                height: 200px;
            }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Story Pages Common *********************************************
#####################################################################################################
****************************************************************************************************/

.storytab {
    display: inline-block;
    border-bottom: 1px solid #C7BBCC;
    width: 100%;
    margin-top: 30px;
}

    .storytab > li {
        float: left;
        margin-bottom: -1px;
    }

        .storytab > li:nth-child(1) > a {
            margin-left: 15px;
        }

        .storytab > li > a {
            border: 1px solid #E4E4E4;
            border-bottom-color: #C7BBCC;
            border-radius: 0;
            background-color: #FFFFFF;
            color: #C7BBCC;
            font-size: 16px;
            font-weight: bold;
            line-height: 1.42857;
            margin-right: 15px;
            padding: 6px 20px;
            text-transform: uppercase;
            text-decoration: none;
            cursor: pointer;
            -moz-transition: all 0.3s linear;
            -webkit-transition: all 0.3s linear;
        }

            .storytab > li > a:focus,
            .storytab > li > a:hover {
                color: #8B7892;
                border: 1px solid #C7BBCC;
                border-bottom-color: #f3f3f3;
                background-color: #f3f3f3;
            }

        .storytab > li.active > a,
        .storytab > li.active > a:focus,
        .storytab > li.active > a:hover {
            color: #8B7892;
            border: 1px solid #C7BBCC;
            border-bottom-color: #f3f3f3;
            background-color: #f3f3f3;
            margin-top: -10px;
            padding-top: 11px;
            padding-bottom: 11px;
        }

.story-panel .panel {
    border: 1px solid #C7BBCC;
    background-color: transparent;
}

    .story-panel .panel .panel-heading {
        padding: 0px;
        background-color: #FFF;
    }

.story-panel .active .panel-heading {
    background-color: #8B7892;
    color: #FFF;
}

.story-panel .active .panel-body {
    background-color: transparent;
}

.story-panel .panel .panel-title button {
    font-size: 16px;
    font-weight: bold;
    line-height: 1.42857;
    text-transform: uppercase;
    text-decoration: none;
    border: none;
    background-color: transparent;
    padding: 10px 15px;
    width: 100%;
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon About Page *****************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-about-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-about-page .tab-content.storytab-content {
    padding-top: 25px;
    padding-bottom: 50px;
}

.salon-about-page .storytab-content h2 {
    font-size: 28px;
    font-weight: 300;
    color: #747096;
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Concept Page ***************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-concept-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-concept-page .tab-content.storytab-content {
    padding-top: 25px;
    padding-bottom: 50px;
}

.salon-concept-page .storytab-content h2 {
    font-size: 36px;
    text-transform: uppercase;
    color: #747096;
}

.salon-concept-page .concept p {
    font-size: 16px;
    font-style: italic;
    line-height: 22px;
    color: #666;
    margin: 0px 30px 10px 30px;
}

.salon-concept-page .concept span.quote-s {
    position: absolute;
    width: 25px;
    height: 25px;
    margin-left: -30px;
    margin-top: -5px;
    font-size: 24px;
    color: #999;
}

.salon-concept-page .concept span.quote-e {
    position: absolute;
    width: 25px;
    height: 25px;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 24px;
    color: #999;
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon History Page ************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-history-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-history-page .tab-content.storytab-content {
    padding-top: 25px;
    padding-bottom: 50px;
}

.salon-history-page .history-timeline {
    position: relative;
    margin: 0;
    padding: 0;
    width: 100%;
}

    .salon-history-page .history-timeline:before {
        content: "";
        position: absolute;
        top: 0px;
        bottom: 0px;
        left: 50%;
        margin-left: -1px;
        width: 2px;
        background-color: #cccccc;
    }

    .salon-history-page .history-timeline li {
        list-style: none;
        width: 100%;
        overflow: hidden;
    }

        .salon-history-page .history-timeline li:not(:first-child) {
            margin-top: -50px;
        }

        .salon-history-page .history-timeline li .history-item {
            position: relative;
            width: 50%;
        }

        .salon-history-page .history-timeline li:nth-child(2n) .history-item {
            float: left;
            padding: 1px 70px 1px 1px;
        }

        .salon-history-page .history-timeline li:nth-child(2n+1) .history-item {
            float: right;
            padding: 1px 1px 1px 70px;
        }

        .salon-history-page .history-timeline li:nth-child(2n) .history-item:after {
            content: "";
            position: absolute;
            right: 45px;
            top: 20px;
            width: 0px;
            height: 0px;
            border-top: 20px solid transparent;
            border-bottom: 20px solid transparent;
            border-left: 25px solid #999999;
            z-index: 2;
        }

        .salon-history-page .history-timeline li:nth-child(2n+1) .history-item:after {
            content: "";
            position: absolute;
            left: 45px;
            top: 20px;
            width: 0px;
            height: 0px;
            border-top: 20px solid transparent;
            border-bottom: 20px solid transparent;
            border-right: 25px solid #999999;
        }

        .salon-history-page .history-timeline li .history-item .history-date {
            position: absolute;
            top: 0;
            left: -40px;
            width: 80px;
            height: 80px;
            border-radius: 50%;
            background-color: #e7c5cb;
            color: #ffffff;
            text-align: center;
            padding: 12px 5px;
        }

        .salon-history-page .history-timeline li:nth-child(2n) .history-item .history-date {
            left: auto;
            right: -40px;
        }

        .salon-history-page .history-timeline li .history-item .history-date i {
            font-size: 20px;
            opacity: 0.4;
        }

        .salon-history-page .history-timeline li .history-item .history-date span {
            display: block;
            margin-top: 2px;
            font-weight: 500;
            font-size: 12px;
            line-height: 1;
            text-transform: uppercase;
        }

            .salon-history-page .history-timeline li .history-item .history-date span.year {
                font-weight: 300;
                font-size: 16px;
            }

        .salon-history-page .history-timeline li .history-item .history-item-inner {
            background: #d8d5ec;
            border: 5px solid #ffffff;
            -webkit-box-shadow: 0px 0px 0px 1px #999999;
            -moz-box-shadow: 0px 0px 0px 1px #999999;
            box-shadow: 0px 0px 0px 1px #999999;
            overflow: hidden;
        }

        .salon-history-page .history-timeline li .history-item .history-img {
            float: left;
            width: 50%;
            margin: 0 10px 0px 0;
        }

            .salon-history-page .history-timeline li .history-item .history-img img {
                width: 100%;
                height: auto;
            }

        .salon-history-page .history-timeline li .history-item .history-des {
            padding: 10px;
        }

@media (max-width: 991px) {
    .salon-history-page .history-timeline:before {
        left: 40px;
        margin-left: 0;
    }

    .salon-history-page .history-timeline li:not(:first-child) {
        margin-top: 15px;
    }

    .salon-history-page .history-timeline li .history-item {
        float: none !important;
        width: 100%;
        padding: 1px 1px 1px 110px !important;
    }

        .salon-history-page .history-timeline li .history-item .history-date {
            left: 0px !important;
        }

        .salon-history-page .history-timeline li .history-item:after {
            left: 85px !important;
            border-right: 25px solid #999999 !important;
            border-left: none !important;
        }
}

@media (max-width: 499px) {
    .salon-history-page .history-timeline:before {
        left: 50%;
        margin-left: -1px;
    }

    .salon-history-page .history-timeline li .history-item {
        padding: 40px 1px 1px 1px !important;
    }

        .salon-history-page .history-timeline li .history-item .history-date {
            left: 50% !important;
            margin-left: -40px;
        }

        .salon-history-page .history-timeline li .history-item:after {
            display: none;
        }

        .salon-history-page .history-timeline li .history-item .history-item-inner {
            border: 0px solid #ffffff;
        }

        .salon-history-page .history-timeline li .history-item .history-img {
            float: none;
            width: 100%;
            margin: 0px;
        }

        .salon-history-page .history-timeline li .history-item .history-des {
            text-align: center;
        }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Event Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-event-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-event-page .tab-content.storytab-content {
    padding-top: 25px;
    padding-bottom: 50px;
}

.salon-event-page .storytab-content h2 {
    font-size: 28px;
    font-weight: 300;
    color: #747096;
}

.salon-event-page .event-item {
    margin-top: 25px;
}

.salon-event-page .data-list {
    list-style: outside none none;
    margin-bottom: 0;
    margin-top: 15px;
    padding-left: 0;
}

    .salon-event-page .data-list > li > .data-icon {
        color: #999999;
        width: 20px;
    }

    .salon-event-page .data-list > li > .data-item {
        color: #888888;
    }

    .salon-event-page .data-list.inline > li {
        display: inline-block;
    }

        .salon-event-page .data-list.inline > li:not(:last-child) {
            margin-right: 25px;
        }
/****************************************************************************************************
#####################################################################################################
****************************** Salon Event Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-review-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-review-page .reviews {
    margin-bottom: 30px;
    padding: 20px;
}

    .salon-review-page .reviews .image {
        height: 160px;
        width: 160px;
        border: 5px solid #FFF;
        border-radius: 50%;
        overflow: hidden;
    }

        .salon-review-page .reviews .image img {
            height: 160px;
            width: auto;
        }

    .salon-review-page .reviews blockquote {
        border: 1px solid #cccccc;
        border-radius: 10px;
        padding: 20px;
        text-align: left;
        margin-top: 30px;
    }

    .salon-review-page .reviews:not(.reviews-inverted) blockquote:before {
        content: "";
        width: 0;
        height: 0;
        border-top: 26px solid transparent;
        border-right: 26px solid #cccccc;
        border-bottom: 26px solid transparent;
        position: absolute;
        left: -10px;
        top: 50px;
        z-index: 1;
    }

    .salon-review-page .reviews:not(.reviews-inverted) blockquote:after {
        content: "";
        width: 0;
        height: 0;
        border-top: 25px solid transparent;
        border-right: 25px solid #FFF;
        border-bottom: 25px solid transparent;
        position: absolute;
        left: -8px;
        top: 51px;
        z-index: 2;
    }

    .salon-review-page .reviews.reviews-inverted blockquote {
        text-align: right;
    }

        .salon-review-page .reviews.reviews-inverted blockquote:before {
            content: "";
            width: 0;
            height: 0;
            border-top: 26px solid transparent;
            border-left: 26px solid #cccccc;
            border-bottom: 26px solid transparent;
            position: absolute;
            right: -10px;
            top: 50px;
            z-index: 1;
        }

        .salon-review-page .reviews.reviews-inverted blockquote:after {
            content: "";
            width: 0;
            height: 0;
            border-top: 25px solid transparent;
            border-left: 25px solid #FFF;
            border-bottom: 25px solid transparent;
            position: absolute;
            right: -8px;
            top: 51px;
            z-index: 2;
        }

    .salon-review-page .reviews blockquote .cite {
        background-color: #E2DBE4;
        padding: 10px;
        font-size: 14px;
    }

        .salon-review-page .reviews blockquote .cite i {
            padding: 0 2px;
        }

        .salon-review-page .reviews blockquote .cite .like {
            color: green;
        }

        .salon-review-page .reviews blockquote .cite .dislike {
            color: red;
        }

        .salon-review-page .reviews blockquote .cite span {
            padding: 0px 10px;
            border-right: 1px solid #666;
        }

            .salon-review-page .reviews blockquote .cite span:last-child {
                border-right: none;
            }

@media (max-width: 991px) {
    .salon-review-page .reviews:not(.reviews-inverted) blockquote:before {
        display: none;
    }

    .salon-review-page .reviews:not(.reviews-inverted) blockquote:after {
        display: none;
    }

    .salon-review-page .reviews.reviews-inverted blockquote:before {
        display: none;
    }

    .salon-review-page .reviews.reviews-inverted blockquote:after {
        display: none;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon News Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-news-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-news-page .tab-content.storytab-content {
    padding-top: 25px;
    padding-bottom: 50px;
}

.salon-news-page .storytab-content h2 {
    font-size: 28px;
    font-weight: 300;
    color: #747096;
}

.salon-news-page .news-item {
    margin-top: 25px;
}
/****************************************************************************************************
#####################################################################################################
****************************** Signup Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.signup .header-img {
    background-image: url("../img/banner/sign_up_2.jpg") !important;
}

.inner-page.signup .signup-content {
    padding-bottom: 30px;
}

    .inner-page.signup .signup-content .form-wrap {
        margin-top: 30px;
    }

/****************************************************************************************************
#####################################################################################################
****************************** Reset Password Page **************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.resetpass .header-img {
    background-image: url("../img/banner/sign_up_2.jpg") !important;
}

.inner-page.resetpass .resetpass-content {
    border: 1px solid #cccccc;
    padding: 15px;
    margin-bottom: 50px;
}

    .inner-page.resetpass .resetpass-content .popup-message {
        margin-bottom: 15px;
    }

/****************************************************************************************************
#####################################################################################################
****************************** Join Our Network Page ************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.join-network .header-img {
    background-image: url("../img/banner/sign_up.jpg") !important;
}

.inner-page.join-network {
    padding-bottom: 30px;
}

    .inner-page.join-network .form-wrap {
        margin-top: 30px;
    }
    /* Breadcrump */

    .inner-page.join-network .j-breadcrump {
        background-color: #fcfcfc;
        border: 1px solid rgba(0, 0, 0, 0.05);
        counter-reset: list;
        display: inline-block;
        list-style: outside none none;
        margin-bottom: 25px;
        margin-top: 15px;
        padding: 15px;
        position: relative;
        width: 100%;
    }

        .inner-page.join-network .j-breadcrump > li {
            color: #aaaaaa;
            display: inline-block;
            font-size: 15px;
            font-weight: 300;
        }

            .inner-page.join-network .j-breadcrump > li:not(:last-child) {
                margin-right: 15px;
            }

                .inner-page.join-network .j-breadcrump > li:not(:last-child)::after {
                    content: "";
                    font-family: FontAwesome;
                    margin-left: 15px;
                }

            .inner-page.join-network .j-breadcrump > li::before {
                content: counter(list, decimal);
                counter-increment: list;
                margin-right: 3px;
            }

            .inner-page.join-network .j-breadcrump > li.current {
                color: #000000;
                font-weight: 500;
            }

            .inner-page.join-network .j-breadcrump > li:not(.current) {
                cursor: pointer;
            }

@media (max-width: 1199px) {
    .inner-page.join-network .j-breadcrump > li {
        font-size: 14px;
    }

        .inner-page.join-network .j-breadcrump > li:not(:last-child) {
            margin-right: 5px;
        }

            .inner-page.join-network .j-breadcrump > li:not(:last-child)::after {
                margin-left: 5px;
            }
}
/* Sections & Pannels */

.inner-page.join-network #loginSection {
    position: relative;
    height: 100%;
    overflow: hidden;
}

    .inner-page.join-network #loginSection .j-left-panel {
        padding-left: 35px;
    }

    .inner-page.join-network #loginSection .j-right-panel {
        padding-right: 35px;
    }

@media (max-width: 991px) {
    .inner-page.join-network #loginSection .j-left-panel {
        padding-left: 0px;
    }

    .inner-page.join-network #loginSection .j-right-panel {
        padding-right: 0px;
    }
}
/* Divider */

.inner-page.join-network .or-divider {
    position: relative;
}

    .inner-page.join-network .or-divider > label {
        border: 1px solid #ccc;
        border-radius: 500px;
        color: #ccc;
        font-size: 18px;
        height: 35px;
        line-height: 32px;
        text-align: center;
        width: 35px;
        font-weight: 100;
        margin: 0;
    }

    .inner-page.join-network .or-divider.divider-hr {
        text-align: center;
        margin-top: 25px;
        margin-bottom: 25px;
        overflow: hidden;
    }

        .inner-page.join-network .or-divider.divider-hr::before,
        .inner-page.join-network .or-divider.divider-hr::after {
            background-color: #ccc;
            content: "";
            display: inline-block;
            height: 1px;
            position: absolute;
            width: 50%;
            top: 50%;
            margin-top: -1px;
        }

        .inner-page.join-network .or-divider.divider-hr::before {
            left: -17px;
        }

        .inner-page.join-network .or-divider.divider-hr::after {
            right: -17px;
        }

    .inner-page.join-network .or-divider.divider-vt {
        width: 35px;
        height: 100%;
    }

        .inner-page.join-network .or-divider.divider-vt::before,
        .inner-page.join-network .or-divider.divider-vt::after {
            content: "";
            position: absolute;
            width: 1px;
            background-color: #ccc;
            height: 50%;
            left: 50%;
        }

        .inner-page.join-network .or-divider.divider-vt::before {
            top: -17px;
            height: 20%;
        }

        .inner-page.join-network .or-divider.divider-vt::after {
            bottom: -17px;
            height: 80%;
        }

    .inner-page.join-network .or-divider#login-register {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 50%;
        z-index: 99;
        margin-left: -17px;
    }

    .inner-page.join-network .or-divider.divider-vt > label {
        position: absolute;
        top: 20%;
        margin-top: -17px;
    }

.inner-page.join-network #commonLoginBox2 .btn {
    white-space: normal;
}
/* Profile */

.inner-page.join-network .j-profile-area {
    margin: 25px 0px;
    overflow: hidden;
    position: relative;
    background-color: #f3f3f3;
    border: 1px solid #cccccc;
    padding: 15px;
}

    .inner-page.join-network .j-profile-area .image img {
        width: 100%;
        height: auto;
    }

    .inner-page.join-network .j-profile-area h4.name {
        font-size: 20px;
        font-weight: 300;
    }

    .inner-page.join-network .j-profile-area p.email {
        color: #999999;
        font-size: 12px;
        word-wrap: break-word;
    }

    .inner-page.join-network .j-profile-area h5 {
        border-top: 1px solid rgba(0, 0, 0, 0.05);
        display: block;
        margin-top: 15px;
        margin-bottom: 0px;
        padding-top: 10px;
    }

.inner-page.join-network .branches {
    color: #888888;
    font-size: 14px;
    list-style: outside none none;
    margin-bottom: 0;
    padding-left: 20px;
}

    .inner-page.join-network .branches > li:not(:last-child) > a {
        border-bottom: 1px solid #eeeeee;
    }

    .inner-page.join-network .branches > li > a {
        display: block;
        padding: 10px 5px;
        position: relative;
    }

        .inner-page.join-network .branches > li > a::before {
            content: "\f1ad";
            font-family: FontAwesome;
            left: 0;
            margin-left: -20px;
            margin-right: 15px;
            position: absolute;
        }

        .inner-page.join-network .branches > li > a:hover {
            background-color: #f9f9f9;
        }
/* Common */

.inner-page.join-network .image-upload-box {
    position: relative;
    width: 100%;
    min-height: 174px;
    height: auto;
    z-index: 1;
    cursor: pointer;
}

    .inner-page.join-network .image-upload-box input {
        width: 100%;
        opacity: 0;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        text-indent: -9999px;
        font-size: 0;
        z-index: 100;
        cursor: pointer;
    }

.inner-page.join-network .image-preview-inner {
    width: 100%;
    min-height: 174px;
    height: auto;
    display: table;
    vertical-align: middle;
    text-align: center;
    border: 1px solid #ccc;
    border-radius: 5px;
    overflow: hidden;
}

    .inner-page.join-network .image-preview-inner p {
        margin: 0;
        display: table-cell;
        vertical-align: middle;
    }

    .inner-page.join-network .image-preview-inner img {
        width: 220px;
        margin: 5px;
    }

    .inner-page.join-network .image-preview-inner.full-width img,
    .inner-page.join-network .image-preview-inner.full-width video {
        width: 100%;
        margin: 0;
    }
/* Map */

.inner-page.join-network .mapSearchBox {
    font-size: 14px;
    left: 15% !important;
    margin: 10px;
    padding: 3px 8px;
    width: 30%;
    border-radius: 4px;
}
/* More Details */

.inner-page.join-network #branchRegModalStep3 .btn-add {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    background-color: #e0e0e0;
    border: 1px solid #cccccc;
    border-radius: 5px;
    height: 114px;
    width: 114px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 15px 5px;
    cursor: pointer;
}

    .inner-page.join-network #branchRegModalStep3 .btn-add i {
        display: block;
        font-size: 60px;
    }

    .inner-page.join-network #branchRegModalStep3 .btn-add > input[type=file] {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        cursor: pointer;
        filter: alpha(opacity=0);
        opacity: 0;
    }

    .inner-page.join-network #branchRegModalStep3 .btn-add + label {
        display: inline-block;
        vertical-align: middle;
        word-wrap: break-word;
        max-width: 160px;
        padding-left: 15px;
        color: #888;
        font-weight: 500;
    }
/* Image Gallery */

.inner-page.join-network .gallery {
    padding: 0;
    margin: 5px 0 15px 0;
}

    .inner-page.join-network .gallery .img-wrap {
        padding: 0;
        margin: 5px 0 15px 0;
    }

.inner-page.join-network .btn-upload {
    position: relative;
}

    .inner-page.join-network .btn-upload > input[type=file] {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        cursor: pointer;
        filter: alpha(opacity=0);
        opacity: 0;
    }

.inner-page.join-network .gallery .img-wrap .img-add,
.inner-page.join-network .gallery .img-wrap .img-tile {
    position: relative;
    display: inline-block;
    vertical-align: top;
    width: 130px;
    height: 130px;
    margin: 5px;
    border-radius: 5px;
}

.inner-page.join-network .gallery .img-wrap .img-add {
    background-color: #e0e0e0;
    border: 1px solid #cccccc;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    padding: 20px 5px;
    cursor: pointer;
}

    .inner-page.join-network .gallery .img-wrap .img-add i {
        display: block;
        font-size: 60px;
    }

.inner-page.join-network .gallery .img-wrap .img-tile {
    overflow: hidden;
}

    .inner-page.join-network .gallery .img-wrap .img-tile img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }

    .inner-page.join-network .gallery .img-wrap .img-tile button {
        position: absolute;
        border: none;
        bottom: 5px;
        right: 5px;
        background: rgba(0, 0, 0, 0.7);
        padding: 4px;
        height: 25px;
        width: 25px;
        color: #ffffff;
    }

        .inner-page.join-network .gallery .img-wrap .img-tile button.edit {
            right: 35px;
        }

            .inner-page.join-network .gallery .img-wrap .img-tile button.edit:hover {
                background: rgba(255, 255, 255, 0.7);
                color: #000000;
            }

        .inner-page.join-network .gallery .img-wrap .img-tile button.delete:hover {
            background: rgba(232, 76, 76, 0.7);
            color: #000000;
        }

    .inner-page.join-network .gallery .img-wrap .img-tile .album-name {
        position: absolute;
        left: 0;
        right: 0;
        padding: 5px;
        text-align: center;
        color: #ffffff;
        font-size: 14px;
        background: rgba(0, 0, 0, 0.5);
    }
/* Popups */

.j-gal-img-delete {
    text-align: center;
}

    .j-gal-img-delete i {
        font-size: 80px;
        color: #999999;
    }
/****************************************************************************************************
#####################################################################################################
****************************** Registration End Page ************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.registration-end .header-img {
    background-image: url("../img/banner/thank_you.jpg") !important;
}
/* Profile */

.inner-page.registration-end .j-left-panel {
    margin-bottom: 30px;
}

.inner-page.registration-end .j-profile-area {
    margin: 0px 0px 15px 0px;
    overflow: hidden;
    position: relative;
    background-color: #f3f3f3;
    border: 1px solid #cccccc;
    padding: 15px;
}

    .inner-page.registration-end .j-profile-area .image img {
        width: 100%;
        height: auto;
    }

    .inner-page.registration-end .j-profile-area h4.name {
        font-size: 20px;
        font-weight: 300;
    }

    .inner-page.registration-end .j-profile-area p.email {
        color: #999999;
        font-size: 12px;
        line-height: 1;
        word-wrap: break-word;
    }

    .inner-page.registration-end .j-profile-area h5 {
        border-top: 1px solid rgba(0, 0, 0, 0.05);
        display: block;
        margin-top: 15px;
        margin-bottom: 0px;
        padding-top: 10px;
    }

.inner-page.registration-end .branches {
    color: #888888;
    font-size: 12px;
    list-style: outside none none;
    margin-bottom: 0;
    padding-left: 20px;
}

    .inner-page.registration-end .branches > li:not(:last-child) > a {
        border-bottom: 1px solid #eeeeee;
    }

    .inner-page.registration-end .branches > li > a {
        display: block;
        padding: 10px 5px;
        position: relative;
    }

        .inner-page.registration-end .branches > li > a::before {
            content: "\f1ad";
            font-family: FontAwesome;
            left: 0;
            margin-left: -20px;
            margin-right: 15px;
            position: absolute;
        }

        .inner-page.registration-end .branches > li > a:hover {
            background-color: #f9f9f9;
        }

.inner-page.registration-end .panel-group .panel {
    border-radius: 0px;
}

.inner-page.registration-end .panel-default > .panel-heading {
    background-color: #f3f3f3;
    border-color: #cccccc;
    color: #747096;
}

.inner-page.registration-end .thnk-msg {
    margin-bottom: 30px;
    border-bottom: 5px solid #cccccc;
    overflow: hidden;
}

.inner-page.registration-end .feature-box {
    background-color: #ffffff;
    border-radius: 3px;
    border: 1px solid #cccccc;
    padding: 15px;
    height: 100%;
}

@media (min-width: 768px) {
    .inner-page.registration-end .features-box-wrp-tbl {
        border-collapse: separate;
        border-spacing: 0 35px;
        display: table;
        height: 100%;
        width: 100%;
    }

    .inner-page.registration-end .features-box-wrp .row {
        display: table-row;
    }

        .inner-page.registration-end .features-box-wrp .row [class*="col-"] {
            display: table-cell;
            float: none;
            height: 100%;
        }
}

.inner-page.registration-end .feature-ico {
    background-color: #d8b2b9;
    border-radius: 50%;
    height: 65px;
    margin-bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    padding: 15px;
    text-align: center;
    width: 65px;
}

.inner-page.registration-end .feature-box .feature-header {
    color: #000000;
    font-weight: 300;
    margin-bottom: 15px;
    text-align: center;
}

.inner-page.registration-end .feature-box .feature-desc {
    color: #888888;
    line-height: 1.8;
}

.inner-page.registration-end .panel-group .panel + .panel {
    margin-top: 15px;
}

.inner-page.registration-end .ico-btn > i {
    margin-right: 5px;
}

.inner-page.registration-end .thnk-msg .btn {
    margin-bottom: 15px;
}

.inner-page.registration-end .thnk-msg img {
    width: 100%;
    margin-bottom: 15px;
}

@media (max-width: 767px) {
    .inner-page.registration-end .thnk-msg {
        text-align: center;
    }

    .inner-page.registration-end .feature-box {
        margin-bottom: 15px;
    }

    .inner-page.registration-end .thnk-msg img {
        width: 150px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** My Account Page ******************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.my-account .header-img {
    background-image: url("../img/banner/my-account.jpg") !important;
    background-position: center 50% !important;
}

.inner-page.my-account .user {
    display: table;
    width: 100%;
    position: relative;
    padding: 15px 0;
}

    .inner-page.my-account .user .image {
        display: table-cell;
        vertical-align: middle;
        width: 95px;
        height: 95px;
        border: 5px solid #ffffff;
    }

        .inner-page.my-account .user .image img {
            width: 85px;
            height: 85px;
            object-fit: cover;
        }

    .inner-page.my-account .user .name {
        display: table-cell;
        vertical-align: middle;
        text-align: left;
        padding-left: 15px;
    }

        .inner-page.my-account .user .name h2 {
            font-size: 30px;
            font-weight: 300;
            color: #ffffff;
            margin: 0px;
        }

@media (max-width: 767px) {
    .inner-page.my-account .user .name h2 {
        font-size: 24px;
    }
}
/* Tabs */

.inner-page.my-account .ma-tabs {
    margin-top: -20px;
}

    .inner-page.my-account .ma-tabs .nav-tabs {
        padding: 0px;
        border-top: 20px solid #ffffff;
        border-bottom: 20px solid #ffffff;
        background-color: #dddddd;
    }

        .inner-page.my-account .ma-tabs .nav-tabs > li {
            margin-bottom: 0;
        }

            .inner-page.my-account .ma-tabs .nav-tabs > li > a {
                position: relative;
                border-radius: 0 !important;
                border: none !important;
                background-color: transparent;
                color: #000000;
                font-size: 16px;
                font-weight: 300;
                text-transform: uppercase;
                margin: 0;
            }

                .inner-page.my-account .ma-tabs .nav-tabs > li > a:hover,
                .inner-page.my-account .ma-tabs .nav-tabs > li > a:focus {
                    background-color: #d0d0d0;
                }

            .inner-page.my-account .ma-tabs .nav-tabs > li.active > a,
            .inner-page.my-account .ma-tabs .nav-tabs > li.active > a:focus,
            .inner-page.my-account .ma-tabs .nav-tabs > li.active > a:hover {
                color: #ffffff;
                cursor: default;
                background-color: #747096;
                border: none;
            }

                .inner-page.my-account .ma-tabs .nav-tabs > li.active > a:after {
                    content: "";
                    position: absolute;
                    bottom: -10px;
                    left: 50%;
                    margin-left: -10px;
                    border-top: 10px solid #747096;
                    border-left: 10px solid transparent;
                    border-right: 10px solid transparent;
                }

@media (max-width: 767px) {
    .inner-page.my-account .ma-tabs h2 {
        float: none !important;
        margin-top: 10px !important;
        margin-bottom: 15px !important;
        text-align: center;
    }

    .inner-page.my-account .ma-tabs .nav-tabs {
        padding: 0px;
        border-top: 10px solid #ffffff;
        border-bottom: 10px solid #ffffff;
        background-color: #dddddd;
    }

        .inner-page.my-account .ma-tabs .nav-tabs > li > a {
            font-size: 14px;
            padding: 8px;
        }
}
/* Headers */

.inner-page.my-account .header {
    overflow: hidden;
}

    .inner-page.my-account .header .btn-group {
        margin-top: 15px;
    }

    .inner-page.my-account .header h2 {
        margin-top: 15px;
        margin-bottom: 20px;
    }

.inner-page.my-account .btn-default.active,
.inner-page.my-account .btn-default.active:hover,
.inner-page.my-account .btn-default.active:focus {
    background-color: #333333;
    color: #ffffff;
    cursor: default;
}

@media (max-width: 767px) {
    .inner-page.my-account .header {
        text-align: center;
    }

        .inner-page.my-account .header .btn-group {
            margin-top: 5px;
            float: none !important;
        }

            .inner-page.my-account .header .btn-group .btn {
                padding: 3px 6px;
            }
}
/* Filters */

.inner-page.my-account .filters {
    padding: 15px 10px;
    background-color: #f3f3f3;
    margin-bottom: 15px;
    border: 2px solid #dddddd;
}

@media (max-width: 767px) {
    .inner-page.my-account .filters {
        margin-top: 15px;
    }
}
/* DataList */
.inner-page.my-account .datalist .panel-group .panel {
    border-radius: 0px;
}

    .inner-page.my-account .datalist .panel-group .panel.acc-title {
        border: none;
        pointer-events: none;
    }

.inner-page.my-account .datalist .panel-default > .panel-heading {
    position: relative;
    padding: 0;
    min-height: 36px;
    background: transparent;
}

.inner-page.my-account .datalist .panel-default:not(.acc-title) > .panel-heading .panel-title > a {
    font-weight: normal;
}

.inner-page.my-account .datalist .panel-default > .panel-heading .panel-title > a {
    font-size: 14px;
    font-weight: 700;
}

    .inner-page.my-account .datalist .panel-default > .panel-heading .panel-title > a:focus,
    .inner-page.my-account .datalist .panel-default > .panel-heading .panel-title > a:hover {
        color: #333333;
        text-decoration: none;
    }

.inner-page.my-account .datalist .acc-heading {
    display: table;
    width: 100%;
    padding: 5px 10px;
    min-height: 36px;
}

.inner-page.my-account .datalist .panel:not(.acc-title) .acc-heading {
    background-color: #f5f5f5;
}

.inner-page.my-account .datalist .panel:not(.acc-title) .acc-heading:hover,
.inner-page.my-account .datalist .panel:not(.acc-title) .acc-heading:focus,
.inner-page.my-account .datalist .panel-default.panel-open .acc-heading {
    background-color: #dddddd;
}
.inner-page.my-account .datalist .panel:not(.acc-title) .acc-heading.promotion-code-booking {
    background-color: #ffd0d0 !important;
}

.inner-page.my-account .datalist .acc-heading i.indt {
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -10px;
    font-size: 20px;
    opacity: 0.5;
    pointer-events: none;
}

.inner-page.my-account .datalist .acc-heading ul {
    display: table-cell;
    vertical-align: middle;
    padding: 0 0 0 30px;
    margin: 0;
}

    .inner-page.my-account .datalist .acc-heading ul li {
        list-style: none;
        display: inline-block;
        vertical-align: middle;
        margin-left: -3px;
        padding-right: 15px;
    }

.inner-page.my-account .datalist .acc-heading button {
    padding: 2px 10px;
}

    .inner-page.my-account .datalist .acc-heading button.delete,
    .inner-page.my-account .datalist .acc-heading button.delete:hover,
    .inner-page.my-account .datalist .acc-heading button.delete:focus {
        color: #db4437;
    }

.inner-page.my-account .datalist .panel-body {
    padding: 0;
}

.inner-page.my-account .datalist .acc-body {
    padding: 15px;
}

@media (max-width: 767px) {
    .inner-page.my-account .datalist .acc-heading button {
        padding: 2px 5px;
    }
}
/* Bookings */

.inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(1) {
    width: 10%;
}

.inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(2) {
    width: 10%;
}

.inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(3) {
    width: 35%;
}

.inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(4) {
    width: 35%;
}

.inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(5) {
    width: 10%;
    text-align: right;
    padding-right: 0px;
}

.inner-page.my-account .bookings .datalist .acc-body .booking-details {
    margin: 0;
    padding: 0;
}

    .inner-page.my-account .bookings .datalist .acc-body .booking-details li {
        position: relative;
        list-style: none;
        padding: 0 0 10px 10px;
    }

        .inner-page.my-account .bookings .datalist .acc-body .booking-details li:before {
            font-family: FontAwesome;
            content: "\f0da";
            position: absolute;
            top: 0;
            left: 0;
        }

@media (max-width: 991px) {
    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(1) {
        width: 40%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(2) {
        width: 40%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(3) {
        width: 0%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(4) {
        width: 0%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(5) {
        width: 20%;
    }
}

@media (max-width: 767px) {
    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(1) {
        width: 38%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(2) {
        width: 38%;
    }

    .inner-page.my-account .bookings .datalist .acc-heading ul li:nth-child(5) {
        width: 24%;
    }
}
/* Reviews */

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(1) {
    width: 15%;
}

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(2) {
    width: 23%;
}

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(3) {
    width: 15%;
}

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(4) {
    width: 25%;
}

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(5) {
    width: 12%;
}

.inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(6) {
    width: 10%;
    text-align: right;
    padding-right: 0px;
}

.inner-page.my-account .reviews .star-rate {
    pointer-events: none;
}

.inner-page.my-account .reviews .datalist .acc-body .review-details {
    margin: 0;
    padding: 0;
}

    .inner-page.my-account .reviews .datalist .acc-body .review-details li {
        position: relative;
        list-style: none;
        padding: 0 0 10px 10px;
    }

        .inner-page.my-account .reviews .datalist .acc-body .review-details li:before {
            font-family: FontAwesome;
            content: "\f0da";
            position: absolute;
            top: 0;
            left: 0;
        }

@media (max-width: 991px) {
    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(1) {
        width: 40%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(2) {
        width: 40%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(3) {
        width: 0%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(4) {
        width: 0%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(5) {
        width: 0%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(6) {
        width: 20%;
    }
}

@media (max-width: 767px) {
    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(1) {
        width: 38%;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(2) {
        width: 38%;
        white-space: nowrap;
    }

    .inner-page.my-account .reviews .datalist .acc-heading ul li:nth-child(6) {
        width: 24%;
    }
}
/* Settings */

.inner-page.my-account .settings .panel-default {
    border: 2px solid #dddddd;
    border-radius: 0;
}

.inner-page.my-account .settings .proflie-image {
    position: relative;
}

    .inner-page.my-account .settings .proflie-image img {
        width: 100%;
        height: auto;
    }

    .inner-page.my-account .settings .proflie-image button {
        position: absolute;
        left: 5px;
        bottom: 5px;
        opacity: 0.8;
    }

.inner-page.my-account .settings .form-group {
    position: relative;
}

.inner-page.my-account .settings .panel .form-group .form-control {
    border: 1px solid #F3D6FF;
    padding: 0 0 0 28px;
    font-size: 14px;
    color: #412e48;
}

.inner-page.my-account .settings .form-group .input-ico {
    color: #B9ABBD;
    font-size: 17px;
    left: 8px;
    top: 33px;
    position: absolute;
}

.inner-page.my-account .settings .form-control[disabled] {
    background-color: #FBF0FF;
}


/****************************************************************************************************
#####################################################################################################
****************************** License Page *********************************************************
#####################################################################################################
****************************************************************************************************/
.inner-page.license .header-img {
    background-image: url("../img/banner/my-account.jpg") !important;
    background-position: center 50% !important;
}

.inner-page.license .user {
    display: table;
    width: 100%;
    position: relative;
    padding: 15px 0;
}

    .inner-page.license .user .image {
        display: table-cell;
        vertical-align: middle;
        width: 95px;
        height: 95px;
        border: 5px solid #ffffff;
    }

        .inner-page.license .user .image img {
            width: 85px;
            height: 85px;
            object-fit: cover;
        }

    .inner-page.license .user .name {
        display: table-cell;
        vertical-align: middle;
        text-align: left;
        padding-left: 15px;
    }

        .inner-page.license .user .name h3 {
            font-size: 26px;
            font-weight: 300;
            color: #ffffff;
            margin: 0px;
        }

        .inner-page.license .user .name p {
            font-size: 14px;
            color: #ffffff;
            margin: 0px;
        }

@media (max-width: 767px) {
    .inner-page.license .user .name h2 {
        font-size: 24px;
    }
}
/* Tabs */
.inner-page.license .ma-tabs {
    margin-top: -20px;
}

    .inner-page.license .ma-tabs .nav-tabs {
        padding: 0px;
        border-top: 20px solid #ffffff;
        border-bottom: 20px solid #ffffff;
        background-color: #dddddd;
    }

        .inner-page.license .ma-tabs .nav-tabs > li {
            margin-bottom: 0;
        }

            .inner-page.license .ma-tabs .nav-tabs > li > a {
                position: relative;
                border-radius: 0 !important;
                border: none !important;
                background-color: transparent;
                color: #000000;
                font-size: 16px;
                font-weight: 300;
                text-transform: uppercase;
                margin: 0;
            }

                .inner-page.license .ma-tabs .nav-tabs > li > a:hover,
                .inner-page.license .ma-tabs .nav-tabs > li > a:focus {
                    background-color: #d0d0d0;
                }

            .inner-page.license .ma-tabs .nav-tabs > li.active > a,
            .inner-page.license .ma-tabs .nav-tabs > li.active > a:focus,
            .inner-page.license .ma-tabs .nav-tabs > li.active > a:hover {
                color: #ffffff;
                cursor: default;
                background-color: #6A5671;
                border: none;
            }

                .inner-page.license .ma-tabs .nav-tabs > li.active > a:after {
                    content: "";
                    position: absolute;
                    bottom: -10px;
                    left: 50%;
                    margin-left: -10px;
                    border-top: 10px solid #6A5671;
                    border-left: 10px solid transparent;
                    border-right: 10px solid transparent;
                }

@media (max-width: 767px) {
    .inner-page.license .ma-tabs h2 {
        float: none !important;
        margin-top: 10px !important;
        margin-bottom: 15px !important;
        text-align: center;
    }

    .inner-page.license .ma-tabs .nav-tabs {
        padding: 0px;
        border-top: 10px solid #ffffff;
        border-bottom: 10px solid #ffffff;
        background-color: #dddddd;
    }

        .inner-page.license .ma-tabs .nav-tabs > li > a {
            font-size: 14px;
            padding: 8px;
        }
}
/* Filters */
.inner-page.license .filters {
    padding: 15px 0px;
}
/* DataList */
.inner-page.license .datalist .panel-group .panel {
    border-radius: 0px;
}

    .inner-page.license .datalist .panel-group .panel.acc-title {
        border: none;
        pointer-events: none;
    }

.inner-page.license .datalist .panel-default > .panel-heading {
    position: relative;
    padding: 0;
    min-height: 36px;
    background: transparent;
}

.inner-page.license .datalist .panel-default:not(.acc-title) > .panel-heading .panel-title > a {
    font-weight: normal;
}

.inner-page.license .datalist .panel-default > .panel-heading .panel-title > a {
    font-size: 14px;
    font-weight: 700;
}

    .inner-page.license .datalist .panel-default > .panel-heading .panel-title > a:focus,
    .inner-page.license .datalist .panel-default > .panel-heading .panel-title > a:hover {
        color: #333333;
        text-decoration: none;
    }

.inner-page.license .datalist .acc-heading {
    display: table;
    width: 100%;
    padding: 5px 10px;
    min-height: 36px;
}

.inner-page.license .datalist .panel:not(.acc-title) .acc-heading {
    background-color: #f5f5f5;
}

    .inner-page.license .datalist .panel:not(.acc-title) .acc-heading:hover,
    .inner-page.license .datalist .panel:not(.acc-title) .acc-heading:focus,
    .inner-page.license .datalist .panel-default.panel-open .acc-heading {
        background-color: #dddddd;
    }

.inner-page.license .datalist .acc-heading i.indt {
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -10px;
    font-size: 20px;
    opacity: 0.5;
    pointer-events: none;
}

.inner-page.license .datalist .acc-heading ul {
    display: table-cell;
    vertical-align: middle;
    padding: 15px 0 15px 30px;
    margin: 0;
}

    .inner-page.license .datalist .acc-heading ul li {
        list-style: none;
        display: inline-block;
        vertical-align: middle;
        margin-left: -3px;
        padding-right: 15px;
    }

.inner-page.license .datalist .acc-heading button {
    padding: 2px 10px;
}

    .inner-page.license .datalist .acc-heading button.delete,
    .inner-page.license .datalist .acc-heading button.delete:hover,
    .inner-page.license .datalist .acc-heading button.delete:focus {
        color: #db4437;
    }

.inner-page.license .datalist .panel-body {
    padding: 0;
}

.inner-page.license .datalist .acc-body {
    padding: 15px;
}

@media (max-width: 767px) {
    .inner-page.license .datalist .acc-heading button {
        padding: 2px 5px;
    }

    .inner-page.license .datalist .acc-heading ul {
        padding: 5px 0 5px 30px;
    }
}

/* My Package */
.inner-page.license .my-packages .datalist .acc-heading ul li:nth-child(1) {
    width: 40%;
}

.inner-page.license .my-packages .datalist .acc-heading ul li:nth-child(2) {
    width: 20%;
}

.inner-page.license .my-packages .datalist .acc-heading ul li:nth-child(3) {
    width: 20%;
}

.inner-page.license .my-packages .datalist .acc-heading ul li:nth-child(4) {
    width: 20%;
}

.inner-page.license .my-packages .datalist .acc-heading ul li.pack-name {
    position: relative;
    font-size: 16px;
    font-weight: bold;
    color: #970067;
    padding-right: 45px;
}

    .inner-page.license .my-packages .datalist .acc-heading ul li.pack-name .package-active {
        position: absolute;
        right: 10px;
        top: 50%;
        margin-top: -13px;
    }

.inner-page.license .my-packages .datalist .acc-body .pack-info {
    background-color: #eaeaea;
    border-radius: 5px;
}

    .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header {
        position: relative;
        background-color: #191919;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding: 10px;
        text-align: center;
        margin-bottom: 10px;
    }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header:after {
            content: "";
            position: absolute;
            bottom: -20px;
            left: 50%;
            margin-left: -20px;
            z-index: 1;
            width: 0;
            height: 0;
            border-left: 20px solid transparent;
            border-right: 20px solid transparent;
            border-top: 20px solid #191919;
        }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header * {
            color: #ffffff !important;
        }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header img {
            width: 100px;
            height: auto;
        }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header h2 {
            margin: 5px 0 15px 0;
            font-size: 30px;
        }

            .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header h2 span {
                font-size: 23px;
                font-weight: 300;
            }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header h3.total {
            display: inline-block;
            background-color: #4e7b1a;
            padding: 10px 20px;
            border-radius: 50px;
            margin: 0 0 15px 0;
            font-size: 24px;
            font-weight: 300;
        }

            .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header h3.total span {
                font-size: 18px;
            }

    .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-data {
        padding: 10px;
    }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-data .table > tbody > tr:first-child td {
            border-top: none !important;
        }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-data .table tr td {
            padding: 3px 8px;
            font-size: 13px;
        }

        .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-data h4 {
            font-size: 16px;
        }

.inner-page.license .my-packages .datalist .acc-body .salon-info h3 {
    color: #747096;
}

.inner-page.license .my-packages .datalist .acc-body .salon-list {
    margin: 0 -5px;
    padding: 0;
}

    .inner-page.license .my-packages .datalist .acc-body .salon-list li {
        list-style: none;
        display: inline-block;
        vertical-align: top;
        width: 134px;
        height: 134px;
        overflow: hidden;
        padding: 5px;
    }

        .inner-page.license .my-packages .datalist .acc-body .salon-list li input[type=checkbox] + label:before {
            z-index: 10;
        }

        .inner-page.license .my-packages .datalist .acc-body .salon-list li input[type=checkbox][disabled] + label {
            opacity: 0.5;
        }

        .inner-page.license .my-packages .datalist .acc-body .salon-list li label {
            position: relative;
            width: 124px;
            height: 124px;
            padding: 5px;
            overflow: hidden;
            margin: 0;
            text-align: center;
            border-radius: 5px;
        }

            .inner-page.license .my-packages .datalist .acc-body .salon-list li label img {
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                z-index: 1;
                width: auto;
                height: 100%;
            }

            .inner-page.license .my-packages .datalist .acc-body .salon-list li label .salon-name {
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                z-index: 2;
                background-color: rgba(58, 39, 55, 0.76);
                color: #ffffff;
                display: table;
                width: 100%;
                height: 100%;
            }

                .inner-page.license .my-packages .datalist .acc-body .salon-list li label .salon-name span {
                    display: table-cell;
                    vertical-align: middle;
                    font-size: 14px;
                    line-height: 1;
                    font-weight: normal;
                    padding: 5px;
                }

@media (max-width: 991px) {
    .inner-page.license .my-packages .datalist .acc-body .salon-list li {
        width: 110px;
        height: 110px;
    }

        .inner-page.license .my-packages .datalist .acc-body .salon-list li label {
            width: 100px;
            height: 100px;
        }
}

@media (max-width: 767px) {
    .inner-page.license .my-packages .datalist .acc-heading ul li:nth-child(1) {
        width: 100%;
    }

    .inner-page.license .my-packages .datalist .acc-body .pack-info .pack-header h2 {
        text-align: center;
    }

    .inner-page.license .my-packages .datalist .acc-body .salon-list li {
        width: 86px;
        height: 86px;
    }

        .inner-page.license .my-packages .datalist .acc-body .salon-list li label {
            width: 76px;
            height: 76px;
        }
}

/* Branches */
.inner-page.license .branches .datalist .acc-heading ul li:nth-child(1) {
    width: 40%;
}

.inner-page.license .branches .datalist .acc-heading ul li:nth-child(2) {
    width: 20%;
}

.inner-page.license .branches .datalist .acc-heading ul li:nth-child(3) {
    width: 20%;
}

.inner-page.license .branches .datalist .acc-heading ul li:nth-child(4) {
    width: 20%;
}

.inner-page.license .branches .datalist .acc-heading ul li.branch-name {
    font-size: 14px;
    font-weight: bold;
    color: #970067;
}

    .inner-page.license .branches .datalist .acc-heading ul li.branch-name img {
        width: auto;
        height: 60px;
        border-radius: 5px;
        margin-right: 5px;
    }

.inner-page.license .branches .payment {
    background-color: #efefef;
    padding: 15px;
    border-bottom: 5px solid #cccccc;
}

    .inner-page.license .branches .payment h3 {
        margin: 0 0 15px 0;
    }

    .inner-page.license .branches .payment .actions {
        display: inline-block;
        vertical-align: top;
    }

@media (max-width: 991px) {
    .inner-page.license .branches .payment .actions {
        margin-top: 10px;
    }
}

@media (max-width: 767px) {
    .inner-page.license .branches .datalist .acc-heading ul li:nth-child(1) {
        width: 70%;
    }

    .inner-page.license .branches .datalist .acc-heading ul li:nth-child(2) {
        width: 30%;
    }

    .inner-page.license .branches .datalist .acc-heading ul li.branch-name img {
        height: 30px;
    }
}

/* Logs */
.inner-page.license .logs h3 {
    margin: 10px 0 20px 0;
    font-size: 20px;
    font-weight: normal;
}


/****************************************************************************************************
#####################################################################################################
****************************** Faq Page *********************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.faq .header-img {
    background-image: url("../img/banner/faq.jpg") !important;
}

.inner-page.faq .faq-content {
    padding-bottom: 30px;
}

    .inner-page.faq .faq-content .panel-group {
        margin-bottom: 30px;
    }

    .inner-page.faq .faq-content .panel-default > .panel-heading {
        color: #333;
        background-color: #FFFFFF;
        border: 1px solid #C2B5C7;
        border-radius: 0px;
        padding: 0;
    }

        .inner-page.faq .faq-content .panel-default > .panel-heading .panel-title {
            font-size: 14px;
        }

    .inner-page.faq .faq-content .panel-group .panel {
        margin-bottom: 5px;
        border-radius: 0;
        border: none;
    }

    .inner-page.faq .faq-content .panel-title a {
        display: block;
        padding: 8px 30px 8px 15px;
        cursor: pointer;
        position: relative;
    }

    .inner-page.faq .faq-content .panel-title a,
    .faq-content .panel-title a:hover {
        color: #000000;
        font-weight: bold;
    }

        .inner-page.faq .faq-content .panel-title a.collapsed {
            color: #666666;
        }

        .inner-page.faq .faq-content .panel-title a:after {
            font-family: FontAwesome;
            content: "\f146";
            position: absolute;
            top: 9px;
            right: 9px;
            color: #000000;
        }

        .inner-page.faq .faq-content .panel-title a.collapsed:after {
            font-family: FontAwesome;
            content: "\f0fe";
            position: absolute;
            top: 9px;
            right: 9px;
            color: #666666;
        }

    .inner-page.faq .faq-content .panel-body {
        border-top: none !important;
        border-left: 1px solid #C2B5C7 !important;
        border-right: 1px solid #C2B5C7 !important;
        border-bottom: 5px solid #C2B5C7 !important;
    }

.inner-page.faq .faq-sidebar {
    padding: 20px 0 50px 0;
}

.inner-page.faq .faq-search {
    padding: 20px 0 20px 0;
}

.inner-page.faq .faq-cat {
    overflow: hidden;
    padding-left: 15px;
    border-left: 3px solid #D2D2D2;
}

    .inner-page.faq .faq-cat h3 {
        font-size: 18px;
        font-weight: bold;
        text-transform: uppercase;
        color: #808080;
    }

    .inner-page.faq .faq-cat ul {
        list-style: none;
        padding: 0;
    }

        .inner-page.faq .faq-cat ul li {
            padding: 5px 0;
        }

            .inner-page.faq .faq-cat ul li a {
                font-size: 16px;
                color: #808080;
            }

                .inner-page.faq .faq-cat ul li a:hover {
                    color: #6F1A91;
                }

/****************************************************************************************************
#####################################################################################################
****************************** Promotion Page *********************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.promotion .header-img {
    background-image: url("../img/banner/faq.jpg") !important;
}

.inner-page.promotion .header-img {
    background-image: url("../img/header-img.jpg") !important;
}

.inner-page.promotion .faq-content {
    padding-bottom: 30px;
}

    .inner-page.promotion .faq-content .panel-group {
        margin-bottom: 30px;
    }

    .inner-page.promotion .faq-content .panel-default > .panel-heading {
        color: #333;
        background-color: #FFFFFF;
        border: 1px solid #C2B5C7;
        border-radius: 0px;
        padding: 0;
    }

        .inner-page.promotion .faq-content .panel-default > .panel-heading .panel-title {
            font-size: 14px;
        }

    .inner-page.promotion .faq-content .panel-group .panel {
        margin-bottom: 5px;
        border-radius: 0;
        border: none;
    }

    .inner-page.promotion .faq-content .panel-title a {
        display: block;
        padding: 8px 30px 8px 15px;
        cursor: pointer;
        position: relative;
    }

    .inner-page.promotion .faq-content .panel-title a,
    .faq-content .panel-title a:hover {
        color: #4e0945;
        font-weight: bold;
    }

        .inner-page.promotion .faq-content .panel-title a.collapsed {
            color: #333333;
        }

        .inner-page.promotion .faq-content .panel-title a:after {
            font-family: FontAwesome;
            content: "\f146";
            position: absolute;
            top: 9px;
            right: 9px;
            color: #4e0945;
        }

        .inner-page.promotion .faq-content .panel-title a.collapsed:after {
            font-family: FontAwesome;
            content: "\f0fe";
            position: absolute;
            top: 9px;
            right: 9px;
            color: #4e0945;
        }

    .inner-page.promotion .faq-content .panel-body {
        border-top: none !important;
        border-left: 1px solid #C2B5C7 !important;
        border-right: 1px solid #C2B5C7 !important;
        border-bottom: 5px solid #C2B5C7 !important;
    }

.inner-page.promotion .faq-sidebar {
    padding: 20px 0 50px 0;
}

.inner-page.promotion .faq-search {
    padding: 20px 0 20px 0;
}

.inner-page.promotion .faq-cat {
    overflow: hidden;
    padding-left: 15px;
    border-left: 3px solid #D2D2D2;
}

    .inner-page.promotion .faq-cat h3 {
        font-size: 18px;
        font-weight: bold;
        text-transform: uppercase;
        color: #808080;
    }

    .inner-page.promotion .faq-cat ul {
        list-style: none;
        padding: 0;
    }

        .inner-page.promotion .faq-cat ul li {
            padding: 5px 0;
        }

            .inner-page.promotion .faq-cat ul li a {
                font-size: 16px;
                color: #808080;
            }

                .inner-page.promotion .faq-cat ul li a:hover {
                    color: #6F1A91;
                }

/****************************************************************************************************
#####################################################################################################
****************************** Privacy Policy Page **************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.privacy .header-img {
    background-image: url("../img/banner/privacy-policy.jpg") !important;
}

.inner-page.privacy .privacy-content {
    padding: 10px 0 50px 0;
}

    .inner-page.privacy .privacy-content h2 {
        margin-top: 25px;
    }

    .inner-page.privacy .privacy-content p {
        text-align: justify;
    }
/****************************************************************************************************
#####################################################################################################
****************************** About Us Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.about-us .header-img {
    background-image: url("../img/banner/about.jpg") !important;
}

.inner-page.about-us .about-us-content {
    padding: 10px 0 50px 0;
}
/****************************************************************************************************
#####################################################################################################
****************************** Contact Page *********************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.contact .header-img {
    background-image: url("../img/banner/contact.jpg") !important;
}

.inner-page.contact .contact-details {
    padding: 10px 0 50px 0;
}

    .inner-page.contact .contact-details h3 {
        font-size: 16px;
        font-weight: bold;
        color: #747096;
        text-transform: uppercase;
        margin: 5px 0;
    }

.inner-page.contact .contact-form {
    padding: 10px 0 50px 0;
}

.inner-page.contact .contact-map {
    margin-bottom: 50px;
    border: 1px solid #ccc;
}

@media (max-width: 767px) {
    .inner-page.contact .contact-details {
        padding: 10px 0 0px 0;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Packages Page ********************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.packages .header-img {
    background-image: url("../img/banner/packages.jpg") !important;
}

.inner-page.packages .filter {
    overflow: hidden;
    background-color: #eeeeee;
    border: 1px solid #cccccc;
    border-radius: 5px;
    padding: 15px 0px;
    margin-bottom: 15px;
}

    .inner-page.packages .filter h2 {
        margin: 0 0 10px 0;
    }

.inner-page.packages .packages-content {
    padding: 10px 0 50px 0;
}

    .inner-page.packages .packages-content table {
        border-collapse: separate;
        border-spacing: 15px 0;
        border: none;
    }

        .inner-page.packages .packages-content table tr td {
            text-align: center;
            vertical-align: middle;
            padding: 6px;
        }

        .inner-page.packages .packages-content table tbody tr td:not(:nth-child(1)) {
            padding: 6px 3px;
        }

        .inner-page.packages .packages-content table tr td:nth-child(1) {
            text-align: left;
        }

        .inner-page.packages .packages-content table thead tr th:not(:nth-child(1)) {
            text-align: center;
            width: 15%;
            padding: 0px;
            background-color: #970067;
        }

        .inner-page.packages .packages-content table thead tr th.over4 {
            width: 12%;
        }

        .inner-page.packages .packages-content table thead tr th:nth-child(1) {
            border-left: none;
            border-right: none;
        }

    .inner-page.packages .packages-content .pack-header {
        background-color: #970067;
    }

        .inner-page.packages .packages-content .pack-header h2 {
            margin: 0 0 -40px 0;
            padding: 15px 0px;
            font-size: 20px;
            font-weight: 300;
            color: #ffffff;
            text-transform: uppercase;
        }

    .inner-page.packages .packages-content table thead .populer {
        position: relative;
    }

        .inner-page.packages .packages-content table thead .populer:after {
            content: "";
            position: absolute;
            top: 10px;
            right: -27px;
            width: 55px;
            height: 100px;
            background: url("../img/package-most-populer.png") no-repeat;
            background-size: cover;
            background-position: center top;
            z-index: 1;
        }

    .inner-page.packages .packages-content table .price {
        position: relative;
        top: 40px;
        margin: 0 auto;
        width: 100px;
        height: 100px;
        line-height: 100%;
        border-radius: 50%;
        border-collapse: collapse;
        background-color: #ffffff;
        border: 3px solid #970067;
        color: #970067;
        z-index: 1;
    }

    .inner-page.packages .packages-content table .price-inner {
        display: table-cell;
        vertical-align: middle;
        width: 100px;
        height: 100px;
    }

    .inner-page.packages .packages-content table .price p {
        margin: 0px;
    }

        .inner-page.packages .packages-content table .price p.currency {
            text-transform: uppercase;
            font-size: 16px;
        }

        .inner-page.packages .packages-content table .price p.amount {
            font-size: 30px;
            line-height: 30px;
        }

        .inner-page.packages .packages-content table .price p.subscription {
            font-size: 14px;
        }

    .inner-page.packages .packages-content table tbody h4 {
        font-size: 20px;
        margin: 5px 0;
    }

    .inner-page.packages .packages-content table tfoot tr td:nth-child(1) {
        border: none;
    }

@media (max-width: 1199px) {
    .inner-page.packages .packages-content table thead .populer:after {
        top: 10px;
        right: -25px;
        width: 49px;
        height: 90px;
    }
}

@media (max-width: 991px) {
    .inner-page.packages .packages-content .pack-header h2 {
        padding: 10px 0px;
        font-size: 16px;
    }
}

@media (max-width: 767px) {
    .inner-page.packages .packages-content table {
        border-spacing: 0px;
        padding: 0 15px;
    }

        .inner-page.packages .packages-content table thead tr th:nth-child(1) {
            padding: 0;
            text-align: center;
        }

        .inner-page.packages .packages-content table tbody tr td:nth-child(1) {
            width: 60%;
            border-right: none;
        }

        .inner-page.packages .packages-content table tbody tr td:nth-child(2) {
            border-left: none;
            text-align: left;
        }

        .inner-page.packages .packages-content table tbody tr:nth-child(1) td {
            padding-top: 30px;
        }

        .inner-page.packages .packages-content table tbody tr td.action {
            text-align: center;
        }

    .inner-page.packages .packages-content .pack-header h2 {
        font-size: 22px;
    }

    .inner-page.packages .packages-content table thead .populer:after {
        width: 65px;
        height: 120px;
        right: -10px;
    }
}



/****************************************************************************************************
#####################################################################################################
****************************** Packages Page (Pay) **************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.package-pay {
    padding-bottom: 30px;
}

    .inner-page.package-pay .header-img {
        background-image: url("../img/banner/packages.jpg") !important;
    }

    .inner-page.package-pay .panel-default > .panel-heading {
        font-size: 16px;
        font-weight: bold;
        color: #333;
        background-color: #e0dbe0;
        border-color: #b18cac;
    }

    .inner-page.package-pay .salon-list {
        margin: 0 -5px;
        padding: 0;
    }

        .inner-page.package-pay .salon-list li {
            list-style: none;
            display: inline-block;
            vertical-align: top;
            width: 16.5%;
            height: 110px;
            overflow: hidden;
            padding: 5px;
        }

            .inner-page.package-pay .salon-list li input[type=checkbox] + label:before {
                z-index: 10;
            }

            .inner-page.package-pay .salon-list li input[type=checkbox][disabled] + label {
                opacity: 0.5;
            }

            .inner-page.package-pay .salon-list li label {
                position: relative;
                width: 100%;
                height: 100px;
                padding: 5px;
                overflow: hidden;
                margin: 0;
                text-align: center;
                border-radius: 5px;
            }

                .inner-page.package-pay .salon-list li label img {
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    z-index: 1;
                    width: auto;
                    height: 100%;
                }

                .inner-page.package-pay .salon-list li label .salon-name {
                    position: absolute;
                    top: 0;
                    bottom: 0;
                    left: 0;
                    right: 0;
                    z-index: 2;
                    background-color: rgba(58, 39, 55, 0.76);
                    color: #ffffff;
                    display: table;
                    width: 100%;
                    height: 100%;
                }

                    .inner-page.package-pay .salon-list li label .salon-name span {
                        display: table-cell;
                        vertical-align: middle;
                        font-size: 14px;
                        line-height: 1;
                        font-weight: normal;
                        padding: 5px;
                    }

    .inner-page.package-pay .pack-info {
        background-color: #eaeaea;
        border-radius: 5px;
        margin-bottom: 30px;
    }

        .inner-page.package-pay .pack-info .pack-header {
            position: relative;
            background-color: #191919;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            padding: 10px;
            text-align: center;
            margin-bottom: 10px;
        }

            .inner-page.package-pay .pack-info .pack-header:after {
                content: "";
                position: absolute;
                bottom: -20px;
                left: 50%;
                margin-left: -20px;
                z-index: 1;
                width: 0;
                height: 0;
                border-left: 20px solid transparent;
                border-right: 20px solid transparent;
                border-top: 20px solid #191919;
            }

            .inner-page.package-pay .pack-info .pack-header * {
                color: #ffffff !important;
            }

            .inner-page.package-pay .pack-info .pack-header img {
                width: 100px;
                height: auto;
            }

            .inner-page.package-pay .pack-info .pack-header h2 {
                margin: 5px 0 15px 0;
                font-size: 30px;
            }

                .inner-page.package-pay .pack-info .pack-header h2 span {
                    font-size: 23px;
                    font-weight: 300;
                }

            .inner-page.package-pay .pack-info .pack-header h3.total {
                display: inline-block;
                background-color: #4e7b1a;
                padding: 10px 20px;
                border-radius: 50px;
                margin: 0 0 15px 0;
                font-size: 24px;
                font-weight: 300;
            }

                .inner-page.package-pay .pack-info .pack-header h3.total span {
                    font-size: 18px;
                }

        .inner-page.package-pay .pack-info .pack-data {
            padding: 10px;
        }

            .inner-page.package-pay .pack-info .pack-data .table > tbody > tr:first-child td {
                border-top: none !important;
            }

            .inner-page.package-pay .pack-info .pack-data .table tr td {
                padding: 3px 8px;
                font-size: 13px;
            }

            .inner-page.package-pay .pack-info .pack-data h4 {
                font-size: 16px;
            }

@media (max-width: 767px) {
    .inner-page.package-pay .salon-list li {
        width: 90px;
        height: 110px;
        padding: 3px;
        margin: 0 -1px;
    }
}


/****************************************************************************************************
#####################################################################################################
****************************** Packages Page (End) **************************************************
#####################################################################################################
****************************************************************************************************/
.inner-page.package-end .header-img {
    background-image: url("../img/banner/packages.jpg") !important;
}

.inner-page.package-end .p-profile-area {
    margin: 0px 0px 15px 0px;
    overflow: hidden;
    position: relative;
    background-color: #f3f3f3;
    border: 1px solid #cccccc;
    padding: 15px;
}

    .inner-page.package-end .p-profile-area .image img {
        width: 100%;
        height: auto;
    }

    .inner-page.package-end .p-profile-area h4.name {
        font-size: 20px;
        font-weight: 300;
    }

    .inner-page.package-end .p-profile-area p.email {
        color: #999999;
        font-size: 12px;
        line-height: 1;
        word-wrap: break-word;
    }

    .inner-page.package-end .p-profile-area h5 {
        border-top: 1px solid rgba(0, 0, 0, 0.05);
        display: block;
        margin-top: 15px;
        margin-bottom: 0px;
        padding-top: 10px;
    }

.inner-page.package-end .branches {
    color: #888888;
    font-size: 14px;
    line-height: 1;
    list-style: outside none none;
    margin-bottom: 0;
    padding-left: 20px;
}

    .inner-page.package-end .branches > li:not(:last-child) > a {
        border-bottom: 1px solid #eeeeee;
    }

    .inner-page.package-end .branches > li > a {
        display: block;
        padding: 10px 25px 10px 5px;
        position: relative;
    }

        .inner-page.package-end .branches > li > a::before {
            content: "\f1ad";
            font-family: FontAwesome;
            left: 0;
            margin-left: -20px;
            margin-right: 15px;
            position: absolute;
        }

        .inner-page.package-end .branches > li > a:hover {
            background-color: #f9f9f9;
        }

        .inner-page.package-end .branches > li > a small {
            display: block;
            color: #666666;
            font-size: 12px;
        }

.inner-page.package-end .pack-info {
    background-color: #eaeaea;
    border-radius: 5px;
    margin-bottom: 30px;
}

    .inner-page.package-end .pack-info .pack-header {
        position: relative;
        background-color: #191919;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        padding: 10px;
        text-align: center;
        margin-bottom: 10px;
    }

        .inner-page.package-end .pack-info .pack-header:after {
            content: "";
            position: absolute;
            bottom: -20px;
            left: 50%;
            margin-left: -20px;
            z-index: 1;
            width: 0;
            height: 0;
            border-left: 20px solid transparent;
            border-right: 20px solid transparent;
            border-top: 20px solid #191919;
        }

        .inner-page.package-end .pack-info .pack-header * {
            color: #ffffff !important;
        }

        .inner-page.package-end .pack-info .pack-header img {
            width: 100px;
            height: auto;
        }

        .inner-page.package-end .pack-info .pack-header h2 {
            margin: 5px 0 15px 0;
            font-size: 30px;
        }

            .inner-page.package-end .pack-info .pack-header h2 span {
                font-size: 23px;
                font-weight: 300;
            }

        .inner-page.package-end .pack-info .pack-header h3.total {
            display: inline-block;
            background-color: #4e7b1a;
            padding: 10px 20px;
            border-radius: 50px;
            margin: 0 0 15px 0;
            font-size: 24px;
            font-weight: 300;
        }

            .inner-page.package-end .pack-info .pack-header h3.total span {
                font-size: 18px;
            }

    .inner-page.package-end .pack-info .pack-data {
        padding: 10px;
    }

        .inner-page.package-end .pack-info .pack-data .table > tbody > tr:first-child td {
            border-top: none !important;
        }

        .inner-page.package-end .pack-info .pack-data .table tr td {
            padding: 3px 8px;
            font-size: 14px;
        }

        .inner-page.package-end .pack-info .pack-data h4 {
            font-size: 18px;
        }



/****************************************************************************************************
#####################################################################################################
****************************** Terms of Use Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.terms .header-img {
    background-image: url("../img/banner/terms-of-use.jpg") !important;
}

.inner-page.terms .terms-content {
    padding: 10px 0 50px 0;
}



/****************************************************************************************************
#####################################################################################################
****************************** Invite Friends Terms *************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.invite-friends-terms .header-img {
    background-image: url("../img/banner/terms-of-use.jpg") !important;
}

.inner-page.invite-friends-terms .ift-content {
    padding: 10px 0 50px 0;
}




/****************************************************************************************************
#####################################################################################################
****************************** Business Terms of Use Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.business-terms .header-img {
    background-image: url("../img/banner/business-terms-of-use.jpg") !important;
}

.inner-page.business-terms .terms-content {
    padding: 10px 0 50px 0;
}

.inner-page.business-terms .header-title h1 {
    font-size: 38px;
}

@media (max-width: 767px) {
    .inner-page.business-terms .header-title h1 {
        font-size: 26px;
    }

        .inner-page.business-terms .header-title h1:before {
            display: none;
        }

        .inner-page.business-terms .header-title h1:after {
            display: none;
        }
}
/****************************************************************************************************
#####################################################################################################
****************************** Help Page ****************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.help .header-img {
    background-image: url("../img/banner/help.jpg") !important;
}

.inner-page.help .help-content {
    padding: 10px 0 50px 0;
}

    .inner-page.help .help-content .video-frame {
        position: relative;
        margin-top: 15px;
        padding: 36px 28px;
    }

        .inner-page.help .help-content .video-frame .frame {
            position: absolute;
            top: 0;
            left: 0;
            z-index: 2;
            width: 100%;
            height: auto;
            pointer-events: none;
        }

        .inner-page.help .help-content .video-frame .embed-responsive {
            position: relative;
            z-index: 1;
        }
/* Register Steps */

.inner-page.help .reg-steps-wrap {
    padding: 30px 0;
    background: #dddddd;
}

    .inner-page.help .reg-steps-wrap .reg-steps .step-item {
        margin-top: 30px;
        overflow: hidden;
    }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .image img {
            width: 100%;
            height: auto;
            border-radius: 8px;
            border: 1px solid #cccccc;
        }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc {
            padding-top: 50px;
        }

    .inner-page.help .reg-steps-wrap .reg-steps > div:nth-child(odd) .step-item .desc {
        text-align: left;
    }

    .inner-page.help .reg-steps-wrap .reg-steps > div:nth-child(even) .step-item .desc {
        text-align: right;
    }

    .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc .step-count {
        display: inline-block;
        width: 100px;
        height: 100px;
        background-color: #000000;
        border-radius: 50%;
        text-align: center;
        color: #ffffff;
        padding-top: 15px;
    }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc .step-count h5 {
            font-size: 50px;
            font-weight: 300;
            margin: 0;
        }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc .step-count p {
            margin: 0 0 -8px 0;
            font-size: 18px;
            font-weight: bold;
        }

    .inner-page.help .reg-steps-wrap .step-footer {
        margin-top: 30px;
    }

.inner-page.help .help-info {
    padding: 10px 0 30px 0;
}

    .inner-page.help .help-info h4 {
        color: #747096;
    }

@media (max-width: 1199px) {
    .inner-page.help .help-content .video-frame {
        padding: 30px 24px;
    }
}

@media (max-width: 991px) {
    .inner-page.help .help-content .video-frame {
        padding: 35px 24px;
    }

    .inner-page.help .reg-steps-wrap {
        padding: 10px 0;
    }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc {
            padding-top: 15px;
        }

        .inner-page.help .reg-steps-wrap .reg-steps > div:nth-child(odd) .step-item .desc {
            text-align: center;
        }

        .inner-page.help .reg-steps-wrap .reg-steps > div:nth-child(even) .step-item .desc {
            text-align: center;
        }

        .inner-page.help .reg-steps-wrap .reg-steps .step-item .desc h3 {
            margin-top: 5px;
        }

    .inner-page.help .help-content {
        padding: 0px 0 20px 0;
    }

    .inner-page.help .reg-steps-wrap .reg-steps .step-item {
        margin-top: 0px;
    }
}

@media (max-width: 767px) {
    .inner-page.help .header-title h1:before,
    .inner-page.help .header-title h1:after {
        display: none;
    }

    .inner-page.help .help-content .video-frame {
        padding: 22px 18px;
    }

    .inner-page.help .help-content h2 {
        margin: 0;
    }

    .inner-page.help .reg-steps-wrap {
        padding: 0 15px;
    }
}

@media (max-width: 499px) {
    .inner-page.help .help-content .video-frame {
        padding: 14px 12px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Inner Page Common **********************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page {
}
    /* Header */

    .salon-inner-page .header-title {
        position: relative;
        height: 130px;
        margin-bottom: 20px;
        padding: 0px;
    }

        .salon-inner-page .header-title .header-img {
            position: absolute;
            top: 0;
            overflow: hidden;
            height: 130px;
            width: 100%;
            background: #3a2237;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center 30%;
        }

            .salon-inner-page .header-title .header-img:after {
                content: "";
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                background-color: rgba(0, 0, 0, 0.5);
            }

        .salon-inner-page .header-title h1 {
            font-family: "Oswald";
            font-weight: normal;
            color: #fff;
            text-align: center;
            text-transform: uppercase;
            padding-top: 20px;
            font-size: 48px;
            position: relative;
            text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
        }

            .salon-inner-page .header-title h1:before {
                margin-right: 25px;
            }

            .salon-inner-page .header-title h1:after {
                margin-left: 25px;
            }

            .salon-inner-page .header-title h1:before,
            .header-title h1:after {
                background-color: #ffffff;
                content: "";
                display: inline-block;
                height: 8px;
                margin-bottom: 15px;
                position: relative;
                width: 40px;
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
            }

    .salon-inner-page .header-sep {
        height: 5px;
        background-color: #cccccc;
        margin-bottom: 15px;
    }

@media (max-width: 767px) {
    .salon-inner-page {
        margin-top: 0px;
    }

        .salon-inner-page .header-title h1 {
            font-size: 30px;
        }

            .salon-inner-page .header-title h1:before,
            .header-title h1:after {
                height: 4px;
                margin-bottom: 10px;
                width: 20px;
            }

            .salon-inner-page .header-title h1:before {
                margin-right: 5px;
            }

            .salon-inner-page .header-title h1:after {
                margin-left: 5px;
            }
}
/*Play Rating*/

.histo {
    margin-top: 10px;
    font-size: 8px;
    display: block;
    overflow: hidden;
}

.histo-star {
    float: left;
    padding: 3px;
}

.histo-rate {
    width: 100%;
    display: block;
    clear: both;
}

.bar-block {
    margin-left: 5px;
    color: #fff;
    display: block;
    float: left;
    width: 75%;
    position: relative;
}

.bar {
    padding: 4px;
    display: block;
}

#bar-five {
    width: 0;
    background-color: #9FC05A;
}

#bar-four {
    width: 0;
    background-color: #ADD633;
}

#bar-three {
    width: 0;
    background-color: #FFD834;
}

#bar-two {
    width: 0;
    background-color: #FFB234;
}

#bar-one {
    width: 0;
    background-color: #FF8B5A;
}
/*End Play Rating*/
/* Admin Edit Button */

.btn-page-edit {
    position: absolute;
    right: 15px;
    top: 0;
    border: none;
    border-radius: 0px;
    background-color: #b6b3d2;
    color: #fff;
    z-index: 1;
}

    .btn-page-edit:hover,
    .btn-page-edit:focus {
        background-color: #9f9cc1;
        color: #fff;
    }
/****************************************************************************************************
#####################################################################################################
****************************** Salon Products Page ************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-products-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-products-page h2 {
    font-size: 30px;
    font-weight: bold;
    text-transform: uppercase;
}

.salon-products-page .service-block {
    margin: 10px;
    position: relative;
    height: 180px;
    width: 180px;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .salon-products-page .service-block .image {
        position: relative;
        width: 180px;
        height: 180px;
        overflow: hidden;
        background-color: rgba(129, 26, 116, 0.14);
        border-radius: 5px;
    }

        .salon-products-page .service-block .image:after {
            content: "";
            position: absolute;
            top: 10px;
            left: 10px;
            width: 160px;
            height: 160px;
            border: 2px solid rgb(187, 165, 185);
            border-radius: 10px;
        }

    .salon-products-page .service-block img {
        width: 50%;
        height: auto;
        margin: 20%;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

    .salon-products-page .service-block h3 {
        position: absolute;
        bottom: 15px;
        font-size: 16px;
        width: 100%;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

    .salon-products-page .service-block:hover img {
        -moz-transform: scale(0.9);
        -webkit-transform: scale(0.9);
    }

    .salon-products-page .service-block:hover h3 {
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
    }

.salon-products-page .new-promo .promo-box .promo-box-back {
    background: #333;
    white-space: nowrap;
}

.salon-products-page .new-promo .promo-box {
    margin: 5px;
    cursor: pointer;
    height: 200px;
    overflow: hidden;
}

    .salon-products-page .new-promo .promo-box .promo-image {
        height: 200px;
        width: 50%;
        display: inline-block;
        white-space: normal;
    }

        .salon-products-page .new-promo .promo-box .promo-image img {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }

    .salon-products-page .new-promo .promo-box .promo-title {
        width: 50%;
        max-height: 200px;
        display: inline-block;
        vertical-align: middle;
        padding: 5px;
        white-space: normal;
    }

        .salon-products-page .new-promo .promo-box .promo-title h2 {
            color: #fff;
            font-size: 34px;
            letter-spacing: normal;
            font-family: 'Oswald';
            text-align: center;
            font-weight: 400;
            text-transform: uppercase;
            margin: 0px;
        }

        .salon-products-page .new-promo .promo-box .promo-title h3 {
            color: #786580;
            text-transform: uppercase;
            font-size: 19px;
            margin: 10px 0;
        }

.salon-products-page .product-cat {
    margin-top: 15px;
    margin-bottom: 15px;
}

    .salon-products-page .product-cat .flexslider .slides img {
        height: 300px;
        width: 100%;
        object-fit: cover;
        -webkit-filter: grayscale(0);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

        .salon-products-page .product-cat .flexslider .slides img:hover {
            cursor: pointer;
            -webkit-filter: grayscale(100%);
            transform: scale(0.99);
        }

    .salon-products-page .product-cat .flexslider .flex-control-nav {
        display: none;
    }

.salon-products-page .gal-img {
    width: 250px;
    height: 250px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .salon-products-page .gal-img:hover {
        transform: scale(0.99);
    }

    .salon-products-page .gal-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .salon-products-page .gal-img .gal-caption {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(0, 0, 0, 0);
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(20%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 1)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 1) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
        padding-top: 70%;
        color: #fff;
        -ms-opacity: 0.7;
        opacity: 0.7;
        pointer-events: none;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

        .salon-products-page .gal-img .gal-caption h3 {
            font-size: 16px;
            text-shadow: 0 0 30px rgba(150, 150, 150, 1);
        }

    .salon-products-page .gal-img:hover .gal-caption {
        opacity: 0.9;
    }

.salon-products-page .package-block {
    position: relative;
    display: inline-block;
    width: 300px;
    height: 200px;
    overflow: hidden;
    margin: 10px;
    cursor: pointer;
}

    .salon-products-page .package-block .image {
        width: 100%;
        height: auto;
        -moz-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

    .salon-products-page .package-block .package-label {
        position: absolute;
        bottom: 0;
        display: table;
        width: 100%;
        height: 50px;
        background-color: #b6b3d2;
        color: #FFF;
        -moz-transition: all 0.3s ease;
        -webkit-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }

        .salon-products-page .package-block .package-label h5 {
            display: table-cell;
            vertical-align: middle;
            font-size: 17px;
            line-height: 20px;
        }

    .salon-products-page .package-block:hover .package-label {
        height: 75px;
    }

    .salon-products-page .package-block:hover .image {
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -webkit-transform: scale(1.1);
    }

@media (max-width: 768px) {
    .salon-products-page .package-block {
        width: 270px;
    }
}
/*Packages*/

.modal#productPackages .package-header,
.package-details {
    text-align: center;
}

    .modal#productPackages .package-header .old-price {
        font-size: 20px;
        font-weight: bold;
        text-decoration: line-through;
    }

    .modal#productPackages .package-header .new-price {
        font-size: 27px;
        font-weight: bold;
        background-color: #b80083;
        color: #FFF;
        display: inline-block;
        padding: 5px 20px;
    }

.modal#productPackages .package-details {
    margin-top: 30px;
}

    .modal#productPackages .package-details .pc-block {
        width: 180px;
        height: 230px;
        display: inline-block;
        border: 1px solid #90487B;
        margin: 5px;
        overflow: hidden;
    }

        .modal#productPackages .package-details .pc-block img {
            width: 170px;
            height: 170px;
            object-fit: cover;
            margin: 5px;
        }

        .modal#productPackages .package-details .pc-block .caption {
            width: 100%;
            height: 50px;
            display: table;
            border-bottom: 10px solid #90487B;
        }

            .modal#productPackages .package-details .pc-block .caption span {
                display: table-cell;
                vertical-align: middle;
                padding: 2px 5px;
                font-size: 14px;
                line-height: 16px;
                font-weight: bold;
            }

.modal#productPackages .package-des {
    margin: 30px 15px;
    text-align: center;
}

.modal#productPackages .package-tag {
    position: relative;
}

    .modal#productPackages .package-tag:before {
        content: "";
        width: 150px;
        height: 150px;
        position: absolute;
        top: -10px;
        left: -10px;
        background: url(../img/package-tag.png) no-repeat top left;
        background-size: cover;
    }

    .modal#productPackages .package-tag h1,
    .modal#productPackages .package-tag h2,
    .modal#productPackages .package-tag h3,
    .modal#productPackages .package-tag h4 {
        padding: 0 70px;
    }

@media (max-width: 767px) {
    .modal#productPackages .package-tag:before {
        width: 100px;
        height: 100px;
        top: -6px;
        left: -6px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Product Details Page *******************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-product-details-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-product-details-page .flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: 0;
    text-align: center;
}

.salon-product-details-page .salon-products-panel {
    padding-right: 15px;
    background-color: #fff;
    margin: 0px 0px 30px 0px;
}

    .salon-product-details-page .salon-products-panel .flexslider .slides img {
        height: 300px;
        width: 100%;
        object-fit: cover;
    }

    .salon-product-details-page .salon-products-panel .btn-default {
        background-color: #6E6C6F;
        border-color: #6E6C6F;
        border-radius: 0;
        height: 50px;
        color: #fff;
        text-transform: uppercase;
    }

        .salon-product-details-page .salon-products-panel .btn-default.active,
        .salon-product-details-page .salon-products-panel .btn-default.focus,
        .salon-product-details-page .salon-products-panel .btn-default:active,
        .salon-product-details-page .salon-products-panel .btn-default:focus,
        .salon-product-details-page .salon-products-panel .btn-default:hover {
            background-color: #747096;
            border-color: #747096;
            color: #fff;
        }

        .salon-product-details-page .salon-products-panel .btn-default span {
            white-space: pre-wrap;
        }

.salon-product-details-page .salon-service-categories {
    padding-top: 6px;
}

    .salon-product-details-page .salon-service-categories button {
        cursor: pointer;
        font-size: 12px;
        padding: 6px 5px;
        height: 30px;
    }

    .salon-product-details-page .salon-service-categories .btn-container:nth-child(odd) {
        padding-right: 3px;
        margin-bottom: 5px;
    }

    .salon-product-details-page .salon-service-categories .btn-container:nth-child(even) {
        padding-left: 3px;
        margin-bottom: 5px;
    }

.salon-product-details-page .salon-sub-services-panel {
    padding-bottom: 30px;
}

@media (max-width: 991px) {
    .salon-product-details-page .salon-products-panel {
        padding-right: 0px;
    }
}

@media (max-width: 768px) {
    .salon-product-details-page .salon-service-categories .btn-container:nth-child(2n),
    .salon-product-details-page .salon-service-categories .btn-container:nth-child(2n+1) {
        padding-left: 15px;
        padding-right: 15px;
    }
}
/* No Results */

.salon-product-details-page .no-result {
    padding: 120px 0;
}

    .salon-product-details-page .no-result i {
        font-size: 100px;
    }

    .salon-product-details-page .no-result h4 {
        font-size: 32px;
    }
/* Widget Boxes */

.salon-product-details-page .widget {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

    .salon-product-details-page .widget .price {
        position: absolute;
        top: 40px;
        font-size: 30px;
        font-weight: 600;
    }

.salon-product-details-page .widget-box {
    margin: 3px;
    position: relative;
    height: 320px;
    border: 1px solid #ccc;
    /*#6E6C6F*/
    overflow: hidden;
}

    .salon-product-details-page .widget-box.selected {
        border-width: 5px;
        border-color: #333;
    }

.salon-product-details-page [class="widget-box selected"]:after {
    position: absolute;
    right: 5px;
    top: 5px;
    z-index: 1;
    height: 35px;
    width: 35px;
    padding: 5px;
    background-color: #747096;
    border: 2px solid #FFF;
    border-radius: 50%;
    text-align: center;
    box-shadow: 0 2px 2px #8d8d8d;
    font-family: 'FontAwesome';
    content: '\f00c';
    font-size: 18px;
    color: #fff;
}

.salon-product-details-page .widget-box.selected > .btn-default {
    background-color: #333 !important;
}

.salon-product-details-page .widgetImage {
    width: 100%;
    height: 260px;
}

    .salon-product-details-page .widgetImage img {
        width: 100%;
        height: 260px;
        object-fit: cover;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

.salon-product-details-page .widgetContent {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 5px 10px 5px;
    line-height: 16px;
    color: #666;
    background: #fff;
    text-align: center;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .salon-product-details-page .widgetContent p {
        /*height: 35px;*/
        margin-top: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

.salon-product-details-page .widget:hover .widgetContent {
    bottom: 0px;
}

.salon-product-details-page .widgetTitle {
    width: 100%;
    overflow: hidden;
    font-size: 16px;
    text-transform: uppercase;
    margin-bottom: 5px;
}

.salon-product-details-page .widget .book {
    position: absolute;
    background-color: #fff;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

.salon-product-details-page .widget .widget-footer {
    border-top: 1px solid #eee;
    bottom: 0;
    color: #ffffff;
    cursor: pointer;
    font-size: 14px;
    height: 50px;
    left: 10px;
    padding: 8px 0;
    position: absolute;
    right: 10px;
    text-align: center;
    z-index: 1;
}

.salon-product-details-page .widget .widget-box {
    position: relative;
}

    .salon-product-details-page .widget .widget-box .rate {
        position: absolute;
        top: -4px;
        right: -4px;
        z-index: 10;
        width: 80px;
        height: 80px;
        background: url(../img/promo-rate-tag.png) no-repeat top right;
        background-size: cover;
        padding: 14px 5px;
        font-size: 16px;
        font-weight: bold;
        color: #ffffff;
        text-align: right;
    }

.salon-product-details-page .widgetContent .rating {
    margin-bottom: 5px;
    cursor: pointer;
}

.salon-product-details-page .widgetContent .service-price {
    display: inline-block;
    line-height: 1;
    margin-bottom: 10px;
}

    .salon-product-details-page .widgetContent .service-price .amount {
        color: #747096;
        font-size: 27px;
        font-weight: 900;
    }
/*Review Dialog*/

.salon-product-details-page .review-dialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

body.modal-open .salon-product-details-page .review-dialog {
    display: block;
}

.salon-product-details-page .review-dialog .modal-backdrop.in {
    z-index: 0;
}

.salon-product-details-page .review-dialog .review-title {
    overflow: hidden;
    padding-bottom: 15px;
    border: 1px solid #CCC;
}

.salon-product-details-page .review-dialog .review-content .user-reviews {
    padding: 15px;
    background-color: #E4E4E4;
    overflow: hidden;
}

.salon-product-details-page .review-dialog .review-content {
    padding: 20px 15px;
}

    .salon-product-details-page .review-dialog .review-content h5 {
        font-weight: bold;
        font-size: 16px;
    }

    .salon-product-details-page .review-dialog .review-content .avg-rating .avg-rating-num {
        display: block;
        font-size: 70px;
        line-height: 66px;
        font-weight: bold;
        color: #970067;
    }

    .salon-product-details-page .review-dialog .review-content .rating-stars.add .fa {
        font-size: 24px;
    }

    .salon-product-details-page .review-dialog .review-content .review-write textarea {
        width: 100%;
        margin: 10px 0;
    }

    .salon-product-details-page .review-dialog .review-content .btn-default {
        background-color: #bd25b4;
        border-color: #8A0D82;
        color: #FFF;
    }

        .salon-product-details-page .review-dialog .review-content .btn-default:hover,
        .salon-product-details-page .review-dialog .review-content .btn-default:focus {
            background-color: #8A0D82;
        }

.salon-product-details-page .review-dialog .review-item {
    margin-bottom: 30px;
}

    .salon-product-details-page .review-dialog .review-item .details {
        overflow: hidden;
    }

        .salon-product-details-page .review-dialog .review-item .details .image {
            float: left;
            width: 75px;
            height: 75px;
            overflow: hidden;
            border: 5px solid #FFF;
            margin-right: 10px;
        }

            .salon-product-details-page .review-dialog .review-item .details .image img {
                width: 100%;
                height: auto;
            }

        .salon-product-details-page .review-dialog .review-item .details .rate-stars span.rate {
            background-color: #333333;
            padding: 1px 5px;
            font-size: 14px;
            color: #FFF;
            border-radius: 3px;
            border: 1px solid #1B1B1B;
        }

        .salon-product-details-page .review-dialog .review-item .details .rate-name {
            margin-top: 3px;
            margin-bottom: 10px;
        }

    .salon-product-details-page .review-dialog .review-item .des {
        position: relative;
        margin-top: 15px;
        padding: 8px;
        background-color: #F5F5F5;
        border-radius: 5px;
    }

        .salon-product-details-page .review-dialog .review-item .des:after {
            content: "";
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-bottom: 10px solid #F5F5F5;
            border-right: 10px solid transparent;
            position: absolute;
            left: 28px;
            top: -10px;
        }

        .salon-product-details-page .review-dialog .review-item .des p {
            margin: 0;
            font-style: italic;
            font-size: 14px;
            line-height: 18px;
        }

.salon-product-details-page .review-dialog.employee-review {
    position: relative;
    overflow-x: visible;
    overflow-y: visible;
}

    .salon-product-details-page .review-dialog.employee-review .er-wrapper {
        margin: 0 15px;
        padding: 15px;
        background-color: #D2D2D2;
        overflow: hidden;
        border: 1px solid #ADADAD;
    }

    .salon-product-details-page .review-dialog.employee-review .modal-hide {
        background-color: #D2D2D2;
        color: #333;
        font-weight: bold;
        font-size: 12px;
        width: 80px;
        height: 35px;
        position: absolute;
        top: -34px;
        left: 50%;
        margin-left: -40px;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        border: 1px solid #ADADAD;
        border-bottom: none;
    }

@media(max-width: 1200px) and (min-width: 992px) {
    .salon-product-details-page .widget .widget-footer {
        left: 0;
        right: 0;
    }
}

@media (max-width: 767px) {
    .salon-product-details-page .review-dialog .review-content .user-reviews {
        margin-top: 30px;
    }

    .salon-product-details-page .widget-box {
        height: 380px;
    }

    .salon-product-details-page .widget .widget-footer {
        height: 88px;
    }

        .salon-product-details-page .widget .widget-footer .btn {
            margin-bottom: 5px;
            width: 100%;
        }
}
/* Popup */

.salon-product-details-page .product-details {
    padding: 15px;
    overflow: hidden;
}

    .salon-product-details-page .product-details .flexslider .slides img {
        height: 250px;
        width: 100%;
        object-fit: cover;
    }

    .salon-product-details-page .product-details h2 {
        font-size: 24px;
        font-weight: 300;
    }

    .salon-product-details-page .product-details p {
        margin-top: 10px;
    }

    .salon-product-details-page .product-details .price {
        font-size: 32px;
        font-weight: bold;
        margin: 10px 0;
        display: inline-block;
        border-radius: 3px;
    }

    .salon-product-details-page .product-details .offer {
        margin: 0 20px;
        font-size: 25px;
        text-decoration: line-through;
    }

    .salon-product-details-page .product-details .artist {
        margin-top: 30px;
        background-color: #E6E6E6;
        padding: 15px;
        border-top: 1px solid #AFAFAF;
    }

        .salon-product-details-page .product-details .artist h3 {
            margin: 0px 0px 20px 0px;
        }

        .salon-product-details-page .product-details .artist .team-thumb {
            display: inline-block;
            padding: 0 10px;
            margin-bottom: 20px;
            width: 140px;
            vertical-align: top;
        }

            .salon-product-details-page .product-details .artist .team-thumb img {
                width: 120px;
                height: 120px;
                border-radius: 50%;
                -webkit-filter: grayscale(100%);
                -webkit-transition: .25s ease-in-out;
                -moz-transition: .25s ease-in-out;
                -o-transition: .25s ease-in-out;
                transition: .25s ease-in-out;
            }

            .salon-product-details-page .product-details .artist .team-thumb:hover .thumb-img {
                -webkit-filter: grayscale(0);
            }

            .salon-product-details-page .product-details .artist .team-thumb .artist-name {
                font-size: 14px;
                margin-top: 10px;
            }

@media (max-width: 991px) {
    .salon-product-details-page .product-details {
        text-align: center;
    }
}
/* Booking Modal */

.booking-popup .modal-login {
    width: 360px;
    margin: 30px auto;
}

@media (max-width: 479px) {
    .booking-popup .modal-login {
        width: 285px;
    }
}

.booking-popup .modal-header {
    background-color: #ffffff;
    color: #000000;
    border-bottom: 1px solid #cccccc;
}

.booking-popup .error {
    color: #e84c4c;
    font-weight: bold;
}
/* Booking Breadcrumb */

.booking-popup #booking-breadcrumb {
    padding: 0px 30px;
    width: 100%;
}

.booking-popup .breadcrumb-item {
    position: relative;
    width: 16.66%;
    height: 50px;
    float: left;
    background-color: #f3f3f3;
    color: #333;
    cursor: pointer;
    padding-right: 30px;
    border-top: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    overflow: hidden;
}

    .booking-popup .breadcrumb-item:hover {
        color: #747096;
    }

    .booking-popup .breadcrumb-item.active {
        background-color: #747096;
        color: #fff;
        border-top: 1px solid #747096;
        border-bottom: 1px solid #747096;
    }

    .booking-popup .breadcrumb-item.disable {
        cursor: default;
        color: #BBB;
    }

    .booking-popup .breadcrumb-item:last-child {
        border-right: 1px solid #CCC;
    }

.booking-popup .circle,
.breadcrumb-text {
    display: inline-block;
    vertical-align: middle;
}

.booking-popup .circle {
    position: relative;
    -ms-border-radius: 50%;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    left: -10px;
    text-align: center;
    border-right: 2px solid #333;
    padding: 16px 0px 10px 10px;
}

.booking-popup .breadcrumb-text h3 {
    font-size: 18px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.booking-popup .breadcrumb-text p {
    font-size: 11px;
    text-align: left;
    margin-top: -3px;
    margin-bottom: 5px;
}

.booking-popup .breadcrumb-item:hover .circle {
    border-right: 2px solid #747096;
}

.booking-popup .breadcrumb-item.active .circle {
    border-right: 2px solid #fff;
}

.booking-popup .breadcrumb-item-content {
    margin: 30px;
}

    .booking-popup .breadcrumb-item-content .actions {
        text-align: center;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .booking-popup .breadcrumb-item-content .img-tile {
        display: inline-block;
        float: none;
    }

        .booking-popup .breadcrumb-item-content .img-tile.selected:after {
            position: absolute;
            right: 5px;
            top: 5px;
            z-index: 1;
            height: 35px;
            width: 35px;
            padding: 5px;
            background-color: #747096;
            border: 2px solid #FFF;
            border-radius: 50%;
            text-align: center;
            box-shadow: 0 2px 2px #8d8d8d;
            font-family: 'FontAwesome';
            content: '\f00c';
            font-size: 18px;
            color: #fff;
        }

.booking-popup .breadcrumb-item {
    width: 33.33%;
    text-align: left;
}

.booking-popup .summery {
    text-align: center;
    display: table;
    width: 100%;
    padding: 0 30px;
}

    .booking-popup .summery .sum-left {
        position: relative;
        display: table-cell;
        vertical-align: middle;
        width: 40%;
        border: 1px solid #cccccc;
        padding: 15px;
        background: #eeeeee;
    }

        .booking-popup .summery .sum-left .rate {
            position: absolute;
            top: -4px;
            right: -4px;
            z-index: 10;
            width: 80px;
            height: 80px;
            background: url(../img/promo-rate-tag.png) no-repeat top right;
            background-size: cover;
            padding: 14px 5px;
            font-size: 16px;
            font-weight: bold;
            color: #ffffff;
            text-align: right;
        }

        .booking-popup .summery .sum-left h2 {
            font-size: 24px;
            font-weight: normal;
            color: #747096;
            margin: 15px 0 5px 0;
        }

        .booking-popup .summery .sum-left .time {
            display: inline-block;
            padding: 10px 15px;
            background-color: #464646;
            border-radius: 10px;
            border: 1px solid #cccccc;
            color: #ffffff;
        }

        .booking-popup .summery .sum-left h4 {
            font-size: 18px;
            font-weight: 300;
            margin: 5px 0;
        }

        .booking-popup .summery .sum-left h5 {
            font-weight: bold;
            font-size: 16px;
            margin: 5px 0 15px 0;
        }

        .booking-popup .summery .sum-left .actual-price {
            display: inline-block;
            position: relative;
            font-size: 16px;
            color: #999999;
        }

            .booking-popup .summery .sum-left .actual-price:before,
            .booking-popup .summery .sum-left .actual-price:after {
                content: "";
                position: absolute;
                top: 10px;
                left: 0;
                right: 0;
                background: #999999;
                height: 1px;
            }

            .booking-popup .summery .sum-left .actual-price:before {
                -webkit-transform: translateX(-1%) rotate(9deg);
                -moz-transform: translateX(-1%) rotate(9deg);
                -o-transform: translateX(-1%) rotate(9deg);
                -ms-transform: translateX(-1%) rotate(9deg);
                transform: translateX(-1%) rotate(9deg);
            }

            .booking-popup .summery .sum-left .actual-price:after {
                -webkit-transform: translateX(0%) rotate(-9deg);
                -moz-transform: translateX(0%) rotate(-9deg);
                -o-transform: translateX(0%) rotate(-9deg);
                -ms-transform: translateX(0%) rotate(-9deg);
                transform: translateX(0%) rotate(-9deg);
            }

        .booking-popup .summery .sum-left .new-price {
            font-size: 24px;
            font-weight: 300;
            margin-bottom: 10px;
        }

    .booking-popup .summery .sum-right {
        display: table-cell;
        vertical-align: middle;
        width: 40%;
        border: 1px solid #cccccc;
        padding: 15px;
        background: #eeeeee;
    }

        .booking-popup .summery .sum-right img {
            width: 120px;
            height: auto;
            border-radius: 50%;
        }

        .booking-popup .summery .sum-right h3 {
            margin: 10px 0;
            font-size: 20px;
            font-weight: normal;
        }

        .booking-popup .summery .sum-right p {
            color: #F44336;
            font-size: 16px;
            font-weight: bold;
            margin-bottom: 5px;
        }

    .booking-popup .summery .sum-center {
        display: table-cell;
        vertical-align: middle;
        width: 20%;
    }
    .booking-popup .summery .sum-center i {
        font-size: 75px;
        color: #999999;
    }
    .booking-popup .summery .sum-center .promo-code {
        display: flex;
        flex-direction: column;
        padding: 0 15px;
        text-align:center;
    }

.booking-popup .comment {
    padding: 15px 30px;
}

@media (max-width: 991px) {
    .booking-popup .breadcrumb-text h3 {
        font-size: 14px;
    }

    .booking-popup .summery {
        display: block;
        padding: 0px 100px;
    }

        .booking-popup .summery .sum-left {
            display: block;
            width: 100%;
        }

            .booking-popup .summery .sum-left h2 {
                font-size: 22px;
            }

            .booking-popup .summery .sum-left h4 {
                font-size: 16px;
            }

        .booking-popup .summery .sum-right {
            display: block;
            width: 100%;
        }

        .booking-popup .summery .sum-center {
            display: block;
            width: 100%;
        }
        .booking-popup .summery .sum-center i {
            font-size: 60px;
        }
        .booking-popup .summery .sum-center .promo-code {
            margin-bottom: 20px;
        }

    .booking-popup .comment {
        padding: 15px 100px;
    }
}

@media (max-width: 767px) {
    .booking-popup #booking-breadcrumb {
        text-align: center;
        height: 60px;
    }

    .booking-popup .breadcrumb-item {
        float: none;
        display: inline-block;
        vertical-align: middle;
        width: 50px !important;
        height: 50px !important;
        border-radius: 50% !important;
        margin: 0px 6%;
        overflow: visible;
    }

    .booking-popup .circle {
        border: none !important;
        left: 0;
        padding: 16px 10px;
    }

        .booking-popup .circle:after {
            content: "";
            position: absolute;
            top: 0;
            left: 50px;
            height: 25px;
            width: 150%;
            border-bottom: 2px dashed #cccccc;
        }

    .booking-popup .breadcrumb-item:last-child .circle:after {
        border-bottom: none;
    }

    .booking-popup .breadcrumb-item .breadcrumb-text {
        position: absolute;
        display: block;
        width: 90px;
        left: -20px;
        color: #666666;
        text-align: center !important;
    }

        .booking-popup .breadcrumb-item .breadcrumb-text h3 {
            font-size: 12px;
        }

        .booking-popup .breadcrumb-item .breadcrumb-text p {
            display: none;
        }

    .booking-popup .summery {
        padding: 0px 0px;
    }

        .booking-popup .summery .sum-right .form-inline .input-group {
            display: inline-table;
            vertical-align: middle;
        }

    .booking-popup .comment {
        padding: 15px 0px;
    }
}

.booking-popup .btn-next {
    width: 150px;
    background-color: #412E48;
    border-color: #412E48;
    color: #fff;
    border: 0 none;
    border-radius: 1px;
    cursor: pointer;
    padding: 10px 5px;
    margin: 10px 5px 0 0;
    text-transform: uppercase;
}

    .booking-popup .btn-next:hover {
        background-color: #29172F;
        color: #fff;
    }
/* Date Picker */

.booking-popup .datepick-box {
    display: inline-block;
    padding: 10px;
    background-color: rgba(0, 0, 0, .05);
    border: 1px solid #e4e4e4;
}
/* Time Picker */

.booking-popup .time-slot-b {
    position: relative;
    height: 200px;
    width: 200px;
    margin: 5px;
    display: inline-block;
    cursor: pointer;
    background-color: #626262;
    transform: scale(1);
    overflow: hidden;
    color: #fff;
    padding: 30px 0;
}

    .booking-popup .time-slot-b:hover {
        transform: scale(0.98);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

.booking-popup .time-slot {
    position: relative;
    padding: 8px 12px;
    width: 112px;
    display: inline-block;
    cursor: pointer;
    background-color: #eee;
    transform: scale(1);
    margin: 0px 2px;
    overflow: hidden;
    color: #fff;
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .booking-popup .time-slot.col-lg-12 {
        width: 100%;
        height: 70px;
    }

    .booking-popup .time-slot:hover {
        transform: scale(0.98);
    }

.booking-popup .time-slot-lunch {
    font-size: 24px;
    color: #fff;
    text-align: center;
    line-height: 60px;
}

.booking-popup .time-slot-booking {
    font-size: 16px;
    color: #fff;
    text-align: center;
    font-weight: normal;
}

.booking-popup .time-slot.selected {
    background-color: rgb(116, 112, 150);
}

.booking-popup .time-slot.available {
    background-color: #6CD669;
}

.booking-popup .time-slot.disabled {
    background-color: #eee;
    color: #ccc;
    cursor: not-allowed;
    transform: scale(1) !important;
}

.booking-popup .time-slot.closed {
    background-color: #000;
    cursor: not-allowed;
    transform: scale(1) !important;
}

.booking-popup .time-slot-legend {
    list-style: none;
    padding: 0;
    margin: 20px 0;
    border-bottom: 1px solid #eee;
}

    .booking-popup .time-slot-legend > li {
        display: inline-block;
    }

        .booking-popup .time-slot-legend > li > span {
            padding: 5px 10px;
            background-color: #ccc;
            color: #fff;
        }

            .booking-popup .time-slot-legend > li > span.available {
                background-color: #87D37C;
            }

            .booking-popup .time-slot-legend > li > span.selected {
                background-color: rgb(116, 112, 150);
            }

            .booking-popup .time-slot-legend > li > span.disabled {
                background-color: #eee;
                color: #ccc;
            }

            .booking-popup .time-slot-legend > li > span.closed {
                background-color: #000000;
            }

.booking-popup .fully-closed button {
    background-color: #ffc107;
}

    .booking-popup .fully-closed button span {
        color: #000000;
        opacity: 0.5;
    }


/****************************************************************************************************
#####################################################################################################
****************************** Salon New Services Page ***********************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-newservices-page .service-nav {
    float: left;
    position: fixed;
    width: 250px;
    overflow-y: auto;
    overflow-x: hidden;
}

    .salon-inner-page.salon-newservices-page .service-nav.fixed-pos {
        margin-top: 0 !important;
    }

    .salon-inner-page.salon-newservices-page .service-nav::-webkit-scrollbar {
        display: none;
    }

.salon-inner-page.salon-newservices-page .service-list {
    position: relative;
    margin-left: 265px;
}

.salon-inner-page.salon-newservices-page .cat-panel {
    margin: 0;
}

    .salon-inner-page.salon-newservices-page .cat-panel .cat-title a {
        display: table;
        width: 100%;
    }

        .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > img {
            width: 40px;
            height: auto;
            display: table-cell;
            vertical-align: middle;
            margin-right: 10px;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > .desc {
            width: 100%;
            display: table-cell;
            vertical-align: middle;
        }

            .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > .desc h4 {
                margin: 0 0 5px 0;
                font-size: 17px;
                color: #333333;
            }

            .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > .desc h6 {
                margin: 5px 0 0 0;
                font-size: 12px;
                color: #999999;
            }

    .salon-inner-page.salon-newservices-page .cat-panel .all-services {
        background-color: #f5f5f5;
    }

        .salon-inner-page.salon-newservices-page .cat-panel .all-services .cat-title a > i {
            width: 50px;
            font-size: 35px;
            padding: 0 5px;
            color: #333333;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .all-services .cat-title a > .desc h4 {
            color: #333333;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .all-services .cat-title a > .desc h6 {
            color: #999999;
        }

    .salon-inner-page.salon-newservices-page .cat-panel .promotions {
        background-color: #ffecec;
    }

        .salon-inner-page.salon-newservices-page .cat-panel .promotions .cat-title a > i {
            width: 50px;
            font-size: 35px;
            padding: 0 5px;
            color: #e50a12;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .promotions .cat-title a > .desc h4 {
            color: #e50a12;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .promotions .cat-title a > .desc h6 {
            color: #ff9b9f;
        }

    .salon-inner-page.salon-newservices-page .cat-panel .packages {
        background-color: #e6e5f3;
    }

        .salon-inner-page.salon-newservices-page .cat-panel .packages .cat-title a > i {
            width: 50px;
            font-size: 35px;
            padding: 0 5px;
            color: #747096;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .packages .cat-title a > .desc h4 {
            color: #747096;
        }

        .salon-inner-page.salon-newservices-page .cat-panel .packages .cat-title a > .desc h6 {
            color: #b6b3d2;
        }

.salon-inner-page.salon-newservices-page .subcat-list {
    padding: 0;
    margin: 0 0 0 15px;
    list-style: none;
}

    .salon-inner-page.salon-newservices-page .subcat-list > li {
        padding: 2px 0;
        cursor: pointer;
    }

        .salon-inner-page.salon-newservices-page .subcat-list > li.all {
            font-weight: bold;
        }

        .salon-inner-page.salon-newservices-page .subcat-list > li.active {
            color: #970067;
        }

        .salon-inner-page.salon-newservices-page .subcat-list > li small {
            color: #999999;
        }

@media (min-width: 768px) and (max-width: 991px) {
    .salon-inner-page.salon-newservices-page .service-nav {
        width: 220px;
    }

    .salon-inner-page.salon-newservices-page .service-list {
        margin-left: 235px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .panel-heading {
        padding: 10px 5px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > img {
        width: 35px;
        margin-right: 5px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .promotions .cat-title a > i {
        width: 40px;
        font-size: 32px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .packages .cat-title a > i {
        width: 42px;
        font-size: 30px;
        padding: 0 5px;
        color: #673AB7;
    }
}

@media (max-width: 767px) {
    .salon-inner-page.salon-newservices-page .service-nav {
        float: none;
        position: relative;
        width: 100%;
        max-width: auto;
        margin: 0 0 15px 0 !important;
        top: 0 !important;
        overflow: visible;
        z-index: 2;
    }

    .salon-inner-page.salon-newservices-page .service-list {
        margin-left: 0;
        min-width: auto;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .panel-heading {
        padding: 5px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > .desc h4 {
        font-size: 16px;
        margin: 0 0 2px 0;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > .desc h6 {
        margin: 2px 0 0 0;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .cat-title a > img {
        width: 35px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .promotions .cat-title a > i {
        width: 44px;
        font-size: 32px;
    }

    .salon-inner-page.salon-newservices-page .cat-panel .packages .cat-title a > i {
        width: 45px;
        font-size: 30px;
    }
}

.salon-inner-page.salon-newservices-page .service-item {
    position: relative;
    display: table;
    width: 100%;
    border: 1px solid #cccccc;
    margin: 0 0 8px 0;
}

    .salon-inner-page.salon-newservices-page .service-item .rate {
        position: absolute;
        top: -4px;
        right: -4px;
        z-index: 10;
        width: 71px;
        height: 68px;
        background: url(img/promo-rate-tag.png) no-repeat top right;
        background-size: cover;
        padding: 5px 2px;
        font-size: 16px;
        font-weight: bold;
        color: #ffffff;
        text-align: right;
        pointer-events: none;
    }

    .salon-inner-page.salon-newservices-page .service-item .image {
        display: table-cell;
        vertical-align: middle;
    }

        .salon-inner-page.salon-newservices-page .service-item .image img {
            height: 120px;
            width: auto;
        }

    .salon-inner-page.salon-newservices-page .service-item .desc {
        display: table-cell;
        vertical-align: middle;
        width: 100%;
        padding: 10px;
    }

        .salon-inner-page.salon-newservices-page .service-item .desc h2 {
            margin: 0 0 5px 0;
            font-size: 24px;
            font-weight: 400;
        }

    .salon-inner-page.salon-newservices-page .service-item .price {
        display: table-cell;
        vertical-align: middle;
        min-width: 200px;
        width: 200px;
        padding: 10px;
        text-align: center;
    }
    .salon-inner-page.salon-newservices-page .service-item .price .lower-price {
        color:#000000;
        font-size:12px;
        font-weight:bold;
    }

        .salon-inner-page.salon-newservices-page .service-item .price h3 {
            color: #747096;
            font-size: 22px;
            font-weight: bold;
            margin: 0 0 10px 0;
        }

            .salon-inner-page.salon-newservices-page .service-item .price h3 span.new-price {
                display: block;
                font-size: 18px;
                font-weight: 400;
            }

            .salon-inner-page.salon-newservices-page .service-item .price h3 span.old-price {
                position: relative;
                display: inline-block;
                margin: 0 0 5px 0;
                padding: 0 5px;
                font-size: 14px;
                font-weight: bold;
                color: #666666;
            }

                .salon-inner-page.salon-newservices-page .service-item .price h3 span.old-price:before,
                .salon-inner-page.salon-newservices-page .service-item .price h3 span.old-price:after {
                    content: "";
                    position: absolute;
                    top: 7px;
                    left: 0;
                    right: 0;
                    background: #666666;
                    height: 1px;
                }

                .salon-inner-page.salon-newservices-page .service-item .price h3 span.old-price:before {
                    -webkit-transform: translateX(-1%) rotate(9deg);
                    -moz-transform: translateX(-1%) rotate(9deg);
                    -o-transform: translateX(-1%) rotate(9deg);
                    -ms-transform: translateX(-1%) rotate(9deg);
                    transform: translateX(-1%) rotate(9deg);
                }

                .salon-inner-page.salon-newservices-page .service-item .price h3 span.old-price:after {
                    -webkit-transform: translateX(0%) rotate(-9deg);
                    -moz-transform: translateX(0%) rotate(-9deg);
                    -o-transform: translateX(0%) rotate(-9deg);
                    -ms-transform: translateX(0%) rotate(-9deg);
                    transform: translateX(0%) rotate(-9deg);
                }

@media (max-width: 991px) {
    .salon-inner-page.salon-newservices-page .service-item .desc h2 {
        font-size: 18px;
    }
}

@media (max-width: 767px) {
    .salon-inner-page.salon-newservices-page .service-item {
        display: block;
        margin-bottom: 15px;
    }

        .salon-inner-page.salon-newservices-page .service-item .image {
            display: block;
        }

            .salon-inner-page.salon-newservices-page .service-item .image img {
                height: auto;
                width: 100%;
            }

        .salon-inner-page.salon-newservices-page .service-item .desc {
            display: block;
            text-align: center;
            padding-bottom: 0;
        }

        .salon-inner-page.salon-newservices-page .service-item .price {
            display: block;
            width: 100%;
            text-align: center;
            padding-top: 0;
            padding-bottom: 15px;
        }
}


/****************************************************************************************************
#####################################################################################################
****************************** Salon New Services Item Page *****************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-newservicesitem-page {
    padding: 0 0 30px 0;
}

    .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li {
    }

        .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li a {
            height: 300px;
            display: block;
            text-align: center;
            background-color: #ececec;
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
        }

            .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li a img {
                height: 100%;
                width: auto;
                margin: 0 auto;
            }

    .salon-inner-page.salon-newservicesitem-page h1 {
        font-size: 24px;
    }

    .salon-inner-page.salon-newservicesitem-page .price {
        line-height:1;
    }
    .salon-inner-page.salon-newservicesitem-page .price .lower-price {
        color:#000000;
        font-size:12px;
        font-weight:bold;
    }

    .salon-inner-page.salon-newservicesitem-page .price .old-price {
        position: relative;
        display: inline-block;
        margin: 10px 0 5px 0;
        font-size: 16px;
        font-weight: bold;
        color: #666666;
    }

        .salon-inner-page.salon-newservicesitem-page .price .old-price:before,
        .salon-inner-page.salon-newservicesitem-page .price .old-price:after {
            content: "";
            position: absolute;
            top: 10px;
            left: 0;
            right: 0;
            background: #666666;
            height: 1px;
        }

        .salon-inner-page.salon-newservicesitem-page .price .old-price:before {
            -webkit-transform: translateX(-1%) rotate(9deg);
            -moz-transform: translateX(-1%) rotate(9deg);
            -o-transform: translateX(-1%) rotate(9deg);
            -ms-transform: translateX(-1%) rotate(9deg);
            transform: translateX(-1%) rotate(9deg);
        }

        .salon-inner-page.salon-newservicesitem-page .price .old-price:after {
            -webkit-transform: translateX(0%) rotate(-9deg);
            -moz-transform: translateX(0%) rotate(-9deg);
            -o-transform: translateX(0%) rotate(-9deg);
            -ms-transform: translateX(0%) rotate(-9deg);
            transform: translateX(0%) rotate(-9deg);
        }

    .salon-inner-page.salon-newservicesitem-page .price .new-price {
        display: inline-block;
        font-size: 28px;
        font-weight: 400;
        color: #747096;
    }

    .salon-inner-page.salon-newservicesitem-page .actions .btn {
        width: 170px;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap {
        border-top: 5px solid #cccccc;
        margin-top: 15px;
    }

        .salon-inner-page.salon-newservicesitem-page .artist-wrap h3 {
            margin: 15px 0;
            font-size: 20px;
        }

.artist-inner {
    text-align: center;
}

.salon-inner-page.salon-newservicesitem-page .artist-wrap .artist {
    display: inline-block;
    vertical-align: top;
    width: 25%;
    margin: 10px -3px;
    text-align: center;
}

    .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist img {
        width: 80%;
        height: auto;
        margin: 0 auto;
        border-radius: 15px;
        overflow: hidden;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist h4 {
        font-size: 16px;
        font-weight: bold;
        color: #666666;
    }

.salon-inner-page.salon-newservicesitem-page .share {
    text-align: center;
}

.salon-inner-page.salon-newservicesitem-page .avg-rating-num {
    width: 100px;
    height: 100px;
    margin: 15px auto 5px auto;
    background-color: #000000;
    border-radius: 50%;
    color: #ffffff;
    font-size: 52px;
    padding: 12px;
}

.salon-inner-page.salon-newservicesitem-page .avg-rating .rating-stars {
    font-size: 20px;
}

.salon-inner-page.salon-newservicesitem-page .histo {
    margin: 10px 0;
}

.salon-inner-page.salon-newservicesitem-page .btn-rate {
    margin: 0 auto;
    display: inherit;
    background: #ec9108;
    color: #ffffff;
}

    .salon-inner-page.salon-newservicesitem-page .btn-rate:hover,
    .salon-inner-page.salon-newservicesitem-page .btn-rate:focus {
        background: #d07f06;
        color: #ffffff;
    }

.salon-inner-page.salon-newservicesitem-page .user-rating {
    display: none;
    position: relative;
    margin: 10px 0;
    padding: 10px;
    border: 1px solid #d2adb3;
    background: #e7c5cb;
}

    .salon-inner-page.salon-newservicesitem-page .user-rating .btn-rate {
        display: inline-block;
    }

    .salon-inner-page.salon-newservicesitem-page .user-rating.show-rating {
        display: block;
    }

.salon-inner-page.salon-newservicesitem-page .rating-close {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 20px;
    color: #999999;
    cursor: pointer;
}

.salon-inner-page.salon-newservicesitem-page .user-reviews {
    margin-top: 15px;
    border-top: 1px solid #cccccc;
    padding: 10px 5px 0 0;
    max-height: 400px;
    overflow-y: scroll;
}

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar {
        width: 5px;
        height: 0;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-button {
        display: none;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-track {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        background-color: #ffffff !important;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-track-piece {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        background-color: #ffffff !important;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-thumb {
        height: 10px;
        border-radius: 4px;
        background-color: rgba(0,0,0,0.0) !important;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews:hover::-webkit-scrollbar-thumb {
        background-color: rgba(0,0,0,0.2) !important;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-thumb:hover {
        border-radius: 4px;
        background-color: rgba(0,0,0,0.3) !important;
    }

    .salon-inner-page.salon-newservicesitem-page .user-reviews::-webkit-scrollbar-corner {
        background-color: #ffffff !important;
    }


.salon-inner-page.salon-newservicesitem-page .review-item {
    margin-bottom: 10px;
}

    .salon-inner-page.salon-newservicesitem-page .review-item .details {
        display: table;
        width: 100%;
    }

        .salon-inner-page.salon-newservicesitem-page .review-item .details .image {
            display: table-cell;
            vertical-align: middle;
            width: 65px;
            height: 65px;
            border-radius: 50%;
            overflow: hidden;
        }

            .salon-inner-page.salon-newservicesitem-page .review-item .details .image img {
                width: 100%;
                height: auto;
            }

        .salon-inner-page.salon-newservicesitem-page .review-item .details .data {
            display: table-cell;
            vertical-align: middle;
            padding-left: 5px;
        }

            .salon-inner-page.salon-newservicesitem-page .review-item .details .data h4 {
                font-size: 16px;
                margin: 0;
                color: #747096;
            }

    .salon-inner-page.salon-newservicesitem-page .review-item .des {
        position: relative;
        border: 1px solid #cccccc;
        background-color: #f3f3f3;
        border-radius: 5px;
        padding: 5px;
        margin-top: 10px;
    }

        .salon-inner-page.salon-newservicesitem-page .review-item .des:before {
            content: "";
            position: absolute;
            top: -9px;
            left: 26px;
            border-bottom: 9px solid #cccccc;
            border-left: 6px solid transparent;
            border-right: 6px solid transparent;
        }

        .salon-inner-page.salon-newservicesitem-page .review-item .des:after {
            content: "";
            position: absolute;
            top: -7px;
            left: 27px;
            border-bottom: 8px solid #f3f3f3;
            border-left: 5px solid transparent;
            border-right: 5px solid transparent;
        }

        .salon-inner-page.salon-newservicesitem-page .review-item .des p {
            margin: 0;
            font-size: 13px;
            font-style: italic;
        }

@media (max-width: 1199px) {
    .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li a {
        height: 240px;
    }

    .salon-inner-page.salon-newservicesitem-page .actions .btn {
        width: 140px;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist h4 {
        font-size: 14px;
    }
}

@media (max-width: 991px) {
    .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li a {
        height: 170px;
    }

    .salon-inner-page.salon-newservicesitem-page .price .new-price {
        font-size: 24px;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap h3 {
        font-size: 18px;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist {
        width: 33.33%;
    }

        .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist h4 {
            font-size: 14px;
        }

    .salon-inner-page.salon-newservicesitem-page .review-item .details .data h4 {
        font-size: 14px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .salon-inner-page.salon-newservicesitem-page .actions .btn {
        width: 100px;
        font-size: 12px;
    }
}

@media (max-width: 767px) {
    .salon-inner-page.salon-newservicesitem-page .flexslider .slides > li a {
        height: 300px;
    }

    .salon-inner-page.salon-newservicesitem-page .service-details {
        text-align: center;
    }

    .salon-inner-page.salon-newservicesitem-page .artist-wrap {
        border-bottom: 5px solid #cccccc;
        margin-bottom: 30px;
    }

        .salon-inner-page.salon-newservicesitem-page .artist-wrap .artist {
            width: 50%;
        }
}

/****************************************************************************************************
#####################################################################################################
****************************** Salon Gallery Page ***************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-albums-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-albums-page .albums .gal-img {
    width: 250px;
    height: 250px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .salon-albums-page .albums .gal-img:hover {
        transform: scale(0.99);
    }

    .salon-albums-page .albums .gal-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .salon-albums-page .albums .gal-img video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .salon-albums-page .albums .gal-img .gal-caption {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(3%, rgba(0, 0, 0, 0)), color-stop(56%, rgba(0, 0, 0, 0)), color-stop(64%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.65)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
        padding-top: 70%;
        color: #fff;
        -ms-opacity: 0.5;
        opacity: 0.5;
        pointer-events: none;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

        .salon-albums-page .albums .gal-img .gal-caption h3 {
            font-size: 16px;
            text-shadow: 0 0 30px rgba(150, 150, 150, 1);
        }

    .salon-albums-page .albums .gal-img:hover .gal-caption {
        opacity: 1;
    }

    .salon-albums-page .albums .gal-img.more {
        background-color: rgba(255, 255, 255, 0.4);
        color: rgba(0, 0, 0, 0.5);
    }

        .salon-albums-page .albums .gal-img.more i {
            margin-top: 45%;
            font-size: 40px;
        }

.salon-albums-page .albums .album-des {
    padding-bottom: 15px;
}

    .salon-albums-page .albums .album-des h1 {
        font-size: 30px;
        font-weight: 400;
        text-transform: uppercase;
        color: #747096;
    }
/****************************************************************************************************
#####################################################################################################
****************************** Salon Contact Page ***************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-contact-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-contact-page a {
    cursor: pointer;
    display: inline-block;
    padding-left: 35px;
    vertical-align: middle;
    word-break: break-all;
    color: #747096;
}

.salon-contact-page .google-map {
    margin: 15px 0;
}

.salon-contact-page .contact-form {
    margin: 15px 0;
}

.salon-contact-page .salon-details {
    background-color: #e2e1ec;
    overflow: hidden;
    margin: 15px 0px;
    padding: 30px;
}

.salon-contact-page .con-sec {
    padding-bottom: 20px;
}

    .salon-contact-page .con-sec h4 {
        font-weight: bold;
    }

    .salon-contact-page .con-sec ul.master-list {
        list-style: none;
        padding: 0;
    }

        .salon-contact-page .con-sec ul.master-list li {
            margin-left: 0;
            margin-right: 0;
            margin-top: 2px;
            min-height: 25px;
            position: relative;
        }

            .salon-contact-page .con-sec ul.master-list li:not(:last-child) {
                margin-bottom: 10px;
            }

        .salon-contact-page .con-sec ul.master-list.address li {
            margin-bottom: 2px;
            min-height: auto;
        }

.salon-contact-page span.icon {
    background-color: #333333;
    border-radius: 3px;
    color: #ffffff;
    display: inline-block;
    height: 25px;
    overflow: hidden;
    padding: 2px;
    position: absolute;
    text-align: center;
    vertical-align: middle;
    width: 25px;
}

.salon-contact-page .branch-list,
.salon-contact-page .branch-list .cont-info {
    list-style: outside none none;
    padding-left: 0px;
}

    .salon-contact-page .branch-list > li {
        margin-bottom: 25px;
        padding-left: 20px;
        position: relative;
    }

        .salon-contact-page .branch-list > li::before {
            border: 1px solid #747096;
            border-radius: 50%;
            content: "";
            display: inline-block;
            height: 10px;
            left: 0;
            position: absolute;
            top: 5px;
            width: 10px;
        }

        .salon-contact-page .branch-list > li::after {
            border-left: 1px dashed #747096;
            bottom: -30px;
            content: "";
            left: 4px;
            position: absolute;
            top: 15px;
            z-index: 1;
        }

        .salon-contact-page .branch-list > li:last-child::after {
            display: none;
        }

    .salon-contact-page .branch-list .cont-info {
        margin-top: 8px;
    }

        .salon-contact-page .branch-list .cont-info > li {
            color: #999999;
            font-size: 75%;
        }

            .salon-contact-page .branch-list .cont-info > li:not(:last-child) {
                margin-bottom: 5px;
            }

            .salon-contact-page .branch-list .cont-info > li > i.fa {
                background-color: #888888;
                border-radius: 50%;
                color: #ffffff;
                display: inline-block;
                height: 15px;
                line-height: 15px;
                text-align: center;
                width: 15px;
            }

@media (max-width: 991px) {
    .salon-contact-page .salon-details {
        margin-top: 0px;
        padding: 15px;
    }
}

@media (max-width: 768px) {
    .salon-contact-page .con-sec {
        padding-bottom: 5px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Team Page ******************************************************
#####################################################################################################
****************************************************************************************************/

.salon-team-page .team-slider {
    position: relative;
}

    .salon-team-page .team-slider .flexslider {
        margin-top: -15px;
    }

        .salon-team-page .team-slider .flexslider .image {
            position: relative;
            width: 100%;
            ;
            height: 512px;
            overflow: hidden;
            background-repeat: no-repeat;
            background-position: top center;
            background-size: cover;
        }

            .salon-team-page .team-slider .flexslider .image .caption {
                position: absolute;
                bottom: 0px;
                left: 0px;
                right: 0px;
                padding: 15px;
                font-size: 20px;
                font-weight: 300;
                color: #fff;
                background-color: rgba(0, 0, 0, 0.5);
                text-align: center;
            }

        .salon-team-page .team-slider .flexslider .flex-control-nav {
            display: none;
        }

.salon-team-page .tm-wrap {
    margin: 15px 0px;
}

    .salon-team-page .tm-wrap .tm-block {
        display: inline-block;
        vertical-align: top;
        width: 260px;
        text-align: center;
        margin: 15px;
        cursor: pointer;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        -ms-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

        .salon-team-page .tm-wrap .tm-block:hover {
            -webkit-transform: scale(0.99);
            -moz-transform: scale(0.99);
            -ms-transform: scale(0.99);
            -o-transform: scale(0.99);
            transform: scale(0.99);
        }

        .salon-team-page .tm-wrap .tm-block .tm-image {
            width: 260px;
            height: 260px;
            border: 5px solid #ffffff;
            border-radius: 50%;
            -webkit-box-shadow: 0px 0px 0px 1px rgba(204, 204, 204, 1);
            -moz-box-shadow: 0px 0px 0px 1px rgba(204, 204, 204, 1);
            box-shadow: 0px 0px 0px 1px rgba(204, 204, 204, 1);
            overflow: hidden;
        }

            .salon-team-page .tm-wrap .tm-block .tm-image img {
                width: 100%;
                height: auto;
            }

        .salon-team-page .tm-wrap .tm-block .tm-name {
            font-size: 20px;
            font-weight: 300;
            text-transform: uppercase;
        }

        .salon-team-page .tm-wrap .tm-block .tm-des {
            font-size: 14px;
            font-weight: bold;
            color: #999999;
        }
/* Popup */

#artistProfile .modal-content {
    overflow: hidden;
}

#artistProfile .profile-user-page .user-profile-header {
    text-align: center;
    background-color: #f3f3f3;
}

#artistProfile .profile-user-page .img-user-profile {
    min-height: 100px;
}

    #artistProfile .profile-user-page .img-user-profile img {
        border-bottom: .2em solid #fff;
        width: 100%;
    }

#artistProfile .profile-user-page .avatar {
    width: 100px;
    height: 100px;
    object-fit: cover;
    box-shadow: 0 0 .1em rgba(0, 0, 0, 0.35);
    margin-top: -75px;
}

#artistProfile .profile-user-page .user-profile-data {
    padding: 30px 15px 40px 15px;
    text-align: center;
    background-color: #f3f3f3;
}

#artistProfile .profile-user-page .description-profile {
    text-align: center;
    padding: 0 1.5em;
}

#artistProfile .profile-user-page .user-profile-data h1 {
    margin-top: 0.35em;
    color: #292f33;
    margin-bottom: 0;
}

#artistProfile .profile-user-page .user-profile-data p {
    color: #8899a6;
    font-size: 1.1em;
    margin-top: 0;
    margin-bottom: 0.5em;
}

#artistProfile .profile-user-page .description-profile {
    color: #75787b;
    font-size: 0.98em;
}

#artistProfile .profile-user-page .data-user {
    margin-bottom: 0;
    margin-top: 10px;
    cursor: pointer;
    padding: 0;
    list-style: none;
    display: table;
    width: 100%;
}

    #artistProfile .profile-user-page .data-user li {
        margin: 0;
        padding: 0;
        width: 33.33334%;
        display: table-cell;
        text-align: center;
        border-left: 0.1em solid transparent;
    }

        #artistProfile .profile-user-page .data-user li:first-child {
            border-left: 0;
        }

            #artistProfile .profile-user-page .data-user li:first-child a {
                border-bottom-left-radius: 0.3rem;
            }

        #artistProfile .profile-user-page .data-user li:last-child a {
            border-bottom-right-radius: 0.3rem;
        }

        #artistProfile .profile-user-page .data-user li a,
        .profile-user-page .data-user li strong {
            display: block;
        }

        #artistProfile .profile-user-page .data-user li a {
            background-color: #f7f7f7;
            border-top: 1px solid rgba(242, 242, 242, 0.5);
            border-bottom: .2em solid #f7f7f7;
            box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(255, 255, 255, 0.4);
            padding: .93em 0;
            color: #46494c;
        }

            #artistProfile .profile-user-page .data-user li a strong,
            .profile-user-page .data-user li a span {
                font-weight: 600;
                line-height: 1;
            }

            #artistProfile .profile-user-page .data-user li a strong {
                font-size: 2em;
            }

            #artistProfile .profile-user-page .data-user li a span {
                color: #717a7e;
            }

            #artistProfile .profile-user-page .data-user li a:hover {
                background: rgba(0, 0, 0, 0.05);
                border-bottom: .2em solid #626262;
                color: #626262;
            }

                #artistProfile .profile-user-page .data-user li a:hover span {
                    color: #626262;
                }

#artistProfile .thumb-close {
    top: 0;
    right: 8px;
    color: #A9A9A9;
    z-index: 1;
}

#artistProfile .emp-wrapper {
    margin-top: 30px;
}

#artistProfile .service-block {
    height: 190px;
    width: 150px;
    margin: 10px;
    position: relative;
    display: inline-block;
    cursor: pointer;
    overflow: hidden;
}

    #artistProfile .service-block .serviceicon {
        width: 150px;
        height: 150px;
        object-fit: cover;
        transform: scale(0.9);
        margin: 0;
    }

    #artistProfile .service-block .service-label {
        text-transform: uppercase;
        font-weight: 400;
    }

#artistProfile ul.social-buttons li a {
    display: block;
    background-color: #222;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    font-size: 16px;
    line-height: 30px;
    color: #fff;
    text-align: center;
    outline: 0;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
}

    #artistProfile ul.social-buttons li a:hover {
        background-color: #747096;
        cursor: pointer;
    }

#artistProfile .profile-user-page .member-tabs {
    margin-top: -39px;
}

    #artistProfile .profile-user-page .member-tabs .nav-tabs {
        text-align: center;
    }

        #artistProfile .profile-user-page .member-tabs .nav-tabs > li {
            float: none;
            display: inline-block;
        }

            #artistProfile .profile-user-page .member-tabs .nav-tabs > li > a {
                margin-right: 2px;
                line-height: 1.42857143;
                border-radius: 4px 4px 0 0;
                font-size: 12px;
                font-weight: bold;
                color: #747096;
                text-transform: uppercase;
            }

#artistProfile .review-dialog {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

    #artistProfile .review-dialog .review-title {
        overflow: hidden;
        padding-bottom: 15px;
        border: 1px solid #CCC;
    }

    #artistProfile .review-dialog .review-content .user-reviews {
        padding: 15px;
        background-color: #E4E4E4;
        overflow: hidden;
    }

    #artistProfile .review-dialog .review-content {
        padding: 20px 15px;
    }

        #artistProfile .review-dialog .review-content h5 {
            font-weight: bold;
            font-size: 16px;
        }

        #artistProfile .review-dialog .review-content .avg-rating .avg-rating-num {
            display: block;
            font-size: 70px;
            line-height: 66px;
            font-weight: bold;
            color: #747096;
        }

        #artistProfile .review-dialog .review-content .rating-stars.add .fa {
            font-size: 24px;
        }

        #artistProfile .review-dialog .review-content .review-write textarea {
            width: 100%;
            margin: 10px 0;
        }

        #artistProfile .review-dialog .review-content .btn-default {
            background-color: #747096;
            border-color: #747096;
            color: #FFF;
        }

            #artistProfile .review-dialog .review-content .btn-default:hover,
            .review-dialog .review-content .btn-default:focus {
                background-color: #534f79;
            }

    #artistProfile .review-dialog .review-item {
        margin-bottom: 30px;
    }

        #artistProfile .review-dialog .review-item .details {
            overflow: hidden;
        }

            #artistProfile .review-dialog .review-item .details .image {
                float: left;
                width: 75px;
                height: 75px;
                overflow: hidden;
                border: 5px solid #FFF;
                margin-right: 10px;
            }

                #artistProfile .review-dialog .review-item .details .image img {
                    width: 100%;
                    height: auto;
                }

            #artistProfile .review-dialog .review-item .details .rate-stars span.rate {
                background-color: #333333;
                padding: 1px 5px;
                font-size: 14px;
                color: #FFF;
                border-radius: 3px;
                border: 1px solid #1B1B1B;
            }

            #artistProfile .review-dialog .review-item .details .rate-name {
                font-size: 16px;
                margin-top: 3px;
                margin-bottom: 5px;
            }

        #artistProfile .review-dialog .review-item .des {
            position: relative;
            margin-top: 15px;
            padding: 8px;
            background-color: #F5F5F5;
            border-radius: 5px;
        }

            #artistProfile .review-dialog .review-item .des:after {
                content: "";
                width: 0;
                height: 0;
                border-left: 10px solid transparent;
                border-bottom: 10px solid #F5F5F5;
                border-right: 10px solid transparent;
                position: absolute;
                left: 28px;
                top: -10px;
            }

            #artistProfile .review-dialog .review-item .des p {
                margin: 0;
                font-style: italic;
                font-size: 14px;
                line-height: 18px;
            }

    #artistProfile .review-dialog.employee-review {
        position: relative;
        overflow-x: visible;
        overflow-y: visible;
    }

        #artistProfile .review-dialog.employee-review .er-wrapper {
            margin: 0 15px;
            padding: 15px;
            background-color: #D2D2D2;
            overflow: hidden;
            border: 1px solid #ADADAD;
        }

        #artistProfile .review-dialog.employee-review .modal-hide {
            background-color: #D2D2D2;
            color: #333;
            font-weight: bold;
            font-size: 12px;
            width: 80px;
            height: 35px;
            position: absolute;
            top: -34px;
            left: 50%;
            margin-left: -40px;
            border-bottom-left-radius: 0;
            border-bottom-right-radius: 0;
            border: 1px solid #ADADAD;
            border-bottom: none;
        }

@media (max-width: 767px) {
    #artistProfile .review-dialog .review-content .user-reviews {
        margin-top: 30px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Gallery Page ***************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-gallery-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-gallery-page .gallery h2 {
    font-size: 30px;
    font-weight: bold;
    text-transform: uppercase;
}

.salon-gallery-page .gallery .gal-img {
    width: 250px;
    height: 250px;
    overflow: hidden;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: 10px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
}

    .salon-gallery-page .gallery .gal-img:hover {
        -webkit-transform: scale(0.99);
        -moz-transform: scale(0.99);
        -ms-transform: scale(0.99);
        -o-transform: scale(0.99);
        transform: scale(0.99);
    }

    .salon-gallery-page .gallery .gal-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .salon-gallery-page .gallery .gal-img video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .salon-gallery-page .gallery .gal-img .gal-caption {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(3%, rgba(0, 0, 0, 0)), color-stop(56%, rgba(0, 0, 0, 0)), color-stop(64%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.65)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 3%, rgba(0, 0, 0, 0) 56%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0.65) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
        padding-top: 70%;
        color: #fff;
        -ms-opacity: 0.5;
        opacity: 0.5;
        pointer-events: none;
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

        .salon-gallery-page .gallery .gal-img .gal-caption h3 {
            font-size: 16px;
            text-shadow: 0 0 30px rgba(150, 150, 150, 1);
        }

    .salon-gallery-page .gallery .gal-img:hover .gal-caption {
        opacity: 1;
    }

    .salon-gallery-page .gallery .gal-img.more {
        background-color: rgba(255, 255, 255, 0.4);
        color: rgba(0, 0, 0, 0.5);
    }

        .salon-gallery-page .gallery .gal-img.more i {
            margin-top: 45%;
            font-size: 40px;
        }
/****************************************************************************************************
#####################################################################################################
****************************** Salon Promotions Page ************************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-promotions-page .header-img {
    background-image: url("http://justbooksalon.com/img/header-img.jpg") !important;
}

.salon-promotions-page .promotions h2 {
    font-size: 30px;
    font-weight: bold;
    text-transform: uppercase;
}

.salon-promotions-page .promotions .promo-content {
    padding-bottom: 15px;
}

.salon-promotions-page .new-promo .promo-box .promo-box-back {
    background: #333;
    white-space: nowrap;
}

.salon-promotions-page .new-promo .promo-box {
    margin: 10px;
    cursor: pointer;
    height: 200px;
    overflow: hidden;
}

    .salon-promotions-page .new-promo .promo-box .promo-image {
        height: 200px;
        width: 50%;
        display: inline-block;
        white-space: normal;
    }

        .salon-promotions-page .new-promo .promo-box .promo-image img {
            width: 100%;
            height: 200px;
            object-fit: cover;
        }

    .salon-promotions-page .new-promo .promo-box .promo-title {
        width: 50%;
        max-height: 200px;
        display: inline-block;
        vertical-align: middle;
        padding: 5px;
        white-space: normal;
    }

        .salon-promotions-page .new-promo .promo-box .promo-title h2 {
            color: #fff;
            font-size: 34px;
            letter-spacing: normal;
            font-family: 'Oswald';
            text-align: center;
            font-weight: 400;
            text-transform: uppercase;
            margin: 0px;
        }

        .salon-promotions-page .new-promo .promo-box .promo-title h3 {
            color: #786580;
            text-transform: uppercase;
            font-size: 16px;
            margin: 10px 0;
        }
/* Modal */

.modal#promotionPackageItems .rate {
    width: 120px;
    height: 120px;
    background-color: #747096;
    border-radius: 50%;
    margin: 10px auto -10px auto;
    position: relative;
    border: 5px solid #FFF;
    color: #FFF;
    font-size: 40px;
    font-weight: bold;
    padding-top: 25px;
}

.modal#promotionPackageItems .promo-wrap {
    border: 1px solid #CCC;
    margin-top: 30px;
    padding: 30px;
    background-color: #f3f3f3;
}

.modal#promotionPackageItems .promo-cat {
    display: inline-block;
    margin: 0px;
    background-color: #666;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 5px 15px;
}

.modal#promotionPackageItems .promo-date {
    margin-bottom: 10px;
}

    .modal#promotionPackageItems .promo-date .sep {
        display: inline-block;
        font-size: 12px;
        font-weight: bold;
    }

    .modal#promotionPackageItems .promo-date .from,
    .modal#promotionPackageItems .promo-date .to {
        position: relative;
        display: inline-block;
        background-color: #D8D8D8;
        padding: 8px 20px;
        margin: 0 20px;
        font-size: 16px;
        font-weight: bold;
        height: 40px;
        width: 200px;
    }

        .modal#promotionPackageItems .promo-date .from:after {
            content: "";
            width: 0;
            height: 0;
            border-top: 20px solid transparent;
            border-left: 20px solid #D8D8D8;
            border-bottom: 20px solid transparent;
            position: absolute;
            right: -20px;
            top: 50%;
            margin-top: -20px;
        }

        .modal#promotionPackageItems .promo-date .to:before {
            content: "";
            width: 0;
            height: 0;
            border-top: 20px solid transparent;
            border-right: 20px solid #D8D8D8;
            border-bottom: 20px solid transparent;
            position: absolute;
            left: -20px;
            top: 50%;
            margin-top: -20px;
        }

.modal#promotionPackageItems .des {
    margin: 30px 15px;
}

.modal#promotionPackageItems .sq-block-md {
    margin: 10px;
    position: relative;
    width: 120px;
    display: inline-block;
    cursor: pointer;
    vertical-align: top;
    padding-bottom: 5px;
    background-color: #FFF;
    overflow: hidden;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

    .modal#promotionPackageItems .sq-block-md img {
        width: 120px;
        height: 120px;
        object-fit: cover;
    }

    .modal#promotionPackageItems .sq-block-md span {
        font-size: 16px;
        font-weight: bold;
        margin-top: 5px;
        display: block;
        line-height: 18px;
    }

.modal#promotionSingleItem .image img {
    height: 300px;
    width: auto;
    margin: 15px auto;
}

.modal#promotionSingleItem .rate {
    width: 120px;
    height: 120px;
    background-color: #747096;
    border-radius: 50%;
    margin: 0 auto -105px auto;
    position: relative;
    top: -100px;
    border: 5px solid #FFF;
    color: #FFF;
    font-size: 40px;
    font-weight: bold;
    padding-top: 25px;
}

.modal#promotionSingleItem .promo-cat {
    display: inline-block;
    margin: 0px;
    background-color: #666;
    color: #FFF;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 5px 15px;
}

.modal#promotionSingleItem .promo-date .sep {
    display: inline-block;
    font-size: 12px;
    font-weight: bold;
}

.modal#promotionSingleItem .promo-date .from,
.modal#promotionSingleItem .promo-date .to {
    position: relative;
    display: inline-block;
    background-color: #D8D8D8;
    padding: 8px 20px;
    margin: 0 20px;
    font-size: 16px;
    font-weight: bold;
    height: 40px;
    width: 200px;
}

    .modal#promotionSingleItem .promo-date .from:after {
        content: "";
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-left: 20px solid #D8D8D8;
        border-bottom: 20px solid transparent;
        position: absolute;
        right: -20px;
        top: 50%;
        margin-top: -20px;
    }

    .modal#promotionSingleItem .promo-date .to:before {
        content: "";
        width: 0;
        height: 0;
        border-top: 20px solid transparent;
        border-right: 20px solid #D8D8D8;
        border-bottom: 20px solid transparent;
        position: absolute;
        left: -20px;
        top: 50%;
        margin-top: -20px;
    }

.modal#promotionSingleItem .des {
    margin: 30px 15px;
}

.modal .promo-tag {
    position: relative;
}

    .modal .promo-tag:before {
        content: "";
        width: 150px;
        height: 150px;
        position: absolute;
        top: -10px;
        left: -10px;
        background: url(../img/promo-tag.png) no-repeat top left;
        background-size: cover;
    }

    .modal .promo-tag h1 {
        font-size: 36px;
        font-weight: 300;
    }

@media (max-width: 767px) {
    .modal#promotionPackageItems .sq-block-md {
        margin: 10px 5px;
    }

    .modal#promotionSingleItem .image img {
        height: auto;
        width: 100%;
    }

    .modal#promotionPackageItems .rate {
        margin: 10px auto 5px auto;
    }

    .modal#promotionSingleItem .rate {
        margin: 0 auto -95px auto;
    }

    .modal#promotionPackageItems .promo-date .from,
    .modal#promotionPackageItems .promo-date .to,
    .modal#promotionPackageItems .promo-date .sep,
    .modal#promotionSingleItem .promo-date .from,
    .modal#promotionSingleItem .promo-date .to,
    .modal#promotionSingleItem .promo-date .sep {
        display: block;
        margin: 5px auto;
    }

        .modal#promotionPackageItems .promo-date .from:after,
        .modal#promotionPackageItems .promo-date .to:before,
        .modal#promotionSingleItem .promo-date .from:after,
        .modal#promotionSingleItem .promo-date .to:before {
            display: none;
        }

    .modal .promo-tag:before {
        width: 100px;
        height: 100px;
        top: -6px;
        left: -6px;
    }

    .modal .promo-tag h1,
    .modal .promo-tag h2,
    .modal .promo-tag h3,
    .modal .promo-tag h4 {
        padding: 0 10px;
    }
}
/****************************************************************************************************
#####################################################################################################
****************************** Salon Promotion Details Page *****************************************
#####################################################################################################
****************************************************************************************************/

.salon-inner-page.salon-promotion-details-page .promotion-wrap {
    position: relative;
    margin-bottom: 30px;
    overflow: hidden;
}

    .salon-inner-page.salon-promotion-details-page .promotion-wrap:after {
        content: "";
        position: absolute;
        top: 15px;
        bottom: 0px;
        left: 75%;
        margin-left: -15px;
        border-right: 1px solid #cccccc;
    }

.salon-inner-page.salon-promotion-details-page .share {
    margin-top: 5px;
    text-align: center;
}

.salon-inner-page.salon-promotion-details-page .promo {
    padding-right: 30px;
    text-align: center;
}

    .salon-inner-page.salon-promotion-details-page .promo h1 {
        font-weight: bold;
        text-transform: uppercase;
        margin-top: 10px;
    }

    .salon-inner-page.salon-promotion-details-page .promo h2 {
        display: inline-block;
        margin: 0px 0px 15px 0px;
        background-color: #666;
        color: #FFF;
        font-size: 14px;
        font-weight: bold;
        text-transform: uppercase;
        padding: 5px 15px;
    }

    .salon-inner-page.salon-promotion-details-page .promo .image {
        position: relative;
    }

        .salon-inner-page.salon-promotion-details-page .promo .image:before {
            content: "";
            width: 150px;
            height: 150px;
            position: absolute;
            top: -9px;
            left: -9px;
            background: url("../img/promo-tag.png") no-repeat top left;
            background-size: cover;
            z-index: 1;
        }

        .salon-inner-page.salon-promotion-details-page .promo .image img {
            position: relative;
            width: 100%;
            height: auto;
        }

    .salon-inner-page.salon-promotion-details-page .promo .details {
        position: relative;
        background: #e7c5cb;
        border: 1px solid #e7c5cb;
        border-top: none;
        padding: 15px;
    }

        .salon-inner-page.salon-promotion-details-page .promo .details .rate {
            position: absolute;
            top: -94px;
            left: 50%;
            margin-left: -80px;
            height: 160px;
            width: 160px;
            padding: 30px 5px;
            color: #ffffff;
            font-size: 60px;
            font-weight: bold;
            border-radius: 50%;
            background: #747096;
            border: 5px solid #e7c5cb;
        }

        .salon-inner-page.salon-promotion-details-page .promo .details .promo-date {
            padding: 50px 0px 15px 0px;
        }

        .salon-inner-page.salon-promotion-details-page .promo .details .from,
        .salon-inner-page.salon-promotion-details-page .promo .details .to {
            position: relative;
            display: inline-block;
            background-color: #000000;
            color: #ffffff;
            padding: 8px 20px;
            margin: 0 20px;
            font-size: 16px;
            font-weight: bold;
            height: 40px;
            width: 200px;
        }

            .salon-inner-page.salon-promotion-details-page .promo .details .from:after {
                content: "";
                width: 0;
                height: 0;
                border-top: 20px solid transparent;
                border-left: 20px solid #000000;
                border-bottom: 20px solid transparent;
                position: absolute;
                right: -20px;
                top: 50%;
                margin-top: -20px;
            }

            .salon-inner-page.salon-promotion-details-page .promo .details .to:before {
                content: "";
                width: 0;
                height: 0;
                border-top: 20px solid transparent;
                border-right: 20px solid #000000;
                border-bottom: 20px solid transparent;
                position: absolute;
                left: -20px;
                top: 50%;
                margin-top: -20px;
            }

        .salon-inner-page.salon-promotion-details-page .promo .details .sep {
            display: inline-block;
            font-size: 12px;
            font-weight: bold;
        }

        .salon-inner-page.salon-promotion-details-page .promo .details .promo-pack-block {
            margin: 5px;
            position: relative;
            width: 110px;
            display: inline-block;
            cursor: pointer;
            vertical-align: top;
            padding-bottom: 5px;
            background-color: #ffffff;
            border: 1px solid #ffffff;
            overflow: hidden;
        }

            .salon-inner-page.salon-promotion-details-page .promo .details .promo-pack-block img {
                width: 100%;
                height: auto;
            }

            .salon-inner-page.salon-promotion-details-page .promo .details .promo-pack-block p {
                font-size: 12px;
                line-height: 1;
                margin: 5px;
            }

.salon-inner-page.salon-promotion-details-page .pn-buttons {
    margin-top: 15px;
}

@media (max-width: 991px) {
    .salon-inner-page.salon-promotion-details-page .promotion-wrap:after {
        display: none;
    }

    .salon-inner-page.salon-promotion-details-page .promo {
        padding-right: 0px;
    }
}

@media (max-width: 767px) {
    .salon-inner-page.salon-promotion-details-page .promo .image:before {
        width: 120px;
        height: 120px;
        top: -8px;
        left: -8px;
    }

    .salon-inner-page.salon-promotion-details-page .promo .details .rate {
        top: -65px;
        margin-left: -60px;
        height: 120px;
        width: 120px;
        padding: 25px 5px;
        font-size: 40px;
    }

    .salon-inner-page.salon-promotion-details-page .promo .details .from,
    .salon-inner-page.salon-promotion-details-page .promo .details .to {
        display: block;
        margin: 0 auto;
        font-size: 14px;
        height: 35px;
        width: 175px;
    }

        .salon-inner-page.salon-promotion-details-page .promo .details .from:after,
        .salon-inner-page.salon-promotion-details-page .promo .details .to:before {
            display: none;
        }
}
/* All Promotions */

.salon-inner-page.salon-promotion-details-page .promo-all {
    text-align: center;
}

    .salon-inner-page.salon-promotion-details-page .promo-all h3 {
        font-size: 16px;
        font-weight: bold;
        text-transform: uppercase;
        margin: 15px 20px 10px 0px;
        ;
        color: #747096;
    }

.salon-inner-page.salon-promotion-details-page .promo-scroll {
    overflow-y: scroll;
    padding-right: 10px;
}

    .salon-inner-page.salon-promotion-details-page .promo-scroll::-webkit-scrollbar-track {
        background-color: #999;
    }

    .salon-inner-page.salon-promotion-details-page .promo-scroll::-webkit-scrollbar-track-piece {
        background-color: #dbdbdb;
    }

    .salon-inner-page.salon-promotion-details-page .promo-scroll::-webkit-scrollbar-thumb {
        height: 10px;
        background-color: #b3b3b3;
    }

        .salon-inner-page.salon-promotion-details-page .promo-scroll::-webkit-scrollbar-thumb:hover {
            background-color: #a8a8a8;
        }

    .salon-inner-page.salon-promotion-details-page .promo-scroll::-webkit-scrollbar-corner {
        background-color: #999;
    }

.salon-inner-page.salon-promotion-details-page .promo-all h5 {
    font-size: 14px;
    background-color: #000000;
    color: #ffffff;
    padding: 10px;
}

.salon-inner-page.salon-promotion-details-page .promo-all .promotions-item {
    border: 1px solid #cccccc;
    cursor: pointer;
    margin-bottom: 15px;
    overflow: hidden;
    position: relative;
}

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .image {
        position: relative;
        height: 200px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top center;
    }

        .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .image:before {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background: rgba(0, 0, 0, 0);
            background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
            background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.2)));
            background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
            background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
            background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
            background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 100%);
            filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
        }

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item:hover .image:before {
        background: rgba(0, 0, 0, 0.5);
        background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
        background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0.5)), color-stop(100%, rgba(0, 0, 0, 0.5)));
        background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
        background: -o-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
        background: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.5) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0);
    }

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .image:after {
        content: "- View Details -";
        position: absolute;
        top: 50%;
        left: 50%;
        height: 30px;
        text-align: center;
        margin-left: -61px;
        margin-top: -300px;
        font-size: 18px;
        font-weight: bold;
        color: #ffffff;
        opacity: 0;
        -webkit-transition: all .25s ease-out;
        -moz-transition: all .25s ease-out;
        -ms-transition: all .25s ease-out;
        -o-transition: all .25s ease-out;
        transition: all .25s ease-out;
    }

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item:hover .image:after {
        margin-top: -10px;
        opacity: 1;
    }

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .pro-rate {
        position: absolute;
        top: 150px;
        left: 50%;
        margin-left: -45px;
        height: 55px;
        width: 90px;
        padding: 8px 5px;
        color: #ffffff;
        font-size: 24px;
        font-weight: bold;
        border-radius: 90px 90px 0 0;
        -moz-border-radius: 90px 90px 0 0;
        -webkit-border-radius: 90px 90px 0 0;
        background: #747096;
        border: 5px solid #ffffff;
    }

    .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .pro-title {
        display: table;
        width: 100%;
    }

        .salon-inner-page.salon-promotion-details-page .promo-all .promotions-item .pro-title p {
            display: table-cell;
            vertical-align: middle;
            font-size: 14px;
            line-height: 1;
            font-weight: bold;
            margin: 0;
            padding: 10px 5px;
        }
/****************************************************************************************************
#####################################################################################################
****************************** Salon Profile Edit Page ************************************************
#####################################################################################################
****************************************************************************************************/

.edit-pannel {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: 15px;
    padding: 15px;
    z-index: 990;
    border: 1px dashed rgba(255, 255, 255, 0.9);
}

    .edit-pannel .btn-edit {
        background: rgba(255, 255, 255, .6);
        border: 1px solid rgba(0, 0, 0, .5);
        color: #626262;
        margin-bottom: 15px;
        font-size: 14px !important;
    }

        .edit-pannel .btn-edit.active,
        .edit-pannel .btn-edit.focus,
        .edit-pannel .btn-edit:active,
        .edit-pannel .btn-edit:focus,
        .edit-pannel .btn-edit:hover {
            background: rgba(255, 255, 255, 0.8);
            border: 1px solid #747096;
            color: #747096;
        }

    .edit-pannel .edit-dialog {
        position: relative;
        clear: both;
        background-color: rgba(0, 0, 0, 0.9);
        border: 1px solid rgba(0, 0, 0, 1);
        padding: 15px;
        border-radius: 5px;
        color: #ffffff;
        width: 100%;
    }

        .edit-pannel .edit-dialog:after {
            content: "";
            position: absolute;
            top: -11px;
            right: 15px;
            width: 0;
            height: 0;
            border-left: 10px solid transparent;
            border-right: 10px solid transparent;
            border-bottom: 10px solid rgba(0, 0, 0, 0.9);
        }

        .edit-pannel .edit-dialog h4 {
            font-size: 24px;
            font-weight: 300;
            margin-right: 30px;
        }

        .edit-pannel .edit-dialog .pannel-close {
            position: absolute;
            top: 20px;
            right: 15px;
            background-color: transparent;
            border: none;
            font-size: 36px;
            line-height: 1;
            padding: 0px;
        }

        .edit-pannel .edit-dialog .char-counter {
            display: none;
        }

        .edit-pannel .edit-dialog .save-group {
            display: table;
        }

            .edit-pannel .edit-dialog .save-group button {
                display: table-cell;
                vertical-align: middle;
            }

            .edit-pannel .edit-dialog .save-group i {
                display: table-cell;
                vertical-align: middle;
                font-size: 20px;
                line-height: 1;
                padding-left: 5px;
                color: #22ce00;
            }

        .edit-pannel .edit-dialog .back-image {
            padding: 15px 0;
            overflow: hidden;
        }
/* Salon Description Section */

.salon-desc.with-edit {
    margin-top: 0px;
}
/* Salon Main Section */

.salon-main.with-edit .edit-pannel {
    text-align: left;
    border: 1px dashed rgba(0, 0, 0, 0.9);
}
/* Salon Promotions Section */

.salon-promotions.with-edit {
    position: relative;
    z-index: 0;
}

    .salon-promotions.with-edit .edit-pannel {
        text-align: left;
        border: 1px dashed rgba(0, 0, 0, 0.9);
    }
/* Salon Services Section */

.salon-services.with-edit {
    position: relative;
    overflow: visible;
}

    .salon-services.with-edit .edit-pannel {
        text-align: left;
    }
/* Salon Products Section */

.salon-products.with-edit {
    position: relative;
    overflow: visible;
}

    .salon-products.with-edit .edit-pannel {
        text-align: left;
    }
/* Salon Team Section */

.salon-team.with-edit {
    position: relative;
    overflow: visible;
}

    .salon-team.with-edit .edit-pannel {
        text-align: left;
    }
/* Salon Business Partners Section */

.salon-businessPartners.with-edit {
    position: relative;
    overflow: visible;
}

    .salon-businessPartners.with-edit .edit-pannel {
        text-align: left;
        border: 1px dashed rgba(0, 0, 0, 0.9);
    }
/* Salon Gallery Section */

.salon-gallery.with-edit {
    position: relative;
    padding-top: 50px;
    overflow: visible;
}

    .salon-gallery.with-edit .edit-pannel {
        text-align: left;
        border: 1px dashed rgba(0, 0, 0, 0.9);
    }
/*promotion list nav*/

.promtion-nav-disalbed {
    background-color: #eee;
    color: #ccc;
    cursor: not-allowed;
    transform: scale(1) !important;
}
/*Working hour time validation*/

.time-error {
    border-color: red;
}

/*My account typheader*/
.filters .typeahead-group-header {
    font-size: 18px;
    font-weight: bold;
    margin-top: 10px;
}

iframe[name="google_conversion_frame"] {
    height: 0 !important;
    width: 0 !important;
    line-height: 0 !important;
    font-size: 0 !important;
    margin-top: -13px;
    float: left;
}

/** licence package */

.img-gallary {
    padding: 0 0 0 0;
    overflow: hidden;
}

    .img-gallary li {
        list-style: none;
    }

        .img-gallary li img {
            cursor: pointer;
            width: 100px;
            height: 100px;
            object-fit: cover;
        }

        .img-gallary li:hover {
            transform: scale(0.98);
        }

.img-tile {
    width: 100px;
    height: 100px;
    object-fit: cover;
    float: left;
    margin: 0 10px 10px 0;
    position: relative;
    cursor: pointer;
    overflow: hidden;
}

    .img-tile .img-tile-select {
        padding: 0 !important;
        margin: 0 !important;
    }

.album-name {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    font-size: 16px;
    background-color: rgba(0, 0, 0, 0.25);
    color: #fff;
    text-align: center;
    padding: 18px 10px 10px 10px;
}


/* Flag Dropdown */
.flag-container .selected-flag:focus {
    outline: 0 !important;
}

.form-group .intl-tel-input {
    width: 100%;
    z-index: 998;
}

    .form-group .intl-tel-input > input {
        width: 100%;
        height: 34px;
        padding: 6px 12px 6px 45px;
        font-size: 14px;
        line-height: 1.42857143;
        color: #555;
        background-color: #fff;
        background-image: none;
        border: 1px solid #ccc;
        border-radius: 4px;
    }

        .form-group .intl-tel-input > input:focus {
            border-color: #af97ac;
            outline: 0;
            -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075), 0 0 0px rgba(102, 175, 233, .6);
            box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075), 0 0 0px rgba(102, 175, 233, .6);
        }

.form-group .input-group-addon + .intl-tel-input > input {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}



/****************************************************************************************************
#####################################################################################################
****************************** Promotions Page [/promotions] ****************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.promotion-page .header-title {
    height: 180px;
}

.inner-page.promotion-page .header-img {
    background-image: url("../img/banner/promotions.jpg") !important;
    background-position: center top !important;
    background-size: 100% auto;
    height: 220px;
}

.inner-page.promotion-page .search-wrap {
    margin-top: -75px;
}

    .inner-page.promotion-page .search-wrap.fix-to-top {
        position: fixed;
        top: 40px;
        width: 100%;
        margin-top: 0;
        z-index: 20;
    }

.inner-page.promotion-page .promotion-search {
    background-color: #cccccc;
    padding: 15px;
    margin-bottom: 15px;
}

.inner-page.promotion-page .offer-item-wrap {
    padding: 4px 4px 0 0;
    overflow: hidden;
    margin-bottom: 15px;
}

.inner-page.promotion-page .offer-item {
    position: relative;
    width: 100%;
    background-color: #ffffff;
    border: 1px solid #cccccc;
}

    .inner-page.promotion-page .offer-item .rate {
        position: absolute;
        top: -4px;
        right: -4px;
        z-index: 10;
        width: 100px;
        height: 94px;
        background: url(../img/promo-rate-tag.png) no-repeat top right;
        background-size: cover;
        padding: 14px 5px;
        font-size: 20px;
        font-weight: bold;
        color: #ffffff;
        text-align: right;
        pointer-events: none;
    }

    .inner-page.promotion-page .offer-item .image {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        z-index: 2;
        width: 50%;
        margin: -1px;
        overflow: hidden;
    }

        .inner-page.promotion-page .offer-item .image img {
            width: 100%;
            height: auto;
            -webkit-transition: all 0.1s ease-out;
            -moz-transition: all 0.1s ease-out;
            -o-transition: all 0.1s ease-out;
            -ms-transition: all 0.1s ease-out;
            transition: all 0.1s ease-out;
            cursor: pointer;
        }

            .inner-page.promotion-page .offer-item .image img:hover {
                -webkit-transform: scale(1.01);
                -moz-transform: scale(1.01);
                -o-transform: scale(1.01);
                -ms-transform: scale(1.01);
                transform: scale(1.01);
            }

.inner-page.promotion-page .des {
    position: relative;
    z-index: 1;
    display: inline-block;
    vertical-align: top;
    margin-left: -2px;
    width: 50%;
    padding: 15px;
    overflow: hidden;
}

    .inner-page.promotion-page .des .des-wrap {
    }

    .inner-page.promotion-page .des .offer-left {
        display: block;
        width: 100%;
    }

    .inner-page.promotion-page .des .offer-right {
        float: right;
        display: table-cell;
        vertical-align: middle;
        width: 200px;
        min-width: 200px;
        margin-left: 10px;
        padding-left: 10px;
        border-left: 1px solid #cccccc;
    }

    .inner-page.promotion-page .des .offer-title {
        color: #970067;
        font-size: 18px;
        font-weight: 500;
        line-height: 1.0;
        margin: 0px 0 5px 0;
        cursor: pointer;
    }

        .inner-page.promotion-page .des .offer-title:hover {
            color: #710b50;
        }

    .inner-page.promotion-page .des .offer-des {
        font-size: 12px;
        line-height: 1;
        color: #999999;
    }

    .inner-page.promotion-page .des .salon-wrap {
        display: table;
        width: 100%;
        padding: 5px 0;
        border-top: 1px solid #cccccc;
    }

        .inner-page.promotion-page .des .salon-wrap .salon-logo {
            display: table-cell;
            vertical-align: middle;
            float: left;
            background: #cccccc;
            overflow: hidden;
            height: 50px;
        }

            .inner-page.promotion-page .des .salon-wrap .salon-logo img {
                height: 100%;
                width: auto;
            }

        .inner-page.promotion-page .des .salon-wrap .salon-name {
            display: table-cell;
            vertical-align: middle;
            width: 100%;
        }

            .inner-page.promotion-page .des .salon-wrap .salon-name h3 {
                font-size: 16px;
                margin: 0;
                font-weight: normal;
            }

            .inner-page.promotion-page .des .salon-wrap .salon-name p {
                font-size: 12px;
                font-weight: bold;
                margin: 0;
            }

    .inner-page.promotion-page .des .valid {
        overflow: hidden;
    }

        .inner-page.promotion-page .des .valid .from,
        .inner-page.promotion-page .des .valid .to,
        .inner-page.promotion-page .des .valid .remaining {
            float: left;
            width: 33.33%;
            color: #a58099;
            font-size: 12px;
            line-height: 1;
            font-weight: bold;
            text-align: center;
            text-transform: uppercase;
            padding: 15px 0;
        }

        .inner-page.promotion-page .des .valid .remaining {
            color: #e60913;
        }

            .inner-page.promotion-page .des .valid .from i,
            .inner-page.promotion-page .des .valid .to i,
            .inner-page.promotion-page .des .valid .remaining i {
                font-size: 30px;
                line-height: 1;
                margin: 5px;
            }

            .inner-page.promotion-page .des .valid .from span,
            .inner-page.promotion-page .des .valid .to span,
            .inner-page.promotion-page .des .valid .remaining span {
                display: block;
                font-size: 16px;
                line-height: 1;
                font-weight: 300;
            }

    .inner-page.promotion-page .des .share {
        text-align: center;
    }

    .inner-page.promotion-page .des .price {
        text-align: center;
    }

        .inner-page.promotion-page .des .price .new-price {
            position: relative;
            display: inline-block;
            color: #333333;
            font-size: 14px;
            line-height: 1;
            font-weight: bold;
            margin-top: 5px;
        }

            .inner-page.promotion-page .des .price .new-price p {
                position: relative;
                display: inline-block;
                color: #970067;
                font-size: 24px;
                line-height: 1;
                font-weight: 300;
                margin: 0;
            }

        .inner-page.promotion-page .des .price .actual-price {
            position: relative;
            display: inline-block;
            color: #666666;
        }

            .inner-page.promotion-page .des .price .actual-price p {
                position: relative;
                margin: 0;
                font-size: 14px;
            }

                .inner-page.promotion-page .des .price .actual-price p:before,
                .inner-page.promotion-page .des .price .actual-price p:after {
                    content: "";
                    position: absolute;
                    top: 8px;
                    left: 0;
                    right: 0;
                    background: #999999;
                    height: 1px;
                }

                .inner-page.promotion-page .des .price .actual-price p:before {
                    -webkit-transform: translateX(-1%) rotate(9deg);
                    -moz-transform: translateX(-1%) rotate(9deg);
                    -o-transform: translateX(-1%) rotate(9deg);
                    -ms-transform: translateX(-1%) rotate(9deg);
                    transform: translateX(-1%) rotate(9deg);
                }

                .inner-page.promotion-page .des .price .actual-price p:after {
                    -webkit-transform: translateX(0%) rotate(-9deg);
                    -moz-transform: translateX(0%) rotate(-9deg);
                    -o-transform: translateX(0%) rotate(-9deg);
                    -ms-transform: translateX(0%) rotate(-9deg);
                    transform: translateX(0%) rotate(-9deg);
                }

    .inner-page.promotion-page .des .voucher {
        text-align: center;
        padding: 10px 0;
    }

        .inner-page.promotion-page .des .voucher h4 {
            margin: 0;
        }

        .inner-page.promotion-page .des .voucher h6 {
            margin-top: 0;
        }

.inner-page.promotion-page .no-promo {
    text-align: center;
    padding-bottom: 30px;
}

    .inner-page.promotion-page .no-promo h3 {
        font-size: 28px;
        font-weight: 300;
        color: #747096;
    }

    .inner-page.promotion-page .no-promo h5.email {
        display: inline-block;
        border: 1px solid #989898;
        padding: 10px 25px;
    }

    .inner-page.promotion-page .no-promo .owner-msg {
        margin-top: 30px;
    }

@media (min-width: 992px) and (max-width: 1199px) {
    .inner-page.promotion-page .des {
        padding: 5px 10px;
    }

        .inner-page.promotion-page .des .offer-right {
            width: 160px;
            min-width: 160px;
        }

        .inner-page.promotion-page .des .offer-title {
            font-size: 18px;
        }

        .inner-page.promotion-page .des .valid .from span,
        .inner-page.promotion-page .des .valid .to span,
        .inner-page.promotion-page .des .valid .remaining span {
            font-size: 14px;
        }

        .inner-page.promotion-page .des .price .actual-price {
            font-size: 12px;
        }

            .inner-page.promotion-page .des .price .actual-price p {
                font-size: 12px;
            }

        .inner-page.promotion-page .des .price .new-price p {
            font-size: 18px;
        }

        .inner-page.promotion-page .des .voucher {
            padding: 5px 0;
        }

            .inner-page.promotion-page .des .voucher h4 {
                font-size: 14px;
            }

        .inner-page.promotion-page .des .salon-wrap .salon-logo {
            height: 40px;
        }

        .inner-page.promotion-page .des .salon-wrap .salon-name h3 {
            font-size: 14px;
        }

    .inner-page.promotion-page .offer-item .rate {
        width: 80px;
        height: 74px;
        padding: 10px 5px;
        font-size: 16px;
    }
}

@media (max-width: 991px) {
    .inner-page.promotion-page .offer-item .image {
        width: 100%;
        margin: 0;
    }

    .inner-page.promotion-page .des {
        margin-left: 0;
        width: 100%;
    }
}

@media (max-width: 767px) {
    .inner-page.promotion-page .header-title {
        height: 115px;
        margin: 0;
    }

    .inner-page.promotion-page .header-img {
        background-size: auto 100%;
        height: 160px;
    }

    .inner-page.promotion-page .search-wrap {
        margin-top: 00px;
    }

        .inner-page.promotion-page .search-wrap.fix-to-top {
            top: 47px;
        }

    .inner-page.promotion-page .promotion-search {
        padding: 10px 12px 0 12px;
        display: none;
        margin: 0;
    }

    .inner-page.promotion-page .search-wrap .search-toggle {
        margin-bottom: 15px;
        background-color: #cccccc;
        color: #666666;
        border-radius: 0;
    }

    .inner-page.promotion-page .offer-item {
        border-bottom: 10px solid #cccccc;
    }

    .inner-page.promotion-page .des {
        padding: 8px;
    }

        .inner-page.promotion-page .des .offer-title {
            font-size: 16px;
            margin: 0;
            text-align: center;
        }

        .inner-page.promotion-page .des .offer-des {
            text-align: center;
        }

        .inner-page.promotion-page .des .offer-left {
            display: block;
            width: 100%;
            margin: 10px 0;
        }

        .inner-page.promotion-page .des .valid .from,
        .inner-page.promotion-page .des .valid .to,
        .inner-page.promotion-page .des .valid .remaining {
            padding: 0;
        }

            .inner-page.promotion-page .des .valid .from span,
            .inner-page.promotion-page .des .valid .to span,
            .inner-page.promotion-page .des .valid .remaining span {
                font-size: 14px;
            }

        .inner-page.promotion-page .des .offer-right {
            display: block;
            float: none;
            width: 100%;
            margin-left: 0;
            padding-left: 0;
            border-left: none;
            margin-top: 10px;
        }

        .inner-page.promotion-page .des .price .new-price {
            display: block;
        }

            .inner-page.promotion-page .des .price .new-price p {
                display: block;
            }

        .inner-page.promotion-page .des .voucher h4 {
            font-size: 14px;
        }

        .inner-page.promotion-page .des .salon-wrap {
            display: block;
            text-align: center;
            width: 100%;
        }

            .inner-page.promotion-page .des .salon-wrap .salon-logo {
                display: inline-block;
                float: none;
                background: #cccccc;
            }

            .inner-page.promotion-page .des .salon-wrap .salon-name {
                display: block;
                padding: 0 !important;
            }
}


/****************************************************************************************************
#####################################################################################################
****************************** Promotions Details Page [/promotions/#] ******************************
#####################################################################################################
****************************************************************************************************/

.inner-page.promotion-details-page {
    padding-bottom: 30px;
}

    .inner-page.promotion-details-page .promotion-search {
        padding: 15px 15px 9px 15px;
        margin-top: 15px;
        background: #cccccc;
    }

    .inner-page.promotion-details-page .promo-details h1 {
        font-size: 30px;
        font-weight: 300;
        color: #970067;
    }

    .inner-page.promotion-details-page .promo-details h3 {
        font-size: 18px;
        font-weight: bold;
        color: #8a6c86;
    }

    .inner-page.promotion-details-page .promo-details .promo-image {
        position: relative;
    }

        .inner-page.promotion-details-page .promo-details .promo-image .rate {
            position: absolute;
            top: -4px;
            right: -4px;
            z-index: 10;
            width: 100px;
            height: 94px;
            background: url(../img/promo-rate-tag.png) no-repeat top right;
            background-size: cover;
            padding: 14px 5px;
            font-size: 20px;
            font-weight: bold;
            color: #ffffff;
            text-align: right;
        }

    .inner-page.promotion-details-page .promo-details .valid {
        overflow: hidden;
        margin: 15px 0;
    }

        .inner-page.promotion-details-page .promo-details .valid .from,
        .inner-page.promotion-details-page .promo-details .valid .to,
        .inner-page.promotion-details-page .promo-details .valid .remaining {
            float: left;
            width: 33.33%;
            color: #970067;
            font-size: 14px;
            line-height: 1;
            font-weight: bold;
            text-align: center;
            text-transform: uppercase;
        }

            .inner-page.promotion-details-page .promo-details .valid .from span,
            .inner-page.promotion-details-page .promo-details .valid .to span,
            .inner-page.promotion-details-page .promo-details .valid .remaining span {
                display: block;
                font-size: 20px;
                line-height: 1;
                font-weight: 300;
            }

        .inner-page.promotion-details-page .promo-details .valid .remaining {
            color: #e60913;
        }

    .inner-page.promotion-details-page .promo-details .promo-desc {
        font-size: 16px;
    }

    .inner-page.promotion-details-page .promo-details hr {
        border-top: 3px solid #cccccc;
    }

    .inner-page.promotion-details-page .share {
        padding-top: 27px;
        text-align: center;
    }

    .inner-page.promotion-details-page .price {
        text-align: center;
        padding-top: 30px;
    }

        .inner-page.promotion-details-page .price .new-price {
            position: relative;
            display: block;
            color: #333333;
            font-size: 18px;
            line-height: 1;
            font-weight: bold;
            margin-top: 5px;
        }

            .inner-page.promotion-details-page .price .new-price p {
                position: relative;
                display: block;
                color: #970067;
                font-size: 32px;
                line-height: 1;
                font-weight: 300;
                margin: 0 0 25px 0;
            }

        .inner-page.promotion-details-page .price .actual-price {
            position: relative;
            display: inline-block;
            color: #666666;
        }

            .inner-page.promotion-details-page .price .actual-price p {
                position: relative;
                margin: 0 0 15px 0;
                font-size: 18px;
            }

                .inner-page.promotion-details-page .price .actual-price p:before,
                .inner-page.promotion-details-page .price .actual-price p:after {
                    content: "";
                    position: absolute;
                    top: 12px;
                    left: 0;
                    right: 0;
                    background: #999999;
                    height: 1px;
                }

                .inner-page.promotion-details-page .price .actual-price p:before {
                    -webkit-transform: translateX(-1%) rotate(9deg);
                    -moz-transform: translateX(-1%) rotate(9deg);
                    -o-transform: translateX(-1%) rotate(9deg);
                    -ms-transform: translateX(-1%) rotate(9deg);
                    transform: translateX(-1%) rotate(9deg);
                }

                .inner-page.promotion-details-page .price .actual-price p:after {
                    -webkit-transform: translateX(0%) rotate(-9deg);
                    -moz-transform: translateX(0%) rotate(-9deg);
                    -o-transform: translateX(0%) rotate(-9deg);
                    -ms-transform: translateX(0%) rotate(-9deg);
                    transform: translateX(0%) rotate(-9deg);
                }

    .inner-page.promotion-details-page .quantity select {
        display: inline-block;
        width: 80px;
    }

    .inner-page.promotion-details-page .salon-wrap {
        display: table;
        width: 100%;
        padding: 5px 0;
    }

        .inner-page.promotion-details-page .salon-wrap .salon-logo {
            display: table-cell;
            vertical-align: middle;
            float: left;
            background: #cccccc;
            overflow: hidden;
            height: 50px;
        }

            .inner-page.promotion-details-page .salon-wrap .salon-logo img {
                height: 100%;
                width: auto;
            }

        .inner-page.promotion-details-page .salon-wrap .salon-name {
            display: table-cell;
            vertical-align: middle;
            width: 100%;
        }

            .inner-page.promotion-details-page .salon-wrap .salon-name h3 {
                font-size: 16px;
                margin: 0;
                font-weight: normal;
            }

    .inner-page.promotion-details-page .salon-details {
        margin-top: 15px;
    }

        .inner-page.promotion-details-page .salon-details p.sec {
            position: relative;
            margin-bottom: 5px;
            padding: 5px 0px 5px 32px;
        }

            .inner-page.promotion-details-page .salon-details p.sec i {
                position: absolute;
                top: 0;
                left: 0;
                background-color: #333333;
                color: #ffffff;
                font-size: 14px;
                width: 28px;
                height: 28px;
                text-align: center;
                border-radius: 50%;
                padding: 7px 0;
            }

@media (max-width: 991px) {
    .inner-page.promotion-details-page .promo-details h1 {
        font-size: 24px;
    }

    .inner-page.promotion-details-page .price {
        padding-top: 5px;
    }

        .inner-page.promotion-details-page .price .new-price {
            font-size: 16px;
        }

            .inner-page.promotion-details-page .price .new-price p {
                font-size: 28px;
                margin: 0 0 15px 0;
            }

        .inner-page.promotion-details-page .price .actual-price p {
            font-size: 18px;
        }

    .inner-page.promotion-details-page .voucher h4 {
        margin: 0;
    }

    .inner-page.promotion-details-page .voucher h6 {
        margin-top: 0;
    }

    .inner-page.promotion-details-page .promo-details .promo-desc {
        font-size: 14px;
    }
}

@media (max-width: 767px) {
    .inner-page.promotion-details-page .promotion-search {
        display: none;
        margin: 0 -15px;
    }

    .inner-page.promotion-details-page .search-toggle {
        margin-bottom: 15px;
        background-color: #cccccc;
        color: #666666;
        border-radius: 0;
    }

    .inner-page.promotion-details-page .promo-details h1 {
        font-size: 18px;
        font-weight: 500;
        text-align: center;
    }

    .inner-page.promotion-details-page .share {
        padding-top: 0px;
        padding-bottom: 5px;
    }

    .inner-page.promotion-details-page .promo-details .valid {
        margin: 5px 0;
    }

        .inner-page.promotion-details-page .promo-details .valid .from span,
        .inner-page.promotion-details-page .promo-details .valid .to span,
        .inner-page.promotion-details-page .promo-details .valid .remaining span {
            font-size: 14px;
        }

    .inner-page.promotion-details-page .price .actual-price p {
        margin-bottom: 5px;
    }

    .inner-page.promotion-details-page .promo-details .promo-desc {
        text-align: center;
    }

    .inner-page.promotion-details-page .salon-wrap {
        display: block;
    }

        .inner-page.promotion-details-page .salon-wrap .salon-logo {
            display: inline-block;
            float: none;
        }

        .inner-page.promotion-details-page .salon-wrap .salon-name {
            display: block;
            padding-left: 0 !important;
        }

    .inner-page.promotion-details-page .salon-details {
        margin-top: 0px;
    }
}

/* Buy Page */
.inner-page.promotion-details-page.buy-page .promo-details.buy {
    padding: 15px;
    background: #dddddd;
    overflow: hidden;
    margin-top: 15px;
    border: 1px solid #b9b9b9;
}

    .inner-page.promotion-details-page.buy-page .promo-details.buy h1 {
        margin-top: 0;
    }

.inner-page.promotion-details-page.buy-page .payment-info {
    margin: 15px 0;
}

    .inner-page.promotion-details-page.buy-page .payment-info .price {
        display: table;
        width: 100%;
        padding-top: 0;
        margin-bottom: 15px;
    }

        .inner-page.promotion-details-page.buy-page .payment-info .price .actual-price,
        .inner-page.promotion-details-page.buy-page .payment-info .price .new-price {
            display: table-cell;
            vertical-align: middle;
            width: 50%;
            font-size: 14px;
            line-height: 1;
            font-weight: normal;
        }

        .inner-page.promotion-details-page.buy-page .payment-info .price .actual-price {
            border-right: 1px solid #cccccc;
        }

            .inner-page.promotion-details-page.buy-page .payment-info .price .actual-price p,
            .inner-page.promotion-details-page.buy-page .payment-info .price .new-price p {
                display: inline-block;
                margin: 0;
                font-size: 18px;
                line-height: 1.5;
                font-weight: normal;
            }

    .inner-page.promotion-details-page.buy-page .payment-info .voucher h4 {
        margin-bottom: 0;
    }

    .inner-page.promotion-details-page.buy-page .payment-info .voucher h6 {
        margin-top: 0;
    }

    .inner-page.promotion-details-page.buy-page .payment-info .amount {
        display: inline-block;
        background-color: #ece8ec;
        border: 1px solid #c5b5c4;
        padding: 10px 20px;
        border-radius: 15px;
    }

        .inner-page.promotion-details-page.buy-page .payment-info .amount h2,
        .inner-page.promotion-details-page.buy-page .payment-info .amount h4,
        .inner-page.promotion-details-page.buy-page .payment-info .amount label {
            margin: 0;
        }

.inner-page.promotion-details-page.buy-page .info-table tr > td {
    vertical-align: top;
    word-break: break-all;
}

    .inner-page.promotion-details-page.buy-page .info-table tr > td:nth-child(1) {
        min-width: 115px;
        width: 115px;
    }

    .inner-page.promotion-details-page.buy-page .info-table tr > td:nth-child(2) {
        min-width: 10px;
        width: 10px;
    }

    .inner-page.promotion-details-page.buy-page .info-table tr > td p {
        line-height: 1;
    }

.inner-page.promotion-details-page.buy-page .info-table tr.gross td {
    vertical-align: middle;
}

    .inner-page.promotion-details-page.buy-page .info-table tr.gross td h3 {
        font-size: 24px;
        font-weight: 300;
        margin: 0 0 15px 0;
    }

@media (max-width: 991px) {
    .inner-page.promotion-details-page.buy-page .payment-info .price .actual-price,
    .inner-page.promotion-details-page.buy-page .payment-info .price .new-price {
        font-size: 12px;
    }

        .inner-page.promotion-details-page.buy-page .payment-info .price .actual-price p,
        .inner-page.promotion-details-page.buy-page .payment-info .price .new-price p {
            font-size: 16px;
        }
}
input#newMobileNo[placeholder] {
    opacity: 0.5;
}

/****************************************************************************************************
#####################################################################################################
****************************** Online Payment *********************************************************
#####################################################################################################
****************************************************************************************************/
.inner-page.online-payment .header-title {
    height: 180px;
}
.inner-page.online-payment .header-img {
    background-image: url("../img/banner/online-payment.jpg") !important;
    background-position: center top !important;
    background-size: 100% auto;
    height: 220px;
}
.inner-page.online-payment .voucher-details {
    margin-bottom:30px;
    margin-top: 15px;
    border: 1px solid #ff9b9c;
    padding: 15px 10px;
}
.inner-page.online-payment .voucher-details h2 {
    margin: -15px -10px 0 -10px;
    padding: 10px 15px;
    background-color: #ff9b9c;
    color: #ffffff;
    font-size: 20px;
}
.inner-page.online-payment .voucher-details table {
    margin:0;
}
.inner-page.online-payment .receiver {
    margin-bottom:30px;
}
.inner-page.online-payment .receiver #paypal-button {
    margin-top: -34px;
}
.inner-page.online-payment .receiver #paypal-button .xcomponent-outlet {
    width: 100%;
    opacity: 0;
}
@media (max-width: 767px) {
    .inner-page.online-payment .header-title {
        height: 115px;
        margin: 0;
    }

    .inner-page.online-payment .header-img {
        background-size: auto 100%;
        height: 160px;
    }
}


/****************************************************************************************************
#####################################################################################################
****************************** Rewards Page *********************************************************
#####################################################################################################
****************************************************************************************************/

.inner-page.rewards .header-img {
    background-image: url("../img/banner/rewards.jpg") !important;
}
.rewards .rewards-content {
    margin-bottom: 15px;
}
.rewards .member {
    margin: 0;
    padding: 10px 0 30px 0;
}
.rewards .member span {
    background-color: silver;
    border-radius: 5px;
    padding: 3px 5px;
    text-transform: uppercase;
    margin-right: 8px;
    color: #ffffff;
}
.rewards .member span.BRZ {
    background-color: #a07861;
}
.rewards .member span.SLV {
    background-color: #888888;
}
.rewards .member span.GOL {
    background-color: #b9932f;
}
.rewards .member span.PLT {
    background-color: #3e647b;
}
.rewards .rewards-item {
    border: 1px solid #dfd2e2;
    margin-bottom: 15px;
    padding: 15px;
    text-align: center;
}
.rewards .rewards-item img {
    width: 80%;
    height: auto;
}
.rewards .rewards-item .points {
    color: #b75758;
    font-weight: 600;
}
#voucherPurchaseModal .rewards .rewards-item {
    margin: 0;
    padding: 0;
    border: none;
}
#voucherPurchaseModal .rewards .rewards-item img {
    width: 50%;
}
#voucherPurchaseModal .rewards .rewards-item .terms {
    border-top: 1px solid #cccccc;
    margin: 15px 0;
}
#purchaseConfirmationModal .actions button,
#purchaseStatusMessageModal .actions button,
#loginerror .actions button {
    width: 100px;
}

/****************************************************************************************************
#####################################################################################################
****************************** My Booking *********************************************************
#####################################################################################################
****************************************************************************************************/

.redeem-code {
    text-align: center;
}
.redeem-ok button {
    width: 100px;
    margin-top: 15px;
}
.modal-footer {
    text-align: left; 
}
@media (max-width: 392px) {
    .table > colgroup:nth-child(1) col {
        width: 4%;
    }
    .table > colgroup:nth-child(2) col {
        width: 10%;
    }
    .table > colgroup:nth-child(3) col {
        width: 8%;
    }
    .table > colgroup:nth-child(4) col {
        width: 8%;
    }
    .table > colgroup:nth-child(5) col {
        width: ;
    }
    .table > thead > tr > th {
        padding: 1px;
        padding-top: 3px;
        margin: 0 auto;
    }
    .table > tbody > tr > td {
        padding: 1px;
        margin: 0 auto;
    }
    
}

/****************************************************************************************************
#####################################################################################################
****************************** Gift Voucher *********************************************************
#####################################################################################################
****************************************************************************************************/
.inner-page.gift-voucher .header-img {
    background-image: url("../img/banner/gift-voucher.jpg") !important;
}
.gift-voucher .vouchers {
    overflow: hidden;
    margin-bottom: 15px;
}
.gift-voucher .vouchers .voucher-item {
    position: relative;
    width: 100%;
    background: #ffffff;
    border: 2px solid #ff9b9c;
    margin-bottom: 10px;
    border-radius: 12px;
    overflow: hidden;
    padding: 10px;
}
.gift-voucher .vouchers .voucher-item .v-desc {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 5px 130px 5px 0px;
    z-index: 2;
    min-height: 140px;
}
.gift-voucher .vouchers .voucher-item .v-desc h4 {
    font-size: 16px;
    color: #735da0;
    text-transform: uppercase;
    margin-bottom: 0;
}
.gift-voucher .vouchers .voucher-item .v-desc h5 {
    font-size: 13px;
}
.gift-voucher .vouchers .voucher-item .v-desc h6 {
    font-size: 12px;
    color: #ad3c3c;
    font-weight: bold;
    margin: 0 0 10px 0;
}
.gift-voucher .vouchers .voucher-item .v-price {
    position: absolute;
    top: 0;
    right: 20px;
    width: 105px;
    height: 140px;
    text-align: center;
    background-image: url(../img/voucher-badge.png);
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 2;
}
.gift-voucher .vouchers .voucher-item .v-price .v-price-inner {
    -ms-transform: rotate(-10deg);
    -webkit-transform: rotate(-10deg);
    transform: rotate(-10deg);
}
.gift-voucher .vouchers .voucher-item .v-price .currency {
    margin-top: 22px;
    color: #be7475;
    font-size: 14px;
    font-weight: bold;
}
.gift-voucher .vouchers .voucher-item .v-price .amount {
    text-align: center;
    color: #be7475;
    font-size: 36px;
    font-weight: bold;
    line-height: 0.7;
}
.gift-voucher .vouchers .voucher-item .v-price .value {
    color: #ff9b9c;
    font-size: 14px;
    font-weight: bold;
}
.gift-voucher .vouchers .voucher-item .terms {
    border-top: 1px solid #cccccc;
    margin-top: 5px;
    margin-bottom: 15px;
}
.gift-voucher .vouchers .actions {
    margin-top: 10px;
    margin-bottom: 0;
}
.gift-voucher .vouchers .actions .details {
    padding-right: 0;
}
.gift-voucher .vouchers .actions .purchase {
    padding-left: 0;
}
.gift-voucher .vouchers .actions .details button {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.gift-voucher .vouchers .actions .purchase button {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}
.gift-voucher .vouchers .form-error {
    font-size: 12px;
    font-weight: bold;
    color: #e84c4c;
}
#giftVoucherDetailModal .gift-voucher .vouchers {
    margin: 0;
}
#giftVoucherDetailModal .gift-voucher .vouchers .voucher-item {
    padding: 0;
    border: none;
    margin: 0;
    border-radius: 0;
    background: transparent;
}
#giftVoucherDetailModal .gift-voucher .vouchers,
#giftVoucherDetailModal .gift-voucher .vouchers .voucher-item {
    overflow: visible;
}
#giftVoucherDetailModal .gift-voucher .vouchers .voucher-item .v-price {
    top:-15px;
}

.trial-booking{
  background-color: #ffe088 !important;
}