#messenger {
    width: 660px; 
    background-color: #131111 !important ;
}
.no-underline {
    text-decoration: none !important;
}
.small-bigger {
    font-size: 90%; 
}
.small-smaller {
    font-size: 70%; 
}
.small-smallest {
    font-size: 60%;
}
.line-height-1{

    line-height: 0.5rem;

}
.line-height-2{

    line-height: 0.75rem;

}
.line-height-3{

    line-height: 1rem;

}


.text-yellow {
    color: #FFFA00!important;
}
.text-mauve{

    color: #784B84!important;
}
.text-lilac{

    color: #B660CD!important;
}
.text-african{

    color: #B660CD!important;
}

.text-purple {
    color: #9C27B0!important;
}
.text-kelly{


    color: #4CBB17!important;
}
.text-muted-darker{

    color: #d4d4d4!important;
}

.text-pearl-river {
    color: #adb8bc !important;
}
 
.cursor-pointer{

    cursor: pointer;

}
.rounded-1 {
    border-radius: 1rem!important;
}
.rounded-2 {
    border-radius:  .4rem!important;
}
.rounded-6 {
    border-radius:  .6rem!important;
}
.rounded-9 {
    border-radius:  .9rem!important;
}
.rounded-1-1 {
    border-radius: 1.1rem!important;
}
.rounded-left-1 {
    border-top-left-radius: 0.2rem!important;
    border-bottom-left-radius: 0.2rem!important;
}
.rounded-right-1 {
    border-top-right-radius: 0.2rem!important;
    border-bottom-right-radius: 0.2rem!important;
}
.border-purple { 
    border-color: #9C27B0!important;
}
.border-teal {

    border-color: #c9e6f2!important;
}
.border-darker {
    border-color: #808080 !important;
}
.border-darkest {
    border-color: #1d1d1d;
}
.border-darker-transparent {
    border-color: #80808085 !important;
}
.bg-lilac{

    background-color: #B660CD!important;
}
.bg-teal {
    background-color: #cae6f1!important;
}
.bg-plum{

    background-color: #520353!important;

}
.bg-deep-purple {

    background-color: #7f39bb!important;
}
.bg-darker {
    background-color: #2d2d2d!important
}
.bg-darkest {
    background-color: #1d1d1d;
}
.bg-light-darker {
    background-color: #f1f1f1 !important;
}
.bg-pearl-river {
    background-color: #D9DDDC !important;
}
.bg-pearl-river-darker {
    background-color: #aaadac !important;
}

