/* Dateselect */

.dateselect {
    display: inline-block;
}

.dateselect-input-container {
    display: inline-block;
    text-align: center;
    margin: 0 5px;
}

.dateselect-input-container .input-header {
    display: block;
}

/**** Slider Graphs ****/
.slider-graph-container {
    height: 17px;
    background: #fafafa;
    -moz-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
    border-radius: 3px;
    overflow: hidden;
}

.slider-graph-fill {
    height: 17px;
    background: #993366;
    position: relative;
}

/***** Carousel *****/

.carousel-inner > .item {
    height: 100%;
}

.carousel-inner > .item > .img-responsive {
    max-height: 100%;
}

.carousel-indicators {
    position: static;
    padding: 0;
    margin: 0;
    left: auto;
    width: auto;
}

.carousel-indicators li,
.carousel-indicators li.active {
    width: 80px;
    height: auto;
    text-indent: initial;
    margin: 0;

    background: none;

    border: 0;
    border-radius: 0;

    color: white;
    position: relative;
}

.carousel-indicators li > .icon-play {
    position: absolute;
    top: 50%;
    z-index: 1;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    font-size: 2em;
    text-shadow: #333 0px 0px 20px;
    color: white;
}

.carousel-indicators .active::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    box-shadow: inset 0 0 8px white;
    -moz-box-shadow: inset 0 0 8px white;
    -webkit-box-shadow: inset 0 0 8px white;
    outline: 1px solid #ccc;
}

.carousel-control {
    background: #993366;
    opacity: 0.2;
    height: 50px;
    width: 50px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.carousel-control > .glyphicon {
    position: relative;
    margin: 0;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

#profile-pics-carousel .carousel-inner {
    height: 480px;
}

@media all and (max-width: 500px) {
    #profile-pics-carousel .carousel-inner {
        height: 350px;
    }
}

@media all and (max-width: 400px) {
    #profile-pics-carousel .carousel-inner {
        height: 300px;
    }
}

/* Carousel gesture guidance */
.gesture-container {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background-color: rgba(51, 51, 51, 0.8);
}

.gesture {
    max-height: 100%;
}

/* Treffit plus ad */
.treffit-plus-ad {
    padding-top: 1em;
    padding-bottom: 1em;
}

.treffit-plus-ad-mobile-button {
    font-size: 0.8em;
    padding-top: 0.5em;
}

.treffit-plus-ad-text {
    font-size: 1.2em;
    padding: 0.5em 0;
}

.treffit-plus-ad-lock {
    text-align: center;
    line-height: 1em;
    font-size: 4em;
}

.treffit-plus-ad-logo {
    padding: 0 0 1em;
}

.treffit-plus-ad-logo > img {
    max-height: 40px;
    margin: 0 auto;
}

@media screen and (min-width: 768px) {
    .treffit-plus-ad.full-width {
        height: 100px;
        position: relative;
        padding: 0 2em;
        margin: 0;
    }

    .treffit-plus-ad.full-width .treffit-plus-ad-lock,
    .treffit-plus-ad.full-width .treffit-plus-ad-logo {
        float: left;
    }

    .treffit-plus-ad.full-width .treffit-plus-ad-lock,
    .treffit-plus-ad.full-width .treffit-plus-ad-logo,
    .treffit-plus-ad.full-width .treffit-plus-ad-text {
        position: relative;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        transform: translateY(-50%);
    }

    .treffit-plus-ad.full-width .treffit-plus-ad-text {
        padding: 0;
    }

    .treffit-plus-ad.full-width .treffit-plus-ad-lock {
        font-size: 5em;
    }

    .treffit-plus-ad.full-width .treffit-plus-ad-logo {
        padding: 0 1em;
        max-height: 50px;
    }
}

/**** slider ****/

.sliderContainer {
    position: relative;
}

.ui-slider a, .ui-widget, .ui-widget select, select, input[type="radio"]:focus, input[type="checkbox"]:focus, select:focus {
    outline: none;
}

.controls.slider input[type=number] {
    display: inline-block;
}

.controls.slider input[type=number]:first-child::after {
    content: " - ";
    display: inline-block;
    margin: 0 10px;
}

.ui-slider.ui-widget-content {
    background: #555;
    -webkit-box-shadow: 0 2px 4px #000000 inset;
    -moz-box-shadow: 0 2px 4px #000000 inset;
    box-shadow: 0 2px 4px #000000 inset;
    margin: 10px 12px 15px;
}

