/* desktop version */
/* html { -webkit-text-size-adjust: none; image-rendering: pixelated; } */
body { background-color: #333; color: #ccc; margin: 0; padding: 0; overflow: hidden; position: relative;
/* transition: opacity .1s ease-in-out; */

 }

body, input, label, textarea, select, option { font: normal 14px Arial, Helvetica, sans-serif; }


/* --------- ligth-background ---------- */

.lightBg * { color: #000 !important; }

.lightBg #vkAudioSearchOut li:hover,
.lightBg .slider,
.lightBg .cbutton span,
.lightBg .head,
.lightBg .anav .amess,
.lightBg .smile-header,
.lightBg .modal h4,
.lightBg .onav h5,
.lightBg .pages a,
.lightBg .table_opt .tr:nth-child(1) .td,
.lightBg .august-head *,
.lightBg .august-head { color: #eee !important; text-shadow: none !important; }

.lightBg .narrow .tr .td.left,
.lightBg #opt-info { color: #000 !important; }

.lightBg .cbutton,
.lightBg .slider { box-shadow: none !important; }

.lightBg .pers { background-color: #d8d8d8 !important; }

.lightBg #horosSigns .amess,
.lightBg .modal,
.lightBg select,
.lightBg option,
.lightBg #vkAudioSearchOut ul,
.lightBg input,
.lightBg textarea,
.lightBg .editable { background-color: #ddd !important;  color: #000 !important; }

.lightBg .ui-tooltip { border: none !important; }
.lightBg .ui-tooltip * { color: #eee !important; }
.lightBg .roomHeader span { color: #bb2525 !important; }

.lightBg .dateDivider { box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .5), 0px 0px 0px 0px #444444 !important; }
.lightBg .dateDivider span span { background-color: inherit; }

.lightBg ::-webkit-scrollbar-track { background-color: #c3c3c3; box-shadow: none; }
.lightBg ::-webkit-scrollbar-thumb { background-color: #a0a0a0; }


/* skin #6 */

.lightBg.modern .cbutton,
.lightBg.modern #wrapper > div.tr:first-child { background-color: #697cbf; }
 
.lightBg.modern #wrapper #topblock a { color: #fff !important; }

.lightBg.modern div.august-head { background-color: #dfd4bf; color: #3a2c10 !important; }
.lightBg.modern div.august-head span { color: #3a2c10 !important; }

.lightBg #online #online_head { margin-top: 5px; }
.lightBg #online.adv #online_head { margin: 1px 0 0 0; }
.lightBg #online #online_head a { line-height: 3px; }
.lightBg #online a.select { background-color: #e8e8e8 !important; }

.lightBg a.amess,
.lightBg #online a.user { color: #4646e1 !important; }

.lightBg span.infobot { background-color: #d1d1d1 !important; }
.lightBg .spoiler-label:before { background-color: #d1afaf !important; width: inherit !important; padding: 0 3px 0 3px;     border-radius: 2px; }

.lightBg.modern ::-webkit-scrollbar-track { background-color: #cdcdcd; }

.lightBg.modern ::-webkit-scrollbar-button,
.lightBg.modern ::-webkit-scrollbar-thumb { background-color: #888; box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, .15); border-bottom: 1px solid #333; }

.lightBg.modern ::-webkit-scrollbar-thumb:hover { background-color: #aaa; }

.lightBg.modern ::-webkit-scrollbar-button:start { background: #888 url(images/ui-icons_222222_256x240.png) 0px -17px no-repeat; }
.lightBg.modern ::-webkit-scrollbar-button:end { background: #888 url(images/ui-icons_222222_256x240.png) -65px -16px no-repeat; }


/* ------------------------------------- */



::-webkit-scrollbar { width: 15px; }
::-webkit-scrollbar-track { background-color: #444; box-shadow: -1px 0px 0 0 rgba(0, 0, 0, .8), inset -1px 0px 0 0 rgba(255, 255, 255, .1); }

::-webkit-scrollbar-button,
::-webkit-scrollbar-thumb { background-color: #646464; box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, .15); border-bottom: 1px solid #333; }

::-webkit-scrollbar-button { box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, .1); }
::-webkit-scrollbar-button:start { background: #646464 url(images/ui-icons_222222_256x240.png) 0px -17px no-repeat; }
::-webkit-scrollbar-button:end { background: #646464 url(images/ui-icons_222222_256x240.png) -65px -16px no-repeat; }
::-webkit-scrollbar-thumb { background: #646464 url(../pic/thumb-bg.png) 5px 50% no-repeat; }
::-webkit-scrollbar-thumb:hover { background-color: #747474; box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, .20); }
::-webkit-scrollbar-thumb:active { background: #646464 url(../pic/thumb-bg-active.png) 4px 49.5% no-repeat; background-color: #646464; box-shadow: inset 1px 1px 0 0 rgba(255, 255, 255, .15); }

::-webkit-scrollbar-button:start:hover,
::-webkit-scrollbar-button:end:hover { background-color: #747474; }

::-webkit-resizer { background: #444 url(images/ui-icons_cccccc_256x240.png) -80px -224px no-repeat; }
::selection { background-color: #bf8ec5; color: #fff; }


@font-face {
 font-family: 'Symbola';
 src: url('../fonts/symbola.woff') format('woff');
 font-weight: normal;
 font-style: normal;
 font-display: block;
}

@font-face{
 font-family: Whitney500;
 font-weight: 500;
 src: url('../fonts/whitney500.woff') format('woff');
 font-display: block;
}

@font-face{
 font-family: Whitney400;
 font-weight: 400;
 src: url('../fonts/whitney400.woff') format('woff');
 font-display: block;
}

@font-face{
 font-family: Whitney300;
 font-weight: 300;
 src: url('../fonts/whitney300.woff') format('woff');
 font-display: block;
}


ul { list-style: none; }
ul, li, ol { margin: 0; padding: 0; }
hr { height: 1px; border: 0; border-top: 1px solid #777; }
p { padding: 0 1px 0 1px; margin: 0; }
img { border: none; }
label { margin: 0; padding: 0; cursor: pointer; }
form, object, iframe { margin: 0; padding: 0; outline: none; }
select, textarea, input { margin: 0; /*font-size: 95%; */ outline: none; }
select option { font-size: 12px; }
input, textarea { background-color: #444; color: #ccc; border: 1px solid #888; padding: 4px; border-radius: 20px; }
textarea { border-radius: 4px; resize: vertical; font-size: 13px; }
svg { width: 0; height: 0; overflow: hidden; }

input[type="file"],
input[type="checkbox"],
input[type="radio"] { margin: 0 0 0 0; padding: 0; }

input[type="file"] { height: 21px; }
input[type="radio"] { border: none; }

a { text-decoration: underline; }
a:focus { outline: none; }
a:hover { cursor: pointer; text-decoration: none; }

h4 > span { width: 12px; height: 12px; }
h4 > span:nth-child(1) { background: url(../pic/w1.png) no-repeat; margin: 3px 2px 0 0; }
h4 > span:nth-child(2) { background: url(../pic/w2.png) no-repeat; margin: 3px 2px 0 0; }
h4 > span:nth-child(3) { background: url(../pic/w3.png) no-repeat; margin: 3px 2px 0 0; }

h4 > span:active { margin-top: 4px; }

/* b { font: bold 14px Whitney500; } */

#input, #login, #passw, #login-restore { width: 300px; border-radius: 20px; padding: 3px 4px 3px 10px; margin: 0px 0 0 3px; }
#input { margin: 0 7px 0 3px; padding-right: 45px; }
#login, #passw, #login-restore { width: 215px; margin-left: 10px; }

/*.border_ok { border-top: 1px solid #222; border-left: 1px solid #222; border-bottom: 1px solid #aaa; border-right: 1px solid #aaa; } */
.border_ok { border: none; box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.45), -1px -1px 0px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.45), -1px -1px 0px 0px rgba(0, 0, 0, 0.2); }

.border_err { border-top: 1px solid #870000; border-left: 1px solid #870000; border-bottom: 1px solid #ff4040; border-right: 1px solid #ff4040; }

#login-restore { margin-right: 10px;  }

input::-webkit-input-placeholder { color: #777; }
input:-moz-placeholder { color: #555; }

textarea::-webkit-input-placeholder { color: #777; }
textarea:-moz-placeholder { color: #555; }

#chat { margin: 5px 0 5px 1px; padding: 0 1px 0 0; overflow-y: auto; overflow-x: hidden; }

/*#chat { margin: 5px 0 5px 5px; padding: 0 5px 0 0; overflow-y: auto; overflow-x: hidden; } */

.sys,
.syshistory { color: #ffcc00; padding-left: 240px; }

.syshistory { margin: 30px 0 20px 0; }

.sys-first,
.msg-first { margin-top: 10px !important; }

.adv.sys-first,
.adv.msg-first { margin-top: 0px !important; }

.adv.msg-first.pers { margin-top: 15px !important; }

.syshistory span > span > span { color: #fff; background-color: #5c5c5c; border-radius: 2px; padding: 1px 9px; }
.err { padding-left: 0; }
img.vkerr {  border-radius: 2px; margin: 4px 0 0 0; }

.infobot {  color: #eaeaea; background-color: #4a4a4a; border-radius: 10px; padding: 0px 8px; display: inline-block; margin: 0; font: normal 12px Arial, Helvetica, sans-serif; border-radius: 2px; }

.infobot.qa { width: 41px; margin-top: 1px; }
.adv .nick-hidden { display: none; }

.infobot.OpenAI { color: #ff9090; }
.infobot.Anthropic { color: #ffaf36; }
.infobot.Google { color: #f19cbf; }
.infobot.DeepSeek { color: #83dbba; }

.third-pers { display: inline-block; color: #ececec; background-color: #505050; border-radius: 10px; margin: 0 5px 1px 5px; padding: 0px 17px; position: relative; }

.third-pers i { font: normal 11px Verdana; position: absolute; display: inline; top: 4px; color: #FFC800; }

.third-pers i:first-child { left: 6px; }
.third-pers i:last-child { right: 6px; }

.user { color: #ff6600; }
.pers { background-color: #3e3e3e; border-radius: 0px; margin: 0 1px 1px 1px; }

a.user:hover,
a.amess:hover,
#online a:hover { text-decoration: none; }

#online > div[id^="child-"] { margin: 0 3px 0 5px; display: block; white-space: nowrap; overflow-x: hidden; text-overflow: ellipsis; padding: 0 0 1px 0; }

a.amess { color: #D5D6A5; display: inline-block; margin: 0 15px 0 0 }
#chat a.amess { margin: 0; }
/*#chat a.amess.gallery { color: #F5D38B; } */

#chat p { /*max-height: 16px; overflow-y: hidden; */  clear: both; }
#chat p > span > img { vertical-align: top; }


.table { display: table; border-collapse: collapse; margin: 0 0 0 0; width: 99.99%; /*height: 99.99%;*/ }
.tr { display: table-row; }
.colspan > div { width: 1px; }
.colspan > div > div { text-align: right; }
.td { display: table-cell; vertical-align: top; padding: 0px 0 0px 0px; }
.online-wrap { position: relative; }

#appearance-avatar .info_wrap { width: 350px; }
#appearance-avatar .colspan > div > div { width: auto !important; }

#online { width: 256px; padding: 0px 0 5px 0px; overflow-y: auto; overflow-x: hidden;  }
#online a { display: inline;  /*display: block;*/ color: #8f8f8f; /*white-space: nowrap;*/ }
#online_head { width: 237px; padding: 0 0 4px 0; margin: 0 0 3px 0;  /*border-bottom: 1px solid #777;*/ color: #777; font-size: 9px; position: fixed; z-index: 1; background-color: #333; box-shadow: 0px 1px 0px 0 rgba(255, 255, 255, .5); }
#online_head a { font: normal 9px Tahoma, Helvetica, sans-serif; color: #69f; display: inline-block; margin: 0 2px 0 3px; }
#online_head a:first-child { margin-left: 0; }
#online_head a.nodec { text-decoration: none !important; }
/*#online > div:nth-child(2) { margin-top: 25px; } */

#online_head a.new-msg { color: #96cd2c; }

#formsend, #formpasswrestore { display: none; }
#formsend ul li { position: relative; }
.ajax-loader { position: absolute; top: 48%; left: 50%; z-index: 99999; }
.ajax-loader-online { position: absolute; top: 48%; left: 41%; }

#id_dreambook { width: 426px; }
#id_dreambook .wrapper_overflow { overflow-y: scroll; }

#topblock,
#id_info .anav,
#id_admin .anav,
#id_info-fr .anav,
#id_reactions .anav,
#id_dreambook .anav,
#id_horoscope .anav { height: 32px; font-size: 7px; color: #eee; }

#topblock { margin: 7px 0 9px 0; }

#topblock a.amess,
#id_info .anav a.amess,
#id_admin .anav a.amess,
#id_info-fr .anav a.amess { margin: 12px 7px 0 7px; font-size: 12px; }

#id_info select,
#id_info-fr select { font: normal 12px Arial, Helvetica, sans-serif; }

#id_youtube { width: min-content; height: auto; min-width: 400px; min-height: 234px; }

#topblock a.amess { font: normal 13px 'PT Sans Narrow'; border-radius: 2px; margin: 0; padding: 6px 7px 6px 7px; color: #FFB71D; text-decoration: none; }


#topblock a.amess:hover { color: #fff; }
#topblock a.amess:last-child { padding-right: 12px; }


#auto { margin: 6px 0px 0 9px; }
#forauto { margin: 4px 12px 0 5px; display: inline-block; vertical-align: top; }
#formlogin, #formsend { /*position: relative;*/ }
#forauto { /*margin: 0 0 0 33px; top: 8px;*/ }
#info { position: absolute; top: 82%; min-width: 30px; text-align: center; opacity: 0; visibility: hidden; }

#info.animate-off {
 opacity: 0;
 visibility: hidden;
 -webkit-transition-duration: 200ms, 200ms, 0ms;
 -webkit-transition-property: opacity, top, visibility;
 -webkit-transition-delay: 0ms, 0ms, 200ms;
 -moz-transition-duration: 200ms, 200ms, 0ms;
 -moz-transition-property: opacity, top, visibility;
 -moz-transition-delay: 0ms, 0ms, 200ms;
 -o-transition-duration: 200ms, 200ms, 0ms;
 -o-transition-property: opacity, top, visibility;
 -o-transition-delay: 200ms, 200ms, 0ms;
}

#info.animate-on {
 opacity: 1;
 visibility: visible;
 -webkit-transition-duration: 200ms, 200ms, 0ms;
 -webkit-transition-property: opacity, top, visibility;
 -webkit-transition-delay: 0ms, 0ms, 0ms;
 -moz-transition-duration: 200ms, 200ms, 0ms;
 -moz-transition-property: opacity, top, visibility;
 -moz-transition-delay: 0ms, 0ms, 0ms;
}

#info.animate-on.stream { width: 37px; }

.ui-tooltip { z-index: 2147483647; background-color: inherit; background-image: none; border: 1px solid #555 !important; box-shadow: none; font: normal 12px Arial, Helvetica, sans-serif; padding: 5px 6px !important; }
.ui-tooltip:after { border-width: 5px !important; margin-left: -5px !important; }
.ui-tooltip:before { border-width: 6px !important; margin-left: -6px !important; }
.ui-tooltip-content { color: #71A3FF; /*white-space: pre;*/ }

.tooltip-title { pointer-events: none; background: #000; padding: 8px 7px 8px 7px; border-radius: 4px; font: normal 11px Arial; max-width: 400px; }
.tooltip-title .ui-tooltip-content { color: #eee; }
.tooltip-title.top:after { border-width: 8px !important; margin-left: -8px !important; border-top-color: #000 !important; } 
.tooltip-title.top:before { border-top-color: #555 !important; border-width: 9px !important; margin-left: -9px !important; } 

.arrow_box,
.arrow_box_bottom { background: #000; padding: 8px 7px 8px 7px; border-radius: 4px; width: auto; opacity: 0.9;
 border: 1px solid #555; }

.tooltip-title.top:after,
.tooltip-title.top:before,
.tooltip-title:after,
.tooltip-title:before,
.arrow_box:after,
.arrow_box:before,
.arrow_box_bottom:after,
.arrow_box_bottom:before { top: 100%; left: 50%; border: solid transparent; content: ' '; height: 0; width: 0; position: absolute; pointer-events: none;  }

.tooltip-title:after,
.tooltip-title:before,
.tooltip-title.top:after,
.tooltip-title.top:before { left: 5%; }

.arrow_box:after { border-top-color: #000; border-width: 8px; margin-left: -8px; }
.arrow_box:before { border-color: rgba(191, 191, 191, 0); border-top-color: #555; border-width: 9px; margin-left: -9px; }

.arrow_box_bottom:after,
.tooltip-title:after { border-bottom-color: #000; border-width: 8px; margin-left: -8px; top: -10px; }

.arrow_box_bottom:before,
.tooltip-title:before { border-color: rgba(191, 191, 191, 0); top: -12px; border-bottom-color: #555; border-width: 9px; margin-left: -9px; } 

#id_option.arrow_box:before,
#id_option.arrow_box:after { border: none; }

.ui-tooltip.arrow_box { max-width: 395px; white-space: nowrap; }


/*
@font-face { font-family: 'RobotoCondensed'; src: url('../fonts/PT_Sans-Narrow-Web-Bold.ttf') format('ttf'); font-weight: 700; font-style: bold; }
*/


.cbutton { text-decoration: none; position: relative; display: inline-block; cursor: pointer; background-color: #555; border-radius: 2px; color: #fff; width: 22px; height: 22px; margin: 1px 2px 0 0px; box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.26), 0px 1px 0px 0px rgba(255, 255, 255, 0.3) inset; }

.cbutt-active { color: #ffcc00; }

/*
#go,
#pvt,
#snd,
#clear,
#reload,
#autoscroll,
#smiles,
#option,
#audio-capture,
#audio-capture.rec
 { background: #555 url(../pic/button-sprite.png) 0 0 no-repeat;  margin: 1px 0 0 0; padding: 3px 0 0 0; }
*/


.cbutt:active,
#change-passw:active,
#appearance-avatar-butt:active,
#save:active,
#save-ym:active,
#escape-ym:active,
#avt-create-prof:active,
#avt-delete-prof:active,
#avt-rename-prof:active,
#asave:active,
#asave-fr:active,
#adel:active,
#adel-fr:active,
#psend:active,
#psend-fr:active,
#loginsubm:active,
#loginrestoresubm:active,
#audio-capture:active,
#go:focus,
#pvt:focus,
#snd:focus,
#clear:focus,
#design-change:focus,
#reload:focus,
#message-filter:focus,
#filter-for-me:focus,
#filter-tidmess:focus,
#barcode:focus,
#autoscroll:focus,
#smiles:focus,
#nashdom:focus,
/*#option:focus, */
#avatars:focus,
#avtoptions:focus,
#audio-capture:focus
 { margin: 0 2px 0 0px; background-color: #454545; box-shadow: 0px -1px 0px rgba(255, 255, 255, .2) inset, 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 1px 0px 0px rgba(0, 0, 0, 0.5) inset, -1px 0px 0px rgba(0, 0, 0, 0.5) inset; /*width: 24px;*/  }


.cbutt:active,
#save:active,
#save-ym:active,
#escape-ym:active,
#asave:active,
#asave-fr:active,
#avt-create-prof:active,
#avt-delete-prof:active,
#avt-rename-prof:active,
#adel:active,
#adel-fr:active,
#psend:active,
#psend-fr:active,
#appearance-avatar-butt:active,
#change-passw:active { width: 100px; height: 30px; margin: 1px 1px 0 0px; line-height: 31px; }

#change-passw { border-radius: 30px !important; }

#go { background-position: -2px 2px; }
#pvt { background-position: -25px 2px; }
#snd { background-position: -51px 2px; }
#clear  { background-position: -77px 2px; }
#reload { background-position: -102px 2px; }
#autoscroll { background-position: -127px 2px; }
#smiles { background-position: -176px 1px; }
/*#nashdom { background-position: -176px 1px; } */
/*#option { background-position: -201px 2px; } */
#audio-capture { background-position: -228px 2px; }
#audio-capture.rec { background-position: -251px 3px !important; }

#go:focus { background-position: -1px 3px; }
#pvt:focus { background-position: -24px 3px; }
#snd:focus { background-position: -50px 3px; }
#clear:focus  { background-position: -76px 3px; }
#reload:focus  { background-position: -101px 3px; }
#autoscroll:focus  { background-position: -126px 3px; }
#smiles:focus { background-position: -175px 2px; }
/*#option:focus { background-position: -200px 3px; } */
#audio-capture:focus { background-position: -227px 3px; }

.button-block { margin: 1px 0 0 0; display: inline-block; vertical-align: top; }
.usnd { font: normal 16px sans-serif; color: #adff2f; margin: 0 3px 0 0; }

.uv2t { background: url(../pic/vmic.png) 0 0px no-repeat; /*font: normal 14px/10px sans-serif; color: #ffe34a;*/ padding: 11px 7px 0 0; display: inline-block; margin: 0 5px -2px 0; }


a.uvm,
a.uvm,
a.uvm,
a.uvmvk,
a.uvmvk,
a.uvmvk,
a.uvm:link,
a.uvm:hover,
a.uvm:visited,
a.uvmvk:link,
a.uvmvk:hover,
a.uvmvk:visited { margin: 0 0px -2px 0; text-decoration: none; display: inline-block; width: 13px; height: 13px; }

/*
a.uvm:link,
a.uvm:hover,
a.uvm:visited { margin-right: 5px; }
*/

a.uvm { background: url(../pic/record.png) no-repeat; }
a.uvmvk { background: url(../pic/recordvk.png) no-repeat; }
a.uvm-big { background: url(../pic/record-big.png) no-repeat; width: 19px; height: 19px; display: inline-block; margin: 0 -45px -6px 0px; -webkit-transition: all .8s ease-in-out; }
.rec-stop { margin-right: 5px !important; }
a.uvm-big.record { margin-right: 5px;  -webkit-transform: translateX(-50px); }

a.uvm:hover,
a.uvm:active { color: #fff; }

/*
a.mp3:link,
a.mp3:hover,
a.mp3:visited { margin-left: 3px; }
*/

.br { margin-left: 5px; }

.record { -webkit-animation: record 2.5s linear infinite; -moz-animation: record 2.5s linear infinite; animation: record 2.5s linear infinite; }
@-webkit-keyframes record { 0% { -webkit-transform: rotate(0deg); }  100% { -webkit-transform: rotate(360deg);  } }
@-moz-keyframes record { 0% { -moz-transform: rotate(0deg); }  100% { -moz-transform: rotate(360deg); } }


.recordvk { -webkit-animation: recordvk 1.5s 1; -moz-animation: recordvk 1.5s 1; animation: recordvk 1.5s 1;  }
@-webkit-keyframes recordvk { 0% { -webkit-transform: rotate(0deg); }  100% { -webkit-transform: rotate(360deg);  } }
@-moz-keyframes recordvk { 0% { -moz-transform: rotate(0deg); }  100% { -moz-transform: rotate(360deg); } }


#loginsubm, #loginrestoresubm { border-radius: 3px; }

#loginsubm,
#loginsubm:active,
#loginrestoresubm,
#loginrestoresubm:active { margin: 1px 0 0 0; width: 60px; text-align: center; height: 20px; padding: 4px 0 0 0;
 /*font: bold 11px tahoma;*/  text-shadow: -1px -1px 0px rgba(0, 0, 0, .4); }

#loginsubm:active,
#loginrestoresubm:active { line-height: 15px; }

#loginsubm { margin-right: 10px; }
#loginrestoresubm, #loginrestoresubm:active { width: 104px; margin-right: 10px; }
#loginsubm:active { margin-right: 10px; }

.submhidden { visibility: hidden; width: 0; height: 0; padding: 0; margin: 0; }

#autoscroll.scroll-off { background-position: -151px 2px; /*background-color: #454545;*/  }
#autoscroll.scroll-off span { text-decoration: line-through; }
#autoscroll.scroll-off:focus { background-position: -151px 2px; }
#smiles.scroll-off { background-position: -175px 2px; background-color: #454545; }
#smiles.scroll-off:focus { background-position: -175px 2px; }
/*
#option.scroll-off { background-position: -200px 3px; background-color: #454545; }
#option.scroll-off:focus { background-position: -200px 3px; }
*/
#audio-capture.scroll-off { background-position: -227px 3px; background-color: #454545; }
#audio-capture.scroll-off:focus { background-position: -227px 3px; }


.table_opt { width: 99.99%; table-layout: fixed; }
.table_opt .td { padding: 0 0 10px 5px; height: 25px; /*position: relative;*/ /*border: 1px solid red; */ }
.table_opt .td.left { width: 50%; position: relative;}
.table_opt .td.center { text-align: center; }

#dreamBook select { border: 1px solid #777; }

.table_opt select,
input[type="file"] { width: 160px; padding: 2px; border-radius: 3px; border: 1px solid #777; }

input[type="file"] { width: 158px; padding: 0; margin: 0; }

#id_option > div > div > div:nth-child(29) > div { position: relative; }

.relative { position: relative; }

#td-container-ym { padding: 0 0 3px 5px; height: 35px; }

.button-down { box-shadow: 0px -1px 0px rgba(255, 255, 255, .2) inset, 0px 1px 0px rgba(0, 0, 0, 0.5) inset, 1px 0px 0px rgba(0, 0, 0, 0.5) inset, -1px 0px 0px rgba(0, 0, 0, 0.5) inset; width: 24px; margin: 1px 1px 0 -1px; }

/*#id_audio, #id_smiles, #id_option, #id_info { display: none; } */

.none { display: none; }
#nashdom.none { display: none !important; }
.novis { display: none; }


#id_ascii,
#id_ym,
#id_sponsor,
#id_dialog_delete,
#id_smiles,
#id_smiles_new,
#id_option,
.id_allinfo,
.id_info { z-index: 1; color: #bbb; position: absolute; padding: 5px; opacity: 1; width: 370px; font-size: 12px; /*height: 340px;*/ background-color: #303030;

 box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 31px 13px; /*0.12 */

 /*padding: 10px;*/  /*box-shadow: 1px 0px 0px rgba(0, 0, 0, .1), 0px 1px 0px rgba(0, 0, 0, .1), -1px 0px 0px rgba(0, 0, 0, .1), 0px -1px 0px rgba(0, 0, 0, .1) */}


#id_ascii { width: auto; }
#id_ascii textarea { height: 250px; max-width: 772px; min-width: 310px; resize: both; }

#id_ym .wrapper_overflow,
#id_sponsor .wrapper_overflow { margin: 4px 4px 0 4px; height: auto; max-height: 400px; }
#id_sponsor .table_opt > div > div > a { padding: 0 0 0 18px; }
#id_sponsor .table_opt .td { padding: 2px 0 5px 0; height: auto; border-bottom: 1px solid #555;  }
#id_sponsor .table_opt .td:first-child { white-space: nowrap; }
#id_sponsor .table_opt .td:last-child { text-align: center; padding: 3px 0 4px 0; }
#id_sponsor .table_opt .td:nth-child(2) { padding: 3px 0 4px 0; }
#id_sponsor .table_opt .td:nth-child(2) .gold { margin: 0 3px 0 55px; }
#id_sponsor .table_opt .tr:last-child .td { border-bottom: none; }
#id_sponsor .table_opt .tr:last-child .td { padding: 6px 0 2px 0; }
#id_sponsor .table_opt .tr:last-child .td:first-child { padding-left: 18px; color: #bbb; }
.divider { margin: 0 6px 0 6px; font-size: 9px; color: #eee; }
#sponsor { margin: 0 0 0 0px; }


.id_info { width: 417px; font: normal 12px Microsoft Sans Serif, Arial, Helvetica, sans-serif; }

#id_dialog_delete:before,
#id_dialog_delete:after,
#id_sponsor:before,
#id_sponsor:after,
#id_ym:before,
#id_ym:after,
.id_info:before,
.id_info:after { border: 0; }

.id_info .opt_image { cursor: pointer; /* transition-property: height, margin-top;  transition-duration: .5s;*/ }
.id_info h2 { height: 64px; /*width: 202px;*/ overflow: hidden; color: orange; margin: 0 0 0px 5px; font: bold 1.6em 'PT Sans Narrow'; }
.id_info h3 { font: normal 1.4em 'PT Sans Narrow'; color: #CEF2F5; text-align: center; }

h2 .melody,
#opt-info.melody { background: url(../pic/melody.png) right 30px no-repeat; cursor: pointer; }
h2 { position: relative; }
h2 .melody { position: absolute; top: 33px; left: 0; width: 208px; height: 24px; background-position: right 0; }

.id_info .iwrapper { margin: 0; }
.id_info .table_opt div { margin: 0; padding: 0 4px 0 0; }
.id_info .td.left { width: 41%; }
.id_info .table_opt .td.left { padding: 0 0 0 1px; }

.id_info .narrow .td,
.id_info .narrow .td.left { color: #fafafa; border-bottom: 1px solid #555; height: auto; padding: 5px 0 7px 5px; white-space: nowrap; }

.id_info .narrow .td { overflow-x: hidden; }
.id_info .narrow .td.left { width: 51.5%; color: #bbb; overflow-x: auto; }
.id_info .wrapper_overflow { margin: 4px 0 4px 4px; }


#id_info-fr { /*width: 603px;*/ width: 620px; }
#id_info-fr .td.leftf { /*width: 30.0%;*/ width: 31.5%; }
#allUserList { overflow-x: hidden; overflow-y: auto; height: 475px; }
#allUserList a { color: #bbb; font: normal 13px Arial, Helvetica, sans-serif; padding: 0 0 0 18px; }
#allUserList a.photo { color: #93B3F7; }
#allUserList a:hover { color: #B5CAF5; }
#allUserList a.active { color: #D5D6A5; }

#allUserList a.sex0 { background: url(../pic/sex0.gif) 0 2px; }
#allUserList a.sex1 { background: url(../pic/sex1.gif) 0 2px; }
#allUserList a.sex2 { background: url(../pic/sex2.gif) 1px 2px; }
#allUserList a.sex1-invis { background: url(../pic/sex1-invis.gif) 0 2px; }
#allUserList a.sex2-invis { background: url(../pic/sex2-invis.gif) 1px 2px; }

#allUserList a.sex0,
#allUserList a.sex1,
#allUserList a.sex2,
#allUserList a.sex1-invis,
#allUserList a.sex2-invis { background-repeat: no-repeat; }

/*#id_allinfo .td.middle { width: 37.5%; } */
/*#id_allinfo .table_opt .td.leftf { padding: 0 0 0 0px; } */
#id_info-fr .table_opt .td.middle { padding: 0 5px 0 8px;  }
/*#id_info-fr .table_opt .td.right { padding: 0 0 0 0px;  }*/

#id_info .table_opt .td:last-child a,
#id_info-fr .table_opt .td.right a { color: #D5D6A5; }


#id_option select,
#id_option label,
#id_admin label,
#id_option input,
#id_info input,
#appearance-avatar input,
#id_admin input,
#id_dreambook input,
#id_avt_options select,
#id_info-fr input { font-size: 12px; }

#id_option input[type="checkbox"] { margin-top: 2px; }

#id_option select,
#id_option input[type="file"],
#id_option input[type="text"] { margin-top: -4px; }

#id_option select:hover,
#id_info select:hover { border: 1px solid #7face4; }

#id_admin input { margin: 3px 0 0 0; }
#id_admin h4 { background-color: #B13E3E; }

#id_smiles { background-color: rgba(48, 48, 48, 0.8); height: auto; /*height: 343px;*/ }

#opt-info.melody { background-position: 68px 124px; }

#id_sponsor:after,
#id_ascii:after,
#id_ym:after,
#id_option:after,
#id_smiles_new:after,
#id_smiles:after { border-top-color: #303030; } 

#id_sponsor:before,
#id_ascii:before,
#id_ym:before,
#id_option:before,
#id_smiles_new:before,
#id_smiles:before { border-top-color: #555; }

#id_smiles p,
#id_smiles_new p { background-repeat: no-repeat; background-position: 50% 50%; cursor: pointer; position: relative; width: 42px; height: 20px; padding: 0; margin: 3px 2px 5px 2px; float: left; text-align: center; /*border: 1px solid red;*/ }

#id_smiles,
#id_smiles_new { padding-bottom: 6px; }

h4, h5 { margin: 0 0 5px 0; padding: 1px 3px 3px 6px; border-radius: 2px; background-color: #5272af; color: #fff; font: normal 14px 'PT Sans Narrow'; }
h4 span { float: right; cursor: pointer; font: normal 15px/14px Arial, Helvetica, sans-serif; text-shadow: -1px -1px 0px rgba(0, 0, 0, .3); }
h5 { border-radius: 2px; text-align: center; background-color: #636363; padding: 1px 3px 3px 6px;  }

.cbutt,
#save,
#save-proxy,
#save-tor,
#save-ym,
#escape-ym,
#avt-create-prof,
#avt-delete-prof,
#avt-rename-prof,
#asave,
#asave-fr,
#adel,
#adel-fr,
#psend,
#psend-fr,
#appearance-avatar-butt,
#change-passw { width: 100px; height: 30px; /*font: bold 11px/30px tahoma;*/ text-align: center; text-shadow: -1px -1px 0px rgba(0, 0, 0, .4); border-radius: 3px; }

.cbutt span,
#save span,
#save-ym span,
#escape-ym span,
#asave span,
#asave-fr span,
#avt-create-prof span,
#adel span,
#adel-fr span,
#psend span,
#psend-fr span,
#appearance-avatar-butt span,
#change-passw span { display: inline-block; color: #fff; white-space: nowrap; }

#avt-create-prof,
#avt-rename-prof,
#avt-create-prof:active,
#avt-rename-prof:active { width: 76px; margin-right: 7px; float: left; }

#id_ym .cbutton { width: 98px; vertical-align: bottom; }

/*#amount { background: #444 url(../pic/ym.png) no-repeat 94% 4px; } */
#amount + div { width: 21px; height: 13px; position: absolute; right: 67px; top: 36px; cursor: pointer; }
#amount + div.wallet { background: #444 url(../pic/ym-wallet.png) right 0 no-repeat; }
#amount + div.card { background: #444 url(../pic/ym-card.png) right 0 no-repeat; }


#balance,
#balance + span { display: inline-block;}

#balance + span { color: #ffd600; }
#balance { margin: 0 2px 0 0; min-width: 26px; }
#balance-refresh { margin: 0 0 0 10px; }
.gold { color: #ffd600; }

#id_dialog_delete,
#id_dialog_delete:active,
#escape-ym,
#escape-ym:active,
#save-ym,
#save-ym:active,
#save,
#save:active { margin: 4px 4px 0 0; }


#save-ym:active,
#escape-ym:active { /*margin: 4px 4px 0 0;*/ /*line-height: 29px !important;*/ }

#escape-ym,
#escape-ym:active { margin-right: 0px; }

#id_dialog_delete  .table_opt .td.left,
#id_ym .table_opt .td.left { width: 43%; }

#color_nick,
#color_mess,
#color_bg,
#translit_encode,
#aiengine,
#invisible,
#mess_sound,
#voice_quality,
#album_delete,
#album_delete-fr,
#album_id,
#album_id-fr,
#color_nick option,
#color_mess option,
#color_bg option,
#aiengine option,
#translit_encode option,
#invisible option,
#mess_sound option,
#voice_quality option,
#album_delete option,
#album_delete-fr option,
#album_id option,
#album_id-fr option,
input[type="file"] { background-color: #303030; color: #c0c0c0; }


.wrapper_overflow { height: 486px; /* 475px; */ /*overflow-y: auto;*/ overflow-x: hidden;  /*border: 1px solid red;*/ }
.opt_image, .aphotos a { margin: 1px 0 0 0; border: 1px solid transparent; box-shadow: 1px 0px 0px 0px rgba(255, 255, 255, .3), 0px 1px 0px 0px rgba(255, 255, 255, .3), -1px 0px 0px 0px rgba(255, 255, 255, .3), 0px -1px 0px 0px rgba(255, 255, 255, .3), 0 1px 3px rgba(0, 0, 0, 0.5); width: 150px; height: 200px; }
.aphotos a:hover { box-shadow: 1px 0px 0px 0px rgba(255, 255, 255, .45), 0px 1px 0px 0px rgba(255, 255, 255, .45), -1px 0px 0px 0px rgba(255, 255, 255, .45), 0px -1px 0px 0px rgba(255, 255, 255, .45);  }

#id_info .wrapper_overflow { overflow-y: scroll; }
.wrapper_overflow_ipad { height: 300px; }
#id_info .wrapper_overflow.height-auto { height: auto; overflow-y: hidden; }

.iwrapper { position: relative; width: 150px; height: 200px; margin: 0 0 10px 0;}
.iwrapper ul li { float: left; position: absolute; }
.iwrapper ul li.show { z-index: 500; }


#history  div { line-height: 8px; cursor: pointer; color: #ffcc00; }
#history  a { display: block; width: 0; height: 0; border-left: 4px solid transparent; border-right: 4px solid transparent; }
#history  a#up { margin: 1px 0 0 0; border-bottom: 8px solid #ffcc00; }
#history  a#dn { margin: 3px 0 0 0; border-top: 8px solid #ffcc00; }

#history  a#up:active { margin-top: 2px; border-bottom: 7px solid #ff9900; }
#history  a#dn:active { border-top: 6px solid #ff9900; }

#history { padding: 2px 0 0 2px; }
#uname { padding: 4px 3px 0 6px; }

#send { /*border: 1px solid red;*/ height: 41px; margin: 19px 0 0 0; }
#send ul { /*height: 24px;/* min-width: 960px; margin: 19px 0 0 0; /*border: 1px solid red; */}
#send ul li { float: left; /*border: 1px solid green;*/ /*margin: 5px 0 0 0;*/ }

.ui-effects-transfer { border: 1px solid #fff; border-radius: 20px; opacity: .15; }
.ui-effects-wrapper { display: inline-block; }


#canvas-bg { position: fixed; z-index: -1; }

#canvasloader-container-main.history { left: 40%; }

#canvasloader-container-options,
#canvasloader-container-changepassw { margin: 1px 0px 0 0; }

#canvasloader-container-options { right: 72px; position: absolute; }

#canvasloader-container-options #canvasLoader { margin-top: 16px; }

#canvasloader-container-thumb { position: absolute; top: 80px; left: 60px; /*height: 200px; line-height: 215px;*/ text-align: center; }
#canvasloader-container-avatar { position: absolute; top: -4px; left: 3px; text-align: center; }
#canvasloader-container-capvoice { position: absolute; top: 2px; right: 12px; }
#canvasloader-container-fastupload { position: absolute; top: 2px; right: 29px; }
#canvasloader-container-vkcover { position: absolute; top: 38.5%; left: 42.5%; }
#canvasloader-container-vkasearch { position: sticky; top: 49%; margin: 40px 0 0 128px;  z-index: 1000; }
#canvasloader-container-vkadownload { position: absolute; top: 1px; left: 4px; }
#canvasloader-container-avtoptions { position: absolute; right: 60px; top: 1px; }
#canvasloader-container-dream { position: absolute; left: 5px; top: 1px; z-index: 1; }

#canvasloader-container-info-fr,
#canvasloader-container-info,
#canvasloader-container-notes,
#canvasloader-container-horos,
#canvasloader-container-admin,
#canvasloader-container-youtube { position: absolute; top: 48%; left: 48%; text-align: center; z-index: 1; }

#canvasloader-container-info-fr { left: 63%; }

input[type="radio"] { margin: 0 21px 0 6px; vertical-align: middle; }

a.outlaw0 { background: url(../pic/kick0.png); }
a.outlaw1 { background: url(../pic/kick1.png); }

#online a.outlaw0,
#online a.outlaw1 { margin: 0px 6px -2px -2px; padding: 0; width: 12px; height: 12px; background-position: 0 0;
    background-repeat: no-repeat; display: inline-block; }

.outlaw0:hover,
.outlaw1:hover { animation: recordvk 1.5s 1; }

a.outlaw0 { cursor: default; }

a.sex0 { background: url(../pic/sex0.gif); }
a.sex1 { background: url(../pic/sex1.gif); padding: 0 21px 0 0 }
a.sex2 { background: url(../pic/sex2.gif); }
a.sex1-invis { background: url(../pic/sex1-invis.gif); padding: 0 21px 0 0 }
a.sex2-invis { background: url(../pic/sex2-invis.gif); }

a.sex0, a.sex1, a.sex2, a.sex1-invis, a.sex2-invis { padding: 0 20px 0 0; width: 12px; background-position: 0 3px; background-repeat: no-repeat; }

a.streamer:after { content: ''; position: absolute; margin: 1px 0px 0 -1px; border-radius: 50%; width: 15px; height: 15px; box-shadow: 0 0 0 2px rgb(69, 202, 140); }

a.sex2, a.sex1-invis, a.sex2-invis { background-position: 1px 3px; }

#thumb { border-color: rgba(255, 255, 255, 0.85); display: none; padding: 0; position: absolute; width: 150px; height: 200px; border-radius: 2px; opacity: 1; background-color: #333; }
#thumb:before, #thumb:after { border-width: 0; }
#thumb img { max-width: 150px; max-height: 200px; }


.models { z-index: 100; position: absolute; display: block; }
.models h4 { margin: 0; border-radius: 20px; background-color: #2a2a2a; border: 1px solid rgba(255, 255, 255, .2); padding: 3px 8px; color: #fff; position: absolute; bottom: -27px; text-align: center; /*width: 98px;*/ /*min-width: 55px;*/ overflow-x: hidden; font-weight: normal; white-space: nowrap; font: normal 12px Arial, Helvetica, sans-serif; }

.models:hover:after {  position: relative; margin: -5px 0 0 0; display: block; content: attr(title); border-radius: 20px; background-color: rgba(0, 0, 0, .3); border: 1px solid rgba(255, 255, 255, .2); padding: 3px 8px; color: #fff; overflow-x: hidden; white-space: nowrap; font: normal 12px Arial, Helvetica, sans-serif; min-width: 30px; }

.grayscale { filter: grayscale(100%); filter: gray; -webkit-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); }


.model-size { width: 75px; height: 200px; }

.cloud,
.cloudpvt { background: url(../pic/cloud.png) no-repeat; background-size: 100%;  position: absolute; width: 0px; height: 0px; }
.cloudpvt { background: url(../pic/cloudpvt.png) no-repeat; background-size: 100%; }

.cloud div,
.cloudpvt div { display: none; margin: 25px 0px 10px 20px; font: normal 11px/9px Arial, Helvetica, sans-serif; overflow: hidden; width: 125px; height: 35px; word-wrap: break-word; color: #000; }
.cloud a { color: navy; }

#model-container { float: left; width: 327px; height: 365px; border: 1px solid #555; border-radius: 3px; padding: 5px }
#model-container li { position: relative; margin: 5px 2px 20px 5px; float: left;  width: 25px; height: 66px; /*border: 1px solid yellow;*/ }
#model-container li input[type="radio"] { position: absolute; bottom: -17px; }
#model-container li label { display: block; width: 100%; height: 100%; }

.slider { width: 160px; }
.slider.ui-slider-horizontal,
.slider.ui-slider-vertical { height: 1px; border-radius: 3px; background-color: #303030; border: none; margin: 7px 0 0 0;  border-bottom: 1px solid rgba(255, 255, 255, .15); border-right: 1px solid rgba(255, 255, 255, .15); border-top: 1px solid rgba(0, 0, 0, 1); border-left: 1px solid rgba(0, 0, 0, 1); background-image: none; }

.slider.ui-slider-vertical { height: 20px; width: 10px; margin: 1px 0 0 4px; overflow: hidden; background: #90e62a url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAABVJREFUeNpi/P//PwODsbHxf4AAAwAaxgSXje/D+QAAAABJRU5ErkJggg==); border-radius: 2px; border: 0; cursor: pointer; box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.26), 1px 0px 0px 0px #333 inset, -1px 0px 0px 0px #333 inset, 0px -1px 0px 0px #333 inset, 0px 1px 0px 0px #333 inset; border: 1px solid #5a5a5a; }

#slider-scal.slider.ui-slider-vertical { background-color: #fd2e9a; margin-left: 5px; }

#slider-voice.slider.ui-slider-vertical { background-color: #00deff; margin-left: 5px; }
#slider-voice { margin: 6px auto 0 auto !important; border: 1px solid #555; height: 26px; width: 11px; background: linear-gradient(to top, #000, #000) no-repeat; opacity: 0.20; background-position:  50% 100%; border-radius: 1px; }

/*
#threshold-bg,
#threshold-label { height: 26px; width: 11px; position: absolute; left: 20px; top: 30px; border-radius: 1px;  }
#threshold-bg { background: rgb(255, 201, 0); }
*/

/*#threshold-label { background: linear-gradient(to top, rgba(59, 255, 23, .3), rgba(59, 255, 23, .3)) no-repeat; background-position:  50% top; } */

#threshold-label.bg-transparent { background-color: transparent; }

.header-voice { font: normal 12px 'PT Sans Narrow'; color: #71a3ff; }

#level-indicator {  position: absolute; top: 0; }

#threshold-bg,
#volume-meter,
#threshold-label {  position: absolute; top: 0px;   }

#threshold-bg { background: #FBB848; left: 0px; }

#volume-meter,
#threshold-bg,
#threshold-label,
#level-indicator { width: 160px; height: 15px;  border-radius: 1px; }

#volume-meter { background-color: #000; opacity: 0.35;  border-radius: 0px; width: 80px; max-width: 160px; }
#threshold-label { background-color: #14c7bf; opacity: 0.7; right: 0;  border-top-left-radius: 0; border-bottom-left-radius: 0; }

#level-indicator { box-shadow: 0px 0px 1px 2px rgba(0, 0, 0, 0.06); border-left: 1px solid #191919; border-top: 1px solid #191919;}

.slider.ui-slider-vertical:hover { border: 1px solid #777;  }

.slider .ui-slider-handle { background-color: #707070; top: -13px; border-radius: 1px; border: none; background-image: none; width: 10px; }
.slider .ui-slider-handle:hover { cursor: pointer; }
.slider .ui-slider-handle:active { border: none; }

.slider.ui-slider-vertical .ui-slider-handle { border: 0; background-image: none; background-color: #333;  height: 100%; margin: 0; top: auto; right: auto; left: auto; }

.slider.ui-slider-vertical .ui-slider-handle:hover,
.slider.ui-slider-vertical .ui-slider-handle:active { background-color: #303030;}

.slider .ui-slider-tip { background-color: #111; border: 1px solid #555; color: #71a3ff; border-radius: 4px; font-weight: normal; }
.slider .ui-slider-tip:after {  border-top-color: #000; } 
.slider .ui-slider-tip:before {  border-top-color: #555; }

.slider .ui-slider-handle:hover,
.slider .ui-slider-handle:active,
.slider .ui-state-focus { background-color: #888; }
.cbutton .ui-slider-tip { font: normal 11px/20px Arial, Helvetica, sans-serif; }

.flip,
.flip * { -webkit-transform: scaleX(-1); -moz-transform: scaleX(-1); -o-transform: scaleX(-1); }

.walk { -webkit-animation: walk .5s linear infinite; -moz-animation: walk .5s linear infinite; animation: walk .5s linear infinite; }

@-webkit-keyframes walk { 0% { -webkit-transform: rotate(0deg); }  50% { -webkit-transform: rotate(-5deg); }  100% { -webkit-transform: rotate(0deg); } }
@-moz-keyframes walk { 0% { -moz-transform: rotate(0deg); }  50% { -moz-transform: rotate(-5deg); }  100% { -moz-transform: rotate(0deg); } }
@keyframes walk { 0% { transform: rotate(0deg); }  50% { transform: rotate(-5deg); }  100% { transform: rotate(0deg); } }

.marquee1, .marquee2, .marquee3, .marquee4, .marquee5, .marquee6, .marquee7, .marquee8, .marquee9, .marquee10 { white-space: nowrap; display: block; }
.marquee1 { -webkit-animation: right2left .3s ease-in; -moz-animation: right2left .3s ease-in; animation: right2left .3s ease-in; }
.marquee2 { -webkit-animation: left2right .33s ease-in; -moz-animation: left2right .33s ease-in; animation: left2right .33s ease-in; }
.marquee3 { -webkit-animation: right2left .36s ease-in; -moz-animation: right2left .36s ease-in; animation: right2left .36s ease-in; }
.marquee4 { -webkit-animation: left2right .39s ease-in; -moz-animation: left2right .39s ease-in; animation: left2right .39s ease-in; }
.marquee5 { -webkit-animation: right2left .42s ease-in; -moz-animation: right2left .42s ease-in; animation: right2left .42s ease-in; }
.marquee6 { -webkit-animation: left2right .45s ease-in; -moz-animation: left2right .45s ease-in; animation: left2right .45s ease-in; }
.marquee7 { -webkit-animation: right2left .48s ease-in; -moz-animation: right2left .48s ease-in; animation: right2left .48s ease-in; }
.marquee8 { -webkit-animation: left2right .51s ease-in; -moz-animation: left2right .51s ease-in; animation: left2right .51s ease-in; }
.marquee9 { -webkit-animation: right2left .54s ease-in; -moz-animation: right2left .54s ease-in; animation: right2left .54s ease-in; }
.marquee10 { -webkit-animation: left2right .57s ease-in; -moz-animation: left2right .57s ease-in; animation: left2right .57s ease-in; }

@-webkit-keyframes left2right { 0% { margin-left: -100%; } 100% { margin-left: 0; } }
@-webkit-keyframes right2left { 0% { margin-left: 100%; } 100% { margin-left: 0; } }
@-moz-keyframes left2right { 0% { margin-left: -100%; } 100% { margin-left: 0; } }
@-moz-keyframes right2left { 0% { margin-left: 100%; } 100% { margin-left: 0; } }
@keyframes left2right { 0% { margin-left: -100%; } 100% { margin-left: 0; } }
@keyframes right2left { 0% { margin-left: 100%; } 100% { margin-left: 0; } }

span.trans { vertical-align: 1px; margin: -1px 4px 0px 0; padding: 2px 0.43em 0px 0.43em; display: inline-block; font: 0.55em Arial, Helvetica, sans-serif; border-radius: 35px; border: 1px solid rgba(255, 255, 255, 0.5); background-color: #603808; color: #eee; }

#photo-del, #melody-del {  vertical-align: middle;}
#photo-del { margin: 0 5px 0 0; }
#melody-del { margin: 0 5px 0 30px; }

.mobile { background: url(../pic/mobile.png) no-repeat; margin: 0 3px -1px 8px !important; display: inline-block; width: 7px; height: 12px; }

.forum { background: url(../pic/forum.png) no-repeat; margin: 0 3px -1px 8px !important; display: inline-block; width: 7px; height: 10px; }

.ignore-off { background: url(../pic/ignore-off.png); }
.ignore-on { background: url(../pic/ignore-on.png); }

.ignore-off,
.ignore-on,
.stream-private-on,
.stream-private-off { display: inline-block !important; background-position: 0 0; background-repeat: no-repeat !important;
    padding: 0; margin: 0px 3px -2px 0; cursor: pointer; width: 12px; height: 12px; }

.ignore-off:hover,
.ignore-on:hover,
.stream-private-on:hover,
.stream-private-off:hover { animation: recordvk 1.5s 1; }

.stream-private-on { background: url(../pic/sec-on.png) 3px 5px; }
.stream-private-off { background: url(../pic/sec-off.png) 3px 5px; }

a.atoggle { display: block; white-space: nowrap; }

#change-password,
.pers-data { display: none; margin: 7px 5px 0 0; width: 335px; padding: 9px 0 0 0; border-radius: 3px; border: 1px solid #777; }

#change-password .td,
.pers-data .td { text-align: left; padding: 0 0 8px 0px;  }

#change-password .td.left,
.pers-data .td.left { width: 54.1%; padding: 0 0 0 8px; }

#change-password .td.center,
.pers-data .td.center { text-align: center; }


#topblock input,
#change-password input,
.pers-data input,
.pers-data textarea,
#playlist-importTarea,
#email,
#id_admin input[type="text"],
#amount,
#id_info input[type="text"],
#id_info-fr input[type="text"],
.comments textarea,
#appearance-avatar input[type="text"],
.note_wrap_send textarea { width: 139px; padding: 4px 0 2px 8px;  border: none; box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.45), -1px -1px 0px 0px rgba(0, 0, 0, 0.2); /*border-top: 1px solid #222; border-left: 1px solid #222;*/ }

#dreamBook select { border-radius: 3px; padding: 0; width: 175px; vertical-align: middle; }

#dreamBook select,
#dreamBook option { background-color: #303030; color: #c0c0c0; font: normal 14px 'PT Sans Narrow'; }

#dreamAuthor > div.sprite { position: relative; vertical-align: middle; display: inline-block; margin: 0 0px 0px 33px; border: 1px solid #333; box-shadow: 1px 0px 0px 0px rgba(255, 255, 255, .4), 0px 1px 0px 0px rgba(255, 255, 255, .4), -1px 0px 0px 0px rgba(255, 255, 255, .4), 0px -1px 0px 0px rgba(255, 255, 255, .4), 0 1px 3px rgba(0, 0, 0, 0.5); height: 86px; width: 86px; }
#dreamAuthor > div.sprite:hover { box-shadow: 1px 0px 0px 0px rgb(127 172 228), 0px 1px 0px 0px rgb(127 172 228), -1px 0px 0px 0px rgb(127 172 228), 0px -1px 0px 0px rgb(127 172 228), 0 1px 3px rgba(0, 0, 0, 0.5); }
#dreamAuthor > div.sprite span { position: absolute; left: 0; top: 0; cursor: pointer; height: 86px; width: 86px; transition: opacity 1.0s; }
#dreamAuthor > div.sprite span:first-child { background: url(../pic/sprite-dreambook.jpg) 0 0 no-repeat; transition: background-position-x .3s, opacity 1.0s; }
#dreamAuthor > div.sprite span:last-child { background: url(../pic/sprite-dreambook-def.jpg) 0 0 no-repeat; opacity: 0; z-index: -1; }
#dreamAuthor > div.sprite.default span:last-child { opacity: 1; }
#dreamAuthor > div.sprite.default span:first-child { opacity: 0; }


#alphabet.anav a { margin: 2px 1px 2px 0px !important; }


#dreamBook select:hover { border: 1px solid #7face4; }

#dreamAuthor { text-align: center; margin: 11px 0 0 0; }
#dreamAuthor > span { font: normal 14px 'PT Sans Narrow'; display: inline-block; margin: 0 5px 0 0; color: #CEF2F5; vertical-align: middle; }

#dreamBook input,
#topblock input { font: normal 10px Tahoma, Helvetica, sans-serif; padding: 4px 0px 3px 10px; width: 137px; margin: 0 7px 0 0; }

#dreamBook .anav { background-color: inherit; text-align: center; height: auto; position: relative; }
#dreamBook input { border: none; box-shadow: 1px 1px 0px 0px rgba(143, 143, 143, 1), -1px -1px 0px 0px rgba(41, 41, 41, 1);  width: 270px; }

input#vkAudioSearch { width: 218px; padding-right: 76px; padding-left: 8px; }
input#vkAudioSearch::-webkit-input-placeholder { padding: 0 0 0 15px; background: url(../pic/search.png) 0 -1px no-repeat; }
input#vkAudioSearch { box-shadow: 1px 1px 0px 0px rgba(143, 143, 143, 1), -1px -1px 0px 0px rgba(41, 41, 41, 1); }


input#dreambookSearch { width: 377px; padding-right: 8px; padding-left: 8px; margin: 0; }
input#dreambookSearch::-webkit-input-placeholder { padding: 0 0 0 15px; background: url(../pic/search.png) 0 -1px no-repeat; }
input#dreambookSearch { box-shadow: 1px 1px 0px 0px rgba(143, 143, 143, 1), -1px -1px 0px 0px rgba(41, 41, 41, 1); }


.pers-data textarea { min-height: 54px; max-height: 160px; font-size: 12px; padding: 4px; }

#playlist-importTarea,
#playlist-importTarea-fr { width: 97.4%; min-height: 162px; font: normal 12px Courier new; white-space: nowrap; }

.left { text-align: left !important;}

#playlist-import-wrapper,
#playlist-import-wrapper-fr { display: none;}

#email { width: 149px; }

#formlogin .amess,
#formpasswrestore .amess { display: inline-block; margin: 3px 0 0 0; }

#speech-recorder,
#webkit-speech,
#fast-upload { position: absolute; width: 11px; height: 15px; top: 4px; cursor: pointer; }

#speech-recorder { right: 50px; background: url(../pic/webkit-speech.png) no-repeat; z-index: 1000; }
#webkit-speech { right: 16px; background: url(../pic/webkit-speech.png) no-repeat; z-index: 1000; }
#fast-upload { right: 33px; top: 5px; background: url(../pic/fast-upload.png) no-repeat; }
#fast-upload:hover { background: url(../pic/fast-upload-hover.png) no-repeat; }
#webkit-speech:hover { background: url(../pic/webkit-speech-hover.png) no-repeat; }


#id_album_edit,
#id_album_edit-fr,
.comments { margin: 10px 10px 0 0; clear: both; }

#id_album_edit-fr { margin-right: 5px; }

/*#id_album_edit .table { margin-bottom: 30px;  } */

#id_album_edit .td, #id_album_edit-fr .td,
.comments .narrow .td.left,
.comments .narrow .td,
.note_wrap_send .narrow .td,
.import_wrap_send  .narrow .td { border-bottom: none; }

#id_album_edit input[type="text"],
#id_album_edit-fr input[type="text"] { width: 240px; }

#appearance-avatar input[type="text"] { width: 156px; }


#id_album_edit input[type="file"],
#id_album_edit-fr input[type="file"] { width: 247px; }

#id_album_edit select,
#id_album_edit-fr select { width: 250px; font-size: 12px; }

#id_album_edit .narrow .td.left,
#id_album_edit-fr .narrow .td.left,
.comments .narrow .td.left { width: 30%; vertical-align: middle; color: #DFC7AD; font: normal 12px Arial, Helvetica, sans-serif; }

#appearance-avatar .info_wrap .td.left { width: 50%; vertical-align: middle; color: #DFC7AD; font: normal 12px Arial, Helvetica, sans-serif; }

#id_album_edit .cbutton,
#id_album_edit-fr .cbutton { border-radius: 30px; }

#id_info .amess,
#id_info-fr .amess { text-align: right; display: inline-block; margin: 0; font: normal 14px Arial, Helvetica, sans-serif; }

#id_info a.none,
#id_info #editPG a.none,
#id_info-fr a.none,
#id_info-fr #editPG a.none { display: none; }


#id_dialog_delete .cbutton,
#id_ym .cbutton,
#formlogin .cbutton,
#formpasswrestore .cbutton,
#id_info .cbutton,
#id_admin .cbutton,
#id_info-fr .cbutton,
#id_option .cbutton,
#id_avt_options .cbutton,
.comments .cbutt { height: 25px; font: normal 12px/25px 'PT Sans Narrow'; }


#formlogin .cbutton,
#formpasswrestore .cbutton { font: normal 12px/18px 'PT Sans Narrow'; }

#formlogin .cbutton,
#formpasswrestore .cbutton {  height: 21px; }

#formlogin .cbutton:active,
#formpasswrestore .cbutton:active { line-height: 20px; }

#formlogin ul li.adv img { /*height: 26px;*/ margin: 5px 0 0 10px; border-radius: 1px; }
#formlogin ul li:nth-child(2) { position: relative; }
.fa-eye { position: absolute; top: 4px; right: 9px; cursor: pointer; color: #c3c3c3; font-weight: inherit !important; }
.fa-eye-slash { right: 8px; }
.fa-eye-slash:before { content: '\f070' !important; }

#formsend .button-block .cbutton { height: 23px; width: 42px; margin: 0; padding: 0; display: inline-block; position: relative; }
#formsend .button-block .cbutton span { display: inline-block; font: normal 12px/16px 'PT Sans Narrow'; position: absolute; height: 15px; text-align: center; margin: 4px 0; top: 0; left: 0; bottom: 0; right: 0; text-shadow: -1px -1px 0px rgba(0, 0, 0, .4); /*text-rendering: optimizeLegibility;*/ }

#formsend .button-block .cbutton:focus span,
#formsend .button-block .cbutton:active span,
#formsend .button-block .button-down span {  margin: 5px 0 0 0px; } 

#formsend .button-block .button-down { margin: 0; }

#go,
#go:focus { background-color: #1A64B4; }


#pvt,
#pvt:focus { background-color: #2C8046; }


#audio-capture,
#audio-capture:active,
#audio-capture:focus,
#audio-capture.button-down { background-color: #985589; }

/*#audio-capture:active { background-color: #b14b68; } */


#smiles,
#smiles:focus,
#smiles.button-down { background-color: #0A778B; }

#id_dialog_delete .cbutton:active,
#id_ym .cbutton:active,
#id_option .cbutton:active,
#id_info .cbutton:active,
#id_admin .cbutton:active,
#id_info-fr .cbutton:active,
#id_avt_options .cbutton:active,
.comments .cbutt:active { line-height: 27px; }


#id_info .info_wrap,
#id_info-fr .info_wrap,
#id_notes .info_wrap,
#id_admin .info_wrap,
#id_reactions .info_wrap,
#id_dreambook .info_wrap,
#id_horoscope .info_wrap { border: 1px solid #777; border-radius: 4px; padding: 5px; margin: 0 0 20px 0;  box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, .3), inset -1px -1px 0px 0px rgba(0, 0, 0, .3); }

/*  box-shadow: -1px -1px 0px 0px rgba(0, 0, 0, .5), inset -1px -1px 0px 0px rgba(0, 0, 0, .5), 1px 1px 0px 0px rgba(255, 255, 255, .3), inset 1px 1px 0px 0px rgba(255, 255, 255, .3)  */ 

/* 393 */
#uinfo,
#uinfo-fr { width: 99%; }

.gray { color: #bbb; }
.red { color: #e60000; }
.white { color: #fff; }

span.gray.search {  cursor: pointer; text-decoration: underline; }
/*a.gray:hover { text-decoration: none !important; } */

i.gray { font-style: normal; color: #FFCC00; }
.pink { color: #FFB5F3; display: inline-block; width: 105px; vertical-align: top; }
.barcode-img { border-radius: 2px; border: 1px solid #818181; padding: 1px; margin: 0 3px 0 0;  height: 90px; max-width: 130px; /*height: 60px; max-width: 80px;*/ }
.over:hover { border: 1px solid #bbb; }

#album-count,
#album-count-fr,
#comment-count-gb,
#comment-count-gb-fr,
#notes-count { color: orange; }

/*.aphotos img { width: 120px; height: 100px; margin: 4px 9px 4px 1px; }*/
/*.aphotos  a:nth-child(3n) { margin-right: 0; } */
/*
.aphotos p { position: relative; background-color: #686868; border-radius: 2px; width: 110px; overflow-x: hidden; color: #fff; text-align: center; white-space: nowrap; font-size: 10px; margin: 0 0 0 0px; padding: 3px 7px; text-shadow: 1px 1px 0px rgba(0, 0, 0, .1); }
.aphotos li { float: left; margin: 0 0 5px 0; }
*/

.aphotos { margin: 10px 0 0 1px !important; padding: 0 !important; text-align: center; }
#id_album_photo-fr { margin: 10px 0 0 -9px !important; }

.aphotos a:after { background-color: #686868; border-radius: 10px; bottom: -110px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); color: #fff;
content: attr(title); display: inline-block; font-size: 10px; max-width: 100px; overflow: hidden; padding: 2px 7px; position: relative; text-align: center; white-space: nowrap; }
.aphotos a { width: 120px; height: 100px; display: inline-block; margin: 0 10px 42px 0; position: relative; text-decoration: none; background-position: center center; background-repeat: no-repeat; background-size: cover; -moz-background-size: cover; -webkit-background-size: cover;  }

#id_photos.aphotos a:after,
#id_photos-fr.aphotos a:after { max-width: 80px; bottom: -7px; } 

/*#id_album_photo-fr.aphotos a { margin: 0 9px 42px 0; } */
/*
.aphotos a:nth-child(6n),
.aphotos a:last-child { margin-right: 0 }
*/

#id_album_photo-fr a:nth-child(3n),
#id_album_photo-fr a:last-child { margin-right: 0; }

/*
#id_photos img,
#id_photos-fr img { display: none; }
*/

.breadc,  
#id_info breadc.amess,
#id_info-fr breadc.amess { font: normal 14px 'PT Sans Narrow' !important; }

.aphotos span.pdel { background: url(../pic/del.png) no-repeat; padding: 12px 12px 0 0;  z-index: 100; margin: 0 7px -4px -19px !important; cursor: pointer; display: inline-block;}

/*.aphotos a img { margin: 0; border: 0; } */

#right-over,
#persGallery-fr { padding-right: 0; }

#albumName,
#albumName-fr { color: #ffa8cb; }

#editPG.amess,
#editPG-fr.amess { float: right; margin: 0 12px 10px 0; }

#editPG,
#editPG-fr { font: normal 11px Arial, Helvetica, sans-serif !important; }

.clear { clear: both; display: block; }

#uinfofr #right-over { height: 475px; overflow-y: scroll; margin: 0 0 0 5px; }
/*#uinfofr #right-over > .table { width: 394px; } */

.comments textarea, .note_wrap_send textarea { width: 97.4%; height: 80px; max-height: 200px; }
.comments .narrow .td, .note_wrap_send .narrow .td { padding-left: 0; padding-right: 0; }

.comments .cbutt,
.note_wrap_send .cbutt,
.import_wrap_send .cbutt { margin: 0 1px 0 0; float: right; }

.comments-out p.pnick { margin: 0 5px 5px 5px; }
.comments-out p.pmess { margin: 0 5px 15px 5px; border-bottom: 1px solid #555; padding: 5px 0 10px 0; box-shadow: inset 0px -1px 0px 0px rgba(0, 0, 0, 0.8); white-space: normal; word-wrap: break-word; font: normal 13px Arial, Helvetica, sans-serif; }
.comments-out p.pnick a { margin: 0 10px 0 0; }
.comments-out p.pmess:last-child { border-bottom: none; box-shadow: none; margin-bottom: 0; }

.comments-out a.del,
.comments-out a.del:link,
.comments-out a.del:visited { text-decoration: none; color: #C21700 !important; float: right; font-size: 11px; margin: 0; }

.comments-out a.del:hover {  color: #F53E25 !important; }

#commentSend,
#commentSend-fr,
.importButton,
#importSend-fr,
#ISPSend,
#IPSend,
#CFPSend,
#noteSend,
#noteSend-fr { margin-left: 7px !important; }

.pages { margin: 0px auto 15px auto; text-align: center; height: 16px; font: 11px Tahoma, Helvetica, sans-serif; }
.pages a { text-decoration: none; display: inline-block; padding: 2px 6px 2px 6px; margin: 0 2px 0 2px; color: #fff; border-radius: 10px; background-color: #646464; }
.pages a:hover { background-color: #ccc; color: #000 !important; }
.pages span { display: inline-block; margin: 0 1px 0 1px; padding: 2px 1px 2px 1px; }
.pages span.or { border-radius: 10px; color: #69dbeb; padding: 2px 6px 2px 6px; }

#id_info .note_wrap_send,
#id_info .import_wrap_send { margin: 20px 10px 0 0; }

#id_info-fr .note_wrap_send,
#id_info-fr .import_wrap_send { margin: 20px 4px 0 0;}

.padding0 { padding: 0 !important; }

.anav { background-color: #3f3f3f; margin: 13px 10px 0 0 !important;  border-radius: 2px; text-align: center; }
.anav a { font-family: Arial, Helvetica, sans-serif; margin-top: 8px !important; }
.anav a:first-child { margin-left: 8px !important; }

.anav a.nodec:visited,
.anav a.nodec:link { text-decoration: none !important; color: #bbb; }

.anav a.dec:visited,
.anav a.dec:link { text-decoration: underline; }
.anav a.dec:hover { text-decoration: none; }

#horoscope .anav { margin: 13px 0 0 0 !important; }

.onav { display: none; }

#aboutMe,
#horoscope,
#aboutMe-fr,
#horoscope-fr { margin: 0 10px 0 0; }

#horoscope,
#horoscope-fr { }

#dreambookText span.dreamName,
#horoscope p,
#horoscope-fr p { font: normal 1.25em 'PT Sans Narrow'; color: #ECC274; display: block; }

#dreambookText span.dreamName { margin: 0 0 7px 0; }
#dreambookText ul { column-count: 2; margin: -4px -6px; }

#dreambookText ul li { border-radius: 2px; font: normal 12px 'Microsoft Sans Serif'; color: #dacaa1; padding: 0 0 0 7px; cursor: pointer; text-decoration: underline; white-space: nowrap; margin: 0; overflow: hidden; position: relative; line-height: 18px; }

#dreambookText ul li:hover { color: #f0f0f0; background-color: #444; text-decoration: none; }

#dreamBook div.back { color: #d9a455; margin: 5px 0 0 4px; cursor: pointer; width: 57px; }
#dreamBook div.back:hover { color: #ffcd99; }
#dreamBook div.back i { font-style: normal; display: inline-block; margin: 0 3px 0 0; }

#dreambookText.info_wrap { margin: 14px 10px 0 0; padding: 10px 10px; }
#dreambookText > p { border-bottom: 1px solid #555; box-shadow: inset 0px -1px 0px 0px rgba(0, 0, 0, 0.8); margin: 0 0 12px 0; }
#dreambookText > p:last-child { border-bottom: none; box-shadow: none; margin: 0 0 3px 0; }

#horoscope span,
#horoscope-fr span { display: block; margin: 5px 0 18px 0; }

#horosDates,
#alphabet,
#horosSigns { text-align: center; }

#horosDates .amess,
#alphabet .amess,
#horosSigns .amess { font: normal 12px Arial, Helvetica, sans-serif; margin: 12px 7px 0 7px; }

#alphabet .amess,
#horosSigns .amess { color: #FFAEA6; font: normal 14px 'Symbola'; }

#horosSigns a.amess { text-decoration: none;  }
#horosSigns a.amess:link { border-bottom: 1px solid; padding-bottom: 1px; }
#horosSigns a.amess:hover { border-bottom: none; color: #bbb; }

#alphabet a.amess { text-decoration: none; text-transform: uppercase; font: normal 11px/11px 'PT Sans Narrow'; background-color: #525252; padding: 2px 4px 1px 3px; margin: 0 1px 0 0px; border-radius: 2px; }

#alphabet.anav a:first-child { margin-left: 0px !important; }
#alphabet.anav a:last-child { margin-right: 0px !important; }

#alphabet a.amess:link { border-bottom: 1px solid; padding-bottom: 1px; }

#alphabet a.amess.current-symb,
#alphabet a.amess:hover { border-bottom: none; color: #cdcdcd; background-color: #3e3e3e; }

#alphabet a.amess:active,
#alphabet a.amess.current-symb { color: #ececec; }

#horosDates span,
#alphabet span,
#horosSigns span { display: inline-block; color: #eee; font-size: 7px; }

#horosSigns a.nodec:link { border-bottom: none !important; }
#horosSigns a.nodec { text-decoration: none !important; color: #bbb; }
#horosSigns.anav { background-color: inherit; }

/*#alphabet.anav a:first-child { margin-left: 2px !important; } */

#alphabet a.nodec:link { border-bottom: none !important; }
#alphabet a.nodec { text-decoration: none !important; color: #bbb; }
#alphabet.anav { background-color: inherit; margin: 14px 14px 0 5px !important; }

.anav a.nodec { text-decoration: none !important; color: #bbb;  }

#dreambookText,
#horosText,
#horosText-fr p:first-child { margin-top: 18px; }

#dreambookText,
#horosText span,
#horosText-fr span { font-family: Arial, Helvetica, sans-serif; }

#aboutMe-fr { margin: 0 4px 0 0; }

#commentGB-fr { margin-right: 4px; }

#commentGB-fr .amess,
#commentGB .amess { font-size: 12px; }

#aboutMe-fr.onav,
#aboutMe.onav,
#banISP.onav { display: block; }

#aboutMe-fr .tr:last-child .td,
#aboutMe .tr:last-child .td { border-bottom: none; }

#aboutMe-fr .td.left,
#aboutMe .td.left { width: 40%; }

#info-aboutme,
#info-aboutme-fr { white-space: normal; word-wrap: break-word; }

#aboutMe .amess,
#aboutMe-fr .amess,
#info-aboutme .amess,
#info-aboutme-fr .amess { font-size: 12px; }

.zsign { color: #5FACFF; display: inline-block; margin: 0 4px 0 0; font-family: 'Symbola'; }

.rotate { -webkit-animation: rotate .4s linear 1; -moz-animation: rotate .4s linear 1; animation: rotate .4s linear 1; }

@-webkit-keyframes rotate { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(180deg); } }
@-moz-keyframes rotate { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(180deg); } }
@keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(180deg); } }

#iHistory:hover,
#vkAudioSearch:hover { color: #fff; }

#iHistory { box-shadow: 1px 1px 0px 0px rgba(143, 143, 143, 1), -1px -1px 0px 0px rgba(41, 41, 41, 1) !important; }


/* vkAudio */
#vkAudioSearchWrapper,
#iHistoryWrapper { display: inline-block; position: relative;
/*  top: -11px; */
/*  right: 75px; */
 }

.ndstyle #vkAudioSearchWrapper,
.ndstyle #iHistoryWrapper { top: -7px; }


#vkAudioSort,
#vkAudioLoop,
#youTube,
#vkAudioRandom,
#vkAudioShare,
#vkAudioMy { position: absolute; top: 3px; right: 13px; width: 11px; height: 15px; cursor: pointer; background: url(../pic/webkit-play.png) no-repeat; }

#vkAudioMy { right: 27px; background: url(../pic/webkit-chbox-off.png) no-repeat; }
#vkAudioRandom { right: 41px; background: url(../pic/webkit-random-off.png) no-repeat; }
#vkAudioLoop { right: 55px; background: url(../pic/webkit-loop-off.png) no-repeat; }
#vkAudioSort { right: 69px; background: url(../pic/webkit-sort-off.png) no-repeat; }

#youTube { right: 69px; background: url(../pic/webkit-vka.png) no-repeat; }
#youTube.yt { right: 69px; background: url(../pic/webkit-vkv.png) no-repeat;  }

#vkAudioMy.on { background: url(../pic/webkit-chbox-on.png) no-repeat; }
#vkAudioRandom.on { background: url(../pic/webkit-random-on.png) no-repeat; }
#vkAudioLoop.on { background: url(../pic/webkit-loop-on.png) no-repeat; }
#vkAudioSort.on { background: url(../pic/webkit-sort-on.png) no-repeat; }


#vkAudioSearchOut { padding: 0; outline: none; background-color: #303030; min-height: 43px; max-height: 460px; width: 300px; overflow-y: scroll; overflow-x: hidden; position: absolute; }
/*#vkAudioSearchOut ul { list-style-type: none; list-style-position: inside; margin: 40px 0 2px 0; } */
#vkAudioSearchOut ul { list-style-type: none; list-style-position: inside; margin: 0px 0 2px 0; background-color: #333; }
#vkAudioSearchOut ul:first-of-type { list-style-type: none; list-style-position: inside; margin: 40px 0 2px 0; }
#vkAudioSearchOut ul.hide > li { margin: 0 7px 0 7px; }
#vkAudioSearchOut ul.hide  { height: 23px !important; overflow: hidden; cursor: pointer; margin: 2px 0; }
#vkAudioSearchOut ul.hide li.head:hover { background-color: #555; }

#vkAudioSearchOut .head.active { background-color: #555; border: 1px solid rgba(0, 0, 0, 0.3); }

#vkAudioSearchOut li { color: #dacaa1; padding: 2px 0 2px 9px; border-radius: 2px; cursor: pointer; text-decoration: underline; white-space: nowrap; margin: 0 7px 0 7px; overflow: hidden; position: relative; line-height: 15px; }

#vkAudioSearchOut li:before { content: attr(data-before); margin: 0 5px 0 0; text-decoration: none; display:inline-block;}
#vkAudioSearchOut li.head { font: normal 14px 'PT Sans Narrow'; margin: 11px 7px 4px 7px; padding: 2px 0 2px 3px; color: #fff; cursor: inherit;  text-decoration: none; background-color: #444; display: list-item !important; }


#vkAudioSearchOut li:hover.current,
#vkAudioSearchOut li:hover { text-decoration: none; color: #f0f0f0; background-color: #444; }

#vkAudioSearchOut ul.hide > li.current,
#vkAudioSearchOut li:hover.current,
#vkAudioSearchOut li.current:not(.head) { color: #FFA113; }

#vkAudioSearchOut li div { background-color: #444; display: none; position: absolute; top: 0px; right: 0; height: 21px; width: 48px; padding: 0 0 0 3px; }
#vkAudioSearchOut li div.share { width: 62px; }
#vkAudioSearchOut li a {  background-color: #444; color: #ccc;  width: 23px; height: 21px; margin: 0; display: inline-block; }

#vkAudioSearchOut li a.op-vk, #chat span.op-vk { background: url(../pic/op-vk.png) no-repeat; width: 15px; }
#vkAudioSearchOut li a.op-vk.asearch { background-position: -74px 0px; }
#vkAudioSearchOut li a.op-vk.ashare { background-position: -93px 0px; }

#vkAudioSearchOut li a.op-vk.add,
#chat span.op-vk.add { background-position: -55px 0; }

#chat span.op-vk { cursor: pointer; height: 13px; display: inline-block; margin: 0 0 -1px 2px; }
#chat span.op-vk.add {  background-position: -55px -4px; }
#chat span.op-vk.del { background-position: -36px -4px; }

#vkAudioSearchOut li a.op-vk.del { background-position: -36px 0px; }
#vkAudioSearchOut li a.op-vk.downl { background-position: -17px 0px; }
#vkAudioSearchOut li a.op-vk.restore { background-position: 4px 0px; }
#vkAudioSearchOut li a.op-vk.del.search { background-position: -36px -16px; }


.op-vk:hover { animation: recordvk 1.5s 1; }
.op-vk:active { animation: none; }

#vkAudioCover { width: 290px; /*max-height: 290px;*/ min-height: 290px; outline: none; text-align: center; }
#vkAudioCover img { border-radius: 3px; cursor: pointer; }
#vkAudioCover img.top { position: absolute; left: 5px; }


#vkAudioCapcha { position: absolute; width: 130px; height: 50px; padding: 0; opacity: 1; box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 31px 13px; }
#vkAudioCapcha img { border-radius: 2px; }
#vkAudioCapcha.arrow_box:after { border-top-color: #eaeaea; }

#vkAudioControl { height: 30px; /*border: 1px solid #777;*/ background-color: #222222; border-radius: 3px; position: fixed; width: 272px; box-shadow: -5px 5px 0 0 #303030, 5px -5px 0 0 #303030, 5px 5px 0 0 #303030, -5px -5px 0 0 #303030; margin: 5px 0 0 5px; z-index: 10000; }
#vkAudioControl div { display: inline-block; }
#vkAudioControl.ccover { margin-left: 0; width: 290px; position: relative; }

#vkAudioPlay { color: #CA8E33; cursor: pointer; position: absolute; top: 9px; left: 7px; }
#vkAudioProgress { padding: 0; border: 0; cursor: pointer; height: 5px; border-radius: 5px; width: 240px; position: absolute; bottom: 6px; left: 25px; -webkit-appearance: none; outline: none; background: transparent; }
#vkAudioProgress::-webkit-slider-thumb { -webkit-appearance: none; outline: none; border: none; width: 8px; height: 5px; background: #80e4df; border-radius: 5px; box-shadow: inset 1px 1px 0px 0 rgba(255, 255, 255, .3), 1px 1px 0 0 rgba(0, 0, 0, .2); }
#vkAudioTrackName { position: absolute; color: #A9C1FF; top: 4px; left: 25px; font: normal 11px Tahoma, Helvetica, sans-serif; width: 205px; overflow-x: hidden; white-space: nowrap;  }
#vkAudioTime { position: absolute; font: normal 10px Tahoma, Helvetica, sans-serif; top: 6px; right: 9px; }

#vkAudioBufferedWrapper,
#vkAudioBuffered { position: absolute; height: 5px; border-radius: 5px; }

#vkAudioBufferedWrapper { width: 240px; background-color: #ccc; bottom: 6px; left: 25px; box-shadow: inset 2px 2px 1px 0 rgba(0, 0, 0, .3); text-align: left; }
#vkAudioBuffered { background-color: #a0a0a0; box-shadow: inset 2px 2px 1px 0 rgba(0, 0, 0, .3); }

.vkPlay,
.vkPause { width: 11px; height: 13px; }

.vkPlay { background: url(../pic/play.png) 0 0 no-repeat;  }
.vkPause { background: url(../pic/pause.png) 0 0 no-repeat;  }

#vkMore { display: block; text-align: center; color: #B997C9; margin: 0 0 8px 0; text-decoration: underline; }
#vkMore:hover { text-decoration: none; }

#vkAudioToolTip { display: none; opacity: .75; border-radius: 3px; z-index: 10000; position: absolute; font: normal 10px Tahoma; padding: 2px 4px; color: #fc0; }

#vkAudioToolTip.arrow_box:after {  border-width: 4px; margin-left: -4px; }
#vkAudioToolTip.arrow_box:before { border-width: 5px; margin-left: -5px; }

.boxshadow { box-shadow: rgba(0, 0, 0, 0.12) 0px 0px 31px 13px; }

/* ------- */


.melodyMotion {
 -webkit-animation: melodykf 2s ease-in-out -2s infinite alternate forwards;
 -moz-animation: melodykf 2s ease-in-out -2s infinite alternate forwards; 
 }

@-webkit-keyframes melodykf {
 100% { background-position: 100% 0; -webkit-transform: rotate(0deg); }
 0% { background-position: 0 0; -webkit-transform: rotate(6deg); opacity: 0; }
}

@-moz-keyframes melodykf {
 100% { background-position: 100% 0; -moz-transform: rotate(0deg); }
 0% { background-position: 0 0; -moz-transform: rotate(6deg); opacity: 0; }
}

/* logo animate */

:root { --left-pos: 13%; }

.logo-animate,
.logo-animate-plus { -webkit-animation: logo-keyframe 2.5s ease-in-out; -moz-animation: logo-keyframe 2.5s ease-in-out; background: url(../pic/chat-logo.png) 13% 79px no-repeat; animation-delay: .25s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; }

.logo-animate-plus { background: url(../pic/chat-logo-plus.png) var(--left-pos) 79px no-repeat; }
.logo-animate-ny { background: url(../pic/chat-logo-ny.png) var(--left-pos) 4px no-repeat; -webkit-animation: logo-keyframe-ny 2.5s ease-in-out; -moz-animation: logo-keyframe-ny 2.5s ease-in-out; animation-delay: .25s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; }
.logo-animate-plus-ny { background: url(../pic/chat-logo-plus-ny.png) var(--left-pos) 4px no-repeat; -webkit-animation: logo-keyframe-plus-ny 2.5s ease-in-out; -moz-animation: logo-keyframe-plus-ny 2.5s ease-in-out; }

.logo-animate-myst,
.logo-animate-plus-myst { -webkit-animation: logo-keyframe-ny 2.5s ease-in-out; -moz-animation: logo-keyframe-ny 2.5s ease-in-out; background: url(../pic/chat-logo-myst.png) var(--left-pos) 4px no-repeat; animation-delay: .25s; -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; }

.logo-animate-plus-myst { background: url(../pic/chat-logo-plus-myst.png) var(--left-pos) 4px no-repeat; }
.logo-animate-ny-myst { background: url(../pic/chat-logo-ny-myst.png) var(--left-pos) 4px no-repeat; -webkit-animation: logo-keyframe-ny 2.5s ease-in-out; -moz-animation: logo-keyframe-ny 2.5s ease-in-out; }
.logo-animate-plus-ny-myst { background: url(../pic/chat-logo-plus-ny-myst.png) var(--left-pos) 4px no-repeat; -webkit-animation: logo-keyframe-plus-ny 2.5s ease-in-out; -moz-animation: logo-keyframe-plus-ny 2.5s ease-in-out; }


@-webkit-keyframes logo-keyframe { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 10px; } }
@-moz-keyframes logo-keyframe { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 10px; } }

@-webkit-keyframes logo-keyframe-ny { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 4px; } }
@-moz-keyframes logo-keyframe-ny { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 4px; } }

@-webkit-keyframes logo-keyframe-plus-ny { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 4px; } }
@-moz-keyframes logo-keyframe-plus-ny { 0% { background-position: var(--left-pos) 79px; } 100% { background-position: var(--left-pos) 4px; } }



/* lindy-hop */
.lindy-hop { background: url(../pic/lindy-hop.png) no-repeat; background-size: 35%; background-position: center center; opacity: 0; -webkit-transition: opacity 1.5s; -moz-transition: opacity 1.5s; }
.logo-ezo { background: url(../pic/logo-ezo.png) no-repeat; background-size: 45%; background-position: center center; opacity: 0; -webkit-transition: opacity 1.5s; -moz-transition: opacity 1.5s; }

.opacity1 { opacity: 1; }
.opacity0 { background-size: 1%; }
.opacity-hidden { opacity: .15; transition: opacity .3s; } 

.animateBG {
 -webkit-animation: animatedBackground 1.5s ease-out; -webkit-animation-fill-mode: forwards;
 -moz-animation: animatedBackground 1.5s ease-out; -moz-animation-fill-mode: forwards;
}

@-webkit-keyframes animatedBackground { 0% { background-size: 35%; } 100% { background-size: 0; }}
@-moz-keyframes animatedBackground { 0% { background-size: 35%; } 100% { background-size: 0; }}
/* ------- */


a.url-img:after,
a.url-img-telegram:after,
a.url-img-samscloud:after,
a.url-img-cloud:after,
/* a.url-img-gcloud:after, */
a.url-doc:after,
a.url-txt:after,
a.url-pdf:after,
a.url-mp4:after,
a.url-mp4-telegram:after,
a.url-mp3:after,
a.url-mp3-telegram:after,
a.url-aiff-telegram:after,
a.url-other-telegram:after,
a.url-zip:after,
a.url-htm:after,
/*a.url-cloud:after, */
a.url-youtube:after,
a.url-sibnet:after,
a.url-reddit:after,
a.url-rutube:after,
a.url-rambler:after,
a.url-rutracker:after,
a.url-dailymotion:after,
a.url-instagram:after,
a.url-vimeo:after,
a.url-tiktok:after,
a.url-wiki:after,
a.url-magnet:after,
a.url-twitch:after,
a.url-twitter:after,
a.url-scifi:after,
a.url-coub:after,
a.url-meganz:after,
a.url-porn:after,
a.russia-tv:after,
a.url-radiofm:after,
a.url-radiofm.current:after,
a.url-radio-search:after,
a.url-ok:after,
a.url-vkontakte:after { display: inline-block; content: ''; margin: 5px 10px 0 7px; height: 10px; float: right; }


a.url-meganz:after,
a.url-meganz.current:after { margin: 2px 0px 0 5px; }

a.url-radiofm:after,
a.url-radiofm.current:after { margin: 4px -4px 0 7px; }

a.url-img:after,
a.url-img-telegram:after { background: url(../pic/url-img.png) 0px 0px no-repeat !important; width: 21px; }

a.url-img-samscloud:after,
a.url-img-cloud:after { background: url(../pic/url-img-cloud.png) 0px 0px no-repeat; width: 21px; }
a.url-doc:after { background: url(../pic/url-doc.png) 0px 0px no-repeat; width: 21px; }
/* a.url-img-gcloud:after { background: url(../pic/url-img-cloud.png) 0px 0px no-repeat; width: 21px; } */

a.url-txt:after,
a.url-other-telegram:after { background: url(../pic/url-txt.png) 0px 0px no-repeat; width: 21px; }

a.url-pdf:after { background: url(../pic/url-pdf.png) 0px 0px no-repeat; width: 21px; }

a.url-mp4:after,
a.url-mp4-telegram:after { background: url(../pic/url-mp4.png) 0px 0px no-repeat; width: 21px; }

a.url-mp3:after,
a.url-mp3-telegram:after,
a.url-aiff-telegram:after { background: url(../pic/url-mp3.png) 0px 0px no-repeat; width: 21px; }

a.url-zip:after { background: url(../pic/url-zip.png) 0px 0px no-repeat; width: 21px; }
a.url-htm:after { background: url(../pic/url-htm.png) 0px 0px no-repeat; width: 21px; }
/*a.url-cloud:after {  background: url(../pic/url-cloud.png) 0px 0px no-repeat; width: 30px; } */
a.url-youtube:after { background: url(../pic/url-youtube.png) 0px 0px no-repeat; width: 35px; }
a.url-sibnet:after { background: url(../pic/url-sibnet.png) 0px 0px no-repeat; width: 26px; }
a.url-reddit:after { background: url(../pic/url-reddit.png) 0px 0px no-repeat; width: 37px; margin-top: 3px; }
a.url-rutube:after { background: url(../pic/url-rutube.png) 0px 0px no-repeat; width: 34px; }
a.url-rambler:after { background: url(../pic/url-rambler.png) 0px 0px no-repeat; width: 36px; }
a.url-dailymotion:after { background: url(../pic/url-dailymotion.png) 0px 0px no-repeat; width: 48px; }
a.url-instagram:after { background: url(../pic/url-instagram.png) 0px 0px no-repeat; width: 50px; }
a.url-vimeo:after { background: url(../pic/url-vimeo.png) 0px 0px no-repeat; width: 31px; }
a.url-tiktok:after { background: url(../pic/url-tiktok.png) 0px 0px no-repeat; width: 34px; margin-top: 3px; }
a.url-wiki:after { background: url(../pic/url-wiki.png) 0px 0px no-repeat; width: 13px; }
a.url-ok:after { background: url(../pic/url-ok.png) 0px 0px no-repeat; width: 24px; margin-top: 3px; }
a.url-vkontakte:after { background: url(../pic/url-vkontakte.png) 0px 0px no-repeat; width: 43px; }
a.url-magnet:after { background: url(../pic/url-magnet.png) 0px 0px no-repeat; width: 39px; }
a.url-twitch:after { background: url(../pic/url-twitch.png) 0px 0px no-repeat; width: 31px; }
a.url-twitter:after { background: url(../pic/url-twitter.png) 0px -2px no-repeat; width: 31px; }
a.url-coub:after { background: url(../pic/url-coub.png) 0px 0px no-repeat; width: 22px; }
a.url-meganz:after { background: url(../pic/url-meganz.png) 0px 0px no-repeat; width: 11px; }
a.url-porn:after { background: url(../pic/url-porn.png) 0px 0px no-repeat; width: 32px; }
a.russia-tv:after { background: url(../pic/url-russia-tv.png) 0px 0px no-repeat; width: 49px; }
a.url-scifi:after { background: url(../pic/url-scifi.png) 0px 0px no-repeat; width: 33px; }
a.url-radiofm:after { background: url(../pic/url-radiofm.png) 0px 0px no-repeat; width: 36px; }
a.url-radiofm.current:after { background: url(../pic/url-radiofm-active.png) 0px 0px no-repeat; width: 36px; }
a.url-radio-search:after { background: url(../pic/url-radio-search.png) 0px 0px no-repeat; width: 15px; position: absolute; }
a.url-rutracker:after { background: url(../pic/url-rutracker.png) 0px -2px no-repeat; width: 48px; }

a.url-radio-search { position: relative; }


.birthDay,
.holiDay { display: inline-block; margin: 1px 0 3px 0; color: #C2FF00; font: bold 17px 'PT Sans Narrow'; letter-spacing: 1px; }

.holiDay { color: #ffcc00; }
.roomHeader { text-align: center;  font: bold 18px 'PT Sans Narrow'; margin: 10px 0; color: #dabb8c; }
.roomHeader.prison { color: #b7a497; }

/* chat PNZ */
/*
.status_00 { color: #aaaaaa; }
.status_01 { color: #ffffff; }
.status_02 { color: #99ccff; }
.status_03 { color: #00ff00; }
.status_04 { color: #ff6600; }
.status_05 { color: #ff0000; }
.status_06 { color: #ffff00; }
*/
/*
.pnzchat-wrap { margin: 0 0 20px 0; padding: 0; }
.chatpnz { padding-left: 245px; }
.chatpnz a:hover { text-decoration: none; }
*/


/* data-tooltip */

[data-tooltip] { position: relative; cursor: pointer; }

/* Base styles for the entire tooltip */
[data-tooltip]:before,
[data-tooltip]:after {
  position: absolute;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.2s ease-in-out;
    -moz-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
  pointer-events: none;
}

/* Show the entire tooltip on hover and focus */
[data-tooltip]:hover:before,
[data-tooltip]:hover:after,
[data-tooltip]:focus:before,
[data-tooltip]:focus:after { display: block; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1; }

/* Base styles for the tooltip's directional arrow */
[data-tooltip]:before { z-index: 1001; border: 6px solid transparent; background: transparent; content: ''; }

/* Base styles for the tooltip's content area */
[data-tooltip]:after { z-index: 1000; padding: 7px; width: 200px; background-color: #eee; color: #000; content: attr(data-tooltip); white-space: pre; font: normal 11px/13px Tahoma, Helvetica, sans-serif; border-radius: 2px;  }

[data-tooltip]:after { margin-left: -100px; }

.tooltip-bottom:before,
.tooltip-bottom:after { top: 190%; bottom: auto; left: 50%; }

.tooltip-bottom:before { margin-top: -12px; border-top-color: transparent; border-bottom-color: #eee; }

/* ------- */

.rouble { position: relative; color: #bbb; }
/*.rouble:before { position: absolute; top: 0.2em; left: -0.04em; content: '−'; } */
.rouble:after { position: absolute; top: 0.15em; left: 0; content: '−'; font-size: 11px; }

p.sys .rouble:before {  top: 0.15em; }
p.sys .rouble:after {  top: 0.3em; }

#id_sponsor .rouble:after {  top: 0.2em; left: 0; }

.ahead { font: normal 20px 'PT Sans Narrow'; color: #FFB71D; }


.august-head { cursor: pointer; font: normal 13px Tahoma, Helvetica, sans-serif; position: relative; background-color: #444; color: #E4E4E4; border-radius: 2px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; margin: 10px 4px 3px 0; padding: 2px 0 2px 26px;  box-shadow: 0px 1px 1px 0px rgba(0, 0, 0, 0.1); height: 16px; }
.august-head a { display: inline-block; position: absolute; top: 3px; left: 4px; width: 14px; height: 14px; border-radius: 15px; background-color: #333; /*#F5B400;*/ margin: 0 5px 0 0; box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.30); }

.august-head span { display: inline-block; text-align: center; width: 25px; position: absolute; top: 2px; right: 1px; padding: 1px 0 1px 0; border-radius: 15px; margin: 0 5px 0 0; /*box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.30);*/ font: normal 11px Tahoma; color: #bbbbbb; }

.august-head span:hover { background-color: #333; }

/*.august-current.read_only {  background-color: #855794 } */

#online > div:nth-child(2) { margin-top: 27px; }
.august-current { background-color: #724780; color: #fff;  /* #707070 #9A3737 #2D6D92 #596945 #61503E #69534F */ }

#online a:hover.noselect { background-color: #9c9c9c; }
#online a.select { background-color: #9c9c9c; }

#online a.select.read_only:after { content: 'ro'; text-decoration: none; font: normal 10px Verdana; color: #000; position: absolute; top: 0; left: 2px; }
#online a:hover.select.read_only:after { color: #FFB71D;}
#online a:hover.select { background-color: #333; }

.august-current span { color: #f9f9f9; }
#online > div:nth-child(2) > div > div:nth-child(even) { margin-left: 5px; }
#online > div:nth-child(3) > a[data-pipeuid*="-id-"] { display: inline; width: 191px; overflow-x: hidden; margin: 0 0 -3px 0; }


#info-aboutme p,
#info-aboutme-fr p { color: #bbb; margin: 0; padding: 0; }

#info-aboutme p.botcurrency,
#info-aboutme-fr p.botcurrency { margin: 5px 0 4px 0; color: #F7B235; }

#info-aboutme p.infobot.weather,
#info-aboutme-fr p.infobot.weather { padding: 0 4px 1px 4px; margin: 10px 0 2px 0; color: #f1f1f1; border-radius: 2px; }
.weather-sign { color: #f5f5f5; }

p.infobot.weekend { background-color: #804141; }

.spoiler-label { cursor: pointer; text-decoration: underline; color: #bbb; position: relative; }
.spoiler-label:before { cursor: pointer; text-decoration: underline; content: attr(data-content); position: absolute; background-color: #333; width: 100%; line-height: 16px; white-space: nowrap; }

.spoiler-label:hover:before,
.spoiler-label:hover { text-decoration: none; }
.spoiler-label.open { color: #ffb735; }

.spoiler { display: none; border: 1px solid rgb(255 255 255 / 12%); border-radius: 2px; margin: 8px 0px 6px 0px; padding: 5px; }
.spoiler.open { display: inline-block !important; }

p.sec { font-style: italic; }
p.sec > span { background: url(../pic/sec.png) 0 2px no-repeat; padding: 0 0 1px .9em; }
p.sec .clear { margin: 0 0 -16px 0; }

.moon-shop { color: #BBCDE0; }
.moon-insign { color: #F7B235; }

#listradios,
#listradios-fr { border: 1px solid #555; border-radius: 2px;  margin: 13px 10px 0 0; padding: 8px 10px; }

#listradios .head:first-child,
#listradios-fr .head:first-child { margin: 0 0 5px 0; }

#listradios .head,
#listradios-fr .head { margin: 15px 0 5px 0; padding: 1px 0 2px 8px; color: #fff; font: normal 14px 'PT Sans Narrow';  background-color: #4a4a4a; border-radius: 2px; overflow-x: hidden; white-space: nowrap; position: relative; }

#listradios .head span,
#listradios-fr .head span { display: inline-block; margin: 0 0 0 5px; }

#listradios .head span:first-child,
#listradios-fr .head span:first-child { color: #bbb; font: normal 10px 'Microsoft Sans Serif'; }

#listradios .head span:last-child,
#listradios-fr .head span:last-child { color: #B8D4FF; }

#listradios ul,
#listradios-fr ul { list-style-type: decimal; list-style-position: inside; margin:  0; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }

#listradios li,
#listradios-fr li { border-radius: 2px; font: normal 12px 'Microsoft Sans Serif'; color: #dacaa1; padding: 0 0 0 7px; cursor: pointer; text-decoration: underline; white-space: nowrap; margin: 0; overflow: hidden; position: relative; line-height: 18px; }

#listradios li.current,
#listradios-fr li.current { color: #FFA113; }

#listradios li:hover,
#listradios-fr li:hover { color: #f0f0f0; background-color: #444; text-decoration: none; }


#playlists,
#playlists-fr { border: 1px solid #555; border-radius: 2px;  margin: 13px 10px 0 0; padding: 8px 10px; }

#playlists .head:first-child,
#playlists-fr .head:first-child { margin: 0 0 5px 0; }

#playlists .head,
#playlists-fr .head { margin: 15px 0 5px 0; padding: 1px 0 2px 8px; color: #fff; font: normal 14px 'PT Sans Narrow';  background-color: #4a4a4a; border-radius: 2px; overflow-x: hidden; white-space: nowrap; position: relative; }

#playlists .head span,
#playlists-fr .head span { display: inline-block; margin: 0 0 0 5px; }

#playlists .head span:first-child,
#playlists-fr .head span:first-child { color: #bbb; font: normal 10px 'Microsoft Sans Serif'; }

#playlists .head span:last-child,
#playlists-fr .head span:last-child { color: #B8D4FF; }

#playlists ul,
#playlists-fr ul { list-style-type: decimal; list-style-position: inside; margin:  0; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; }

#playlists li,
#playlists-fr li { border-radius: 2px; font: normal 12px 'Microsoft Sans Serif'; color: #dacaa1; padding: 0 0 0 7px; cursor: pointer; text-decoration: underline; white-space: nowrap; margin: 0; overflow: hidden; position: relative; line-height: 18px; }

#playlists li.current,
#playlists-fr li.current { color: #FFA113; }

#playlists li:hover,
#playlists-fr li:hover { color: #f0f0f0; background-color: #444; text-decoration: none; }


/*.fm101-img { height: 150px; width: 150px; margin-top: 51px; } */

.weather-dangerous { color: #FF3434; }

#video-placeholder-twitch,
#video-placeholder-youtube,
#video-placeholder-cloud > video,
#video-placeholder-other { margin: 0; padding: 0; border: 0; width: 640px; height: 360px; max-height: 360px; /*display: none;*/ }

#video-placeholder-twitch iframe { height: 360px; width: 640px; }

#video-placeholder-cloud > video { display: block; height: auto; }

#video-placeholder-cloud { position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; background-color: #000; }

#scroll-arrow { box-shadow: 0px 1px 3px 2px rgba(0, 0, 0, .2); display: none; cursor: pointer; background-color: #1E6CE0; width: 30px; height: 30px; border-radius: 18px; position: fixed; bottom: 80px; left: 38%; z-index: 9000; }
#scroll-arrow:active { bottom: 78px; box-shadow: none; background-color: #0855C7; }

.icon-arrow-down { margin: 4px auto; display: block; width: 1.6em; height: 1.6em; stroke-width: 0; stroke: currentColor; fill: #fff; }

/* pCloud player */

video::-webkit-media-controls { display: none !important; }
video::-webkit-media-controls-enclosure { display: none !important; }

#controls { margin: 0; padding: 0px 0 9px 0; width: 100%; height: 30px; position: absolute; left: 0; bottom: 0; background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.65));  opacity: 0; z-index: 2147483647; }
#controls span { display: inline-block; padding: 0; }
#playpause { color: #eee; font-size: 20px; line-height: 16px; width: 20px; margin: 0 3px 0 26px; cursor: pointer; }
#playpause svg { display: inline; width: 20px;  height: 20px; fill: #ddd; }
#progress { margin: 0px 14px 8px 14px; cursor: pointer; max-height: 3px; }
#total { width: 100%; max-height: 3px; height: 3px; position: relative; background-color: rgba(255, 255, 255, 0.16); transform: scaleY(1); transform-origin: bottom; transition: transform 0.1s ease; }
#buffered { max-height: 100%; height: 3px; background-color: rgba(255, 255, 255, 0.35); }
#cmover { max-height: 100%; z-index: -1; position: absolute; left: 0; top: 0; height: 3px; background-color: rgba(255, 255, 255, 0.4); }
#current { /*max-width: 618px;*/ max-height: 100%; height: 3px; background-color: #e80000; position: relative; }
#progress .pover { transform: scaleY(1.8); }
#progress .pover-roll { transform: scale(1.3,0.7); }
#croll { width: 10px;  height: 10px; border-radius: 5px; background-color: #e80000; position: absolute; top: -3.5px; right: -5px;  transform: scale(0,0); transition: transform 0.1s ease; display: block; }
#time { color: #dcdcdc; font: normal 12px Verdana; vertical-align: top; margin: 2px 0 0 0; }
#volume { position: relative; width: 30px; }
#dynamic { fill: #dcdcdc; padding: 0 5px; width: 16px; height: 16px; cursor: pointer; position: absolute; top: -18px; }
#dynamic.off { fill: #888; }
#volume-wrapper { padding: 2px 0 3px 0; margin: 4px 15px 0 5px; cursor: pointer; vertical-align: top; }
#cvolume {  background-color: rgba(255, 255, 255, 0.25); height: 3px; width: 50px; border-radius: 2px; vertical-align: top; margin: 5px 0 0 0; }
#volcurrent { overflow: visible !important; max-width: 50px; background-color: #ddd; position: relative; cursor: pointer; height: 3px; border-radius: 2px; }
#volroll { width: 12px; height: 12px; background-color: #ddd; position: absolute; top: -5px; right: -7px; border-radius: 7px; cursor: pointer; }
#logo-player { cursor: pointer; right: 26px; bottom: 8px; width: 19px; height: 20px; position: absolute; background:  url(../pic/logo-player.png) 0 0 no-repeat; }
#logo-player:active { background-position: 0 1px; }


#crewind,
#cloop,
#cloud-download { vertical-align: top; margin: 1px 0 0 0; cursor: pointer; width: 19px; height: 15px; background: url(../pic/chat-cloud-btsprite.png) no-repeat; }

#crewind { margin-left: 10px; background-position: -60px 0; }
#cloop { margin-left: -8px; background-position: -100px 0; }
#cloud-download { margin-left: 2px; background-position: -80px 0; }

#crewind:hover { background-position: 0 0; }
#cloop:hover { background-position: -40px 0; }
#cloud-download:hover { margin-left: 2px; background-position: -20px 0; }
#cloop.on { background-position: -40px 0; }

#crewind:active { background-position: -60px 1px; }
#cloop:active,
#cloop.on:active { background-position: -100px 1px; }
#cloud-download:active { background-position: -80px 1px; }

#time-marker { position: absolute; top: -38px; color: #71A3FF; display: none; background-color: rgba(0, 0, 0, 0.8); }

#cthumbnail { z-index: 2147483647; display: none; width: 150px; height: 100px; background-color: #000; position: absolute; bottom: 48px; left: 0; border-radius: 2px; border: 1px solid #bbb;  background-repeat: no-repeat; background-position: 0 50%; }


/*  --------------  */


#admCFP .td,
#admISP .td,
#admIP .td { padding: 2px 9px 2px 9px; color: #bbb; }

#admCFP .tr:nth-child(1) .td,
#admISP .tr:nth-child(1) .td,
#admIP .tr:nth-child(1) .td { background-color: #3f3f3f; color: #E8C48D; }

#banCFP a.cbutt,
#banISP a.cbutt,
#IPAdd a.cbutt,
#ISPEdit a.cbutt,
#banIP a.cbutt { float: right; margin: 0 0 0 6px; }

#admISPSaveButt,
#admIPAddButt,
#admCFPSaveButt { margin-right: 9px !important; }

#banCFP .info_wrap,
#banISP .info_wrap,
#banIP .info_wrap { margin-bottom: 10px; }

#banISP .td:nth-child(1) { width: 51%; }
#banCFP .td:nth-child(1) { width: 27%; }
#banCFP .td:nth-child(2) { width: 19%; }
#banCFP .td:nth-child(4) { width: 9%; }
#admIP .td:nth-child(3) { width: 12%; }

.center { text-align: center; }

#ISPTarea { max-height: 461px; height: 224px; }

#id_admin .info_wrap { margin: 9px 9px 20px 0; }
#id_admin input[type="text"] { width: 97.4%; border-radius: 3px; }
#id_admin input#ISPNetName { width: 76.3%; margin: 0 0 0 6px; }
#id_admin input#uLogin { width: 97%; }
#id_admin { width: 562px;}
#IPAdd .td { border-bottom: 0; }
#IPAdd .td.left { width: 15%;}

#IPAdd > div:last-child { float: right; margin: 17px -6px 0 0px; }

a.banned-cfp { color: #d4d4d4; }
a.banned-cfp:hover { text-decoration: none; }


/* advanced design */

#chat > p.adv { position: relative; /*border-bottom: 1px solid rgba(255, 255, 255, 0.05); padding: 7px 0 14px 0; margin: 0 10px 0px 10px;  */ padding: 0 0 10px 0; margin: 0 0 1px 0; }
#chat > p.adv:last-child { border-bottom: none; }

#chat > p.adv > a { background-repeat: no-repeat; }
#chat > p.adv > a:first-child { width: 40px; height: 40px; background-size: 100%; background-position: 50%; border-radius: 50%; display: inline-block; text-indent: -9999px; margin: 10px 15px 7px 14px; box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.15), -1px -1px 0 0 rgba(255, 255, 255, 0.2) inset; background-image: url(../pic/avatars/p_0.png); /*margin: 10px 15px 10px 14px; */ }

#chat > p.adv > a:nth-child(2) { vertical-align: middle; margin: 7px 10px 0.5em 0; display: inline-block; font: normal 15px/15px Whitney500; }
#chat > p.adv > span { display: block; clear: both; outline: none; font: normal 15px/15px Whitney300; position: relative; margin: 0px 0px 0 68px; }

#chat > p.adv.sys > span:last-of-type,
#chat > p.adv.syshistory > span:last-of-type { margin-left: 0px; }

#chat > p.adv > span:first-of-type { margin-top: -1.5rem; }
#chat > p.adv.sec > span { background: none; font-style: italic; } 
#chat > p.adv.sec > span { background: url(../pic/sec.png) 0 2px no-repeat; background-size: .57em; }
#chat > p.adv > i,
#chat > p.adv > span > span > i.idate { color: hsla(0, 100%, 100%, .4); font: normal 12px/13px Whitney300; margin: 0 0 -1px 0; display: inline-block; vertical-align: middle; text-decoration: underline; text-decoration-color: transparent; }
#chat > p.adv > span > span > i.idate { margin: -4px 3px 0 0; color: inherit; }
#chat > p.adv.pers { border-radius: 0; }

#chat > p.adv.sys,
#chat > p.adv.syshistory { padding: 0; padding-left: 240px; border: 0; margin: 0px 0; }


#chat > p.adv.sys { font: normal 15px/15px Whitney500; }
#chat > p.adv.sys span.mobile { display: inline-block; }
#chat > p.adv.syshistory {  margin: 30px 0 20px 0; }

#chat > p.adv.sys span,
#chat > p.adv.syshistory span { display: inline; margin: 0; padding: 1px 0px; }

#chat > p.adv.sys span.mobile,
#chat > p.adv.syshistory span.mobile { padding: 0; }


#chat > p.adv.syshistory span > span > span { padding: 1px 9px; }

#chat > p.adv span.select { border: 1px dashed rgba(255, 255, 255, 0.12); border-radius: 2px; }
#chat > p.adv > span:hover { text-shadow: 0px 0px 1px rgba(255, 255, 255, 0.4); }

/*
#online.adv a { font: normal 15px/15px Whitney300; }
#online.adv #online_head a { font: normal 13px/13px Whitney400; }
*/

#chat > p.adv.pers { background: rgba(255, 255, 255, 0.04); /* rgba(255, 255, 255, .03); border: none; */ }

/*
#chat > p.adv.pers:before { content: ''; border-style: solid; border-width: 6px 0px 6px 9px; border-color: transparent transparent transparent #57C1FF; display: inline-block; vertical-align: top; position: absolute; left: 0; top: 29px; }
#chat > p.adv.sec.pers:before { border-color: transparent transparent transparent #FF5757; }
*/

#input.adv { font: normal 15px/15px Whitney300; padding: 1px 63px 2px 10px; width: 282px; }



/* Like reactions */

#chat > p.adv .reactions  { position: relative; display: inline-block !important; margin: 5px 0 1px 0; }
#chat > p.adv .reaction { position: relative; padding: 3px 3px 3px 4px; margin: 10px 4px 0 0; background: hsla(0,0%,100%,.04); height: 1.3em;  border-radius: 3px; cursor: pointer; display: none; transition: background-color .1s ease; }
#chat > p.adv .reaction { display: inline-block; width: 2.867em; height: 1.465em; padding: 0; margin: 2px 4px 0 0; }
#chat > p.adv .reaction:hover { background: rgba(92,106,158,.5); }
.reaction img { position: absolute; left: 0.25em; top: 20%; max-width: 1.7em; max-height: 1.065em; }
#chat > p.adv .reaction-me { background: rgba(92,106,158,.3); }

.btn-option,
.btn-reaction { position: absolute; top: 0; right: 0; width: 1em; height: 1em; cursor: pointer; margin: 0; opacity: 0; }

.btn-option { background: url(../pic/btn-option.svg) 50% no-repeat; }
.btn-reaction { background: url(../pic/btn-reaction.svg) 50% no-repeat; background-size: 100%; right: 1.4em; }

.btn-option:hover,
.btn-reaction:hover { opacity: 1 !important; }

.reactions > .btn-reaction { display: inline-block; position: relative; right: -0.75em; top: 0.4em; float: none; }

.reaction-count { position: absolute; right: 0.15em; top: 0.15em; width: .6em; height: 1.19em; color: #7289da; display: inline-block; font: normal 0.932em Whitney500; overflow: hidden; vertical-align: middle;  }
#chat > p.adv > span > span { display: block; }
#chat > p.adv > span > span:first-child { padding-right: 18px; }
#chat > p.adv > span > span.select:first-child { background-color: rgba(255, 255, 255, 0.05); border-radius: 2px; }

#chat > p.adv.sys > span > span:first-child { padding-right: inherit;}

.like-rate-animate { position: absolute; top: 0;  width: .7em; word-wrap: break-word; }

#message-menu { /*position: absolute; width: 146px; border: 1px solid #555; border-radius: 2px; background-color: #333; */ margin: 4px 0 4px 68px; }
#message-menu li { display: inline-block; text-align: center; cursor: pointer; font: normal 12px Whitney300; color: #c1c1c1; padding: 2px 10px; background-color: rgba(255, 255, 255, 0.1);  border-radius: 2px;  }
#message-menu li:hover { background-color: rgba(111, 111, 111, 0.84); color: #FFF; }
#message-menu li.none { display: none; }

#message-like { background-size: 100%; background: url(../pic/btn-reaction.svg) 50% center / 70% no-repeat; }
#message-like:hover { background-color: rgba(111, 111, 111, 0.6) !important; }

.editable { display: inline-block; min-height: 200px; outline: none; width: 97%; margin: 3px 0px 0 0; padding: 10px 12px 10px 12px !important; background-color: rgba(255, 255, 255, 0.12); min-height: 20px; font: normal 13px Whitney300; color: #ECECEC !important; border-radius: 4px; line-height: 1rem !important; word-wrap: break-word; white-space: pre-wrap; }
span[contenteditable="false"] { outline: none; }

.edit-operation { margin: 0 4px 0 0; color: hsla(0, 0%, 100%, .3); padding: 5px 0; text-align: end; font: normal 0.75rem Whitney300; }
.edit-operation a { color: #7289da; }
.edited { font: normal 0.65rem Whitney300; color: hsla(0, 100%, 100%, .4); margin-left: 3px; cursor: pointer; }

/* dialog delete */

#overlay { display: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; text-align: center; z-index: 1000; background-color: rgba(0, 0, 0, 0.6); }
#id_dialog_delete { height: auto; top: 45%; left: 25%; width: 485px; }
#id_dialog_delete > div:first-of-type { margin: 27px 0 29px 0; }
#id_dialog_delete > div { text-align: center; }
#delete-button { background-color: #764454; }
#msg-chunk { margin: 0 10px 33px 10px; text-align: left !important; font: normal 15px Whitney300; }

/* who likes */

#id_likes { width: 100%; font: normal 15px Whitney500; }

#like-smiles,
#like-users { min-height: 410px;  display: inline-block; border-radius: 3px; vertical-align: top; }

#like-smiles { width: 30%; background-color: rgba(255, 255, 255, 0.05); }
#like-smiles div { height: 1.3em; cursor: pointer; margin: 4px 4px; border-radius: 2px; padding: 0.6em 6px 3px 7px; }

/*#like-smiles div:hover { background-color: rgba(255, 255, 255, 0.05); } */
/*#like-smiles div.active:hover { background-color: rgba(255, 255, 255, 0.1); } */
#like-smiles .active { background-color: rgba(255, 255, 255, 0.09); }

#like-smiles div span { display: inline-block; float: right;  margin: 0 3px 0 0; color: #A6D2FF; }
#like-smiles div img { max-height: 1.3em; vertical-align: middle; margin: -0.2em 0 0 0; }
#like-smiles .emoji { float: left; }

#like-users div { height: 1.3em; margin: 0px 0px 0px 0px; padding: 6px 6px 7px 7px; }
#like-users div a { width: 1.7em; height: 1.7em; background-size: 100%; background-position: 50%; border-radius: 50%; display: inline-block; margin: 0 0.7em 0 0; text-indent: -9999px; }
#like-users div a.user { margin: 0; width: auto;  background: none; border: none; text-indent: inherit; }

#like-users { width: 66%; padding: 0px 0 0 7px; }


#smile-button { display: none; position: absolute; cursor: pointer; top: 4px; right: 50px; background: url(../pic/smile.svg) 0 0 no-repeat; width: 14px; height: 14px; filter: grayscale(1); opacity: 0.7; }

#smile-button.active,
#smile-button:hover { filter: grayscale(0); opacity: 1; background: url(../pic/smile-nerd.svg) 0 0 no-repeat; }

#smile-button:hover.active { background: url(../pic/smile.svg) 0 0 no-repeat; filter: grayscale(1); opacity: 0.7; }
#smile-button:active { margin-top: 1px; }
#smile-button.adv { display: block; }
#smiles.adv { display: none !important; }
#id_smiles_new { width: 384px; }
#id_smiles_new > div { height: 380px; overflow-y: scroll; overflow-x: hidden; }
#id_smiles_new div.smile-header { background-color: #4a4a4a; border-radius: 2px; color: #fff; height: auto; display: block; padding: 2px 0 2px 7px; margin: 13px 0px 9px 3px; vertical-align: middle; float: left; width: 95%; font: normal 14px 'PT Sans Narrow'; }

#id_smiles_new p,
.emoji { width: 22px; height: 22px; line-height: 28px; text-align: center; background-image: url(../pic/sprite-emoji.png);
 background-size: 924px 704px; margin: 3px; padding: 0; background-position: 50%; background-repeat: no-repeat; }

.emoji { display: inline-block; background-size: 630px 480px; width: 15px; height: 15px; margin: 0 2px -1px 4px; padding: 0; }

#id_smiles_new p.emoji-people,
.emoji-people { background-image: url(../pic/sprite-emoji-people.png) !important; background-size: 220px 198px; margin: 3px; padding: 0; background-position: 50%; background-repeat: no-repeat; }

.emoji-people { display: inline-block; background-size: 150px 135px; width: 15px; height: 15px; margin: 0 2px -1px 4px; padding: 0; }

.reaction .emoji { margin: 0px 2px 0px 5px; vertical-align: middle; }
#like-smiles .emoji { vertical-align: middle; }

.through { text-decoration: line-through; }
.bold { font-weight: bold; }
.h1 { font-size: 1.8em;  font-weight: bold; }

span.none-mf,
p.none-mf,
span.none-fm,
p.none-fm { display: none !important; }

#message-filter,
#filter-for-me,
#filter-tidmess { display: none !important; }

#message-filter.adv,
#filter-for-me.adv,
#filter-tidmess.adv { display: inline-block !important; }

.adv b { font: bold 15px/15px Whitney500; }

/*#chat.adv { margin-left: 2px; } */

p.adv > img:first-of-type { display: none; }
span.quote { color: #ececec; background-color: rgba(255, 255, 255, 0.03); padding: 0 6px; border-radius: 2px; }
p.adv .quote { display: block; border: 1px solid rgba(255, 255, 255, 0.2);  padding: 10px 19px; margin: 4px 0; }
/*
@keyframes shake { 10%, 90% { transform: translate3d(-1px, 0, 0); } 20%, 80% { transform: translate3d(2px, 0, 0); } 30%, 50%, 70% { transform: translate3d(-4px, 0, 0); } 40%, 60% { transform: translate3d(4px, 0, 0); } }
*/

@keyframes shake { 10%, 90% { background-position: 3px .15em; } 20%, 80% { background-position: 6px .15em; } 30%, 50%, 70% { background-position: -0px .15em; } 40%, 60% { background-position: 8px .15em; } }

.note { background: url(../pic/note.png) 4px .15em no-repeat; background-size: .74em; padding: 0 0 0 1.5em; }
.note-animation { animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both; }

.emojii { width: 1em; height: 1em; padding: 0 4px 0 4px; vertical-align: 0.1em; }
.discord-custom-smile { height: 1em; vertical-align: -0.15em; }

.tg-voice { display: inline-block; position: relative; background-color: #44464c; border-radius: 2px; padding: 2px 5px; width: 94px; cursor: pointer; margin: 1px 0 0 0; }
.tg-voice:hover,
.tg-voice.active { background-color: #4a4d56; }
.tg-voice svg { display: inline-block; width: 9px; height: 9px; fill: #44464c; position: absolute; top: 3px; left: 3px; }
.tg-voice > span:first-child { position: relative; background-color: #5faeff; border-radius: 20px; width: 15px; height: 15px; display: inline-block; margin: 0px 0 -2px 0; }
.tg-voice .progress { position: absolute; background: #777; bottom: 3px; left: 26px; width: 73px; border-radius: 1px; background: #434343; height: 14px; display: block; }
.tg-voice .progress > span { display: block; position: relative; background: #716e6d; border-radius: 1px 0 0 1px; width: 0; height: 100%; }
.tg-voice > span.tg-currtime { font: normal 10px Arial, Helvetica, sans-serif; color: #dadada; position: absolute; left: 31px; bottom: 3px; }


#design-change.none { display: none !important; }
.user-no-action { opacity: 0.6; }

#id_info .goto-channel { cursor: pointer; text-decoration: underline; }
#id_info .goto-channel:hover { text-decoration: none; }

#chat > p > span > span > img { margin-bottom: -3px; }



/* fancyBox */

#fancyBox-overlay { width: 100%; height: 100%; top: 0; left: 0; position: absolute;  z-index: 8010; background: rgba(0, 0, 0, .6); }
#fancyBox-wrapper { margin: auto; position: absolute; top: 0; left: 0; bottom: 0; right: 0; text-align: center; background-color: #fff; border-radius: 4px; padding: 8px 8px 8px 8px; }
#fancyBox-ibox { }
#fancyBox-wrapper > div img { max-height: 91vh; max-width: 97vw;  }
#fancyBox-wrapper > div iframe { width: 626px; height: 650px; }
#fancyBox-wrapper > div > div { font: normal 17px/20px 'PT Sans Narrow'; color: #000; margin: 5px 0 0 0;white-space: nowrap; overflow: hidden; }
.image-load-error { background: rgba(0, 0, 0, 0.15); height: 100%;  }
.load-error { width: 624px !important; height: 261px !important; }

.pers-gallery { padding: 0 14px 0 15px; }


/* dateDivider */

.dateDivider { padding-left: 43% !important; margin: 0px 2px !important; height: 22px; position: relative !important; margin-bottom: 22px !important; box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .5), 0px 2px 0px 0px #444444; }
.dateDivider span { color: #828282; position: absolute !important; top: 15px !important; background-color: #333; padding: 0px 17px !important; }
.dateDivider.adv { padding-left: 36.5% !important; margin-left: 70px !important; margin-right: 18px !important; }
.dateDivider.adv span { top: 16px !important; position: inherit !important; padding: 0px 17px 0 17px !important; }
span.dateDivider.adv { margin-left: 0 !important; padding-left: 39.3% !important; }
.dateDivider.adv span span { display: none; }
p.dateDivider.adv span { padding: 0px 0px 0 17px !important; }
.dateDivider.weekend > span { color: #a97e7e; }


#vk_auth { position: absolute; top: 100px; }


/* load logo animate */

#load-logo { position: fixed; max-width: 600px; height: 230px; margin: auto; top: 0; left: 0; bottom: 0; right: 0; display: none;  }
#load-logo video { width: 200px; position: absolute; top: 0; left: 0; right: 0; margin: auto; }
#load-logo div { position: absolute; bottom: 0; height: 20px; vertical-align: middle; width: 100%; text-align: center; font: normal 12px Whitney500; color: #72767d; text-transform: uppercase; }

#load-logo div:before { content: attr(data-before); color: #fff; position: absolute; left: 0; bottom: 24px; right: 0; font: italic 16px Whitney500; text-transform: uppercase; }

#chat { opacity: 0; }

.opacity-animate-chat { animation: fadein ease-in-out; animation-duration: .2s; animation-fill-mode: forwards; }
.opacity-animate-chat.animate-delay-zero { animation-duration: 0s; }
@-webkit-keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; }}
@-moz-keyframes fadein { 0% { opacity: 0; } 100% { opacity: 1; }}


.opacity-animate-chat-hide { animation: fadeout ease-in-out; animation-duration: .2s; animation-fill-mode: forwards; }
@-webkit-keyframes fadeout { 0% { opacity: 1; } 100% { opacity: 0; }}
@-moz-keyframes fadeout { 0% { opacity: 1; } 100% { opacity: 0; }}


/* ------- */

.top-counter { position: absolute; bottom: 8px; right: 39px; }
.top-counter img { border-radius: 1px; width: 88px; height: 31px; }
.top-counter:first-of-type { right: 132px; }


/* --- switch slider vkaudio ---- */
#vkAudioSearchOut .switch,
.august-head .switch { position: relative; display: inline-block; width: 33px; height: 16px; position: absolute; right: 3px; top: 3px; }

.august-head .switch { right: 35px; top: 2px; }

#vkAudioSearchOut .switch input,
.august-head .switch input { opacity: 0; width: 0; height: 0; }

#vkAudioSearchOut .slider,
.august-head .slider { position: absolute; cursor: pointer; width: 33px; top: 0; left: 0; right: 0; bottom: 0; background-color: #2f2f2f; transition: .1s; box-shadow: 1px 1px 0px 0px rgba(0, 0, 0, .5) inset; }

#vkAudioSearchOut .slider:before,
.august-head .slider:before { position: absolute; content: ''; height: 12px; width: 12px; left: 3px; bottom: 2px; background-color: #545454; transition: .1s; }

#vkAudioSearchOut input:checked + .slider:before { background-color: #5285bd; }
.august-head input:checked + .slider:before { background-color: #47ad54; }

#vkAudioSearchOut input:checked + .slider:before,
.august-head input:checked + .slider:before { transform: translateX(16px); }

#vkAudioSearchOut .slider.round,
.august-head .slider.round { border-radius: 34px; }

#vkAudioSearchOut .slider.round:before,
.august-head .slider.round:before { border-radius: 50%; box-shadow: 1px 1px 0 0 rgba(0, 0, 0, 0.2); }

#vkAudioSearchOut .switch.none { display: none; }
/* ------------------------------ */

.date-history { color: #f7f7f7; cursor: pointer; padding: 0 3px 0 4px; border-radius: 2px; background-color: #636363; font: normal 0.83em Arial, Helvetica, sans-serif; }
.date-history:hover { background-color: #885b5b; }
p.adv .date-history { color: #e6e6e6; }

.weather .date-history { background-color: inherit; }

#formsend #buttonBlock .cbutton { float: left; margin: 0 4px 0 0 !important; }

#quoteButton { position: absolute; width: 100px; cursor: pointer; text-align: center; padding: 3px 5px 4px 5px; font: normal 0.83em Arial, Helvetica, sans-serif; color: #b7a572; display: none; }
#quoteButton:hover { border-color: #656565; color: #dec88a; }
#quoteButton.arrow_box_bottom:before { top: -11px; border-width: 5px; margin-left: -5px; }
#quoteButton.arrow_box_bottom:after { border-width: 5px; margin-left: -5px; top: -10px; }

/* -------- code highlight ------- */

code { white-space: pre; font: normal 0.88em Courier; color: #b7b7b7; display: inline-block; vertical-align: top; background: #404040 !important; margin: 4px 0px 2px 1px; padding: 8px 9px; border-radius: 2px; }
code br { display: none; }
code .hl-bold { font-weight: bold; color: #72a0e4; }
code .hl-function { color: #a69ae4; }
code .hl-this { color: #70bfcc; }
code .hl-php-var { color: #c379c7; }

/*.m3u8 { color: red !important; } */

/* -------- code highlight ------- */


/* иконки в меню */

.ndstyle #admin,
.ndstyle #horos,
.ndstyle #dreambook,
.ndstyle #notes,
.ndstyle #option,
.ndstyle #uallinfo,
.ndstyle #exit { background: url(../pic/chat-nash-dom-sprite.png) no-repeat; height: 25px; margin: 5px 0 0 14px !important; padding: 0 !important; }

.ndstyle #admin { width: 21px;  background-position: 0px 0px; }
.ndstyle #horos { width: 24px; background-position: -20px 0px; }
.ndstyle #dreambook { width: 24px; background-position: -20px 0px; }
.ndstyle #notes { width: 30px; background-position: -44px 0px; }
.ndstyle #option { width: 25px; background-position: -74px 0px; }
.ndstyle #uallinfo { width: 33px; background-position: -100px 0px; padding: 0 !important; }
#topblock.ndstyle a#exit { width: 47px; background-position: -134px 0px; margin: 0 0 0 18px !important; }
#topblock.ndstyle a:last-child { margin: 0 19px 0 0 !important; }

#topblock.ndstyle a:hover {
  animation: animationFramesMenu ease 1s;
  animation-iteration-count: 1;
  -webkit-animation: animationFramesMenu ease 1s;
  -webkit-animation-iteration-count: 1;
  -moz-animation: animationFramesMenu ease 1s;
  -moz-animation-iteration-count: 1;
  -o-animation: animationFramesMenu ease 1s;
  -o-animation-iteration-count: 1;
}


@keyframes animationFramesMenu {
  0% {
    left:0px;
    top:0px;
    opacity:1;
    transform:  rotate(0deg) scaleX(1) scaleY(1) ;
  }
  15% {
    left:-25px;
    transform:  rotate(-10deg) ;
  }
  30% {
    left:20px;
    transform:  rotate(6deg) ;
  }
  45% {
    left:-15px;
    transform:  rotate(-6deg) ;
  }
  60% {
    left:10px;
    transform:  rotate(4deg) ;
  }
  75% {
    left:-5px;
    transform:  rotate(-2deg) ;
  }
  100% {
    left:0px;
    top:0px;
    opacity:1;
    transform:  rotate(0deg) scaleX(1) scaleY(1) ;
  }
}



#id_youtube.tme { min-width: inherit !important; height: 593px !important; }
.tme { width: 315px !important; height: 564px !important; max-height: inherit !important; }

#id_youtube.shorts { min-width: auto; }
#id_youtube.shorts #video-placeholder-youtube { width: 282px; height: 500px; max-height: none; }
#video-placeholder-youtube { transition: all .7s ease; }

.nick-hidden { color: transparent; }


#vkAudioSearchOut.youtube-search ul { margin: 0px 0 0 0; }
#vkAudioSearchOut.youtube-search li { padding: 0 0 0 0; margin: 0 4px 0 4px; }

#vkAudioSearchOut.youtube-search li span { vertical-align: top; display: inline-block; text-decoration: underline; white-space: normal; width: 199px; margin: 0 3px 0 0; float: right; }

#vkAudioSearchOut.youtube-search li span:hover { text-decoration: none; }
#vkAudioSearchOut.youtube-search li span span { color: #9f9f9f; font-size: 10px; float: left; margin: 3px 0 0 0; text-decoration: none; }

#vkAudioSearchOut.youtube-search li:before { position: absolute; top: 0; width: 23px; text-align: right; margin: 0; }
.youtube-search li > img { width: 64px; height: 48px; margin: 3px 0 1px 4px; border: 1px solid rgb(255 255 255 / 52%); border-radius: 2px; }

#vkAudioSearchOut.youtube-search ul:first-of-type { margin-top: 4px; }

#vkAudioSearchOut.youtube-search .op-vk { margin: 0px 0 -7px 2px; }

#child-bots-knews-id a:link { color: #a2c1e7; }
#child-bots-knews-id a:visited { color: #8f8f8f !important; }
#child-bots-knews-id a:hover { color: #ffa739 !important; }
#online.adv #child-bots-knews-id a.preview { background-size: cover !important; }


.opshow { opacity: 1; transition: all .8s; }
.ophide { opacity: 0; transition: all .8s; }

.weather-sign.yellow { color: #ffd400; }
.weather-sign.white { color: #fff; }
.weather-sign.gray { color: #a0abd1; }
.weather-sign.lightBlue { color: #70abf5; }

span.dream-key-word { background: #525151; color: #fff; padding: 0 4px 0 4px; border-radius: 2px; margin: 0px 5px 0 0; cursor: pointer; display: inline-block; }
span.dream-key-word > i { color: #f19757; font-style: normal; }
span.dream-key-word:hover { background-color: #7e5555; }


#online.adv > div > a.preview { width: 30px; height: 30px; background-size: 100%; background-position: 50%; border-radius: 50%; display: inline-block; text-indent: -9999px; margin: 17px 9px -12px 2px; padding: 0; box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.15), -1px -1px 0 0 rgba(255, 255, 255, 0.2) inset; }
#online.adv > div > a:nth-child(2) { margin-top: 8px; }
#online.adv > div[id^="child-"] { padding-bottom: 11px; }
#online.adv #online_head { margin-top: -8px; }
#online.adv a.user { font: normal 15px/15px Whitney500; }