.bg-purple {
    background-color: #9C27B0!important;
}
.bg-purple-gradient{

    background: #330135;
    background: -moz-linear-gradient(top, #330135 0%, #640464 100%);
    background: -webkit-linear-gradient(top, #330135 0%,#640464 100%);
    background: linear-gradient(to bottom, #330135 0%,#640464 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#330135', endColorstr='#640464',GradientType=0 );
 

}
.bg-black {
    background-color: #000 !important;
}

.modal-header-gray-border{

    border-bottom: 1px solid #494b4c;

}

.row-1>div {
    height: 50px;
}
.row-2>div {
    height: 240px;
}
.row-3>div {
    height: 36px;
} 

.bg-no-repeat{

    background-repeat:no-repeat;
}
.bg-cover{

    background-size: cover;

}
.bg-contain{

    background-size: contain;
}
.bg-center{

    background-position: center;
}
.bg-img-whisper-white{

    background-image:url(images/whisper-white.png);


}
.position-absolute{

    position: absolute;


}

#spinner {
    margin-left: 50%;
    margin-top: 30%;
    text-shadow: 1px 1px 0 #525252;
    color: #ffffff !important;
}
#video {
    object-fit: unset;
    background-size: 100% 100%;  
}
#video.hls {
    object-fit: contain;
    background-size: 100% 100%;  
}
#messages{

    overflow-y: auto;
    overflow-x: hidden;

    background: rgba(126,205,225, 0);
    background: -moz-linear-gradient(-45deg, rgba(126,205,225,1) 0%, rgba(200,229,243,1) 24%, rgba(224,232,252,1) 47%, rgba(216,239,255,1) 72%, rgba(150,213,255,1) 99%);
    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,rgba(126,205,225,1)), color-stop(24%,rgba(200,229,243,1)), color-stop(47%,rgba(224,232,252,1)), color-stop(72%,rgba(216,239,255,1)), color-stop(99%,rgba(150,213,255,1)));
    background: -webkit-linear-gradient(-45deg, rgba(126,205,225,1) 0%,rgba(200,229,243,1) 24%,rgba(224,232,252,1) 47%,rgba(216,239,255,1) 72%,rgba(150,213,255,1) 99%);
    background: -o-linear-gradient(-45deg, rgba(126,205,225,1) 0%,rgba(200,229,243,1) 24%,rgba(224,232,252,1) 47%,rgba(216,239,255,1) 72%,rgba(150,213,255,1) 99%);
    background: -ms-linear-gradient(-45deg, rgba(126,205,225,1) 0%,rgba(200,229,243,1) 24%,rgba(224,232,252,1) 47%,rgba(216,239,255,1) 72%,rgba(150,213,255,1) 99%);
    background: linear-gradient(135deg, rgba(126,205,225,1) 0%,rgba(200,229,243,1) 24%,rgba(224,232,252,1) 47%,rgba(216,239,255,1) 72%,rgba(150,213,255,1) 99%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7ecde1', endColorstr='#96d5ff',GradientType=1 );

}
#messages>li {
    display: block;
    clear: both;
    float: left;
    border-radius: 14px;
    padding: 2px 4px 2px;
    margin: 5px; 
    color: #000;
}
#messages>li .message-time {
    float: right;
    width: 50px;
    margin-right: -60px;
    font-size: 10px;
    color: #5B5B5B;
    margin-top: 4px;
    opacity: 0;
}
#messages:hover .message-time {
    opacity: 0;
}
#messages> li.right-bubble > .message-time {
    float: left;
    margin-left: -100px;
}
#messages> li.c.vip span.message-icon {
    width: 26px;
    height: 26px;
    display: inline-block;
    margin-top: -3px;
    margin-bottom: -9px;
    margin-left: -64px;
    margin-right: 28px;
    background-size: contain;
    background-repeat: no-repeat;
    font-weight: bold; 
    padding-left: 34px;
    background-position: center -6px;
}
 
#messages> li.c.vip span.message-icon::after {
    content: "VIP";
}
.bubble-pointer-chat {
    height: 20px;
    width: 20px;
    position: relative;
    overflow: hidden;
    margin-left: -20px;
    float: left;
}
.bubble-pointer-chat:after {
    height: 100%;
    width: 100%;
    position: relative;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    transform: rotate(45deg);
    content: '';
    display: block;
    position: absolute;
    left: 75%;
    background-color: #f38396;
    background-size: cover; 
}
.right-bubble>div.bubble-pointer-chat:after {
    background-color: #93cbff;
    left: -75%;
}

.right-bubble>div.bubble-pointer-chat {
    float: right;
    margin-right: -20px;
}
.right-bubble {
    background-color: rgb(147, 203, 255) !important;
    border-color: rgb(147, 203, 255) !important;
    float: right !important;
    margin-right: 10px !important;
}
#messages>li.right-bubble.image  {
    max-width: 200px;
}
 
#messages > li.right-bubble.vip-3 b {
    color: #fef9ff;
}
#messages > li.right-bubble.vip-2 b {
    color: #ad8d10;
}
#messages > li.right-bubble.vip-2 b {
    color: #777777;
}

#messages > li.c.vip.vip-3 span.message-icon {
    color: #DAA9EB;
    background-image: url(images/vip-3.png);
}
#messages > li.c.vip.vip-2 span.message-icon {
    color: #ad8d10;
    background-image: url(images/vip-2.png);
}
#messages > li.c.vip.vip-1 span.message-icon {
    color: #868686;
    background-image: url(images/vip-1.png);
}
#messages > li.right-bubble.vip-1 {
    background-color: #fbfdff !important;
    border-color: #b7b7b7 !important;
}
#messages > li.right-bubble.vip-2 {
    background-color: #c1f9ac !important;
    border-color: rgba(29, 101, 30, 0.19) !important;
}
#messages > li.right-bubble.vip-3 {
    background-color: #8f4ac6 !important;
    border-color: #8f4ac6 !important;
}

#messages > li  .message-content {
    padding-left: 2px;
}

#messages > li.c.vip.vip-3 .message-content {
    color: #FFF;
}

#messages > li.c.vip.vip-2 .message-content {
    color: #000;
}

#messages > li.c.vip.vip-1 .message-content {
    color: #000;
}