.ui-slider-range.ui-widget-header {
    background: #98c646;
    -webkit-box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.3) inset;
    -moz-box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.3) inset;
    box-shadow: 0 -2px 4px rgba(0, 0, 0, 0.3) inset;
}

.ui-slider-horizontal .ui-slider-handle {
    top: -0.6em;
    height: 2em;
}

.ui-slider.ui-widget-content {
    border-top: 1px solid #BDBDBD;
    background: #DDD;
    -moz-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
    -webkit-box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 1px 1px 2px 0px rgba(0, 0, 0, 0.1) inset;
}

.ui-slider {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    border: none;
}

.ui-slider-horizontal {
    height: 20px;
}

.sliderContainer.simpleSlider .sliderCont {
    margin-right: 75px;
}

.profile_search .sliderValue + .sliderCont {
    margin-right: 0px;
}

.seek_edit .sliderValue + .sliderCont, .profile_search .sliderValue + .sliderCont {
    top: -25px;
    position: relative;
}

.sliderValue + .sliderCont.hasUnit {
    margin-right: 120px;
}

.sliderValue .sliderValueText {
    width: 100px;
    display: block;
    text-align: center;
    float: right;
    line-height: 1;
    position: relative;
    top: 2px;
    left: 25px;
    height: 13px;
}

.sliderValue.disabled .sliderValueText {
    width: 80px;
    top: 0;
}

.sliderValue.disabled .profile-bargraph-container .profile-bargraph {
    display: none !important;
}

.sliderCont .endLabels {
    position: relative;
    font-size: 15px;
    color: #737373;
}

.sliderCont .endLabels .rightLabel {
    position: absolute;
    right: 0;
    top: 0;
}

.ui-slider-horizontal .ui-slider-handle {
    height: 42px;
    top: -0.9em;
}

.ui-slider .ui-state-default, .ui-slider ui-widget-content .ui-slider .ui-state-default, .ui-widget-header .ui-slider .ui-state-default {
    width: 20px;
    height: 42px;
    border: 0px;
    background: url('/img/icon/slider-handle.png');
}

.rangeSliderValues.hiddenInput > .numberInputFields {
    display: none;
}

body.seek_edit .sliderContainer .profile-bargraph-container, body.profile_search .sliderContainer .profile-bargraph-container {
    margin-left: -50px;
    padding-left: 50%;
    position: relative;
    height: 25px;
    display: block;
    float: none;
}

body.profile_edit .sliderContainer .profile-bargraph-container {
    float: right;
}

.sliderValue.hasBar .profile-bargraph-container {
    width: 55px;
}

.simpleSlider .sliderValue {
    float: right;
}

.simpleSlider .profile-bargraph-container.hasBar {
    width: 80px;
}

.simpleSlider .sliderValue .profile-bargraph-container .profile-bargraph {
    display: block;
    width: 40px;
    margin: auto;
    float: none;
    margin-top: -14px;
}

.profile-bargraph.range {
    display: inline;
}

.sliderValue input, .rangeSliderValues input {
    width: 75px;
    padding: 1px 0;
    margin-bottom: 6px;
}

.rangeSliderValues input {
    padding: 3px 0;
    margin-bottom: 3px;
}

.ui-widget-header.ui-slider-range {
    background-color: #A8447A;
}

.ui-slider .ui-state-hover, .ui-slider.ui-widget-content .ui-state-hover, .ui-widget-header .ui-slider .ui-state-hover, .ui-slider .ui-state-focus, .ui-widget-content.ui-slider .ui-state-focus, .ui-widget-header .ui-slider .ui-state-focus {
    border: 0px;
    color: transparent;
    font-weight: normal;
}

#slider_Profile_smoking, #slider_Profile_drinking, #slider_Profile_sports, #slider_Profile_travel, #slider_Profile_religion_significance, #slider_Profile_politics_left_right, #slider_Profile_politics_liberal_conservative, #slider_Profile_politics_significance {
    position: relative;
}

#slider_Profile_smoking:before, #slider_Profile_drinking:before, #slider_Profile_sports:before, #slider_Profile_travel:before, #slider_Profile_religion_significance:before, #slider_Profile_politics_left_right:before,
#slider_Profile_politics_liberal_conservative:before, #slider_Profile_politics_significance:before {
    content: '';
    position: absolute;
    height: 21px;
    width: 20%;
    background-color: rgba(179, 179, 179, 0.2);
    left: 0;
    top: 0;
}

