// Vertical Slider Styling
.g-verticalslider {
    position: relative;

    .g-verticalslider-content-wrapper {
        position: absolute;
        right: 0;
        top: 0;
        width: 50%;
        height: 100%;
        overflow: hidden;

        .dir-rtl & {
            left: 0;
            right: auto;
        }

        @include breakpoint(mobile-only) {
            width: 100%;
        }

        .g-verticalslider-content-before {
            filter: blur(10px);
            content: "";
            position: absolute;
            z-index: 0;
            top: 0;
            right: 0;
            width: 200%;
            height: 100%;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: 50% 42%;

            @include breakpoint(mobile-only) {
                width: 100%;
            }
        }

        .g-verticalslider-content-after {
            content: "";
            position: absolute;
            z-index: 0;
            top: 0;
            right: 0;
            opacity: 0.6;
            width: 100%;
            height: 100%;
            background: $white;
        }

        .g-verticalslider-content {
            position: absolute;
            right: 0;
            top: 0;
            width: 100%;
            height: 100%;
            @include display(flex);
            @include justify-content(center);
            @include align-items(center);
            @include flex-direction(column);
            text-align: center;
            opacity: 0;
            padding: $content-padding;
            z-index: 1;

            @include breakpoint(mobile-only) {
                padding: $content-padding 3.5rem;
            }

            h1 {
                text-shadow: 1px 1px 6px transparentize($black, 50%);
            }

            .dir-rtl & {
                left: 0;
                right: auto;
            }

            .g-verticalslider-small-title {
                color: $black;
                @include responsive-font($responsive-font-size + 1, $core-font-size + 1.5, false, false);
                font-weight: $font-weight-bold;
                line-height: 1.1;
            }

            .g-verticalslider-description {
                color: lighten($base-text-color, 15%);
                @include responsive-font($responsive-font-size - 0.1, $core-font-size + 0.1, false, false);

                @include breakpoint(mobile-only) {
                    margin-top: ($content-margin * 2);
                }
            }

            .button {
                display: table;
                font-size: inherit;
                margin-top: 2rem;
                z-index: 1;
            }
        }
    }

    ul {
        .g-verticalslider-item {
            position: relative;
            background-repeat: no-repeat;
            background-size: cover;
            background-position: center;

            &.active {
                .g-verticalslider-content {
                    opacity: 1;
                }
            }
        }
    }

    .lSSlideOuter {
        overflow: hidden;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none
    }
    .lightSlider:before, .lightSlider:after {
        content: " ";
        display: table;
    }
    .lightSlider {
        overflow: hidden;
        margin: 0;
    }
    .lSSlideWrapper {
        max-width: 100%;
        overflow: hidden;
        position: relative;
    }
    .lSSlideWrapper > .lightSlider:after {
        clear: both;
    }
    .lSSlideWrapper .lSSlide {
        -webkit-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
        -webkit-transition: all 1s;
        -webkit-transition-property: -webkit-transform,height;
        -moz-transition-property: -moz-transform,height;
        transition-property: transform,height;
        -webkit-transition-duration: inherit !important;
        transition-duration: inherit !important;
        -webkit-transition-timing-function: inherit !important;
        transition-timing-function: inherit !important;
    }
    .lSSlideWrapper .lSFade {
        position: relative;
    }
    .lSSlideWrapper .lSFade > * {
        position: absolute !important;
        top: 0;
        left: 0;
        z-index: 9;
        margin-right: 0;
        width: 100%;
    }
    .lSSlideWrapper.usingCss .lSFade > * {
        opacity: 0;
        -webkit-transition-delay: 0s;
        transition-delay: 0s;
        -webkit-transition-duration: inherit !important;
        transition-duration: inherit !important;
        -webkit-transition-property: opacity;
        transition-property: opacity;
        -webkit-transition-timing-function: inherit !important;
        transition-timing-function: inherit !important;
    }
    .lSSlideWrapper .lSFade > *.active {
        z-index: 10;
    }
    .lSSlideWrapper.usingCss .lSFade > *.active {
        opacity: 1;
    }
    /** /!!! End of core css Should not edit !!!/**/

    /* Pager */
    .lSSlideOuter {
        &::before {
            content: '';
            z-index: 24;
            position: absolute;
            left: 0;
            height: 100%;
            width: 80px;

            .dir-rtl & {
                left: auto;
                right: 0;
            }
        }
    }

    .lSSlideOuter .lSPager.lSpg {
        margin: 10px 0 0;
        margin-left: 2px !important;
        padding: 0;
        position: absolute;
        left: 1.95rem;
        z-index: 24;
        top: 49%;
        transform: translateY(-49%) !important;

        .dir-rtl & {
            right: 1.95rem;
            left: auto;
        }
    }

    .lSSlideOuter .lSPager.lSpg > li {
        cursor: pointer;
        display: block;
        background: transparent;
        border: 2px solid $white;
        border-radius: 100%;
        position: relative;
        z-index: 1;
        margin: 1rem 0;
        width: 0.75rem;
        height: 0.75rem;
        text-align: center;
        text-indent: -9999px;

        &:first-child {
            margin-top: 0;
        }

        &:last-child {
            margin-bottom: 0;
        }
    }

    .lSSlideOuter .lSPager.lSpg > li a {
        display: none;
        position: relative;
        height: 100%;
        z-index: 99;
        color: transparentize($white, 50%);
        -webkit-transition: all 0.5s linear 0s;
        transition: all 0.5s linear 0s;
    }
    .lSSlideOuter .lSPager.lSpg > li:hover, .lSSlideOuter .lSPager.lSpg > li.active {
        background: $white;
        color: $white;
    }
    .lSSlideOuter .media {
        opacity: 0.8;
    }
    .lSSlideOuter .media.active {
        opacity: 1;
    }
    /* End of pager */

    /** Gallery */
    .lSSlideOuter .lSPager.lSGallery {
        list-style: none outside none;
        padding-left: 0;
        margin: 0;
        overflow: hidden;
        transform: translate3d(0px, 0px, 0px);
        -moz-transform: translate3d(0px, 0px, 0px);
        -ms-transform: translate3d(0px, 0px, 0px);
        -webkit-transform: translate3d(0px, 0px, 0px);
        -o-transform: translate3d(0px, 0px, 0px);
        -webkit-transition-property: -webkit-transform;
        -moz-transition-property: -moz-transform;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
    .lSSlideOuter .lSPager.lSGallery li {
        overflow: hidden;
        -webkit-transition: border-radius 0.12s linear 0s 0.35s linear 0s;
        transition: border-radius 0.12s linear 0s 0.35s linear 0s;
    }
    .lSSlideOuter .lSPager.lSGallery li.active, .lSSlideOuter .lSPager.lSGallery li:hover {
        border-radius: 5px;
    }
    .lSSlideOuter .lSPager.lSGallery img {
        display: block;
        height: auto;
        max-width: 100%;
    }
    .lSSlideOuter .lSPager.lSGallery:before, .lSSlideOuter .lSPager.lSGallery:after {
        content: " ";
        display: table;
    }
    .lSSlideOuter .lSPager.lSGallery:after {
        clear: both;
    }
    /* End of Gallery*/

    /* slider actions */
    .lSAction {
        position: absolute;
        left: 0;
        width: 80px;
        height: 100%;
        top: 0;
        z-index: 25;
        pointer-events: none;

        .dir-rtl & {
            right: 0;
            left: auto;
        }
    }
    .lSAction > a {
        width: 32px;
        display: block;
        color: $white;
        top: 50%;
        height: 32px;
        cursor: pointer;
        pointer-events: initial;
        position: absolute;
        font-size: 1.4rem;
        z-index: 99;
        margin-top: -16px;
        -webkit-transition: opacity 0.35s linear 0s;
        transition: opacity 0.35s linear 0s;

        &:hover {
            color: $accent-color-1;
        }
    }

    .lSAction > a:hover {
        opacity: 1;
    }
    .lSAction > .lSPrev {
        background-position: 0 0;
        left: 10px;

        .dir-rtl & {
            left: auto;
            right: 10px;
        }
    }
    .lSAction > .lSNext {
        background-position: -32px 0;
        right: 10px;

        .dir-rtl & {
            right: auto;
            left: 10px;
        }
    }
    .lSAction > a.disabled {
        pointer-events: none;
    }
    .cS-hidden {
        height: 1px;
        opacity: 0;
        filter: alpha(opacity=0);
        overflow: hidden;
    }


    /* vertical */
    .lSSlideOuter.vertical {
        position: relative;
    }
    .lSSlideOuter.vertical.noPager {
        padding-right: 0px !important;
    }
    .lSSlideOuter.vertical .lSGallery {
        position: absolute !important;
        right: 0;
        top: 0;
    }
    .lSSlideOuter.vertical .lightSlider > * {
        width: 100% !important;
        max-width: none !important;
    }

    /* vertical controlls */
    .lSSlideOuter .lSAction > a {
        left: 0;
        margin-left: 0;
        margin-top: 0;
        text-align: center;

        .dir-rtl & {
            left: auto;
            right: 0;
        }
    }
    .lSSlideOuter .lSAction > .lSNext {
        width: 100%;
        bottom: 2rem;
        top: auto;
    }
    .lSSlideOuter .lSAction > .lSPrev {
        width: 100%;
        bottom: auto;
        top: 2rem;
    }
    /* vertical */


    /* Rtl */
    .lSSlideOuter.lSrtl {
        direction: rtl;
    }
    .lSSlideOuter .lightSlider, .lSSlideOuter .lSPager {
        padding-left: 0;
        list-style: none outside none;
    }
    .lSSlideOuter.lSrtl .lightSlider, .lSSlideOuter.lSrtl .lSPager {
        padding-right: 0;
    }
    .lSSlideOuter .lightSlider > *,  .lSSlideOuter .lSGallery li {
        float: left;
    }
    .lSSlideOuter.lSrtl .lightSlider > *,  .lSSlideOuter.lSrtl .lSGallery li {
        float: right !important;
    }
    /* Rtl */

    @-webkit-keyframes rightEnd {
        0% {
            left: 0;
        }

        50% {
            left: -15px;
        }

        100% {
            left: 0;
        }
    }
    @keyframes rightEnd {
        0% {
            left: 0;
        }

        50% {
            left: -15px;
        }

        100% {
            left: 0;
        }
    }
    @-webkit-keyframes topEnd {
        0% {
            top: 0;
        }

        50% {
            top: -15px;
        }

        100% {
            top: 0;
        }
    }
    @keyframes topEnd {
        0% {
            top: 0;
        }

        50% {
            top: -15px;
        }

        100% {
            top: 0;
        }
    }
    @-webkit-keyframes leftEnd {
        0% {
            left: 0;
        }

        50% {
            left: 15px;
        }

        100% {
            left: 0;
        }
    }
    @keyframes leftEnd {
        0% {
            left: 0;
        }

        50% {
            left: 15px;
        }

        100% {
            left: 0;
        }
    }
    @-webkit-keyframes bottomEnd {
        0% {
            bottom: 0;
        }

        50% {
            bottom: -15px;
        }

        100% {
            bottom: 0;
        }
    }
    @keyframes bottomEnd {
        0% {
            bottom: 0;
        }

        50% {
            bottom: -15px;
        }

        100% {
            bottom: 0;
        }
    }
    .lSSlideOuter .rightEnd {
        -webkit-animation: rightEnd 0.3s;
        animation: rightEnd 0.3s;
        position: relative;
    }
    .lSSlideOuter .leftEnd {
        -webkit-animation: leftEnd 0.3s;
        animation: leftEnd 0.3s;
        position: relative;
    }
    .lSSlideOuter.vertical .rightEnd {
        -webkit-animation: topEnd 0.3s;
        animation: topEnd 0.3s;
        position: relative;
    }
    .lSSlideOuter.vertical .leftEnd {
        -webkit-animation: bottomEnd 0.3s;
        animation: bottomEnd 0.3s;
        position: relative;
    }
    .lSSlideOuter.lSrtl .rightEnd {
        -webkit-animation: leftEnd 0.3s;
        animation: leftEnd 0.3s;
        position: relative;
    }
    .lSSlideOuter.lSrtl .leftEnd {
        -webkit-animation: rightEnd 0.3s;
        animation: rightEnd 0.3s;
        position: relative;
    }
    /*/  GRab cursor */
    .lightSlider.lsGrab > * {
        cursor: -webkit-grab;
        cursor: -moz-grab;
        cursor: -o-grab;
        cursor: -ms-grab;
        cursor: grab;
    }
    .lightSlider.lsGrabbing > * {
        cursor: move;
        cursor: -webkit-grabbing;
        cursor: -moz-grabbing;
        cursor: -o-grabbing;
        cursor: -ms-grabbing;
        cursor: grabbing;
    }
}

// Tooltip
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
	display: none;
}
.ui-helper-hidden-accessible {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
.ui-helper-reset {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	line-height: 1.3;
	text-decoration: none;
	font-size: 100%;
	list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
.ui-helper-clearfix:after {
	clear: both;
}
.ui-helper-zfix {
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	opacity: 0;
	filter:Alpha(Opacity=0); /* support: IE8 */
}

.ui-front {
	z-index: 100;
}

.ui-tooltip {
	padding: 8px;
	position: absolute;
	z-index: 9999;
	max-width: 150px;

    &:after {
        content: "";
        position: absolute;
        top: 40%;
        left: 0;
        margin-left: -7px;
        border-width: 8px;
        border-style: solid;
        border-color:  transparent $navigation-background transparent transparent;
    }
}
body .ui-tooltip {
	border-width: 2px;
}

img.map {
    border-radius: 0.5rem;
    border: 1px solid transparentize($navigation-background, 50%);
}