#messages >li.right-bubble.vip.vip-3>div.bubble-pointer-chat:after {
    background-color: #8f4ac6 !important;
}
#messages >li.right-bubble.vip.vip-2>div.bubble-pointer-chat:after {
    background-color: #c1f9ac;
}
#messages >li.right-bubble.vip.vip-1>div.bubble-pointer-chat:after {
    background-color: #FFF;
}

#messages >.message-name {
    padding-left: 2px;
    padding-right: 2px;
}
#messages>li.system {
    background-color: #af489d !important;
    color: #fbf22e !important;
    text-shadow: none !important;
    float: inherit;
    border: none;
    text-align: center;
}
#messages>li.system>.bubble-pointer-chat, 
#messages>li.system>.message-time, 
#messages>li.system>.message-icon, 
#messages>li.system .message-name, 
#messages>li.system .message-colon {
    display: none;
}
#messages>li.left-bubble {
    background-color: #f38396;
    border-top: none;
    border-right: none;
} 

#messages .message-smiley {
    width: 20px;
    height: 20px;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
}
.alert_msg {
    color: #000;
}
.pc .alert_buttons .alert_btn {
    border-radius: 5px;
    background-color: #e4e4e4;
    width: 80px;
}
.pc .alert_buttons .alert_btn.alert_btn_cancel {
    background-color: #2196F3;
    color: #FFF;
    border: 1px solid #2196F3;
}
.heart, .token-heart {
    font-size: 50px;
    width: 60px; 
    text-align: center;
    height: 60px;
}
.heart-amount{

    margin-top: -60%;
    width: 100%;
    font-size: 14px;
    font-family: sans-serif;

}
#hearts {
    width: 375px;
    margin: auto;
}
#attachments {
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 200px;
    background-color: #CCC;
    border: 1px solid #FFFFFF;
    border-radius: 10px;
    display: none;
}
#attachments-content {
    height: 170px;
}
#attachments-buttons {
    height: 30px;
    background: #7b7b7b; 
    border-top: 1px solid #d2d2d2;
}
.attachment-button {
    font-size: 17px;
    line-height: 21px;
    cursor: pointer;
    border-right: 1px solid #8e8e8e;
}
.attachment-button:hover {
    color: #9C27B0;
    background-color: #fff;
}
#attach-gif-giphy::before {
    content: "GIPHY";
}
#attach-gif-guggy::before {
    content: "GUGGY";
}
#attach-gif-giphy, #attach-gif-guggy {
    font-size: 12px;
    line-height: 12px;
}
#attach-gif-giphy span,#attach-gif-guggy span {
    display: block;
    margin-top: -3px;
}
#attach-gif-giphy span:after {
    content: "Search GIFs";
    display: inline-block;
    font-size: 7px;
}
#attach-gif-guggy span:after {
    content: "Add text to GIFs";
    display: inline-block;
    font-size: 6px;
}
#smileys,#stickers,#emojis {
    overflow-y: scroll;
    height: 100%;
}
.smiley, .emoji {

    float: left;
    height: 20px;
    padding: 2px;
    background-repeat: no-repeat;
    margin: 3px 2px;
    width: 20px;
    cursor: pointer;
    text-align: center;
    font-size: 22px;

}
#send.active {
    color: #ffef00 !important;
}

#font-size.h6 {
    font-size: 10px; 
}
#font-size.h4 {
    font-size: 14px;
    line-height: 15px;
}
#font-size.h3 {
    font-size: 20px;
    line-height: 16px;
}
#font-size::after {
    content: "A";
}
 