#slider_Profile_smoking:after, #slider_Profile_drinking:after, #slider_Profile_sports:after, #slider_Profile_travel:after, #slider_Profile_religion_significance:after, #slider_Profile_politics_left_right:after,
#slider_Profile_politics_liberal_conservative:after, #slider_Profile_politics_significance:after {
    content: '';
    position: absolute;
    height: 30px;
    border-left: 1px solid #b3b3b3;
    left: 20%;
    top: -10px;
}

.zeroDisable .leftLabel {
    padding-left: 20%;
}

/**** multiselect ****/
.ui-multiselect {
    max-width: 100%;
}

.ui-multiselect-checkboxes input, .ui-multiselect-checkboxes span {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}

.ui-multiselect-checkboxes label {
    font-weight: normal;
}

.ui-multiselect-checkboxes li {
    padding: 0;
}

.ui-multiselect-menu {
    padding: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.ui-multiselect-menu label {
    padding: 3px;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    margin: 0;
    line-height: 1;
    border: none;
}

.ui-multiselect-menu label.ui-state-hover {
    background: #E6E6E6;
    border: none;
}

.ui-multiselect-checkboxes {
    max-height: 125px;
}

@media (max-width: 979px) {

    .ui-multiselect-checkboxes {
        max-height: none !important;
    }
}

/**** switch ****/

.switch {
    background: none !important;
    border: 0px !important;
}

.switch-controls i.icon-cross {
    background: url('/img/icon/cross-on.png') no-repeat;
}

.switch-controls i.icon-tick {
    background: url('/img/icon/tick-off.png') no-repeat;
}

#switch-box:checked + .switch-controls i.icon-cross {
    background: url('/img/icon/cross-off.png') no-repeat;
}

#switch-box:checked + .switch-controls i.icon-tick {
    background: url('/img/icon/tick-on.png') no-repeat;
}

#switch-box:checked + .switch-controls .switch-knob {
    left: 20px;
}

#switch-box {
    display: none;
}


.switch-container {
    position: relative;
    height: 20px;
    width: 105px;
}

.switch-controls i {
    float: left;
    position: relative;
    height: 12px;
    width: 12px;
    margin: 0 7px;
}

.switch-slide {
    float: left;
    position: relative;
    height: 12px;
    width: 40px;
    background-color: #292929;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.switch-knob {
    position: absolute;
    top: -5px;
    left: -5px;
    width: 22px;
    height: 22px;
    background: url('/img/icon/icon-knob.png');
}


/**** Icons *****/
i {
    display: inline-block;
    width: 14px;
    height: 14px;
    line-height: 14px;
    vertical-align: text-top;
}

i.icon-cross-cancel {
    float: right;
    margin-left: 7px;
    margin-top: 2px;
    background: url("/img/icon/cross-cancel.png");
}

i.icon-arrow-next {
    float: right;
    margin-left: 7px;
    width: 17px;
    height: 16px;
    background: url("/img/icon/arrow-next.png");
}

i.icon-m, input.gender[value="m"] + i {
    width: 30px;
    height: 30px;
    background: url("/img/icon/icons_30x30.png") -160px -240px;
}

i.icon-f, input.gender[value="f"] + i {
    width: 30px;
    height: 30px;
    background: url("/img/icon/icons_30x30.png") -80px -78px;
}

i.icon-u, input.gender[value="u"] + i {
    width: 30px;
    height: 30px;
    background: url("/img/icon/icons_30x30.png") -240px -1122px;
}

input.eye_color + i, input.hair_color + i, p.hair_color i, p.eye_color i, i.color {
    margin-top: 2px;
    width: 20px;
    height: 20px;
    border-radius: 2px;
}

/* facelift-2016 new color selectors */
.eye_color input[value="1"] + span, span.blue {
    color: #2da2ca;
}

.eye_color input[value="2"] + span, span.grey {
    color: #828282;
}

.eye_color input[value="4"] + span, span.green {
    color: #5bab1a;
}

.eye_color input[value="8"] + span, .hair_color input[value="8"] + span, span.brown {
    color: #7b4b00;
}

.eye_color input[value="16"] + span, .hair_color input[value="1024"] + span, .hair_color input[value="2048"] + span {
    display: none;
}

.eye_color input[value="0"] + span, .eye_color input[value="0"] + span, .hair_color input[value="0"] + span {
    border: 1px solid #737373;
    background: transparent;
    padding-top: 3px;
}

.eye_color input[value="0"] + span, .eye_color input[value="0"] + span:before, .hair_color input[value="0"] + span:before {
    content: "?";
    padding: 7px 0 0 5px;
}

