@import url(_sprite-stack.css);

/* reset */
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, strong, sub, tt, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, button, textarea, input, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, footer, header {margin:0; padding:0; border:0; vertical-align:baseline; word-break:break-word}
*, ::after, ::before {box-sizing:border-box}
a, button, div, input, select, textarea, :focus, :active {outline:none}
ol, ul {list-style:none; display:block}
p {margin-bottom:10px}
caption, th, td {text-align:left; font-weight:normal; vertical-align:middle}
img {display:inline-block; border:none}

body {/* overscroll-behavior:none; */ cursor:default; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-touch-callout:none}
html, body {-webkit-text-size-adjust:none}

:root {
	--regular:'SFUIDisplay-Regular', 'Helvetica Neue', Roboto, sans-serif;
	--semibold:'SFUIDisplay-Semibold', 'Helvetica Neue', Roboto, sans-serif;
	--bold:'SFUIDisplay-Bold', 'Helvetica Neue', Roboto, sans-serif;

	--font-xs:12px;
	--font-sm:14px;
	--font-base:16px;
	--font-md:18px;
	--font-lg:20px;
	--font-xl:24px;
	--font-xxl:30px;

	--color-dark:#000;
	--color-header:#4182d3;
	--color-secondary:#7c7c7c;
	--color-primary:#178cf9;
	--color-success:#4fd964;
	--color-danger:#ff5656;
	--color-info:#ecf5fb;
	--color-light:#e6e6e6;
	--color-white:#fff;
	--color-elite:#ffbf00;
	--color-gray: #838383;

	--down_menu:0px; --down_inset:0px; --down_padding:0px;
	--height:100dvh;
}

/* sprite */
.sprite, .return::before, .captcha-box .refresh::before, .left-menu li::before, .burger::before, .dropdown::before, .btn-srch::before, .closer::before,
.count-photo::before, .location::before, .profile-box .title::before, .outbox .text-mess::before, .inbox .text-mess::before, .mess-blocked .text-mess::before,
.add-mess-box .btn-add-img::before, .btn-edit::before, .icon::before, .file-upload::before, .nav-tabs_payment span::before, .content-card-checkbox label::before,
.closser::before, .castom::before, .prop-castom label::before, .trend-list .file-upload::before, .advantages-premium li::before, .user-photo_round::before,
.check-list li::before, .down-menu div::before {background:url('sprite.svg?place-for-version') transparent no-repeat}

.icon-png {display:inline-block; background:url('sprite.png?place-for-version') no-repeat}
.heart {width:21px; height:18px; background-position:0px -27px}
.magic-wand {width:23px; height:22px; background-position:0px 0px}
.mask {width:24px; height:14px; background-position:-53px 0px}
.mess:not(li.mess):not(div.mess) {width:20px; height:20px; background-position:-28px 0px}
.emoji {vertical-align: bottom}

.left-menu .trend, .left-menu .views, .left-menu .symp {background-image:none}