#messages .image .message-content img {
    width: 100%;
    display: inherit;
    border-radius: 9px;
}
#messages > li.local {
    opacity: 0.4;
}
#attach-snapshot-take {
    width: 220px!important;
    display: inherit;
}
#photo-viewer img {
    max-width: 100%;
}
#stickers .sticker {
    height: 85px;
    float: left;
    background-position: center center;
    background-size: contain;
    background-repeat: no-repeat;
}
#messenger #giphy-results, #messenger #guggy-results, #messenger #gifs-results {
    height: 136px;
    overflow-y: scroll;
}
#messenger .giphy-gif, #messenger .guggy-gif, #messenger .gifs-gif {
    float: left;
    height: 136px;
    width: 33.33%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border: 1px solid #ccc;
    background-color: #717171;
}
#messenger #giphy-results >.loader, #messenger #guggy-results >.loader, #messenger #gifs-results >.loader {
    display: block;
    clear: both;
    opacity: 0;
    color: #7b7575;
    text-align: center;
}
#messenger #giphy-results >.loader::after, #messenger #guggy-results >.loader::after, #messenger #gifs-results >.loader::after {
    content: "Loading...";
}
#messenger #giphy-search-field, #messenger #guggy-search-field {
    background-color: #f5f5f5 !important;
    border-radius: 8px;
    height: 22px;
    color: #000;
    font-size: 12px;
    border: 1px solid #ccc;
}
#messenger #giphy-results.loading >.loader, #messenger #guggy-results.loading >.loader, #messenger #gifs-results.loading >.loader{
    
    opacity: 1;
   
}
#messenger #gifs-results {
    height: 170px;
}
#messenger #send-whisper.active {
    background-color: #ff0097 !important;
}
#attach-gif-sexy::before {
    content: "💋";
}
#attach-gif-naughty::before {
    content: "👅";
}
#attach-gif-funny::before {
    content: "🤣";
}
#attach-sticker::before {
    content: "❤️";
}
#messages .whisper-icon {
    display: none;
    width: 16px;
    background-size: cover;
    background-color: #8032BE;
    border-radius: 50%;
    height: 16px;
    margin-right: 2px;
    vertical-align: middle;
    margin-left: 2px;
    background-image: url(images/whisper-white.png);
}

#messages .whisper .whisper-icon {
    display: inline-block;
}
#messages>li.left-bubble.image {
    max-width: 200px;
}
#messages .sticker {
    background-color: transparent!important;
    border: none;
} 
#messages > li.right-bubble.sticker .bubble-pointer-chat {
    display: none;
}
#messages > li.right-bubble.sticker .message-name {
    color: #000;
}
#messages > li.right-bubble.sticker {
    text-align: right;
    max-width: 200px;
    background-color: transparent!important;
    border: none;
}
.bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before {
    border-bottom-color: #2b2b2b;
}
.tooltip-inner { 
    background-color: #2b2b2b; 
}
#messages .sticker .bubble-pointer-chat {
    display: none;
} 
#message-input-container {
    padding: 1px !important; 
}
#messages.bg-darkest {
    background: #343a40 !important;
}
#tip, #tip-heart {
    padding-top: 10px;
}
#buttons-holder {
    height: 100%;
    position: absolute;
    z-index: 10;
    display: none;
}

#messenger .btn-1 {
    background-color: #26282963;
    width: 30px;
    text-align: center;
    height: 30px;
    padding: 7px 0 0 0 !important;
    margin-top: 1px;
    margin-bottom: 2px;
}
.btn-1.btn-dark {
    background-color: #0000006b !important;
    border: 1px solid #00000078;
}
.h-90 {
    height: 90%;
}
.h-80 {
    height: 80%;
}
.h-20 {
    height: 20%;
}
.h-10 {
    height: 10%;
}
#messenger .btn-1:hover {
    background-color: #000000b5 !important;
}
#video-holder:hover #buttons-holder {
    display: block;
} 
#messages>li.system.private-notification {
    background-color: #1f8023 !important;
}
#messages>li.system.private-ended-notification {
    background-color: none !important;
}