.hair_color input[value="1"] + span, span.verylight {
    color: #fffeb1;
}

.hair_color input[value="2"] + span, span.blond {
    color: #fef503;
}

.hair_color input[value="4"] + span, span.darklight {
    color: #d39a6c;
}

.hair_color input[value="16"] + span, span.darkbrown {
    color: #4c2b00;
}

.hair_color input[value="32"] + span, span.black {
    color: #000000;
}

.hair_color input[value="64"] + span, span.grey {
    color: #b0b0b0;
}

.hair_color input[value="128"] + span, span.red {
    color: #bc0101;
}

.hair_color input[value="256"] + span, span.white {
    border: 1px solid #737373;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: #ffffff;
}

.hair_color input[value="512"] + span, span.colored {
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    color: transparent;
    background: url('/img/icon/hair_color_colored.png');
}


/* facelift-2016 the following eye_color, hair_color are deprecated, ready to remove */
.eye_color input[value="1"] + i, i.blue {
    background: #2da2ca;
}

input.eye_color[value="2"] + i, i.grey {
    background: #828282;
}

input.eye_color[value="4"] + i, i.green {
    background: #5bab1a;
}

input.eye_color[value="8"] + i, input.hair_color[value="8"] + i, i.brown {
    background: #7b4b00;
}

input.eye_color[value="16"] + i, input.hair_color[value="1024"] + i, input.hair_color[value="2048"] + i {
    display: none;
}

input.eye_color[value="0"] + i, input.hair_color[value="0"] + i {
    border: 1px solid #737373;
    background: transparent;
    padding-top: 3px;
}

input.eye_color[value="0"] + i:before, input.hair_color[value="0"] + i:before {
    content: "?";
    padding: 7px 0 0 5px;

}

input.eye_color[value="0"] + i + span, input.eye_color[value="1"] + i + span, input.eye_color[value="2"] + i + span, input.eye_color[value="4"] + i + span, input.eye_color[value="8"] + i + span,
input.hair_color[value="0"] + i + span, input.hair_color[value="1"] + i + span, input.hair_color[value="2"] + i + span, input.hair_color[value="4"] + i + span, input.hair_color[value="8"] + i + span, input.hair_color[value="16"] + i + span,
input.hair_color[value="32"] + i + span, input.hair_color[value="64"] + i + span, input.hair_color[value="128"] + i + span, input.hair_color[value="256"] + i + span, input.hair_color[value="512"] + i + span {
    display: none;
}

input.hair_color[value="1"] + i, i.verylight {
    background: #fffeb1;
}

input.hair_color[value="2"] + i, i.blond {
    background: #fef503;
}

input.hair_color[value="4"] + i, i.darklight {
    background: #d39a6c;
}

input.hair_color[value="16"] + i, i.darkbrown {
    background: #4c2b00;
}

input.hair_color[value="32"] + i, i.black {
    background: #000000;
}

input.hair_color[value="64"] + i, i.grey {
    background: #b0b0b0;
}

input.hair_color[value="128"] + i, i.red {
    background: #bc0101;
}

input.hair_color[value="256"] + i, i.white {
    border: 1px solid #737373;
    background: #ffffff;
}

input.hair_color[value="512"] + i, i.colored {
    background: url('/img/icon/hair_color_colored.png');
}

/**** Profile Graph ****/

.profile-bargraph {
    display: inline-block;
    height: 35px;
    width: 55px;
}

.profile-bargraph.range {
    height: 24px;
    margin-bottom: -2px;
}

.profile-bargraph .bar {
    height: auto;
    width: 7px;
    float: left;
    margin-left: 4px;
    background-color: #CCC;
}

#politics-libcon-graph.profile-bargraph .bar {
    background-color: none !important;
    background: url('/img/icon/icon-tie.png') no-repeat;
    width: 9px;
    opacity: 0.25;
}

#politics-libcon-graph.profile-bargraph .bar.fill {
    opacity: 1;
}

#politics-libcon-graph.profile-bargraph .bar1, #politics-libcon-graph.profile-bargraph .bar2, #politics-libcon-graph.profile-bargraph .bar3, #politics-libcon-graph.profile-bargraph .bar4, #politics-libcon-graph.profile-bargraph .bar5 {
    height: 35px;
    margin-top: 0 !important;
}

.profile-bargraph.range .bar {
    height: 24px;
    margin-top: 0;
}

#seek-politics-libcon-graph.profile-bargraph.range .bar {
    background-color: none !important;
    background: url('/img/icon/icon-tie.png') no-repeat;
    width: 9px;
    height: 35px;
}