/* grid */
html, body {min-height:var(--height); line-height:1; background:#fff}

.payment-contaner {position:absolute; left:0; right:0; min-height:var(--height); z-index:500}
.left-menu-box {width:100%; min-height:100%; position:fixed; left:0; top:0; bottom:0; z-index:2}
	.left-menu-box .wrap {height:100%; background:var(--color-header);}
.left-menu {height:100%; position:absolute; left:0; right:0; top:0; bottom:0; overflow-y:hidden; z-index:11; background: #f3f3f3;}

.main-content {min-height:var(--height); position:relative; z-index:15; margin-left:300px; width:calc(100% - 300px); background:#fff}
.main-content > div {will-change:transform; transform:translateZ(0); display:flex; flex-direction:column; min-height:var(--height); background:#fff}
.content {min-height:var(--height); overflow:hidden}
.content_unsubscr {min-height:calc(var(--height) - 44px - var(--down_padding))}

.header-box, .fixed-box {height:auto; left:0; right:0; top:0; z-index:15}
.app-popup {height:264px; background:#1e1f20; background:linear-gradient(to bottom, #1e1f20 0%,#386692 100%)}
.header-box {position:-webkit-sticky; position:sticky}
.fixed-box {width:100%; position:fixed}
.header-box_up {top:44px}

.header {height:44px; font-size:var(--font-md); color:#fff; text-align:center; position:relative; background:var(--color-header); border-radius:0px; transition:all .2s ease-out}
.header-title {line-height:44px}
	.header-title .to-els {display:inline-block}
	.header-title .long-title {max-width:96% !important; padding:0 10px}
.header-without-bg { background: transparent; }

.header.vip, .list-item.vip {background:#fdbb16 !important}
.vip .user-info .text, .vip .user-info .name {color:#fff}
.vip .user-info {border-top:solid 1px #fff !important}

.dlg-page, .dlg-modal {width:100%; height:100%; overflow-y:auto; position:fixed; left:0; top:0; z-index:100}
.dlg-modal {padding:16px; background:rgba(0,0,0,0.8)}
.dlg-page {padding:0}
.dlg-page-content {min-height:100%; position:relative; padding:44px 16px 16px}
.dlg-page-content.bg-grad {min-height:var(--height)}

.float-box {width:100%; max-width:343px; margin:0 auto}

.substrate {width:100%; height:100%; position:relative; z-index:12; margin-left:300px; background:#fff}

/* typography */
body {font-weight:normal; font-size:var(--font-base); line-height:1.375; font-family:var(--regular); color:var(--color-dark); -webkit-font-smoothing:antialiased}
textarea {resize:none; font-size:var(--font-base); font-family:var(--regular)}

.fmedium, .reg-data-list li > label, .left-menu a, .list .name, .alert,
.show-profile-list_self label, .profile-edit_me > li > label, .profile-edit_self label, .tags-list a,
.dropmenu-box .title, .dropmenu-list li, .elit-preference li, .nav-tabs_payment span, .nav-payment span, .feed-list .user-info,
.user-action, .content-trend .title, .premium-result .title, .blocking-chat .title1, .blocking-chat .title2,
.buttons-box .title, .name-row {font-family:var(--semibold)}

.fbold, .float-box_logon .reminder, .captcha-box_outer .title, .captcha .refresh, strong, .warning-title,
.profile-box .title, .item-album-name, .add-mess-box .btn-send-mess, .elit-title div, .payment-contaner .title div,
.count-bonus-up, .rules-subscr h6, .app-popup .title, .payment-wallet .title-row, .payment-wallet .coins-row, .firstpage-v1 label {font-family:var(--bold)}

a, a:hover {font-size:var(--font-base); text-decoration:none}

h2, .rules-subscr h6 {font-size:var(--font-md); margin-bottom:22px; padding-left:16px}
.rules-subscr h6 {font-size:var(--font-base); padding-left:0}

.fsize14, .fsize14 a {font-size:var(--font-sm)}

.cblue {color:var(--color-primary)}
.white {color:#f6f6f6}
.gray {color:var(--color-secondary)}

.bg-grad {background:#1e1f20; background:linear-gradient(to bottom, #1e1f20 0%, #386692 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e1f20', endColorstr='#386692',GradientType=0 )}
.bg-white {background:#fff}
.bg-lightblue, .content_result-up {background:#e8f4fb}

.lth_norm {font-weight:normal !important; text-decoration:line-through}
.to-els {overflow:hidden; -ms-text-overflow:ellipsis; text-overflow:ellipsis; white-space:nowrap}

.thumb {position:relative; flex-shrink:0; background-color:#ebeff1; border-radius:10px}
.thumb img {display:block; border-radius:10px; width:70px; height:70px}

/* captcha */
.captcha-box_outer {padding:0 25px 25px}
	.captcha-box_outer .title {height:64px; font-size:var(--font-md); line-height:64px; text-align:center}

.captcha-box {text-align:left; margin-bottom:24px}
	.captcha-box img {width:120px; height:50px}
	.captcha-box .refresh {display:inline-block; line-height:20px; color:#178cf9; position:absolute; right:25px; top:15px}
	.captcha-box .refresh:before {width:14px; height:14px; display:block; content:''; position:absolute; left:-22px; top:1px; background-position:-31px -60px}
	.captcha-box + .form-control {width:150px}

/* border radius */
.rds3, select, .textarea, .form-control, .tag-dropdown-input {border-radius:3px}
.rds5, .captcha-box_outer {border-radius:5px}
.mess-list .text-mess {border-radius:11px}
.rds15 {border-radius:15px}
.rds50pc, .mutual-sympathy li, .mutual-sympathy img, .mutual-sympathy:before {border-radius:50%}
.rds100, .badge {border-radius:100px}
.rds10, .badge {border-radius:10px}


/* buttons */
.pointer {cursor:pointer}
.btn-edit {width:44px; height:44px; float:right; position:absolute; right:10px; top:2px; cursor:pointer}
.btn-edit:before {width:18px; height:18px; display:block; content:''; position:absolute; left:13px; top:13px; background-position:-30px -240px}
.btn-edit-active:before {background-position:-50px -240px}
.btn-edit-block {position:absolute; left:0; right:0; top:0; bottom:0; cursor:pointer; z-index:5}
.btn-like, .btn-dislike {width:60px; height:60px; display:block; -webkit-filter:drop-shadow(0px 0px 7px gray); filter:drop-shadow(0px 0px 7px gray)}
.btn-like {background-position:0 -120px; cursor:pointer}
.btn-like.active{background-color:#10fe6a80;border-radius:50px}
.btn-dislike {background-position:-80px -120px; cursor:pointer}
.btn-dislike.active {background-color:#fe101080;border-radius:50px}
.btn-mess {width:76px; height:76px; background-position:-161px -120px; cursor:pointer; -webkit-filter:drop-shadow(0px 0px 7px gray); filter:drop-shadow(0px 0px 7px gray)}
.btn-srch {width:44px; height:44px; position:absolute; cursor:pointer}
.btn-srch:before {width:20px; height:19px; display:block; content:''; position:absolute; left:12px; top:12px; background-position:-50px -60px}
.btn-elit {width:270px}
.btn-account span {color:#fff; border-bottom:solid 1px #90acc7; text-transform:none}

/* new buttons */

.btn {display:inline-block; text-align:center; text-decoration:none; border:0; background:transparent; cursor:pointer}

.btn-big { height: 52px; font-family:var(--semibold); font-size:var(--font-base); line-height:52px; padding:0 30px; border-radius:30px; }
.btn-lg {height:44px; font-family:var(--semibold); font-size:var(--font-base); line-height:44px; padding:0 16px; border-radius:10px}
.btn-md {height:36px; font-family:var(--semibold); font-size:var(--font-sm); line-height:34px; padding:0 10px; border-radius:6px}
.btn-sm {height:30px; font-family:var(--regular); font-size:var(--font-sm); line-height:30px; padding:0 10px; border-radius:5px}
.btn-link-lg {font-size:var(--font-base)}
.btn-link-md {font-size:var(--font-sm)}

.btn-success {color:var(--color-white); background:var(--color-success)}
.btn-primary {color:var(--color-white); background:var(--color-primary)}
.btn-danger {color:var(--color-white); background:var(--color-danger)}
.btn-light {color:var(--color-dark); background:var(--color-white)}
.btn-link-primary {font-family:var(--regular); color:var(--color-primary)}
.btn-link-secondary {font-family:var(--regular); color:var(--color-secondary)}
.btn-gray { color: var(--color-white); background: rgba(255, 255, 255, 0.15); }

.btn-outline-dark {font-family:var(--regular); color:var(--color-dark); border:1px solid #bdbdbd; border-radius:100px; background:transparent}
.btn-outline-success {color:var(--color-success); border:1px solid var(--color-success); background:#fff}
.btn-outline-primary {color:var(--color-primary); border:1px solid var(--color-primary); background:#fff}
.btn-outline-white {color:var(--color-white); border:1px solid var(--color-white)}

.btn-default {color:var(--color-primary); border:1px solid var(--color-primary); background:#fff} /* no logon user */
.btn-link {color:var(--color-primary)} /* no logon user */

.btn-payment {width:100%; max-width:335px}

.btn-primary_rambler, .btn-success_rambler {width:260px; height:50px; font-size:var(--font-sm) !important; line-height:50px; letter-spacing:1.4px; font-family:'robotobold', sans-serif; color:#fff; text-transform:uppercase; margin:0 auto}
.btn-primary_rambler {background:#315efb; margin-bottom:15px}
.btn-success_rambler {background:#00baad}

.btn-vipchat {display:flex; justify-content:center; align-items:center; color:#fff; background:linear-gradient(90deg, #ff9246 0.34%, #fdbc15 100%)}
	.btn-vipchat .icon-stack {margin-right:8px}

/* switcher */
.switcher-row {max-width:320px; height:45px}
.switch {width:50px; height:29px; display:inline-block; margin-left:auto; cursor:pointer}
	.switch input {display:none !important}
	.switch .slider {position:absolute; left:0; right:0; top:0; bottom:0; background-color:var(--color-light); border-radius:29px; transition:all .3s ease-out}
	.switch .slider::before {height:25px; width:25px; display:block; content:''; position:absolute; left:2px; top:2px; border-radius:50%; background-color:#fff; transition:all .3s ease-out}
	.switch input:checked + .slider {background-color:var(--color-success)}
	.switch input:checked + .slider::before {transform:translateX(21px)}

.badge {min-width:25px; height:23px; display:block; font-size:var(--font-sm); line-height:24px; color:#fff; text-align:center; white-space:nowrap; padding:0 7px; background-color:var(--color-danger)}

.album-photo-add {width:130px; height:130px; position:relative; overflow:hidden}
.file-upload {position:absolute; left:0; right:0; top:0; bottom:0; background:#2b73bb}
.file-upload:before {width:42px; height:39px; display:block; content:''; position:absolute; left:calc(50% - 21px); top:30px; background-position:-191px -260px}
	.file-upload input[type="file"] {opacity:0}
	.file-upload .btn-name {font-size:var(--font-xs); color:#fff; text-align:center; position:absolute; left:0; right:0; bottom:25px}

.logo-sm, .apple, .google {display:inline-block; position:relative; top:3px; margin-right:11px}
.logo-sm {width:21px; height:20px; background-position:-111px -672px}
.apple {width:18px; height:23px; background-position:-80px -672px}
.google {width:18px; height:19px; background-position:-40px -749px}

.click-zone {width:44px; height:44px; display:flex; position:absolute; cursor:pointer}
	.click-zone span, .click-zone svg, .click-zone i {margin:auto}
.closer-row .click-zone {position:relative; margin:0 0px 0 auto}
.cross-gray {width:17px; height:17px; display:block; margin:auto; background-position:-140px -710px}

/* display */
.block, .show, .link-block {display:block}
.in-block {display:inline-block}
.hide, .nobr br {display:none !important}

.width-100p {width:100%}
.transition {transition:all 0.2s ease-out}

/* dropdown */
.fixed-box-dropdown {top:auto; bottom:0}
.dropmenu-box {position: relative; width:100%; max-width:480px; min-height: 50px; margin:0 auto;  padding: 0 28px calc(var(--down_inset)); border-radius:10px 10px 0 0; background:#2b73bb; }
	.dropmenu-box .title {color:#cbdef7; text-align:center; margin-bottom:4px; padding:16px 30px 0}
.dlg-page .dropmenu-box {background: #fff; max-width: 800px; border-radius:10px 10px 0 0;}
.dropmenu-list {padding-bottom:16px}
	.dropmenu-list li { padding-top: 1px; }
		.dropmenu-list li > div { width: 100%; height: 50px; display: flex; align-items: center; color: #fff; margin: 4px 0 5px; padding-left: 10px; border-radius: 6px; transition: background 0.2s ease-in; }
	.dropmenu-list li > div:active, .dropmenu-list li > div:hover { background: #3185d8; }

	.dropmenu-list .item-cancel { position: relative; }
	.dropmenu-list .item-cancel:before { height: 1px; display: block; content: ''; position: absolute; left: 0; right: 0; top: 0; background: #797399; }

	.dropmenu-list.bb li > div{border-bottom:solid 1px #eee}

.list-box {border:solid 1px #ccc; background-color:#fff; opacity:0.98; height:200px; line-height:22px; overflow-y:auto; -webkit-overflow-scrolling:touch}
	.list-box > div {border-bottom:solid 1px #ccc; padding:10px}
	.list-box > div:hover {background-color:#eaeaea}

/* icons */
.icon {width:44px; height:44px; display:block}
.icon-arrow-right {width:7px; height:14px; display:block; position:absolute; right:16px; top:19px; background-position:-231px -89px}
.icon-elite {width:38px; height:38px; background-position:-100px -360px}
.icon-up {width:38px; height:47px; background-position:-200px -310px}

/* left, right, position, clearfix */
.text-center {text-align:center !important}
.text-right {text-align:right}
.text-left {text-align:left}
.text-jastify {text-align:justify}

.pos-abs {position:absolute}
.pos-rel, #pull-control {position:relative}
.pos-fixed {position:fixed; left:0; right:0; top:0; bottom:0; z-index:1}
.cflex {display: flex; flex-direction: column}

#pull-control.pull_up {height:27px; margin-top:-27px}
#pull-control.pull_dwn {height:27px; margin-bottom:-27px}

.fl {float:left}
.fr {float:right}

.clearfix:before, .clearfix:after,
.profile-edit_me > li:before, .profile-edit_me > li:after {display:table; content:''}
.clearfix:after,
.profile-edit_me > li:after {clear:both}

/* list */
.default-list {margin-bottom:20px; padding-left:17px}
	.default-list li + li {margin-top:5px}
ul.default-list li {list-style-type:disc; overflow:hidden}
ol.default-list li {list-style-type:decimal; overflow:hidden}

.list li {overflow:hidden; will-change:transform; transform:translateZ(0)}
	.list .list-item {position:relative; z-index:5; padding-left:10px; min-height:90px; background:#fff; display:flex}
.list .thumb {height:70px; width:70px; margin:10px 0}
.list .user-info {margin-left:15px; padding:10px 10px 10px 0; border-top:solid 1px #ccc; min-width:0px; flex-grow:1}
	.list li:first-child .user-info {border-top:0}
.list .contact-del {font-size:var(--font-sm); color:var(--color-secondary); clear:both}
.list .heading {margin-bottom:11px; display:flex; align-items:baseline}
	.list .heading .verified-icon { width: 16px; height: 16px; position: relative; top: 2px; margin-right: 6px; }
.list .name {font-size:var(--font-base); margin-right:8px; display:inline-flex}
.list .date {font-size:var(--font-xs); color:var(--color-secondary); justify-content:flex-end; display:flex; flex-grow:1}
.list .text {max-width:85%; height:24px; display:inline-block; font-size:var(--font-sm); color:var(--color-secondary)}
.list .badge {position:relative; top:-4px}
.list .del-box {width:90px; display:block; font-size:var(--font-md); color:#fff; line-height:90px; text-align:center; position:absolute; top:0; right:0; bottom:0; z-index:1; background:#ff3b30; cursor:pointer}
.list .sel-box, .list-tile .sel-box {position:absolute; z-index:100; height:100%; width:100%; top:0; left:0; display:none; background-color:#2b73bb}

.list-tile {position:relative}
	.list-tile li {margin:5px}
	.list-tile li > div {position:relative}
	.list-tile li > div img {width:170px; border-radius:10px; display:block}
	.list-tile .item-img, .list-tile .upload-img {width:130px; height:auto; display:block}
	.list-tile.flex-parent {justify-content:space-around; align-content: space-around;}
	.list-tile.flex-parent.fs {justify-content:flex-start; align-content:flex-start; align-items:flex-start}

.list-tile-info li > div.select:after {width:20px; height:20px; content:''; top:3px; right:3px; position:absolute; z-index:1; background-color:#178cf9; border-radius:10px}

.list-tile-info .name {font-size:var(--font-sm); color:#fff; position:absolute; left:6px; right:20px; top:4px; text-shadow:1px 1px 1px #000}
.list-tile-info .online-icon {position:absolute; right:6px; top:7px; /*filter:drop-shadow(0px 0px 3px #0006);*/}
.list-tile-info.s160 li {height:170px; width:170px; will-change:transform; transform:translateZ(0); border-radius:10px; background:#2e4358}

.frame-elite, .frame-elite_round:before {border:solid 2px var(--color-elite); border-radius:10px}
.frame-elite_round:before {display:block; content:''; position:absolute; left:0; right:0; top:0; bottom:0;}

.item-album-name {width:100%; height:48px; line-height:48px; color:#333844}
	.item-album-name h2 {margin-bottom:0}
.list-tile .item-nophoto {width:100%; padding-top:54px; position:absolute; left:0; top:0; bottom:0; z-index:2; margin:0; background:#25323e; background:linear-gradient(to bottom, #25323e 0%,#386692 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#25323e', endColorstr='#386692',GradientType=0 )}
	.item-nophoto .pcamera {width:118px; height:91px; display:block; margin:0 auto 30px}
	.item-nophoto .text {color:#8d9093}
		.item-nophoto .text span {display:block; font-size:var(--font-lg); color:#fff; margin-bottom:15px}
	.item-nophoto .file-upload {width:280px; height:45px; display:block; position:relative; left:auto; top:auto; margin:23px auto 0; background-color:transparent}
	.item-nophoto .file-upload:before {display:none}
		.item-nophoto .file-upload input {width:280px; height:45px; display:block; position:absolute; left:0; top:0; cursor:pointer}
		.item-nophoto .file-upload .btn {width:100%}

.blocklist {padding:34px 16px 24px}
	.blocklist .else {padding:10px 0 11px}
.blocklist-title {font-size:var(--font-lg); line-height:24px}
.blocklist .thumb {margin:10px 5px}
.blocklist-text {padding:10px 0 22px}

@-webkit-keyframes typing {
  to { -webkit-clip-path: inset(0 -1ch 0 0); clip-path: inset(0 -1ch 0 0) }
}

@keyframes typing {
  to { -webkit-clip-path: inset(0 -1ch 0 0); clip-path: inset(0 -1ch 0 0) }
}

.chat-typing {color:#3095d4;}
.chat-typing::after {content:'...'; display:inline-block; font-family: monospace; font-size: 10px; -webkit-clip-path: inset(0 3ch 0 0); clip-path: inset(0 3ch 0 0); -webkit-animation: typing 1s steps(4) infinite; animation: typing 1s steps(4) infinite}
.selected #chat_typing, .vip #chat_typing {color:#fff}
.header-user-info #chat_typing {padding-top: 3px;font-size: var(--font-sm); color:#fff; clear: both}

/* margin & padding */
.ma {margin:auto}
.m0a {margin:0 auto}
.mb8 {margin-bottom:8px}
.mb10 {margin-bottom:10px !important}
.mb11 {margin-bottom:11px}
.mb16 {margin-bottom:16px}
.mb20 {margin-bottom:20px}
.mb26 {margin-bottom:26px}
.mb30 {margin-bottom:30px !important}
.mt8 {margin-top:8px !important}
.mt24 {margin-top:24px !important}
.ml44 {margin-left:44px}
.mr25 {margin-right:25px}
.pad0 {padding:0 !important}
.pt0 {padding-top:0 !important}
.pad-lr16 {padding:0 16px}
.pt14 {padding-top:14px !important}
.pt25 {padding-top:25px}


/* form */
.form-control, .tag-dropdown-input {width:100%; max-width:350px; font-family: var(--regular); font-size:var(--font-base); color:#26242c; padding:6px 10px; border:solid 1px #ccc; background:#fff}
.form-control_reg {width:100%; height:48px; font-size:var(--font-base); line-height:48px; color:#787979; text-align:right; position:relative; padding:0 16px; border:none; background:#fff}
.form-control_add-mess {height:40px; max-width:unset; padding:11px 9px 5px 45px; border:solid 1px #dfdfe2; border-radius:11px; transition:height 0.3s ease-in-out}
.form-control_age {width:70px}
.form-control_day, .form-control_year {width:80px}
.form-control_month {width:110px; margin:0 5px}
.form-control_textarea {line-height:20px}
.form-control_amount {max-width:420px; padding:6px 4px 7px}
.form-control_num {width:150px; padding:7px 10px 5px}
.form-control_payment {max-width:420px; display:block; margin:0 auto 30px}
.form-control_city {position:relative}

.radio, input[type="radio"], input[type="checkbox"] {display:inline-block; margin:0 5px 0 10px}
input[type="radio"]:first-child, input[type="checkbox"]:first-child {margin-left:0}

.paycard_cloudp {width:100%; max-width:490px; height:366px; margin:0 auto; border:none}
.select-tariff {max-width:470px; display:block; margin:0 auto 20px}
.iframe-card {display:flex; flex-direction:column; height:100%}

/* flex */
.flex, .flex-parent, .flex-stretch, .center, .mess-list .gifts-list li, .trend-list .user-info {display:flex}
.flex-parent {flex-flow:row wrap; justify-content:space-between; align-content:space-between}
.flex-stretch {flex-flow:row nowrap; align-items:stretch}
.flex-center { display: flex; align-items: center; justify-content: center; }
.center {justify-content:center; align-items:center}
.ai-center, .mess-list .gifts-list li, .trend-list .user-info {align-items:center}
.content-box, .flex-space {flex-grow:1; z-index:1; padding-bottom:var(--down_padding)}

.jc-center {justify-content:center}
.jc-between {justify-content:space-between}

/* animation */
/*.main-content > div {filter:drop-shadow(rgba(0, 0, 0, 0.7) 0px 0px 4px)}*/
.suspend {position:fixed; z-index:100; top:0; left:300px; width:calc(100vw - 300px); height:var(--height)}
	.suspend #scroll_content {height:100%;overflow-y:hidden}
	.suspend .mess-list, .suspend .has-tabs-menu .view-list {margin-bottom:88px}
	.suspend .view-list {margin-bottom:44px}
	.suspend .profile-carousel-out {position:initial}
	.suspend .header {border-radius:10px 10px 0px 0px}
	.suspend .datetime {display:none !important}

@-webkit-keyframes curr_view {
	from {transform:translate3d(calc(100%),0,0)}
	to {transform:translate3d(0,0,0)}
}

@keyframes curr_view {
	from {transform:translate3d(calc(100%),0,0)}
	to {transform:translate3d(0,0,0)}
}

@-webkit-keyframes prev_view {
	from {transform:translate3d(0,0,0)}
	to {transform:translate3d(-30px,0,0)}
}

@keyframes prev_view {
	from {transform:translate3d(0,0,0)}
	to {transform:translate3d(-30px,0,0)}
}

@-webkit-keyframes blackout {
	from {background-color:rgba(0,0,0,0)}
	to {background-color:rgba(0,0,0,0.8)}
}

@keyframes blackout {
	from {background-color:rgba(0,0,0,0)}
	to {background-color:rgba(0,0,0,0.8)}
}

@-webkit-keyframes visible {
	from {opacity:0; transform:scale(0.95); visibility:hidden}
	to {opacity:1; transform:scale(1); visibility:visible}
}

@keyframes visible {
	from {opacity:0; transform:scale(0.95); visibility:hidden}
	to {opacity:1; transform:scale(1); visibility:visible}
}

@-webkit-keyframes curr_view2 {
	from {opacity:0;transform:translate3d(0,150px,0)}
	30% {opacity:1;transform:translate3d(0,100px,0)}
	to {opacity:1;transform:translate3d(0,0,0)}
}

@keyframes curr_view2 {
	from {opacity:0;transform:translate3d(0,150px,0)}
	30% {opacity:1;transform:translate3d(0,100px,0)}
	to {opacity:1;transform:translate3d(0,0,0)}
}

@-webkit-keyframes prev_view2 {
	from {transform:scale(1)}
	to {transform:scale(0.93)}
}

@keyframes prev_view2 {
	from {transform:scale(1)}
	to {transform:scale(0.93)}
}

@-webkit-keyframes hidden {
	from {opacity:1; visibility:visible}
	to {opacity:0; visibility:hidden}
}

@keyframes hidden {
	from {opacity:1; visibility:visible}
	to {opacity:0; visibility:hidden}
}

@-webkit-keyframes scale {
	from {transform:scale(1); opacity:1}
	to {transform:scale(2); opacity:0.3}
}

@keyframes scale {
	from {transform:scale(1); opacity:1}
	to {transform:scale(2); opacity:0.3}
}

@-webkit-keyframes opacity {
	from {opacity:0.2}
	to {opacity:0.7}
}

@keyframes opacity {
	from {opacity:0.2}
	to {opacity:0.7}
}

@-webkit-keyframes rotation {
	from {transform:rotate(0deg)}
	to {transform:rotate(359deg)}
}

@keyframes rotation {
	from {transform:rotate(0deg)}
	to {transform:rotate(359deg)}
}

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

@keyframes rotate_down {
	from {transform:rotate(0deg)}
	to {transform:rotate(180deg)}
}

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

@keyframes rotate_up {
	from {transform:rotate(180deg)}
	to {transform:rotate(0deg)}
}

@-webkit-keyframes block_up {
	from {opacity:0.2; transform:translate3d(0,-40px,0); }
	to {opacity:1; transform:translate3d(0,0,0); }
}

@keyframes block_up {
	from {opacity:0.2; transform:translate3d(0,-40px,0); }
	to {opacity:1; transform:translate3d(0,0,0); }
}

@-webkit-keyframes block_down {
	from {opacity:0.2; transform:translate3d(0,40px,0); }
	to {opacity:1; transform:translate3d(0,0,0); }
}

@keyframes block_down {
	from {opacity:0.2; transform:translate3d(0,40px,0); }
	to {opacity:1; transform:translate3d(0,0,0); }
}

@-webkit-keyframes none {
	from {opacity:1; display:block}
	to {opacity:0; display:none}
}

@keyframes none {
	from {opacity:1; display:block}
	to {opacity:0; display:none}
}

@-webkit-keyframes brightness_on {
	from {-webkit-filter:brightness(0.3);filter:brightness(0.3)}
	to {-webkit-filter:brightness(1);filter:brightness(1)}
}

@keyframes brightness_on {
	from {-webkit-filter:brightness(0.3);filter:brightness(0.3)}
	to {-webkit-filter:brightness(1);filter:brightness(1)}
}

.remove_anim {
  -webkit-animation:none !important;
          animation:none !important;
}

.curr_view_anim{
	animation-name:curr_view;
	-webkit-animation-name:curr_view;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
}

.prev_view_anim{
	animation-name:prev_view;
	-webkit-animation-name:prev_view;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
}

.blackout_anim{
	animation-name:blackout;
	-webkit-animation-name:blackout;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
}

.visible_anim{
	animation-name:visible;
	-webkit-animation-name:visible;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-out;
	-webkit-animation-timing-function:ease-out;
	visibility:visible;
}
.visible_anim .header {border-radius:10px 10px 0px 0px}

.curr_view2_anim{
	animation-name:curr_view2;
	-webkit-animation-name:curr_view2;
	animation-duration:0.4s;
	-webkit-animation-duration:0.4s;
	animation-timing-function:ease-out;
	-webkit-animation-timing-function:ease-out;
}

.prev_view2_anim{
	animation-name:prev_view2;
	-webkit-animation-name:prev_view2;
	animation-duration:0.4s;
	-webkit-animation-duration:0.4s;
	animation-timing-function:ease-out;
	-webkit-animation-timing-function:ease-out;
}

.hidden_anim{
	animation-name:hidden;
	-webkit-animation-name:hidden;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
	visibility:hidden;
}

.scale_anim{
	animation-name:scale;
	-webkit-animation-name:scale;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
}

.opacity_anim{
	animation-name:opacity;
	-webkit-animation-name:opacity;
	animation-duration:0.8s;
	-webkit-animation-duration:0.8s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
	display:block !important;
}

.rotation_anim{
	animation-name:rotation;
	-webkit-animation-name:rotation;
	animation-duration:2s;
	-webkit-animation-duration:2s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
	animation-iteration-count:infinite;
	-webkit-animation-iteration-count:infinite;
}

.rotate_down_anim div {
	animation-name:rotate_down;
	-webkit-animation-name:rotate_down;
	animation-duration:0.2s;
	-webkit-animation-duration:0.2s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
	transform:rotate(180deg);
}

.rotate_up_anim div {
	animation-name:rotate_up;
	-webkit-animation-name:rotate_up;
	animation-duration:0.2s;
	-webkit-animation-duration:0.2s;
	animation-timing-function:linear;
	-webkit-animation-timing-function:linear;
	transform:rotate(0deg);
}

.block_up_anim{
	animation-name:block_up;
	-webkit-animation-name:block_up;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-out;
	-webkit-animation-timing-function:ease-out;
}

.block_down_anim{
	animation-name:block_down;
	-webkit-animation-name:block_down;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-out;
	-webkit-animation-timing-function:ease-out;
}

.none_anim{
	animation-name:none;
	-webkit-animation-name:none;
	animation-duration:0.3s;
	-webkit-animation-duration:0.3s;
	animation-timing-function:ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
	display:none;
}

.brightness_on_anim{
	animation-name:brightness_on;
	-webkit-animation-name:brightness_on;
	animation-duration:0.5s;
	-webkit-animation-duration:0.5s;
	animation-timing-function:ease-in-out;
	-webkit-animation-timing-function:ease-in-out;
}

.anim_rev{animation-direction:reverse}

/*
cubic-bezier(.2,.48,.59,1.19)
cubic-bezier(.2,.48,.3,1.2)
*/

/* pop-up */
.app-popup {text-align:center}
	.app-popup .title {font-size:var(--font-md); line-height:1.5; color:#fff; text-transform:uppercase; padding:48px 0 9px}
	.app-popup .logo {width:207px; height:39px; display:block; margin:0 auto 29px}
	.app-popup .btn {width:283px; margin:0 auto}
.sticker-free {width:85px; height:87px; position:absolute; left:0; top:0}

/* warning */
.warning-box {height:auto; font-size:var(--font-sm); color:#fff; text-align:left; position:fixed; left:0; right:0; top:0; z-index:500; background:#1e1f20}
	.warning-box .wrap {padding:16px 25px 20px}
.warning-title {margin-bottom:10px}
.warning-txt {position:relative; padding-left:10px}
.warning-txt:before {content:'•'; position:absolute; left:0; top:0}

.warning-box-sticky {z-index:999; position:-webkit-sticky; position:sticky; top:44px}

.notify-container {width:100%; font-size:var(--font-sm); color:#fff; position:fixed; left:0; top:0; z-index:999}
.notify-box {padding:16px; background:#1e1f20}
.notify-box .thumb {width:50px; height:50px; display:block; float:left}
	.notify-box .thumb img {width:50px; height:50px}
.notify-box .user-info {font-size:var(--font-sm); color:#fff; display:block; margin-left:65px}
.notify-box .name {display:block; color:#76bdff; margin-bottom:5px}
.notify-box .user-info > div {min-height:20px}
.notify-box .closer {width:55px; height:55px}
	.notify-box .closer:before {transform:scale(1.6)}

.alert-success {color:#288619; position:absolute; left:0; right:0; top:44px; padding:15px 80px 16px; background:#d2e9c3}

.closer {width:44px; height:44px; display:block; position:absolute; right:0; top:0; cursor:pointer}
.closer:before {width:12px; height:12px; display:block; content:''; position:absolute; left:50%; top:50%; z-index:501; margin:-6px 0 0 -6px; background-position:-211px -90px}

.apprambler-container {padding:0}
.apprambler-box {padding:15px 20px 9px; border:solid 1px #e8e8e8; border-width:1px 0; background:#f2f2f2}
	.apprambler-box .thumb {width:70px; height:70px; display:block; float:left}
		.apprambler-box .thumb img {width:100%; height:100%; border-radius:0}
	.apprambler-box .closer {font-size:var(--font-xxl); line-height:44px; color:#818181; text-align:center; z-index:10}
	.apprambler-box .closer:before {display:none}

.app-info {display:block; color:#000; margin-left:85px}
	.app-info img {width:82px; height:14px; display:block; margin-bottom:6px}
	.app-info .title {font-size:var(--font-md); display:block; padding-right:30px}
	.app-info .maker {font-size:var(--font-sm)}
	.app-info .invait-download span {text-transform:uppercase}
	.app-info .view {font-size:var(--font-md); color:#0070bc; right:20px; top:40px}

.loader-dark, .loader-light {width:30px; height:30px; margin:20px auto}
.loader-dark {background:url('loader-dark.png?place-for-version') no-repeat center}
.loader-light {background:url('loader-light.png?place-for-version') no-repeat center}
.pull-ctrl {width:22px; height:27px; position:absolute; left:calc(50% - 11px); bottom:10px; background-position:0 -240px}

/*----- HEADER -----*/

.burger, .return, .dropdown, .closser {width:44px; height:44px; display:none; position:absolute; left:5px; top:0; cursor:pointer}
	.burger:before {width:22px; height:16px; content:''; position:absolute; left:11px; top:14px; background-position:-81px -60px}
	.burger .badge {position:absolute; top:2px; left:25px; font-size:var(--font-xs); white-space:nowrap}
.return, .dropdown, .closser {display:block}
	.return:before {width:22px; height:22px; content:''; position:absolute; left:10px; top:11px; background-position:-1px -60px}
.dropdown, .closser {left:auto; right:0}
	.dropdown:before {width:4px; height:18px; content:''; position:absolute; left:20px; top:14px; background-position:-231px -60px}
	.closser:before {width:14px; height:14px; content:''; position:absolute; left:15px; top:14px; background-position:-201px -400px}
.header-btn-srch {position:absolute; right:3px; top:0}

.header-thumb {width:40px; height:40px; float:left; position:relative; top:2px; margin-right:10px}
.header-thumb img {width:40px; height:40px}

.header-user-info {line-height:14px; float:left; padding-top:6px}
	.header-user-info .name {height:17px; line-height:20px; float:left}
	.header-user-info .lastvisit {font-size:var(--font-sm); clear:both; padding-top:3px}
	.header-user-info .online-icon {margin-right:5px}
	.vip .header-user-info .online {color:#FFF}
	.header-user-info .online {color:#18DE3A}

/* tabs menu */
.tabs-menu {width:100%; height:44px; position:relative; background:var(--color-header);}
.nav-tabs {padding:0 6px; position:relative; display:flex}
.nav-tabs li {cursor:pointer; flex-grow:1}
.nav-tabs span {height:44px; display:block; line-height:44px; text-align:center; color:#fff;}
.nav-tabs .active span {color:#fff}
.sel-tab-container {width:100%; height:44px; position:absolute}
	.sel-tab-container > div {
		width:0; height:4px; position:absolute; left:0; bottom:0; background:#18de3a;
		transition:left 0.3s ease-in-out, width 0.3s ease-in-out;
	}
.tabs-menu-profile {width:65%; margin:0 auto}
.tabs-menu_payment {height:84px}
.nav-tabs_payment li {width:33%}
.nav-tabs_up li {width:50%}
.nav-tabs_payment span {height:84px; font-size:var(--font-base); line-height:122px; position:relative}
.nav-tabs_payment span:before {height:31px; display:block; content:''; position:absolute; left:50%; top:14px; opacity:0.5}
	.nav-tabs_payment .active span:before {opacity:1}
	.nav-tabs_payment .ico-card:before {width:30px; margin-left:-15px; background-position:-171px -360px}
	.nav-tabs_payment .ico-phone:before {width:21px; margin-left:-10px; background-position:-141px -360px}
	.nav-tabs_payment .ico-subscr:before {width:29px; margin-left:-15px; background-position:-210px -360px}

/*----- SIDEBAR -----*/

.left-menu li { height: 52px; display: flex; align-items: center; position: relative; padding-left: 24px; }
/*.left-menu li:after { height:1px; display:block; content:''; position: absolute; left: 75px; top:0; right: 16px; background: #3f5469; }*/
	.left-menu li > div { width: 254px; display: flex; align-items: center; position: relative; }
	.left-menu li .icon-stack { margin-right: 22px; }
.left-menu .myprofile-link { line-height: 20px; padding-left: 14px; }
.left-menu div, .left-menu a { color: #000; cursor: pointer; }
.left-menu .badge { height: 22px; font-size: var(--font-xs); line-height: 22px; margin-left: auto; padding: 0 6px; }
.left-menu .full-version:before { display: none; }
	.left-menu .full-version a { font-size: var(--font-sm); color: #576879; text-decoration: underline; }

.myprofile-link:after {display:none}
	.myprofile-link span { font-size: var(--font-sm); color: var(--color-secondary); }
	.myprofile-link .img-link { margin-right: 14px; }
		.myprofile-link .img-link img {display:block}
	.myprofile-link .setting {width:22px; height:22px; display:block; content:''; position:absolute; left:258px; top:19px; background-position:0 -90px}

.sel-menu-container {width:100%; height:100%; position:absolute; left:0; top:0}
	.sel-menu-container > div { width: 100%; height: 59px; position: absolute; left: 0; top: 1px; background: var(--color-light); transition: top 0.3s ease-in-out, height 0.3s ease-in-out; transform: translateZ(0); }

.partner-counter-box {width:1px; height:1px; position:absolute; left:-999px}

/* DOWN MENU */
.down-menu-box{position:fixed; bottom:0px; background-color:#fff; min-height:unset; width:100%; z-index:16; display:none}
	.down-menu{display:flex; justify-content:space-evenly; height:var(--down_menu); padding-bottom:var(--down_padding)}
	.down-menu > div {width:70px; height:var(--down_menu); position:relative}
	.down-menu > div:before {width:26px; height:26px; display:block; content:''; position:relative; left:50%; top:50%; transform:translate(-50%, -50%)}
	.down-menu .meet:before {background-position:-90px -749px}
	.down-menu .mess:before {background-position:-120px -749px}
	.down-menu .search:before {background-position:-219px -710px}
	.down-menu .profile:before {background-position:-60px -749px}
	.down-menu .other:before {background-position:-150px -744px}

.down-menu .badge {height:auto; font-size:var(--font-xs); line-height:20px; letter-spacing:-0.21px; position:absolute; right:8px; top:9px; padding-left:3px; padding-right:3px; left:unset}

/*----- CONTENT -----*/

.delimiter {padding:0 6px}

.logout-container, .logout-container_rambler {min-height:var(--height); position:relative; padding:16px; background:url('bg_main.jpg') #386692 repeat-x center top}
.logout-container_rambler {background:url('bg_main_rambler.jpg') #bc205f no-repeat center top; background-size:cover}
	.logout-container .logo-box {width:224px; display:inline-flex; justify-content:center; align-items:center}
	.logout-container .logo {width:auto; max-width:224px; height:auto}
	.logout-container .logo-lp { width: 170px; height: 30px; }
	.logout-container .logo-rambler {width:236px; height:auto; margin-bottom:50px}
	.logout-container :is(.btn-primary, .btn-light) {margin-bottom:16px}
	.logout-container .title { font-family: var(--bold); font-size: var(--font-md); line-height: 1.5; color: #fff; }
	.logout-container .btn-big { display: block; }
	.logout-container .text-link, .float-box_logon .text-link { line-height: 1.375; color: #fff; text-decoration: none; }

.soc-btn {padding:94px 0 29px}
	.soc-btn ul {display:flex; justify-content:center}
	.soc-btn li {width:55px; height:55px; float:left}
	.soc-btn li + li {margin-left:13px}
	.soc-btn a, .soc-btn .soc-more {height:55px; display:block}
	.soc-btn .wk {background-position:-1px 0}
	.soc-btn .fb {background-position:-62px -1px}
	.soc-btn .ok {background-position:-60px -820px}
	.soc-btn .mail {background-position:-1px -820px}
	.soc-btn .inst {background-position:-123px 0}
	.soc-btn .soc-more {background-position:-185px 0; cursor:pointer}
.soc-btn-en ul {width:123px}

.add-social {padding:0 28px}
body:has(.warning-cookie) .add-social { padding-bottom: 50px; }
body:has(.warning-cookie[hidden]) .add-social { padding-bottom: 0; }
	.add-social .title {color:rgba(255, 255, 255, 0.6)}
	.add-social li { height:60px; }
		.add-social li + li {border-top:solid 1px rgba(255, 255, 255, 0.3)}
		.add-social li > div {margin-left:0}
	.add-social a {display:flex; align-items:center; color:#fff; width: 100%; height: 100%}
	.add-social .ok {width:14px; height:24px; display:inline-block; margin:0 13px 0 4px; background-position:-205px -580px}
	.add-social .mail {width:22px; height:22px; display:inline-block; margin-right:9px; background-position:-143px -672px}
	.add-social .yandex {width:12px; height:18px; display:inline-block; margin:0 17px 4px 6px; background-position:-230px -592px}
	.add-social .google-sm {width:18px; height:18px; display:inline-block; margin:0 13px 0 5px; background-position:-30px -880px}
	.add-social .apple {width:18px; height:22px; display:inline-block; top:0; margin:0 13px 0 5px; background-position:-1px -880px}

.sprite *{background:url('sprite.svg?place-for-version') no-repeat center top}
.social { gap: 20px; margin: 0 auto 30px; }

.float-box_logon .btn, .float-box_reg .btn {width:100%; display:block; margin-bottom:11px}
.float-box_logon .reminder {font-size:var(--font-base); color:#fff}
.float-box_reg {padding-top:16px}
	.float-box_reg .text-box, .float-box_reg .text-box a,
	.float-box_logon .text-box, .float-box_logon .text-box a {font-size:var(--font-sm); color:#aeb9c7}
	.float-box_reg .text-box a, .float-box_logon .text-box a {text-decoration:underline}
.editpass-title {font-size:var(--font-base); margin-bottom:6px; padding-top:24px}
.requirement-list li {position:relative; padding-left:20px}
.requirement-list li:before {display:inline-block; content:'—'; position:absolute; left:0; top:-1px}
.redirect-link {color:#90acc7; text-decoration:underline}

.reg-list {margin-bottom:30px}
	.reg-list li {text-align:left}
	.reg-list li + li {margin-top:15px}
	.reg-list label {display:inline-block; color:#f6f6f6; margin-bottom:5px}
	.reg-list .form-control {height:40px; line-height:40px; padding:0 6px 0 10px; border:none}

.mount-list {padding-top:16px}
	.mount-list label {display:block}
	.mount-list a {color:#499aff}

.restore-content { max-width: 375px; color: var(--color-white); padding-top: 15px; }
	.restore-content .title {font-family: var(--semibold); font-size: var(--font-xl); line-height: 1.166; letter-spacing: -0.12px; margin-bottom: 36px; }
	.restore-content p { margin-bottom: 23px; }
	.restore-content p + p { margin-bottom: 34px; }

/* confirm email V1 */
.content-blocked1 {margin-bottom:18px; padding:0 20px}
	.content-blocked1 .title {font-size:var(--font-lg); padding:30px 0 15px}
	.content-blocked1 .text {max-width:460px; display:inline-block; line-height:24px; margin-bottom:18px}
	.content-blocked1 .btn {width:270px; display:block; margin:0 auto 10px}
.content-blocked2 {max-width:650px; color:#26242c; margin:0 auto; padding:30px 20px}
	.content-blocked2 .col-left {width:282px; float:left}
	.content-blocked2 .col-right {width:282px; float:right}
	.content-blocked2 p {line-height:24px; margin-bottom:13px}
	.content-blocked2 .form-control {margin-bottom:6px}
	.content-blocked2 .btn {margin:20px 10px 0 0}
.form-control-notice {font-size:var(--font-sm); color:#949494; margin-bottom:17px}

.captcha-box_blocked {padding-top:4px}
	.captcha-box_blocked img {width:131px; height:53px; display:block; float:left}
	.captcha-box_blocked > div {width:132px; float:right}
	.captcha-box_blocked .form-control {margin-bottom:3px}
	.captcha-box_blocked a {letter-spacing:-1px; line-height:20px}

/* confirm email V2 */
.content-blocked {text-align:center; padding-bottom:20px}
.content-blocked .container {max-width:390px; display:inline-block; padding-left:16px; padding-right:16px}
.content-blocked .title-box {height:135px; flex-direction:column; margin:0 -20px; background:#ecf5fb}
.content-blocked .title, .content-blocked .mail-row {font-size:var(--font-lg)}
.content-blocked .mail-row {margin-bottom:22px}
.content-blocked .btn {width:100%; max-width:328px; display:block; margin:0 auto 17px}
.content-blocked .refresh {width:15px; height:17px; display:inline-block; margin-right:10px; background-position:-220px -501px}
.content-blocked .btn-send {display:inline-flex; background:transparent}
	.content-blocked .btn-send span {display:inline-block; font-size:var(--font-base); color:#3095d4; border-bottom:dashed 1px #3095d4; cursor:pointer}
.content-blocked hr {margin:22px -20px 17px}
.content-blocked .form-control {margin-bottom:6px}
.content-blocked .logout {color:#3095d4; border-bottom:dashed 1px #3095d4}

.icon-box-email {width:64px; height:64px; margin-bottom:11px; border:solid 1px rgba(218, 218, 218, .6); border-radius:100%; box-shadow:0 2px 5px 0 rgba(0, 0, 0, 0.04); background:#fff}
	.icon-box-email .badge {width:27px; height:27px; font-weight:bold; font-family:var(--regular); position:absolute; right:-12px; top:-4px; padding:0; border-radius:100%; background:#fe4440}
.text-blocked {line-height:22px; margin-bottom:0; padding-top:14px; padding-bottom:7px}
.mail-blocked {width:32px; height:26px; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background-position:0 -751px}
.title-list {text-align:left}
.check-list li {font-size:var(--font-sm); text-align:left; position:relative; padding-left:26px}
.check-list li::before {width:15px; height:14px; display:block; content:''; position:absolute; left:0; top:2px; background-position:-220px -531px}
.check-list .link-list {color:#3095d4; border-bottom:dashed 1px #3095d4; cursor:pointer}

.content-blocked_screen2 .text-blocked {padding-top:23px; padding-bottom:12px}
.content-blocked_screen2 .btn {margin-bottom:21px}
.content-blocked_screen2 .form-control-notice {font-size:var(--font-sm); color:#949494; letter-spacing:-0.2px; text-align:left; margin-bottom:36px}
.content-blocked_screen2 .captcha-title {letter-spacing:-0.2px}

.content-blocked_screen2 .captcha-box_blocked {max-width:333px; justify-content:space-between; margin:0 auto 39px}
	.content-blocked_screen2 .captcha-box_blocked img {width:156px; height:63px; display:block}
	.content-blocked_screen2 .captcha-box_blocked > div {width:144px}
	.content-blocked_screen2 .captcha-box_blocked .form-control {margin-bottom:13px}
	.content-blocked_screen2 .captcha-box_blocked a {color:#3095d4}
/* /confirm email V2 */

.has-tabs-menu {padding-top:88px}

.online-icon {width:13px; height:12px; top:1px; position:relative; display:inline-block; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 10 10'%3E%3Cpath fill='%2318DE3A' fill-rule='evenodd' d='M6.653 6.99H1.382A1.375 1.375 0 0 1 0 5.623V1.366C0 .611.619 0 1.382 0h5.271c.763 0 1.331.611 1.331 1.366v4.257c0 .755-.568 1.367-1.331 1.367zM6.994.986H.999v4.019h5.995V.986zm-4 6.03h2.009v.987H2.994v-.987zm1.997.988l1.827 1.002H1.209l1.794-1.002h1.988z'/%3E%3C/svg%3E")}
.vip .online-icon {background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 10 10'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M6.653 6.99H1.382A1.375 1.375 0 0 1 0 5.623V1.366C0 .611.619 0 1.382 0h5.271c.763 0 1.331.611 1.331 1.366v4.257c0 .755-.568 1.367-1.331 1.367zM6.994.986H.999v4.019h5.995V.986zm-4 6.03h2.009v.987H2.994v-.987zm1.997.988l1.827 1.002H1.209l1.794-1.002h1.988z'/%3E%3C/svg%3E")}

.device-icon {width:11px; height:11px; display:inline-block; /* position:relative; top:1px */}
.pc-icon {background-position:-111px -60px}
.phone-icon {background-position:-130px -60px}
.pc-icon-offline {background-position:-151px -60px}
.phone-icon-offline {background-position:-170px -60px}

.location {position:relative; padding-left:22px; color:#fff; white-space:nowrap}
.location:before {height:12px; width:12px; display:block; content:''; position:absolute; top:3px; left:2px; background-position:-211px -60px}
.count-photo {position:relative; margin-left:26px}
.count-photo:before {width:21px; height:21px; left:-26px; display:block; content:''; position:absolute; background-position:-120px -630px}
.count-photo.icon-verify-yes:before {background-position:-150px -629px}

.t-photo-info {width:100%; color:#fff; position:absolute; left:0; top:0px; z-index:5; padding:8px 16px; background:linear-gradient(180deg, #1a2026 0%, #1a202600 100%)}
.bt-photo-info {width:100%; position:-webkit-sticky; position:sticky; left:0; bottom:var(--down_padding); z-index:5}
.bt-photo-info_profile {position:relative; bottom:auto}
	.bt-photo-info_profile .btn-vipchat {width:calc(100% - 26px); max-width:350px; margin:0 auto 16px}
	.bt-photo-info .heading {overflow:hidden; position:relative; padding:8px 16px 4px; background:rgba(0,0,0,0.3)}
	.bt-photo-info .name {font-size:var(--font-xxl); line-height:32px; color:#fff; flex:1; margin-right:12px; padding-bottom:11px}
		.bt-photo-info .name.elite {color:var(--color-elite)}
	.bt-photo-info .text {display:block; clear:both; line-height:22px; color:#fff}
	.bt-photo-info .text.fix {max-height:44px; overflow:hidden}
.btn-like-box {width:228px; height:76px; align-items:center; justify-content:space-between; margin:0 auto 16px}

.become_popular .photo-box {width:100px; height:100px; position:relative; margin:0 auto 4px}
.become_popular .user-photo {width:100px; height:100px}
.become_popular .popular-up {width:36px; height:36px; display:block; position:absolute; right:-5px; bottom:2px; background-position:-60px -780px}
.become_popular .graph {width:287px; height:90px; display:block; margin:0 auto 43px}
.become_popular .content {max-width:285px; margin:0 auto}
	.become_popular .content p {margin-bottom:23px}
.become_popular .title {font-size:var(--font-xl); letter-spacing:-0.12px; margin-bottom:19px}
.become_popular .btn {width:100%; max-width:285px; margin-bottom:13px}
.become_popular .coast {font-size:var(--font-sm); color:var(--color-secondary)}

/* message */
.mess-list .date-mess {font-size:var(--font-sm) !important; color:#6a6a6a; border-radius: 5px; padding: 1px 5px}
.mess-list .srv-info-mess {display:inline-block; font-size:var(--font-xs); color:#afafaf; position:absolute; top:7px; padding-left:18px}
	.mess-list .inbox .srv-info-mess {right:-52px}
	.mess-list .outbox .srv-info-mess {left:-57px}

.icon-mess {width:15px; height:10px; position:absolute; left:0; top:4px}
.icon-mess-notsent {background-position:-155px -240px}
.icon-mess-sent {background-position:-116px -250px}
.icon-mess-read {top:5px; background-position:-135px -250px}
.icon-mess-new {top:5px; background-position:-155px -250px}

.mess-list .text-mess {max-width:68%; font-size:var(--font-base) !important; line-height:20px; position:relative; padding:7px 13px 10px}
.outbox .text-mess {color:#fff; float:right; background:#0084ff}
.inbox .text-mess {min-width:37px; min-height:37px; float:left; background:#ededf0}
.mess-blocked .text-mess {max-width:275px; padding:12px 17px 10px; background:#e36161}
.mess-blocked .reason-blocking {font-size:var(--font-sm); padding-top:6px}
.mess-blocked .btn-info {margin:9px auto 6px}
.text-mess .quote {border-left:1px dashed; padding-left:5px; margin-bottom:2px}

.quote_area {display:flex; position:relative; border-left:1px dashed; padding:10px; margin-left:10px}
.quote_area .closer {-webkit-filter:invert(1);filter:invert(1); height:32px}

.mess-list .outbox, .mess-list .inbox {padding:13px 16px 11px; overflow:hidden}
.mess-list .datetime {position:-webkit-sticky;position:sticky; top:44px; background: #f8f8f870; -webkit-backdrop-filter: blur(15px); backdrop-filter: blur(15px); display: flex; justify-content: center; z-index:1}
.outbox .text-mess:before, .inbox .text-mess:before, .mess-blocked .text-mess:before {width:12px; height:9px; display:block; content:''; position:absolute; bottom:0}
.outbox .text-mess:before {background-position:-100px -250px; right:-5px}
.inbox .text-mess:before {background-position:-100px -240px; left:-5px}
.mess-blocked .text-mess:before {background-position:-120px -240px}

.mess-list .gifts-list li, .mess-list .sticker-list li {width:100%; text-align:center}
.mess-list .photo-list li {margin-top:8px}
/*.mess-list .photo-list li:first-child {margin-top:0}*/
.mess-list .gifts-list img, .mess-list .sticker-list img, .mess-list .photo-list img {display:block; margin:0 auto}
.mess-list .gifts-list img {width:auto; height:200px}
.mess-list .sticker-list img {width:auto; height:100px}
.mess-list .photo-list li {width:200px; height:200px}
.fixed-box-mess {position:-webkit-sticky; position:sticky; bottom:0; flex-shrink:0; padding-bottom:calc(var(--down_inset)); max-height:calc(var(--height) - 44px - var(--down_padding)); background:#f8f8f8d6; display:flex; flex-direction:column; z-index:2}
.fixed-box-mess:focus-within {padding-bottom:0px}
.fixed-box-mess.active {position:fixed; top:0px; left:0px; width:100%; z-index:20}
.fixed-box-mess.blur{backdrop-filter: blur(15px); -webkit-backdrop-filter:blur(15px);}
	.fixed-box-mess .btn-vipchat {width:calc(100% - 24px); margin:5px auto 0px}
.add-mess-box {position:relative; padding:11px 64px 10px 10px}
	.add-mess-box .camera { bottom: 15px; width: 40px; height:40px; position: absolute; cursor:pointer; }
	.add-mess-box .camera::before {top: 10px; left: 8px; width: 24px; height: 20px; content: ''; position: absolute; content: ''; background-image: url(sprite-stack.svg?place-for-version#camera);}
	.add-mess-box .btn-send-mess { width: 44px; height: 44px; right: 10px; bottom: 14px; padding: 4px 0px 0px 4px; border-radius: 22px; background: var(--color-primary); }
.upload-mess-box {display:flex; flex-direction:column; position:absolute; z-index:1; padding:20px 10px 0px 10px; border-radius:15px 15px 0px 0px; background:#f8f8f870; backdrop-filter:blur(15px); -webkit-backdrop-filter:blur(15px); border:1px solid #d6d4d4; border-bottom: 0px; width:100%; transition:height .2s ease-out; height:0px; bottom:calc(0px - var(--down_inset)); padding-bottom: calc(var(--down_inset));}
	.upload-mess-box ul {overflow-y:scroll; -webkit-overflow-scrolling:touch;}
.upload-select-box {display:flex;}
	.upload-select-box div {position:relative; height:70px; margin:3px;}
	.upload-select-box img {height:70px; border-radius:10px; cursor:pointer;}
.carousel {width:100%; height:calc(var(--height) - 44px - var(--down_padding)); display:block; z-index:1; position:relative}
.carousel-stage-outer {height:100%; overflow:hidden; background:#b0b0b0}
.carousel-stage {height:100%; position:relative}
	.carousel-stage img {position:relative; float:left}
.carousel-item {height:100%}

.profile-carousel-out {position:-webkit-sticky; position:sticky; top:44px; margin-bottom:-208px; z-index:1; background:rgba(0,0,0,0.85)}

.mess-list .link-mess {line-height:20px; color:#afafaf; text-decoration:none; background:transparent}
	.mess-list .outbox .link-mess {color:#fff}

.mess-list .geochat-avatar {float:left; margin-right:5px}
	.mess-list .geochat-avatar > div {width:24px; height:24px}

/* verified */
.verified-icon { width: 32px; height: 32px; flex-shrink: 0; margin-right: 18px; background: url('sprite-stack.svg?place-for-version#check-green') no-repeat 50% / cover; }

.verified-row { padding: 10px; background: #f0f6fa; }
	.verified-row .text-link { color: var(--color-primary); text-underline-offset: 3px; cursor: pointer; }
	.verified-row .text-link:hover { text-decoration: underline; }

/* feed */
.feed-list .date-event {font-size:var(--font-sm); color:#afafaf; padding-top:17px; justify-content:center}
.feed-list > li {font-size:var(--font-sm); padding:0 16px; display:flex; flex-wrap:wrap-reverse}
.feed-list .thumb {margin:0}
.feed-list .user-info {border-top:none}
.feed-list .name {margin-right:0}

.feed-list .item-user-action {margin-left:60px; padding:17px 16px 26px 16px; border-bottom:solid 1px #eee}
/* .feed-list .user-block {margin-bottom:-20px} */
.item-user-action a {font-size:var(--font-sm); color:#2a90fe}
.item-user-action .profile-me label {color:#afafaf}
	.item-user-action .profile-me label + div {color:#000}
.item-user-action .present {width:220px; height:220px; display:block; margin-bottom:25px}
.item-user-action .img-list img {width:100px; height:100px; float:left; margin:1px}
.item-user-action .date span {margin-right:5px}

/* trend */
.trend-list {padding-right:18px}
.trend-list .user-info {min-height:89px; padding:12px 10px 11px 0}

.trend-list .text {max-width:100%; height:auto; display:block; font-size:var(--font-base); color:var(--color-dark); font-family:var(--regular); margin-bottom:4px}
.trend-list .gray {color:var(--color-secondary)}
.trend-list .name {font-size:var(--font-sm); color:var(--color-secondary)}
.trend-list .file-upload {width:70px; height:70px; display:block; position:relative; border-radius:10px}
.trend-list .file-upload:before {width:20px; height:20px; display:block; content:''; position:absolute}
.trend-list .is-photo {background-color:#2b73bb}
.trend-list .is-photo:before {left:25px; top:24px; background-position:-30px -445px}
.trend-list .no-photo {border:dashed 2px #2b73bb; background-color:transparent}
.trend-list .no-photo:before {left:24px; top:23px; background-position:-60px -445px}
.trend-list-upload {position:-webkit-sticky;position:sticky; top:44px; z-index:1; padding:0}
.trend-list-upload .user-info {height:90px; border-top:none; border-bottom:solid 1px #ccc}

.slider-feed {padding:12px 0 12px 16px}
.slider-feed ul {width:6000px}
.slider-feed > div {overflow:hidden;}
.slider-feed li {width:70px; height:70px; display:block; float:left; position:relative; margin-right:16px; border-radius:50%}
.slider-feed .active:before {content:''; position:absolute; left:-4px; right:-4px; top:-4px; bottom:-4px; border:solid 2px #7ccd43; border-radius:50%}
.slider-feed li img {display:block; border-radius:50%;width:70px;height:70px}

.content-trend {padding:15px 20px 20px; text-align: center;}
.content-trend .title {margin-bottom:5px}
.content-trend .form-control {margin-bottom:20px}
.content-trend textarea {width:100%; height:80px; font-size:var(--font-base); padding:6px 10px 8px}
.content-trend .btn {display:block; margin:0 auto 17px}

.empty-sch .title {font-size:var(--font-lg)}
.empty-sch > div {margin:20px 0}

/* profile */
.text.online {color:#18de3a}
.profile-container { position: relative; z-index: 5; border-top: 1px solid transparent; background:#f6f6f6; }
.profile-box {margin-top:20px; padding-left:60px; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,0.08)}
.profile-box:first-child {margin-top:0}
.profile-box_self {box-shadow:none}
	.profile-box .title {position:relative; margin-bottom:6px}
		.profile-box .title::before {width:20px; height:20px; display:block; content:''; position:absolute; left:-40px; top:0}
		.profile-box .title-edit {margin-bottom:15px}
		.profile-box .title-location {float:left}
		.profile-box .title-location::before {background-position:-80px -210px}
		.profile-box .title-srch::before {background-position:-100px -209px}
		.profile-box .title-gift::before {top:-3px; background-position:-140px -210px}
		.profile-box .title-tag::before {top:-2px; background-position:-121px -210px}
		.profile-box .title-about::before {background-position:-161px -210px}
		.profile-box .title-find::before {background-position:-201px -210px}
		.profile-box .title-private::before {background-position:-181px -210px}
		.profile-box .title-status::before {top:2px; background-position:-201px -240px}
		.profile-box .title-elite::before {background-position:-180px -238px}
		.profile-box .title-purse::before {top:1px; background-position:-220px -210px}
		.profile-box .title-city::before {background-position:-80px -210px}
		.profile-box .title-heart::before {background-position:-200px -210px}
		.profile-box .title-info::before {background-position:-181px -210px}
		.profile-box .title-verify_get::before {background-position:-120px -630px}
		.profile-box .title-verify_info::before {width:21px; height:21px; background-position:-150px -629px}
		.profile-box .text, .profile-me label + div {color:var(--color-secondary)}
		.profile-box .profile-location {float:right; padding-right:20px}
		.profile-box .title-support::before {width:21px; height:20px; background-image:url('sprite-stack.svg?place-for-version#support')}

		.profile-box .title-subscribe-premium::before {width:16px; height:15px; top:2px; background-image:url('sprite-stack.svg?place-for-version#star-setting')}
		.profile-box .title-subscribe-vip::before {width:19px; height:16px; top:2px; background-image:url('sprite-stack.svg?place-for-version#vip-setting')}
		.profile-box .title-notify::before {width:16px; height:15px; top:2px; background-image:url('sprite-stack.svg?place-for-version#bell-setting')}

		.profile-box .level-low .title::before {width:16px; height:20px; left:-38px; background:url('sprite-stack.svg?place-for-version#popular-low') 50% / cover}
		.profile-box .level-medium .title::before {width:16px; height:20px; left:-38px; background:url('sprite-stack.svg?place-for-version#popular-medium') 50% / cover}
		.profile-box .level-high .title::before {width:16px; height:20px; left:-38px; background:url('sprite-stack.svg?place-for-version#popular-high') 50% / cover}
		.profile-box .title-settings::before {width:16px; height:18px; top:1px; background:url('sprite-stack.svg?place-for-version#settings-gear') 50% / cover}
		.profile-box .title-freeze::before {width:16px; height:16px; left:-37px; top:2px; background:url('sprite-stack.svg?place-for-version#freeze') 50% / cover}
		.profile-box .title-delete::before {width:18px; height:18px; left:-37px; background:url('sprite-stack.svg?place-for-version#basket-red') 50% / cover}

.profile-list > li {position:relative; padding:15px 16px 19px 0; border-top:solid 1px #e3e3e4}
.profile-list > li:first-child {border-top:none}
.profile-list a:not(.btn):not(.title-support) {color:var(--color-primary)}
.profile-list .title-support {color:var(--color-dark); display:block; height:100%}
.profile-list .title-freeze {color:var(--color-dark); display:block}
.profile-list .title-delete {color:var(--color-dark); display:block}
.profile-list .item-notext {padding-bottom:15px}
	.profile-list .item-notext .title {margin-bottom:0}
	.profile-list .item-notext .btn-outline-dark {min-width:94px; position:absolute; right:16px; top:8px}
.profile-list .item-link {padding:0}
	.profile-list .item-link > a {height:50px; display:block; padding:15px 16px 15px 0}
.profile-list .balance {color:var(--color-secondary); padding-right:17px}

.promocode-row .form-control {width:calc(100% - 136px); max-width:209px; margin-right:10px; border-radius:10px; font-size:var(--font-lg)}
.promo-error, .promo-success {font-size:var(--font-xs); color:var(--color-danger); margin-bottom:-7px; padding-top:10px}
.promo-success {color:#06b521}

.premium-box { font-size:var(--font-lg); margin-top: 20px; padding: 22px 20px 24px; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08); }
.premium-box-wrap { max-width: 470px; }
	.premium-box-wrap .title { font-size: var(--font-lg); line-height: 1.3; margin-bottom: 23px; }
	.premium-box-wrap .btn { width: 100%; max-width: 335px; display: block; margin-inline: auto; }
.possibility-list { display: grid; grid-template-rows: repeat(3, 1fr); grid-template-columns: 1fr 1fr; gap: 20px 40px; margin-bottom: 27px; }
	.possibility-list li { display: flex; align-items: center; font-size: var(--font-sm); line-height: 16px; }
	.possibility-list .icon-stack { margin-right: 11px; }

.profile-gift-list {width:450px}
	.profile-gift-list li {float:left; margin-left:16px}
	.profile-gift-list li:first-child {margin-left:0}
	.profile-gift-list img {display:block}

.profile-tag-list {margin:0 0 -3px -5px; padding-top:5px}
.profile-tag-list div, .profile-tag-list label {border-radius:15px; float:left; margin:4px 5px; cursor:pointer; font-size:var(--font-sm); line-height:16px; text-decoration:none; text-align:center; padding:7px 16px 6px; color:#d3d3d3; border:solid 1px #d3d3d3}
	.profile-tag-list .allowed, .profile-tag-list .checked {color:var(--color-primary); border:solid 1px var(--color-primary)}
	.profile-tag-list .declined {border-color:#f94848; background:#ffefef; color:#f94848}

.gift-list-outer {margin-right:20px; overflow:hidden}

.show-profile-list{padding:14px 0 25px}
	.show-profile-list li {padding:20px 16px 0 0}
	.show-profile-list li:first-child {padding-top:0}
	.show-profile-list label {color:#333844}
	.show-profile-list div {color:var(--color-secondary); margin-top:5px}

.show-profile-list_self {padding-bottom:15px}
	.show-profile-list_self label {display:block; float:none; margin-bottom:10px}
	.show-profile-list_self div {margin-left:0}

.myprofile-heading {padding:16px 16px 16px 20px; border-bottom:solid 1px #e3e3e4}
	.myprofile-heading .user-info {margin-left:86px}

.edit-box {padding:24px 24px 23px; border-bottom:solid 1px #e3e3e4; background:#fafbfb}
	.edit-box .alert {margin-bottom:20px}
	.edit-box .form-control_textarea {height:80px}
	.edit-box .btn {margin-right:12px}

.edit-box_profile {margin:0 -16px -19px -60px; border-top:solid 1px #e3e3e4; border-bottom: none;}
.edit-box_unsubscr {width:100%; min-height:100%; position:absolute; left:0; top:0; bottom:0; overflow-y:auto; padding-top:58px !important; border-bottom:none}
	.edit-box_unsubscr > div {max-width:380px; margin:0 auto}

.edit-box_me {padding-right:0}
	.edit-box_me .profile-edit_me > li {padding-right:24px}

.profile-edit_main {max-width:430px}
	.profile-edit_main > li + li {margin-top:16px}
		.profile-edit_main > li > label {width:140px; float:left; padding-top:5px}
		.profile-edit_main > li > div {margin-left:140px}

.profile-edit li > label {width:150px}
.profile-edit li > div {margin-left:150px}

.profile-me li > label {width:100%; display:block; float:none; margin-bottom:5px; padding-top:0}
.profile-me li > div {margin-left:0}
.profile-edit_me {max-width:100%}
	.profile-edit_me > li {margin-top:0 !important; padding:20px 0; border-top:solid 1px #d7d7d8}
	.profile-edit_me > li:first-child {padding-top:0; border-top:none}
.profile-edit_inner li + li, .profile-edit_lang li + li {margin-top:15px}
.profile-edit_inner label, .profile-edit_lang .label, .profile-edit_self label {display:block; margin-bottom:5px}

.write-textarea {padding-left:36px}
	.write-textarea li + li {margin-top:15px}

.item-physical-data > div + div {margin-left:34px}
.item-physical-data .form-control {width:75px; margin-right:5px}
.skin-edit input {margin-left:0}
.skin-edit label {display:inline-block; margin:0}
	.skin-edit > div {margin-top:12px}

.profile-edit_self {padding-left:37px}
	.profile-edit_self li + li {margin-top:16px}

/* premium */
.header-elite, .photo-container-elite {background:#3495f0}
.header-up, .photo-container-up {background:#87cd59}
.photo-container {height:125px; position:relative}
.elite-photo-box {width:108px; height:108px; left:calc(50% - 54px); top:70px; border:solid 4px #ffe507}
	.elite-photo-box img {width:100px; height:100px}
	.elite-photo-box .icon-elite, .elite-photo-box .icon-up {left:70px; top:64px}
.elit-title {font-size:var(--font-base); color:#949494; padding:75px 16px 36px}
	.elit-title div {font-size:var(--font-lg); color:#26242c; margin-bottom:11px}

.elit-preference {max-width:600px; margin:0 auto 13px; padding:0 30px}
	.elit-preference li {width:30%; font-size:var(--font-sm); line-height:17px; position:relative; margin-bottom:20px; padding-left:55px}
	.elit-preference span {width:41px; height:41px; display:inline-block; position:absolute; left:0; top:-5px}
	.elit-preference .icon-appearance {background-position:-1px -309px}
	.elit-preference .icon-adv {background-position:-101px -309px}
	.elit-preference .icon-chat {background-position:0 -359px}
	.elit-preference .icon-invisible {background-position:-50px -309px}
	.elit-preference .icon-sympathy {background-position:-150px -309px}
	.elit-preference .icon-protection {background-position:-50px -359px}

.payment-box {max-width:592px; margin:0 auto; padding:29px 16px 24px; flex-grow:1; width:100%}
	.payment-box .title {font-size:var(--font-base); color:#949494; text-align:center; margin-bottom:24px}
		.payment-box .title div {font-size:var(--font-lg); color:#26242c; margin-bottom:8px}
		.payment-box .title span {font-size:var(--font-base); color:#949494}
.payment-box_bonus {padding-top:10px}
	.payment-box_bonus .title {margin-bottom:12px}

.payment-box .iframe-show {width:100%; height:100%; margin:0 auto 13px; padding-top:20px}
	.payment-box .iframe-show iframe {width:100%; /*height:300px !important*/}

.slogan-box {font-size:var(--font-sm); padding:10px 15px; background:#fff}
	.slogan-box .thumb img {width:45px; height:45px}
	.slogan-box .slogan-text {margin:3px 0 0 59px}

.payment-footer {font-size:var(--font-sm); color:#949494; padding:19px 24px 20px; border-top:solid 1px #d7d7d8}
	.payment-footer a {font-size:var(--font-sm); color:#949494; border-bottom:solid 1px #949494}
	.payment-footer .dashed {border-style:dashed}

.payment-agree {margin-bottom:20px; font-size:var(--font-sm); color:#949494}
	.payment-agree a {font-size:var(--font-sm); text-decoration:underline; color:#949494}

.rocket {width:146px; height:165px; display:inline-block}
.phone-num {max-width:500px; margin:0 auto; padding:0 16px 30px}
.enter-num {float:left}
	.enter-num label {padding-right:7px}
	.enter-num .format-num {font-size:var(--font-sm); color:#949494; padding:6px 0 0 30px}

.opsos-box {float:right; padding-top:2px}
	.opsos-box label {float:left; padding:4px 12px 0 0}
	.opsos-box .opsos-logo {width:155px; height:26px; display:block; float:left; background-position:0 -410px}
	.logo-subs {width:65px; height:26px; background-position:-36px -410px}

.data-subscr {display:inline-block; margin-bottom:26px}
	.data-subscr li {height:30px; float:left}
	.data-subscr li + li {margin-left:10px}
	.data-subscr .opsos-logo img {width:45px; height:30px; display:block; margin-top:-2px}
	.data-subscr .num-subscr {font-size:var(--font-md); line-height:28px; padding-right:15px}

.content_up .payment-box {padding-top:78px}
.content-card-checkbox input[type="checkbox"] {display:none}
	.content-card-checkbox label {width:44px; height:44px; float:left; position:relative; left:-10px; top:-13px}
	.content-card-checkbox input[type="checkbox"] + label:before {width:24px; height:24px; display:block; content:''; position:absolute; left:10px; top:10px; background-position:-171px -410px}
	.content-card-checkbox input[type="checkbox"]:checked + label:before {background-position:-161px -270px}

.srv-mess {padding:20px 0 20px}

.mutual-sympathy {width:260px; justify-content:space-between; margin:0 auto 80px}
.mutual-sympathy:before {width:56px; height:56px; display:block; border:solid 5px #c7d8e1; content:''; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); background:#fff url('heart.png?place-for-version') no-repeat 12px 15px}
	.mutual-sympathy li {width:120px; height:120px; display:flex; background:#c7d8e1}
	.mutual-sympathy img {width:110px; height:110px; display:block; margin:auto}
	.mutual-sympathy + .btn-payment {width:260px}

.rules-subscr {padding:34px 16px 24px}
.rules-subscr a, .rules-subscr a:hover {color:#00e}

.conditions_title {font-size:var(--font-md); font-family:var(--regular); margin-bottom:14px}
.conditions_list {margin:0 0 26px 24px}
	.conditions_list li {line-height:24px}
		.conditions_list li a {color:#178cf9}
		.conditions_list li + li {margin-top:12px}

.conditions_item {padding-left:15px; margin:15px 0}
.conditions_item::before {content:"●"; position:relative; left:-5px}

.network_list li {padding-left:30px; background:url('../lp14/sprite_soc_network.png?place-for-version') no-repeat}
.network_list li + li {margin-top:10px}
.network_list .vk {background-position:0 5px}
.network_list .fb {background-position:5px -24px}
.network_list .yt {background-position:0 -53px}

.link-row .info {margin-right:5px}

/* customization */
.prop-castom input, .select-period input {display:none}

.castom, .prop-castom label {width:auto; display:inline-block; float:none; margin-bottom:8px; padding:0 0 0 34px; position:relative}
.castom:before, .prop-castom label:before, .select-period label:before {width:27px; height:27px; display:block; position:absolute; content:''; left:0; top:-2px}
.select-period label:before {left:11px; top:10px}

.castom_chbox:before, .prop-castom_chbox label:before {background-position:-60px -270px}
.castom_radio:before, .prop-castom_radio label:before, .select-period label:before {background-position:0 -268px}

input:checked + .castom_chbox:before, .prop-castom_chbox input:checked + label:before {background-position:-90px -270px}
input:checked + .castom_radio:before, .prop-castom_radio input:checked + label:before, .select-period input:checked + label:before {background-position:-30px -268px}

.photo_zoom {position:absolute; z-index:500; min-height:var(--height); min-width:100vw; text-align:center; background-color:#000}
	.photo_zoom .closer {position:fixed; width:44px; height:44px; top:20px; left:calc(100vw - 64px)}
	.photo_zoom .closer:before {width:34px; height:34px; display:block; content:''; position:absolute; left:50%; top:50%; z-index:501; margin:-16px 0 0 -17px; background-position:-159px -580px}

/* select premium plans */
.pay_option li + li {margin-top:7px}
.pay_option .item {width:100%; height:50px; flex-direction:row; justify-content:space-between; line-height:15px; position:relative; padding:0 10px; border-radius:10px; background:#f6f7fb}
.pay_option .select {color:#fff; background:#008bfd}
.pay_option .amount-row {display: flex; flex-direction: column; justify-content: center;}
.pay_option .period-row {flex-direction: column; justify-content:center; text-align: right; font-size:var(--font-xs)}
.pay_option .crossed-out {display:inline-block; position:relative; width: -webkit-max-content; width: -moz-max-content; width: max-content;}
.pay_option .crossed-out::before {height:1.7px; display:block; content:''; position:absolute; left:0px; right:20px; top:7px; transform:rotate(-23deg); background:#fc721b}
	.pay_option .select .crossed-out::before {background:#fff}
.pay_option .total {font-size:var(--font-xs); line-height:24px; color:#b8b8b8; padding-left:10px}
.pay_option .sticker {height:20px; align-items:center; justify-content:center;position: relative; top: -13px; font-size:var(--font-xs); border:solid 1px; border-radius:10px; background:#fff}
.pay_option .action {width:50px; color:#28c625 !important; border-color:#28c625 !important}
.pay_option .best {width:85px; color:#fb701b !important; border-color:#fb701b !important}

/* question to the support service */
.support-form {max-width:570px}
.add-question li + li {margin-top:30px}
	.add-question .form-control_textarea {height:94px}

/* promo premium Version 2 from 18.09.2020 */
.premium-result {min-height:var(--height); color:var(--color-secondary); background:#fff url('bg_congratulation_box.png?place-for-version') repeat-x 0 0}
.premium-result .payment-box {padding-top:24px}
.premium-result .next-row {text-align:right; margin-bottom:52px}
.premium-result .title {font-size:var(--font-xl); color:#000; text-align:left; margin-bottom:19px}
.premium-result .text {margin-bottom:31px}
.premium-result .btn, .blocking-chat .btn, .blocking-profile .btn {max-width:335px; margin:0 auto 31px}
.advantages {max-width:480px; color:#000}
	.advantages li + li {margin-top:14px}
	.advantages .icon {width:34px; height:34px; flex-shrink:0; position:inherit; margin-right:11px; background-size:cover; background-position:50%; background-repeat:no-repeat}
	.advantages .icon-chat {background-image:url('../popup/sprite.premium.svg?place-for-version#chat')}
	.advantages .icon-like {background-image:url('../popup/sprite.premium.svg?place-for-version#like')}
	.advantages .icon-mess {background-image:url('../popup/sprite.premium.svg?place-for-version#mess')}
	.advantages .icon-incognito {background-image:url('../popup/sprite.premium.svg?place-for-version#incognito')}
	.advantages .icon-disign {background-image:url('../popup/sprite.premium.svg?place-for-version#disign')}
	.advantages .icon-support {background-image:url('../popup/sprite.premium.svg?place-for-version#support')}

/* Contact bell */
.mess-list .outbox-bell {padding:0}
.outbox-bell .btn-sm {height:30px; line-height:30px; border:1px solid #d9dadc; background:#fff}
.outbox-bell .icon_hi {width:16px; height:17px; display:inline-block; top:4px; background:url('../newchat/chat_icons.png?place-for-version') no-repeat -28px 0}
.thumb-bell {width:100px; height:100px; flex-shrink:0; margin-right:15px; background:url('../newchat/bell_pda.svg?place-for-version') no-repeat 0 0 / cover}

/* Picker */
.picker-box {padding-top:147px}
	.picker-box .user-photo {width:100px; height:100px; margin:0 auto 16px; border-radius:100%}
	.picker-box .btn {width:90%; max-width:335px}

/* New chat design */
.dating-offer { color: var(--color-secondary); padding: 127px 26px 26px; }
	.dating-offer .user-photo { width: 120px; height: 120px; margin: 0 auto 20px; }
	.dating-offer .name { font-size: var(--font-lg); color: var(--color-dark); }

/* New version menu & bottom menu */
.inform-box {width:100%; padding:14px 15px 0}
	.inform-box > div {width:calc((100% - 30px) / 4); height:85px; flex-direction:column; font-size:var(--font-sm); padding:17px; border-radius:10px; background:#f6f7f8}

.buttons-box {flex-wrap:wrap; padding:0 15px}
	.buttons-box .button {width:calc((100% - 20px) / 4); height:67px; font-size:var(--font-sm); color:var(--color-secondary); padding:0 15px; border-radius:10px}
	.buttons-box .button-premium, .buttons-box .button-balance {background:#fff7e1}
	.buttons-box .button-vip {background:#edf9ff}
	.buttons-box .button-vip-chat {background:#feeae9}
	.buttons-box .button-popular {background:#f1ebfb}
	.buttons-box .title {font-size:var(--font-base); color:var(--color-dark)}
	.buttons-box .btn {width:103px; margin-left:auto}
	.buttons-box .icon-stack {margin-right:14px}

.level-low .level-icon {width:45px; height:45px; background-image:url('sprite-stack.svg?place-for-version#popular-round-low')}
.level-medium .level-icon {width:45px; height:46px; background-image:url('sprite-stack.svg?place-for-version#popular-round-medium')}
.level-high .level-icon {width:44px; height:44px; background-image:url('sprite-stack.svg?place-for-version#popular-round-high')}

.level-name-low, .level-name-medium, .level-name-high {display:none; padding-top:6px}
.level-low .level-name-low {display:block; color:var(--color-danger)}
.level-medium .level-name-medium {display:block; color:#ffa722}
.level-high .level-name-high {display:block; color:var(--color-success)}

/* VIP chat */
.image-vipchat {width:133px; height:120px; display:block; margin:24px auto 21px}

.create-vip-chat .title {font-family:var(--semibold); font-size:var(--font-lg)}
.create-vip-chat .text {color:var(--color-secondary)}
.create-vip-chat .link {color:var(--color-primary)}

.newyear-hat {width:20px; height:20px; display:block; margin-left:9px; background:url('newyear_hat.png?place-for-version') no-repeat 50% / cover}

/* smart message */
.premium-offer-row { justify-content: flex-end; font-family: var(--bold); font-size: var(--font-sm); color: var(--color-success); padding: 1px 16px 10px; }
	.premium-offer-row .icon-stack { margin-right: 7px; }

.premium-activate { height: 148px; margin-top: 20px; background: #e2f9d6; }
	.premium-activate .icon-stack { left: 50%; top: 0; transform: translate(-50%, -50%); }
.premium-activate-wrap { width: 100%; max-width: 335px; margin-inline: auto; }
	.premium-activate-wrap span { display: block; font-family: var(--bold); }
	.premium-activate-wrap .btn { margin-top: 12px; }

.quick-mess { height: 42px; font-size: var(--font-sm); margin: -7px -13px 7px -13px; padding: 0 13px; border-radius: 11px 11px 0 0; background: #0072dc; }
	.quick-mess .rocket-white { margin-right: 10px; }

/* about */
.about-premium-list {list-style:circle; padding:0 0 14px 30px}
.about-premium-list li:not(:last-child) {margin-bottom:10px}
.office-images {max-width:800px; margin:0 auto 20px; padding-top:6px}
	.office-images img {display:block}

/* warning cookies */
.warning-cookie { height: 60px; font-size: var(--font-xs); line-height: 1.3333; color: var(--color-secondary); position: fixed; left: 0; right: 0; bottom: 0; z-index: 1001; padding: 0 3px 0 5px; border-top: 1px solid rgba(0, 0, 0, .1); background: rgba(255, 255, 255, .9); }
	.warning-cookie a { font-size: var(--font-xs); color: var(--color-secondary); text-decoration: underline; text-underline-offset: 3px; }
.warning-close { height: 30px; width: 30px; flex-shrink: 0; font-size: 16px; color: var(--color-secondary); position: static; }

body:has(.logout-container) .warning-cookie { color: rgba(255, 255, 255, .6); border-top-color: rgba(255, 255, 255, .15); background: transparent; }
	body:has(.logout-container) .warning-cookie a { color: rgba(255, 255, 255, .6); }
body:has(.logout-container) .warning-close { color: rgba(255, 255, 255, .7); }
body:has(.warning-cookie) .bottom-reg { margin-bottom: 40px; }

@media screen and (max-height:480px) {
	.logo-rambler {margin-bottom:70px}
	.soc-btn {padding-top:16px}
}

@media screen and (max-height:430px) {
	.logout-container {padding:10px 16px}
	.logout-container .logo {width:149px; height:100px}
	.soc-btn {padding:5px 0}
	.logout-container .btn-primary {margin-bottom:10px}
}

@media screen and (min-device-height:812px) and (orientation:portrait) {
	/*.fixed-box-mess {height:80px}*/
	/*.profile-carousel-out {margin-bottom:-200px}*/
}

@media screen and (max-width:1600px) {
	.buttons-box {max-width:730px; justify-content:center; margin:0 auto}
	.buttons-box .button {width:calc((100% - 10px) / 2); max-width:360px}
	.buttons-box .button-vip, .buttons-box .button-popular {margin-left:10px}
}

@media screen and (max-width:1023px) {
	:root {--down_menu:60px; --down_inset:constant(safe-area-inset-bottom)*1.5; --down_inset:env(safe-area-inset-bottom)*1.5; --down_padding:calc(var(--down_menu) + var(--down_inset))}
	.main-content, .header-out, .substrate, .profile-carousel-out .carousel {margin-left:0}
	.main-content {width:100%}
	.down-menu-box {display:block}
	.substrate {box-shadow:-8px 0 15px rgba(0,0,0,0.5)}
	.burger {display:block}
	.suspend {left:0; width:100vw}
}

@media screen and (max-width:840px) {
	.office-images {flex-direction:column; width:-webkit-max-content; width:-moz-max-content; width:max-content}
		.office-images .picture:first-child img {margin-bottom:20px}
}

@media screen and (max-width:715px) {
	.myprofile-heading {padding:16px 10px 16px 16px}
	.btn-edit {right:0}
	.date span {display:none}
	.content-blocked2 .col-left, .content-blocked2 .col-right {width:100%; max-width:335px; float:none; margin:0 auto}
	.captcha-box_blocked {margin-bottom:19px}
	.content-blocked2 .btn {margin:20px 0 0 0}
	.date span {display:none}
}

@media screen and (max-width:670px) {
	.list-tile.flex-parent .loader-dark {margin:40px 0}
	.rules-subscr {padding-top:43px}

	.buttons-box {flex-direction:column; align-items:center}
	.buttons-box .button {width:100%; max-width:360px}
	.buttons-box .button-vip, .buttons-box .button-popular {margin-left:0}
}

@media screen and (max-width:540px) {
	.list-tile li > div img {width:30cqw; height:30cqw}
	.list-tile-info.s160 li {height:30cqw; width:30cqw}

	.elit-preference li {width:50%}

	.enter-num, .opsos-box, .opsos-box label, .opsos-box .opsos-logo {float:none}
	.enter-num, .opsos-box {text-align:center}
	.enter-num {margin-bottom:13px}
	.opsos-box label {display:inline-block; padding-bottom:9px}
	.opsos-box .opsos-logo {margin:0 auto}

	.list > div {padding-left:8px}
	.inform-box {flex-wrap:wrap}
	.inform-box > div {width:calc((100% - 10px) / 2)}
}

@media screen and (max-width:480px) {
	.mess-list .text-mess {max-width:80%}

	.profile-box .title-location, .profile-box .profile-location {float:none}
	.gift-list-outer {width:250px}

	.edit-box {padding:15px 20px 23px}
	/*.edit-box .warning-box-sticky{margin-left:-20px}*/
	.write-textarea {padding:9px 0 0 40px}

	.profile-edit_main > li + li {margin-top:15px}
	.profile-edit_main > li > label {width:100%; display:block; float:none; margin-bottom:5px; padding-top:0}
	.profile-edit_main > li > div {margin-left:0}
	.profile-edit_main .item-checkbox div {padding-top:5px}
	.form-control_month {width:calc(100% - 180px)}

	.edit-box_me {padding-right:0}
		.edit-box_me .profile-edit_me > li {padding-right:20px}
	.profile-edit_me > li {padding-top:15px}
		.profile-edit_me > li + li {margin-top:0}
	.profile-edit_me .title-sublist {margin-bottom:15px}
	.profile-edit_self {padding-left:40px}

	input[type="checkbox"] + .castom {margin-bottom:9px}
}

@media screen and (max-width:445px) {
	.list-tile .item-img, .list-tile .upload-img, .album-photo-add {width:28cqw; height:28cqw}
}

@media screen and (max-width:420px) {
	.elit-preference {padding:0 20px}
		.elit-preference li {padding-left:50px}

	.item-user-action .inner-box {margin-left:35px}
	.rules-subscr {padding-top:33px}

	.apprambler-box {padding:15px 10px 9px}
		.apprambler-box .thumb {width:50px; height:50px}
	.app-info {margin-left:60px}
		.app-info .title, .app-info .view {font-size:var(--font-base)}

	.text-blocked, .captcha-title {font-size:var(--font-base)}

	.office-images { width:100%}
		.office-images img {width:100%; height:auto}

	.premium-box-wrap { width: 335px; }
}

@media screen and (max-width:378px) {
	.myprofile-heading .name > span {max-width:205px; float:left}
	.list .name > span {max-width:145px}
	.feed-list .name > span {max-width:210px}
	.bt-photo-info .name > span {max-width:260px}
	.conditions_list {margin-left:12px}
}

@media screen and (max-width:371px) {
	.file-upload:before {width:32px; height:29px; left:calc(50% - 16px); top:25px; background-position:-121px -270px}
		.file-upload .btn-name {line-height:12px; padding:0 10px; bottom:15px}
}

@media screen and (max-width:360px) {
	.myprofile-heading .name > span {max-width:190px; top:-94px}

	.elit-preference {padding:0 10px}
		.elit-preference li {width:48%}

	.header-title .to-els, .elit-title .to-els {max-width:76%}
	.data-subscr .num-subscr {padding-right:0}

	.content-blocked .container {padding-left:10px; padding-right:10px}
	.content-blocked .title, .content-blocked .mail-row {font-size:var(--font-md)}
	.content-blocked hr {margin-left:-10px; margin-right:-10px}

	.alert-discount {padding-left:15px; padding-right:15px}
	.btn-discount {max-width:300px}
}

@media screen and (max-width:324px) {
	.captcha-box .refresh {right:0}
	.nav-tabs a {font-size:var(--font-sm)}

	.header-user-info {max-width:177px}
	.profile-box {padding-left:50px}
		.profile-box .title:before {left:-33px}
	.show-profile-list label {display:block; float:none; margin-bottom:10px}
	.show-profile-list div {margin-left:0}
	.myprofile-heading .name > span {max-width:150px}
	.edit-box_profile {margin-left:-50px}
	.profile-edit_self {padding-left:30px}

	.item-user-action .present {width:200px; height:200px}
	.item-user-action .img-list img {width:98px; height:98px}

	.header-user-info .name > span {max-width:150px}
	.list .name > span {max-width:95px}
	.feed-list .name > span {max-width:155px}
	.bt-photo-info .name > span {max-width:205px}

	.list-tile li > div img {width:44cqw; height:44cqw}
	.list-tile-info.s160 li {height:44cqw; width:44cqw}
	.list-tile .item-img, .list-tile .upload-img, .album-photo-add {width:43cqw; height:43cqw}

	.conditions_list {margin-left:0}
	.header-title_conditions .to-els {max-width:100%; padding-left:25px}

	.app-info .view {display:none}

	.text-blocked br {display:none}
	.content-blocked .btn {width:300px}
	.content-blocked_screen2 .captcha-box_blocked img {width:146px}

	.content-popup {padding:0 10px}
	.reminder-confirm .photo-box {margin-top:14px}
	.reminder-confirm .title + .text {margin-bottom:14px}

	.fp-header .title {font-size:var(--font-xl)}

	.premium-result .next-row, .premium-result .title {margin-bottom:10px}
	.premium-result .text {margin-bottom:20px}
	.premium-result .btn {margin-bottom:25px}
	.advantages li + li {margin-top:12px}

	.buttons-box .button {padding:0 10px}
	.buttons-box .icon-stack {margin-right:10px}
	.buttons-box .btn {width:96px}
}

[data-hidden="true"], [hidden] { display: none; }