#messages>li.system.performer-only {
    display: none;
}
.message-colon {
    display: inline-block;
} 
#volume-slider {
    display: none;
} 
#messenger #volume.btn-1:hover #volume-slider {
    display: initial;
}
#volume-slider .ui-slider-handle {
    width: 1rem;
    height: 1rem;
    background: #fbfbfb;
    border: none;
    border-radius: 13px;
}
#volume-slider.ui-slider-horizontal {
    height: 4px !important;
    margin-top: 4px;
    background: #717171 !important;
    border: none;
}
#volume-slider .ui-widget-header {
    background: #1ea726;
    border-radius: 2px;
}
@-moz-keyframes spinner-loader {
    0% {
        -moz-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@-webkit-keyframes spinner-loader {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@keyframes spinner-loader {
    0% {
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
.spinner:not(:required) {
    width: 40px;
    margin-left: 50% !important;
    -moz-animation: spinner-loader 1500ms infinite linear;
    -webkit-animation: spinner-loader 1500ms infinite linear;
    animation: spinner-loader 1500ms infinite linear;
    -moz-border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    border-radius: 0.5em;
    -moz-box-shadow: rgba(255, 255, 255, 0.3) 1.5em 0 0 0, rgba(255, 255, 255, 0.3) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) 0 1.5em 0 0, rgba(255, 255, 255, 0.3) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) -1.5em 0 0 0, rgba(255, 255, 255, 0.3) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.3) 0 -1.5em 0 0, rgba(255, 255, 255, 0.3) 1.1em -1.1em 0 0;
    -webkit-box-shadow: rgba(255, 255, 255, 0.3) 1.5em 0 0 0, rgba(255, 255, 255, 0.3) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) 0 1.5em 0 0, rgba(255, 255, 255, 0.3) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) -1.5em 0 0 0, rgba(255, 255, 255, 0.3) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.3) 0 -1.5em 0 0, rgba(255, 255, 255, 0.3) 1.1em -1.1em 0 0;
    box-shadow: rgba(255, 255, 255, 0.3) 1.5em 0 0 0, rgba(255, 255, 255, 0.3) 1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) 0 1.5em 0 0, rgba(255, 255, 255, 0.3) -1.1em 1.1em 0 0, rgba(255, 255, 255, 0.3) -1.5em 0 0 0, rgba(255, 255, 255, 0.3) -1.1em -1.1em 0 0, rgba(255, 255, 255, 0.3) 0 -1.5em 0 0, rgba(255, 255, 255, 0.3) 1.1em -1.1em 0 0;
    display: inline-block;
    font-size: 10px;
    width: 1em;
    height: 1em;
    margin: 1.5em;
    overflow: hidden;
    text-indent: 100%;
}
#video-holder {
    background-color: #000;
}
#room-details {
    opacity: 0;
}

#viewer-container video ,#broadcast-container video{

    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center center;

}


.heart-track, .dollar-track { 
    width: 200px;
    height: 50px;
    position: absolute;
    z-index: 1000;
    bottom: 0;
}
.heart-item, .dollar-item { 
    font-size: 50px;
    color: #ff00a1c4;
    position: absolute;
    text-shadow: 1px 1px 30px #ffffff96;
}
.dollar-item { 
    width: 50px;
    height: 50px;
    background-image: url(images/gold-tip.png);
    background-repeat: no-repeat;
}

.dollar-item.silver { 
    background-image: url(images/silver-tip.png); 
}

#messenger #end-chat {
    width: 22px;
    height: 22px;
    background-color: #757575;
    border-radius: 50%;
    display: block;
    text-align: center;
    line-height: 22px;
    font-family: Arial;
    color: #FFF;
    font-weight: bold;
    border: 1px solid #a9a9a9;
    cursor: pointer;
    position: absolute;
    right: -11px;
    top: -11px;
}

#attach-emoji::before {

    content: "😍";

}

emoji {

    font-size: 3rem !important;

}
#hd-icon {
    width: 25px;
    height: 30px;
    position: absolute;
    right: 10px;
    top: 10px;
    background-image: url(images/hd.png);
    background-size: contain;
    background-repeat: no-repeat;
}
#messenger.flash #hd-icon {
    display: none;
}
#messages li.system.whisper .whisper-icon {
    display: none;
}
.bg-light-purple-gradient {

    background: #bf5cc1;
    background: -moz-linear-gradient(top, #bf5cc1 0%, #f489f4 100%);
    background: -webkit-linear-gradient(top, #bf5cc1 0%,#f489f4 100%);
    background: linear-gradient(to bottom, #bf5cc1 0%, #f489f4 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf5cc1', endColorstr='#f489f4',GradientType=0 );

}
.bg-light-purple-flat{

    background-color: #bf5cc1;


}

#messenger.client-app #viewer-container {
    background-image: none !important;
}


.message-parent { 
    color: #ffc4c4;
}
#messages>li {
    cursor: pointer;
}
div#message-replying-to-container {
    width: 100%;
    position: absolute;
    margin-top: -48px;
    background: #e39adc;
    border-radius: 2px;
    padding: 2px;
    color: #1f1020;
    display: none;
    height: 47px;

}
div#message-replying-to-close {
    position: absolute;
    right: 5px;
    cursor: pointer;
}
div#message-replying-to {
    font-weight: bold;
}
div#message-replying-to-message {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#viewer-container.brightness-0 {
    filter: brightness(1);
}
#viewer-container.brightness-10 {
    filter: brightness(1.1);
}
#viewer-container.brightness-20 {
    filter: brightness(1.2);
}