.profile-bargraph .bar1 {
    margin-top: 29px;
    height: 6px;
    margin-left: 0;
}

.profile-bargraph .bar2 {
    margin-top: 23px;
    height: 12px;
}

.profile-bargraph .bar3 {
    margin-top: 16px;
    height: 19px;
}

.profile-bargraph .bar4 {
    margin-top: 8px;
    height: 27px;
}

.profile-bargraph .bar5 {
    height: 35px;
}

.profile-bargraph .fill {
    background-color: #0291FF;
}

#politics-libcon-graph.profile-bargraph .bar.fill, #seek-politics-libcon-graph.profile-bargraph.range .bar.fill {
    background-color: none !important;
    background: url('/img/icon/icon-tie-fill.png') no-repeat;
}

/**** Range graphs in seek ****/
.range-wrapper {
    text-align: center;
}

.range-wrapper h5 {
    text-align: left;
    margin-bottom: 3px;
}

.range-wrapper h5 i.icon {
    margin: -5px 5px -5px 0;
}

.range-wrapper .profile-bargraph.range {
    display: inline-block;
    margin: auto;
    width: auto;
    height: auto;
}

.range-wrapper .range-texts span {
    display: inline-block;
    width: 45%;
    vertical-align: middle;
}

.range-wrapper .range-texts {
    line-height: 1.1;
    margin-top: -2px;
}

.range-wrapper .single .range-texts span {
    display: block;
    width: auto;
}

.range-wrapper .range-texts i {
    width: 5%;
}

.ui-tabs .ui-tabs-panel {
    padding: 1em 0 0;
}

.tabsContainer {
    margin: 20px 0 15px;
}


/****** Black speech bubble ******/

.speech-bubble-container {
    height: auto;
    position: relative;
}

.speech-bubble {
    background: #2f2e33;
    -moz-border-radius: 8px;
    margin: 10px 10px 20px;
    padding: 15px 20px;
    border-radius: 5px;
    color: #FFF;
    position: relative;
}

.speech-bubble:after {
    top: 100%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.speech-bubble:after {
    border-color: rgba(136, 183, 213, 0);
    border-top-color: #2f2e33;
    border-width: 20px 0px 0px 20px;
    left: 5%;
}

.speech-bubble p {
    margin: 0;
    line-height: 1.3;
}

.speech-bubble p + p {
    margin-top: 10px;
}

.speech-bubble em {
    line-height: 18px;
    font-size: 13px;
}

/**** Online status indicator ****/
.online-status {
    height: 8px;
    width: 8px;
    display: inline-block;
    vertical-align: middle;
    background: #EDEDED;
    border-radius: 5px;
}

.online-status.online {
    background: #8FC35B;
}

/**
 * Photoswipe gallery customization
 **/
div.ps-caption-content {
    display: none;
}

/****** Fancybox *****/
#fancybox-close {
    top: -22px;
    right: -22px;
}

#fancybox-content {
    overflow: hidden;
}

#fancybox-content > div {
    overflow: visible !important;
}

/** Modal **/
.modal-backdrop {
    z-index: 1140;
}

.modal {
    z-index: 1201;
}

.popover-highlight {
    background-color: #c8ef9a;
}

.popover-highlight .arrow:after {
    border-bottom-color: #c8ef9a !important;
    border-top-color: #c8ef9a !important;
}

/*    */
#premium-mis-setting-container, #premium-cont-order-container {
    margin-bottom: 30px;
}

.mis-settings-checkbox {
    margin-top: 30px;
    margin-bottom: 30px;
}

.mis-settings-checkbox .checkbox > label {
    font-family: 'Lato 6r', sans-serif;
}

.mis-setting-small {
    font-family: 'Lato 5r', sans-serif;
}

.current-container-header {
    margin-bottom: 18px;
}

.current-container-header-main {
    margin-bottom: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.payment-history-heading {
    margin-top: 50px;
    margin-bottom: 50px;
}

.transaction-payments-container-header {
    margin-top: 30px;
    margin-bottom: 20px;
}

.payment-history-small {
    font-size: 16px;
    font-weight: normal;
    margin-top: 10px;
    margin-bottom: 10px;
}

.treffit-plus-account {
    margin-left: 15px;
}

#cancelAgreement {
    margin-bottom: 12px;
}

#saveMisSettings {
    margin-top: 12px;
}

.treffit-plus-help {
    margin-top: 30px;
}