.innersetpage, .mainpage, .msg-page, .notifications, html {
    scroll-behavior: smooth
}

.mainpage, body {
    background-color: #fff
}

.buttons_error_wind button, .discripe_error_window span, .header-top p, .loads-contserio:after, .profile-info p, .social *, .top_message_error span {
    font-family: var(--regular)
}

.deflexloginput svg, .pico:after, .pico:before, .innerstcstsnm svg, .login-menu-btn span, .logo-inbn, .logo:before, .right-menu span, .social, button.loginbtnsubmain svg, button.send-btn span, span.user-send {
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.flex-section.shop span:after {
    content: 'Shop';
}
.mainpage::-webkit-scrollbar, .page::-webkit-scrollbar, body::-webkit-scrollbar {
    display: none
}
.hyprid-drawing {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    display: none;
    z-index: 999;
}
.canvas-boxing.native .hyprid-drawing {
    display: flex;
}
body {
    scrollbar-width: none;
    overflow: hidden
}

html {
    -ms-overflow-style: none
}

.mainpage {
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed !important;
    height: 100%
}

.home, .logo {
    position: relative
}

.pppi, .usim {
    background-color: #f0f0f0
}

.home {
    z-index: 2
}

.main-menu-top, .page-header {
    background: transparent;
    display: flex;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    height: 90px;
    padding-top: 5px;
    position: relative;
    transition: .2s
}

.loads-contserio, .oitset-back-loads, .page {
    width: 100%;
    height: 100%
}

.menu-share-outer.muted-menu .action-menu:nth-of-type(3n), button, input {
    border: none
}

.swiper {
    overflow: visible
}

* {
    padding: 0;
    margin: 0;
    outline: 0;
    -webkit-appearance: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none
}

.hidden, .login-cclog, .post-text p:empty, .post.muted .post-draw, .post.muted .post-movie, .post.muted .post-music, .post.muted .post-profile-info a, .post.muted .post-profile-info span, .repdis .inset-menu-bottom, .search-music-fetch[dnload=true] .loadmusic, .search-rowsmusic-fetch[dnload=true] .loadmusic, .showhidelo .svg.showsvgpassdef, .trending-search-fetch[dnload=true] .loadtrending {
    display: none !important
}

.no-transition, .notransition {
    transition: none !important
}

.logo {
    display: flex;
    left: 0;
    transition: .1s
}

.logo:before {
    content: '';
    width: 24px;
    height: 30px;
    -webkit-mask-size: 70px;
    -webkit-mask-image: url(../media/logo.svg);
    background: #000007;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    display: flex
}

.loads-contserio {
    position: absolute;
    z-index: 9
}

.right_buttons_error button {
    color: #000007;
}

.oitset-back-loads {
    position: absolute;
    z-index: 1;
    background: #fff;
    opacity: 1;
    transition: .2s;
    margin-top: 100px
}

.contains_errors, .lds-roller, .page, .right-menu span {
    margin: auto;
    bottom: 0;
    right: 0;
    top: 0
}

.movies-search {
    background: linear-gradient(45deg, #2d2f3e 0, #1b1a2a 50%, #221e35 100%);
    z-index: 999999 !important
}

.music-search {
    z-index: 999 !important;
    background: rgb(13 14 31 / 100%)
}

.music-search.blured {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    background: rgb(13 14 31 / 81%) !important
}

.page {
    left: 0;
    position: fixed;
    transition: .2s;
    transform: translateY(100%);
    overflow-x: hidden;
    overflow-y: scroll;
    background: #fff;
    z-index: 9
}

.action-menu.delete, .action-menu.edit, .action-menu.reback, .boxoffice-container[dnload=true] .boxmload, .cardsmain .saledisc, .chat .post-profile-info p, .container-currentsv, .containerlog.container_flog span.problemerrno, .containmovlg.nobackaros span.edithidccx, .editlink span.edit-link, .fehdhdhstrt, .flex-section a:empty, .follow-btn[datafn=follow] .followed-spn, .follow-btn[datafn=unfollow] .follow-spn, .hidesend .add-msg-btn, .info-field-sets.edting a, .inner-movies-search.searching .trending-movies-fetch, .inner-movies-slider[dnload=true] .loadmovies, .inner-music-search.searching .music-sections-menu, .inner-music-search.searching .search-header, .inner-music-search.searching .search-rowsmusic-fetch, .inset-notifcation[dnload=true] .loadnoties, .insetdir .action-menu.share, .link-field-inner.editing span.edit-link.icon, .link-field-inner.inner-link-btn a:before, .link-field-inner.inner-link-btn:before, .link.acvlink:after, .loginfilterpage.outlog-user .bottom-logout-cclog, .mask.delete .dir-profile-all, .mask.delete .profile-menu, .mask.delete .textarea, .mask[muted=muted] .dir-profile-container, .mask[muted=muted] .profile-menu, .mask[muted=muted] .textarea, .menu-share-outer.insetdir .action-menu.reply, .menu-share-outer.insetdir .menu-share-inner:before, .menu-share-outer.insetdir .top-share-flex, .menu-share-outer.logedin .action-menu.mute-user, .menu-share-outer.logedin .action-menu.reply, .menu-share-outer.logedin .action-menu.report, .menu-share-outer.muted-menu .action-menu.share, .menu-share-outer.muted-menu .menu-share-inner:before, .menu-share-outer.muted-menu .top-share-flex, .movie-card.loadmovies span.movie-descripe a, .movie-card.loadmovies span.movie-rating:before, .movie-search-layer.load-search-movies .mov-search-actress:before, .movies-circles, .msg-page[dnload=true] .msgsload, .noti-data[state=seen] .inset-noti-data:after, .phoneemtrachadd .userdeflexcont, .phoneustrachadd .emailflexcont, .phsetvrefcate .seroncaaswq, .played .image-gcsp:before, .post-msg-profile-info p, .post-qoute-text p:empty, .post.muted .post-footer, .post.muted .post-text p, .post.muted .tfpo, .privcy-terms span, .remadinl a, .reniewmailem .phondeflexcont, .reniewmailem .userdeflexcont, .reniewphonem .emailflexcont, .reniewphonem .userdeflexcont, .resetcloseeion .dsclcrestpass, .resetustrachadd .contneureg, .resetustrachadd .emailflexcont, .resetustrachadd .logoutsubuser, .resetustrachadd .phondeflexcont, .scroll-story-view[dnload=true] .loadstoryview, .search-container.opend-search .search-banner-home, .search-home-opend .follow-list-user, .search-home-opend[dnload=true] .loaduser, .search-movies-fetch[load=false] .load-search-movies, .search-music-fetch, .stories-inset[dnload=true] .storylaods, .stories-main-page.addable .bottom-stories-text p, .stories-main-page.addable .container-story-slider, .stories-main-page.addable .left-story-click, .stories-main-page.addable .right-story-click, .subchangexeo, .textarea .inner-post-qoute:before, .thred-page[dnload=true] .msgsload, .thred-post.actv-post:last-child .post .inner-post:before, .tfpo, .top-reply-post .post-qoute, .topinput .post-qoute, .useremtrackadd .phondeflexcont, .usermaikedro, .usertxtnodro, .vrfcationtezt, body[state=all] .details-draw-footer, span.year-rank-search a:last-child:after {
    display: none
}

.hideoverflow {
    overflow: hidden !important
}

@keyframes popScale {
    0%, 100% {
        transform: scale(1)
    }

    50% {
        transform: scale(1.2)
    }
}

.movies-container .page-header, .movies-container .page-header .page-left {
    background: 0 0 !important;
    position: absolute
}

.loads-contserio:after {
    content: 'Loading...';
    font-size: 20px;
    color: #999;
    display: flex;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto auto 50px;
    bottom: 0;
    height: 20px;
    width: fit-content;
    z-index: 99;
    padding-top: 65px
}

.lds-roller {
    position: absolute;
    display: inline-block;
    width: 80px;
    height: 80px;
    left: 0;
    padding-bottom: 0;
    z-index: 999
}

.lds-roller div {
    animation: 1.2s cubic-bezier(.5, 0, .5, 1) infinite lds-roller;
    transform-origin: 40px 40px
}

.lds-roller div:after {
    content: " ";
    display: block;
    position: absolute;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #6c63ff;
    margin: -4px 0 0 -4px
}

.error_window_back, .follow-btn[datafn=unfollow] span {
    background: #000007
}

.lds-roller div:first-child {
    animation-delay: -36ms
}

.lds-roller div:first-child:after {
    top: 63px;
    left: 63px
}

.lds-roller div:nth-child(2) {
    animation-delay: -72ms
}

.lds-roller div:nth-child(2):after {
    top: 68px;
    left: 56px
}

.lds-roller div:nth-child(3) {
    animation-delay: -108ms
}

.lds-roller div:nth-child(3):after {
    top: 71px;
    left: 48px
}

.lds-roller div:nth-child(4) {
    animation-delay: -144ms
}

.lds-roller div:nth-child(4):after {
    top: 72px;
    left: 40px
}

.lds-roller div:nth-child(5) {
    animation-delay: -.18s
}

.lds-roller div:nth-child(5):after {
    top: 71px;
    left: 32px
}

.lds-roller div:nth-child(6) {
    animation-delay: -216ms
}

.lds-roller div:nth-child(6):after {
    top: 68px;
    left: 24px
}

.lds-roller div:nth-child(7) {
    animation-delay: -252ms
}

.lds-roller div:nth-child(7):after {
    top: 63px;
    left: 17px
}

.lds-roller div:nth-child(8) {
    animation-delay: -288ms
}

.lds-roller div:nth-child(8):after {
    top: 56px;
    left: 12px
}

@keyframes lds-roller {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(360deg)
    }
}

.error_window {
    top: 0;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99999999999
}

.error_window_back {
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: .8
}

.contains_errors {
    position: fixed;
    width: 80%;
    height: fit-content;
    left: 0;
    background: #fff;
    border-radius: 15px 50px 15px 15px;
    box-shadow: 0 15px 30px -10px #000007;
    transition: .2s;
    transform: scale(0);
    z-index: 9
}

.top_message_error {
    text-align: left;
    margin-left: 20px;
    margin-top: 20px
}

.top_message_error span {
    font-size: 18px;
    font-weight: 500;
    line-height: 21px
}

.discripe_error_window {
    text-align: left;
    margin-left: 20px;
    padding-right: 20px;
    word-break: break-word;
    margin-top: 10px
}

.discripe_error_window span {
    word-break: break-word;
    font-size: 14px;
    line-height: 18px
}

.buttons_error_wind {
    margin-top: 20px;
    right: 0;
    display: inline-flex;
    margin-left: -10px;
    margin-bottom: 20px;
    width: 100%
}

.buttons_error_wind button {
    line-height: 16px;
    width: fit-content;
    font-size: 14px;
    padding: 5px 10px;
    background: 0 0
}

.right_buttons_error {
    width: fit-content;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: 0;
    position: relative
}

.header-top, .logo:after, .right-menu, .right-menu span {
    position: absolute
}

.left_buttons_error {
    width: fit-content;
    margin-right: 5px
}

.left_buttons_error button, .post.reply-txt-post .post-profile-info a {
    color: #9081e4
}

.privcy-terms {
    text-align: left;
    margin-left: 20px;
    padding-right: 20px;
    margin-top: 10px;
    max-height: 500px;
    overflow-x: hidden;
    overflow-y: scroll
}

.bottom-post-movie p, .privcy-terms * {
    word-break: break-word;
    font-size: 12px;
    font-family: var(--regular);
    line-height: 14px
}

.socialogomain.apple svg {
    -webkit-mask-image: url(../media/svg/apple.svg);
    -webkit-mask-size: contain;
}

.addedbanner .buyedbannersor, .follow-btn[datafn=follow] .follow-spn, .follow-btn[datafn=unfollow] .followed-spn, .inner-draw-page.proggressing .proggressing-back-draw, .inner-draw-page.proggressing progress#progress-draw, .inner-movies-search.searching .search-movies-fetch, .inner_error_window.seobanner .promocodebann, .link-field-inner.editing span.delete-link, .logins-fetch-info.actv-s span:after, .logins-fetch-info.actv-s span:before, .post-qoute.deleted .post-qoute-text p, .privcy-terms.privacy span.privacy, .privcy-terms.terms span.terms, .resetustrachadd .fehdhdhstrt, .resetustrachadd .subchangexeo, .sections-cclog.blocked-cclog .flex-prof-cclog, .stories-main-page.addable .container-currentsv {
    display: block;
}

.right-menu {
    width: 50px;
    height: 50px;
    right: 0;
    background: #5d5c61;
    display: flex;
    border-radius: 35px 20px 25px;
    top: 0;
    margin-top: 35px;
    transition: .2s
}

.right-menu span {
    -webkit-mask-size: 24px;
    width: 24px;
    height: 24px;
    left: 0
}

.follow-btn .follow-spn {
    -webkit-mask-image: url(../media/svg/Broken/Add%20User.svg);
    background: #fff
}

.follow-btn .followed-spn {
    -webkit-mask-image: url(../media/svg/donefollow.svg);
    background: #fff;
    display: none
}

.effectbtnlnk, .follow-btn[datafn=unfollow], .selector-follow.selected {
    background: #eee
}

.profile-image, .profile-image-full {
    width: 100px;
    height: 100px;
    background-position: center
}

.inner-back, .profile-image, .profile-image-full {
    background-size: cover;
    background-repeat: no-repeat
}

.logo:after {
    content: 'ONVO';
    font-size: 25px;
    font-weight: 400;
    font-family: alba;
    margin-left: 32px;
    height: 30px;
    line-height: 38px;
    display: flex;
    width: 100%;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto
}

.header-top {
    display: flex;
    margin-left: 109px;
    margin-top: 34px;
    width: 100%;
}

.hidesend .topinput, .social, .stories-main-page.addable textarea.stroy-title {
    display: grid
}

.header-top p {
    font-size: 16px;
    font-weight: lighter;
    color: #999;
    border-left: 1px solid #f0f0f0;
    padding-left: 10px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 25px;
    height: 25px;
    min-width: 150px;
    max-width: 50%
}

.ar .header-top p {
    border-left: none;
    border-right: 1px solid #f0f0f0
}

.profile-image-full {
    transition: 0.2s;
    z-index: 9;
    top: 0;
    border: 5px solid #f6f6f6;
    border-radius: 50%;
    position: absolute;
    background-image: none
}

.profile-image {
    border: 5px solid #f6f6f6;
    border-radius: 50%;
    position: relative;
    background-image: url(../media/profile/user.jpg)
}

.profile {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto
}

.profile-header {
    margin: 0 auto auto;
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    width: 88%
}

.profile-info span {
    font-size: 20px;
    display: flex;
    padding-top: 10px;
    font-weight: 500;
    line-height: 25px;
    font-family: var(--bold);
}

.flex-prof-section *, .noti-header span a, .social span {
    font-weight: 700
}

.profile-info p {
    font-size: 16px;
    margin-top: 5px;
    line-height: 20px;
    word-break: break-word
}

.draw-foter, .profile-info, .trending-container {
    margin-top: 15px
}

.social {
    width: fit-content;
    height: 40px;
    text-align: center;
    margin: auto;
    -webkit-mask-size: contain;
    transition: .1s
}

.social * {
    font-size: 16px
}

.flex-prof-section *, .topinput textarea {
    font-size: 14px;
    font-family: var(--regular)
}

.inset-header-social {
    width: 100%;
    margin-left: calc(6% + 100px);
    display: flex;
    line-height: 20px
}

.attach-item:last-child, .flex-prof-section.following-section, .flex-prof-section.views-section, .share-btns:last-child, .showed-connect:last-child, .stories-content:last-child {
    margin-right: 0
}

.share-section.profile-sh .link-share-text a {
    text-overflow: ellipsis;
    overflow: hidden;
    width: calc(100% + -210px)
}

.share-section.profile-sh .link-share-text {
    display: flex;
    line-height: 25px
}

.social.following-section:after {
    content: 'Following';
    font-family: var(--regular);
    font-size: 16px
}

.social.followers-section:after {
    content: 'Followers';
    font-family: var(--regular);
    font-size: 16px
}

.social-header-set {
    display: flex;
    position: absolute;
    width: 100%;
    margin-top: 35px
}

.topinput textarea {
    margin-left: 20px;
    display: flex;
    resize: none;
    border: none;
    width: 80%;
    height: 20px;
    top: 0;
    position: relative;
    margin-top: 18px;
    background: 0 0
}

.topinput {
    width: 88%;
    position: relative;
    border: 1px solid #f0f0f0;
    border-radius: 15px;
    left: 0;
    margin: 20px auto auto;
    right: 0;
    min-height: 100px;
    display: none
}

.send-buttons {
    position: absolute;
    display: block;
    direction: rtl;
    width: 100%;
    transition: .2s
}

.textarea, button.send-btn {
    position: relative;
    width: 100%;
    overflow: hidden
}

.send-btn:disabled {
    color: #000007;
    opacity: .5
}

button::disabled * {
    opacity: .5
}

button.send-btn {
    z-index: 9;
    border: none;
    display: none;
    height: 50px;
    background: #6c63ff !important;
    border-radius: 15px;
    margin-top: 5px;
    transition: .2s;
    justify-content: center
}

button.send-btn span {
    background: 0 0/24px #948e99;
    border-radius: 50%;
    border: none;
    width: 22px;
    height: 22px;
    -webkit-mask-image: url(../media/svg/Broken/Send.svg);
    position: absolute;
    transform: rotate(45deg);
    margin-right: 20px;
    margin-top: 15px;
    right: 0
}

button.send-btn:after {
    content: 'Send anonymously';
    position: absolute;
    font-size: 16px;
    font-family: var(--regular);
    margin-top: 16px;
    color: #fff !important;
    display: flex;
    width: fit-content
}

.textarea {
    margin-bottom: 20px
}

.flex-send-icons {
    position: absolute;
    left: 0;
    display: none;
    width: 100%
}

.back-main, .backdrop-filter, .inner-back {
    height: 100%;
    position: fixed;
    width: 100%
}

span.media-send {
    -webkit-mask-image: url(../media/svg/Broken/Image.svg)
}

.profile-flex:after, .profileognicon, .share-profile-btn:before, span.icon.profileico, span.user-send {
    -webkit-mask-image: url(../media/svg/Broken/Profile.svg)
}

span.user-send {
    display: none;
    -webkit-mask-size: 20px;
    background: #999;
    width: 20px;
    height: 24px;
    margin-left: 10px;
    margin-right: 5px
}

.backdrop-filter, .inner-back {
    z-index: 1
}

.mask {
    width: 100%;
    z-index: 9;
    transition: .2s;
    transform: translateX(100%)
}

.back-main {
    background: rgb(255 255 255 / 84%);
    z-index: 2
}

.posts-all {
    position: absolute;
    left: 0;
    padding-bottom: 200px
}

.thred-post {
    width: 100%;
    position: relative
}

.post {
    width: 100%;
    padding-bottom: 14px;
    padding-top: 15px
}

.pppi {
    position: relative;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url(../media/profile/user.jpg)
}

.inner-post {
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    transition: .1s
}

.post-header {
    display: block;
    width: 100%;
    margin-bottom: 20px
}

.post-profile-info a, .post.muted .post-profile-info:after {
    font-family: var(--regular);
    line-height: 22px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.post-profile-info p:before {
    content: '';
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #999;
    margin-top: 9px;
    position: absolute;
    margin-left: -7px;
    display: flex
}

.post-profile-info p {
    font-size: 16px;
    font-family: var(--regular);
    color: #999;
    line-height: 22px;
    margin-left: 12px;
    margin-right: 10px;
    height: 18px;
    overflow: hidden
}

.post-text p {
    font-family: var(--regular);
    direction: ltr;
    margin-left: 60px
}

.post-footer {
    margin-top: 13px
}

.clkble-user, .delete-story .views-storis-btn, .editlink span.delete-link, .flexed-notistrod-inset, .hidesend button.send-btn, .icons-post, .menu-share-outer.insetdir .action-menu.delete, .menu-share-outer.logedin .action-menu.delete, .menu-share-outer.logedin .action-menu.edit, .menu-share-outer.logedin .action-menu.reback, .post-msg-profile-info.verified-profile span, .stories-main-page.addable button.story-add-btn, body[state=all] .switch-anonymous {
    display: flex
}

.pico {
    display: flex;
    margin: auto
}

.popeffect {
    animation: .2s forwards popScale
}

.pico:after, .pico:before {
    -webkit-mask-size: 18px;
    background: #999;
    width: 18px;
    margin: auto;
    height: 18px
}

.pico.xupost:before {
    -webkit-mask-image: url(../media/svg/Broken/Heart.svg)
}

.pico.xupost:after {
    visibility: hidden;
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg)
}

.flex-section.selected:after, .liked:before {
    visibility: hidden !important
}

.flex-section.selected:before, .liked:after, .unvishide {
    visibility: visible !important
}

.liked:after {
    background: #fe6885 !important
}

.liked a {
    color: #ff6161 !important
}

.inner-post:after {
    position: absolute;
    content: '';
    width: 2px;
    background: #f5f5f5;
    height: 100%;
    display: flex;
    z-index: -1;
    top: 0;
    margin-left: 24px;
    margin-top: 25px
}

.post:last-child .inner-post:after {
    content: none
}

.inner-profile-menu {
    display: flex;
    width: 88%;
    margin: auto;
    justify-content: center;
    right: 0;
    left: 0;
    height: 100%
}

.flex-prof-section {
    display: flex;
    position: relative;
    height: 100%;
    padding: 0;
    border-radius: 50px;
    left: 0;
    width: fit-content;
    margin: auto;
    text-align: center;
    transition: .1s;
    line-height: 20px;
    z-index: 8;
}

.profile-menu {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto auto -10px;
    height: 30px
}

.settings .page-left span {
    transform: rotate(180deg);
}

.flex-prof-section a {
    margin-right: 5px;
    height: 100%;
    position: relative;
    margin-left: auto;
    display: flex
}

.flex-prof-section.likes-section a {
    margin-left: 5px;
    margin-right: 0;
}

.login-menu-btn, .login-menu-btn span {
    width: 50px;
    height: 50px;
    transition: .2s;
    right: 0;
    bottom: 0
}

.ar .left-imgs-icons, .codevrfcation input:first-child, .flex-prof-section.answers-section, .msg-post.music .inner-post-music, .my-story[dataid], .my-story[datatime], .showed-connect.google-connect {
    margin-left: 0
}

.flex-prof-section.selected a:after {
    content: '';
    width: 15px;
    height: 2px;
    position: absolute;
    bottom: 0;
    background: #ff6161;
    right: 0;
    left: 0;
    margin: auto
}

.login-menu-btn {
    position: fixed;
    overflow: hidden;
    background: #000007;
    margin-bottom: 80px;
    margin-right: 6%;
    border-radius: 35px 20px 25px;
    box-shadow: rgba(0, 0, 0, .2) 0 12px 28px 0, rgba(0, 0, 0, .1) 0 2px 4px 0, rgba(255, 255, 255, .05) 0 0 0 1px inset;
    z-index: 10
}

.login-menu-btn span {
    -webkit-mask-image: url(../media/svg/menu.svg);
    -webkit-mask-size: 22px;
    background: #fff;
    position: absolute;
    top: 0;
    margin: auto;
    border-radius: 50%
}

.loginfilterpage {
    position: fixed;
    bottom: 0;
    height: 500px;
    width: 100%;
    border-top-right-radius: 35px;
    border-top-left-radius: 100px;
    background: 145% -80% no-repeat #fff;
    z-index: 999999999;
    overflow: hidden;
    transition: .1s;
    transform: translateY(500px)
}

.poutbackloginfi {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99999999;
    background: #303036;
    opacity: .5;
    display: none
}

.dragloginfilts {
    position: absolute;
    width: 100%;
    height: 44px;
    text-align: center;
    background: 0 0;
    z-index: 9
}

.innrrstyledrags {
    width: 30px;
    height: 4px;
    position: absolute;
    right: 0;
    left: 0;
    margin: 20px auto auto;
    border-radius: 10px;
    background: #eaeaea
}

.deflexloginput, .deflexsoianput {
    height: 50px;
    width: 80%;
    display: flex;
    right: 0;
    left: 0;
    margin: 20px auto auto;
    direction: rtl;
    position: relative
}

.deflexloginput input {
    font-family: var(--regular);
    width: 100%;
    padding-right: 45px;
    height: 50px;
    border-radius: 15px;
    color: #000007;
    text-align: right;
    font-size: 13px;
    direction: rtl;
    background: #f8f8f8
}

.deflexloginput input::placeholder {
    color: silver
}

.deflexloginput svg, .innerstcstsnm svg {
    position: absolute;
    width: 20px;
    height: 20px;
    margin-top: 15px;
    -webkit-mask-size: cover;
    background-color: #999
}

.deflexsvglog {
    margin-right: 15px
}

.info-field-sets.pass-sets:before, .passleognicon, span.icon.lock {
    -webkit-mask-image: url(../media/svg/Broken/Lock.svg)
}

.forgetpass, .hideshowpaslog {
    position: absolute;
    height: 50px;
    width: 50px;
    left: 0;
    float: left;
    display: flex;
    direction: ltr;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px
}

.hideshowpaslog svg {
    margin-left: 15px
}

.deflexloginput button:disabled *, .disabled span, .disabled svg, .mask.delete .right-menu, .right-reply-btn:disabled:after, .right-reply-btn:disabled:before, .subchangebtn:disabled *, .subuploadimg:disabled, button.btn-draw-sub:disabled * {
    opacity: .5
}

.menu-share-outer.muted-menu .action-menu.reply:before, .showsvgpassdef {
    -webkit-mask-image: url(../media/svg/Broken/Show.svg)
}

.hidesvgpassdef {
    display: none;
    -webkit-mask-image: url(../media/svg/Broken/Hide.svg)
}

.inner-music-search.searching .search-music-fetch, .movies-container.blured .movies-circles, .movies-container.blured .movies-search::after, .movies-container.blured .movies-search::before, .post.top-reply-post, .showhidelo .hidesvgpassdef {
    display: block !important
}

.dark .loginfilterpage {
    background-image: none !important
}

.inputs_form {
    margin: auto;
    width: 100%;
    text-align: center
}

.bannerimglogin, .logologinhead {
    position: absolute;
    margin-left: 10%
}

.logologinhead {
    margin-top: 50px;
    height: 50px;
    width: 80%;
    direction: rtl
}

.forminputslogin {
    margin-top: 120px
}

.bannertextlogin, .post-draw img, .post-msg-draw img, .textdezcript {
    width: 100%;
    display: flex
}

.bannertextlogin span {
    line-height: 22px;
    width: 100%;
    text-align: center;
    font-size: 18px;
    font-family: var(--regular);
    font-weight: 400
}

.logologinhead span {
    font-family: Alba;
    font-size: 25px;
    line-height: 22px;
    height: 22px;
    font-weight: 400;
    position: absolute;
    margin-left: 15px;
    margin-right: 45px
}

.pricefiap a, span.diroxvrefctde, span.problemerrno {
    font-size: 12px;
    font-family: var(--regular)
}

.logo-inbn {
    height: 45px;
    width: 45px;
    background-color: #000007;
    -webkit-mask-size: 70px;
    -webkit-mask-image: url(../media/logo.svg)
}

.logologinhead *, .right-reply-btn * {
    margin-top: auto;
    margin-bottom: auto;
    top: 0;
    bottom: 0
}

button.loginbtnsubmain {
    width: 100%;
    text-align: center;
    height: 50px;
    display: flex;
    background: #000007;
    border-radius: 15px;
    outline: 0;
    position: relative
}

button.loginbtnsubmain span {
    font-size: 16px;
    color: #fff;
    font-family: var(--regular);
    height: 20px;
    line-height: 20px;
    width: 100%;
    text-align: center;
    margin-top: 15px
}

button.loginbtnsubmain svg {
    position: absolute;
    width: 20px;
    height: 20px;
    -webkit-mask-size: cover;
    background-color: #fff;
    left: 0;
    margin-left: 15px;
    margin-top: 15px
}

.btn-menu-home.login-home:before, .loginsubsvg {
    -webkit-mask-image: url(../media/svg/Broken/Logout.svg)
}

.susbnextsvg {
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Left%203.svg)
}

.bannerimglogin {
    left: 0;
    z-index: -1
}

span.problemerrno {
    width: 100%;
    text-align: center;
    color: #999;
    direction: ltr
}

.flex-section:after, .flex-section:before, .sociallogoin svg {
    width: 24px;
    height: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.bannerimglogin img {
    max-width: 245%;
    opacity: .5
}

.sociallogoin * {
    margin: auto;
    top: 0
}

.sociallogoin svg {
    -webkit-mask-size: cover;
    background-color: #000007
}

.sociallogoin {
    z-index: 2;
    height: 100%;
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    direction: rtl;
    padding-top: 40px
}

.showed-connect.facebook-connect:before, .socialogomain.facebook svg {
    -webkit-mask-image: url(../media/svg/f.svg)
}

.showed-connect.google-connect:before, .socialogomain.google svg {
    -webkit-mask-image: url(../media/svg/g.svg)
}

.showed-connect.twitter-connect:before, .socialogomain.twitter svg {
    -webkit-mask-image: url(../media/svg/a.svg)
}

.socialogomain {
    height: 100%;
    width: 100%;
    display: flex;
    transition: .1s
}

.ar .privcy-terms {
    direction: rtl;
    text-align: right;
}

.welcomebanner {
    width: 80%;
    right: 0;
    left: 0;
    margin: 150px auto auto;
    position: absolute
}

.containerlog, .containmovlg, .follow-all {
    width: 100%;
    position: absolute
}

.addedbanner .discripe_error_window, .adressview .descripessnone, .deletepage .privcysec, .seobanner .discripe_error_window {
    margin-top: 0
}

.deflexsoianput.clcproblemerrno, .handmadeswiper, .movies-outset-slider {
    margin-top: 20px
}

.pricefiap a {
    margin-left: 5px;
    margin-right: auto;
    text-decoration: line-through;
    color: #b1b195
}

.callognicon {
    -webkit-mask-image: url("../media/svg/Broken/Call.svg")
}

.emailoginic {
    -webkit-mask-image: url("../media/svg/Broken/Message.svg")
}

.containerlog.container_nlog {
    transform: translateX(-300%)
}

.containerlog.container_ulog, .followers-container.following-fetch {
    transform: translateX(-100%)
}

.containerlog.container_vlog {
    transform: translateX(-200%)
}

.containerlog.container_plog {
    transform: translateX(-400%)
}

span.diroxvrefctde {
    color: #000007;
    line-height: 24px
}

span.diroxvrefctde a {
    color: #9081e4;
    font-size: 14px;
    margin-left: 5px
}

.containmovlg {
    transition: .2s
}

.containmovlg.moveconlogamex {
    transform: translateX(300%)
}

.containmovlg.movethrdlogamex {
    transform: translateX(100%)
}

.containmovlg.movefordlogamex {
    transform: translateX(200%)
}

.containmovlg.movefifdlogamex {
    transform: translateX(400%)
}

.editing-all .links-subdiv-add, .hidesend .flex-send-icons, .hidesend button.send-btn:after, .hidesend button.send-btn:before, .loginfilterpage.outlog-user .login-cclog, .qouted-textarea .closecoted-textarea, .qouted-textarea .post-qoute, .repdis .reply-flex-btns, .resetcloseeion .resetnewpass {
    display: flex !important
}

.inner-msg-post .inner-post-music {
    margin-left: 0 !important
}

.handmadeswiper {
    padding-left: 20px
}

.oldpricdlock {
    position: absolute;
    display: flex;
    direction: rtl;
    padding: 0 5px;
    background: rgb(149 177 156 / 85%);
    border-radius: 0 10px 10px 0;
    margin-left: 55px;
    margin-top: 135px;
    top: 0;
    height: 20px
}

.ar .language-settings, .codevrfcation, .loading_user {
    direction: ltr
}

@keyframes rotatex {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes rotatex {
    from {
        -webkit-transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

@keyframes rotatey {
    from {
        transform: rotate(0)
    }

    to {
        transform: rotate(-360deg)
    }
}

@-webkit-keyframes rotatey {
    from {
        -webkit-transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(-360deg)
    }
}

.checksvg_user {
    position: absolute;
    width: 45px;
    height: 25px;
    margin-top: 15px;
    left: 0
}

.checksvg_user svg {
    -webkit-mask-image: url(../media/svg/Broken/Tick%20Square.svg);
    background-color: #9081e4 !important;
    margin-top: 2px !important;
    display: none;
    margin-right: 2px
}

.loading_user {
    display: none;
    position: absolute
}

.loading_out {
    width: 20px;
    height: 20px;
    border: 1.5px solid #9081e4;
    border-radius: 50%;
    border-right-color: transparent;
    border-bottom-color: transparent;
    -webkit-transition: .2s ease-in;
    -webkit-animation-name: rotatex;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    transition: .2s ease-in;
    animation-name: rotatex;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.loading_in {
    position: absolute;
    width: 10px;
    height: 10px;
    margin-left: 5px;
    margin-top: 5px;
    border: 1.5px solid #9081e4;
    border-radius: 50%;
    border-bottom-color: transparent;
    -webkit-transition: .2s ease-in;
    -webkit-animation-name: rotatex;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    transition: .2s ease-in;
    animation-name: rotatey;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear
}

.loading, .loadinghnxer, .loadingpostp {
    animation: 1.5s linear infinite loading-gradient
}

.oldpricdlock span {
    color: #fff;
    text-decoration: line-through;
    font-size: 13px;
    font-family: var(--regular);
    height: 20px;
    line-height: 20px
}

.codevrfcation input {
    padding-right: 0;
    text-align: center;
    font-size: 20px;
    font-family: var(--regular);
    font-weight: 500;
    margin-left: 10px;
    direction: ltr
}

.flex-section a, .textdezcript span {
    font-family: var(--regular);
    margin: 10px auto auto;
    right: 0;
    left: 0
}

.textdezcript span {
    font-size: 16px;
    text-align: center;
    color: #999;
    direction: rtl;
    width: 88%
}

.menu-bottom {
    position: fixed;
    height: 70px;
    width: 100%;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    z-index: 999;
    display: flex;
    background: #fff;
    border-top-right-radius: 30px;
    border-top-left-radius: 30px;
    box-shadow: rgba(17, 17, 26, .05) 0 4px 16px, rgba(17, 17, 26, .05) 0 8px 32px
}

.inner-memu-bottom {
    width: 100%;
    height: 50px;
    position: relative;
    background: #ececec;
    right: 0;
    left: 0;
    margin: auto 15px 5px;
    border-radius: 20px 20px 30px 30px;
    display: flex
}

.flex-section {
    transition: .1s;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    position: relative
}

.flex-section:after, .flex-section:before {
    content: '';
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
    background: #000007;
    -webkit-mask-size: 24px
}

.flex-section:before, .mask .follow-list-user[datafn=unfollow]:before, .ptr--text {
    visibility: hidden
}

.center {
    transform: none !important
}

.home-flex:after {
    -webkit-mask-image: url(../media/svg/Broken/Home.svg)
}

.noti-flex:after, span.icon.noti {
    -webkit-mask-image: url(../media/svg/Broken/Notification.svg)
}

.info-field-sets.email-sets:before, .msg-flex:after {
    -webkit-mask-image: url(../media/svg/Broken/Message.svg)
}

.profile-flex:before {
    -webkit-mask-image: url(../media/svg/Bold/Profile.svg)
}

.inset-menu-bottom {
    width: 100%;
    height: 100%;
    display: flex;
    right: 0;
    left: 0;
    margin: auto 15px
}

.home-flex:before {
    -webkit-mask-image: url(../media/svg/Bold/Home.svg)
}

.flex-section a {
    position: absolute;
    font-size: 12px;
    line-height: 12px;
    height: 12px;
    display: flex;
    padding: 2px 4px;
    background: #6c63ff;
    color: #fff;
    top: 0;
    width: fit-content;
    transform: translateX(10px);
    border-radius: 25px;
    z-index: 9
}

.page-left span, .search-btn:after {
    -webkit-mask-size: 24px;
    background: #000007
}

.noti-flex:before, .top-notifs-fixed[type=system] .left-imgs-icons:before {
    -webkit-mask-image: url(../media/svg/Bold/Notification.svg)
}

.msg-flex:before {
    -webkit-mask-image: url(../media/svg/Bold/Message.svg)
}

.search-page-backsc {
    transition: transform .3s linear;
    width: 45px;
    height: 45px;
    right: 0;
    margin-top: 25px;
    position: fixed;
    background: #eee;
    border-radius: 50%;
    z-index: 3;
    opacity: 0
}

.inhidcrovrfl.readyimgup, .viewopacity {
    opacity: 1 !important
}

.scaledfif {
    transition: transform .2s linear !important;
    transform: scale(40)
}

.search-btn {
    position: absolute;
    right: 0;
    width: 50px;
    height: 50px;
    top: 0;
    margin-top: 25px
}

.search-btn:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Broken/Category.svg)
}

.empty-banner-main {
    right: 0;
    position: relative;
    left: 0;
    top: 0;
    bottom: 0;
    transform: translateY(-20px);
    margin: 50px auto auto;
    width: 100%;
    height: 200px;
    display: flex;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center
}

.empty-content {
    background-image: url(../media/bn/undraw_walk_dreaming_u-58-a.svg)
}

.empty-banner-main:after, .empty-follow-fetch:after {
    content: 'No content found';
    font-size: 20px;
    font-family: var(--regular);
    transform: rotate(-90deg) translateY(-72px);
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    margin: auto auto auto 6%;
    display: flex;
    height: 20px;
    line-height: 24px
}

.reply-msgs a, .right-reply-btn:after {
    font-size: 14px;
    font-family: var(--regular)
}

.page-left span, .reply-msgs:before {
    width: 24px;
    height: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    right: 0
}

.container-page {
    width: 100%;
    height: 100%;
    position: fixed;
    overflow-x: hidden;
    overflow-y: auto;
    bottom: 0;
    background: #fff
}

.page-left {
    position: fixed !important;
    margin-right: 6%;
    width: 50px;
    height: 50px;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    margin-top: 25px
}

.page-left span {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Down%202.svg)
}

.msgs-replay-cont, .post-msg-header {
    display: flex;
    position: relative;
    width: 100%
}

.reply-msgs {
    width: 100px;
    height: 35px;
    position: relative;
    border-radius: 50px;
    display: flex;
    direction: rtl
}

.post-msgs-all .post .inner-post:after {
    display: none;
    content: none
}

.post-msgs-all .post {
    border-bottom: 1px solid #f0f0f0;
    padding-top: 20px;
    padding-bottom: 17px
}

.chat .qouted-textarea .topinput {
    padding-bottom: 5px
}

.post-msgs-all .post-footer {
    margin-top: 10px
}

.reply-msgs:before {
    content: '';
    border-radius: 50%;
    background: #999;
    -webkit-mask-image: url(../media/svg/Bulk/Send.svg);
    -webkit-mask-size: 20px;
    margin: auto 16px auto 0
}

.reply-msgs a {
    margin: auto 5px auto auto
}

.action-menu.delete:before, .delete-storry-div:before, .pico.delete span {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg)
}

.action-menu.report:before, .icon.delete, .inlog-user .section-btn-cclog.report-issue-cclog:before, .pico.report span, .outlog-user .section-btn-cclog.report-issue-cclog:before {
    -webkit-mask-image: url(../media/svg/Broken/Danger.svg)
}

.action-menu.mute-user:before, .inlog-user .section-btn-cclog.settings-cclog:before, .pico.block span, .outlog-user .section-btn-cclog.settings-cclog:before {
    -webkit-mask-image: url(../media/svg/Broken/Volume%20Off.svg)
}

.inner-msgs-mage, .ios .login-menu-btn {
    margin-bottom: 100px
}

.reply-page-msg {
    z-index: 10;
    transform: translateX(-100%)
}

.inner-replay-page {
    width: 88%;
    padding-bottom: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute
}

.post.reply-txt-post .post-profile-info span {
    font-family: var(--regular);
    font-weight: 500;
    color: #999
}

.post.top-reply-post .inner-post:after {
    height: 100%;
    margin-top: 50px
}

.stories-main-page {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 9999;
    top: 0;
    transition: .2s;
    transform: translateY(100%)
}

.stories-page-back {
    width: 100%;
    height: 100%;
    background: #000
}

.image-preview-stories {
    width: 100%;
    display: flex;
    z-index: 9999;
    top: 0
}

textarea.reply-textarea {
    margin-left: 60px;
    border: none;
    font-family: var(--regular);
    font-size: 18px;
    height: 100%;
    background: 0 0;
    z-index: 9;
    word-break: break-word;
    resize: none;
    line-height: 22px
}

.media-reply-add span, .right-reply-btn:before {
    -webkit-mask-size: 24px;
    width: 24px;
    height: 24px;
    top: 0
}

.post.reply-txt-post .post-profile-info {
    margin-top: -20px
}

.post.reply-txt-post .post-text {
    margin-top: -40px;
    height: 200px;
    z-index: 99;
    position: absolute
}

.reply-flex-btns {
    direction: rtl;
    margin-right: 6px;
    margin-left: 6px;
    width: 100%;
    height: 100%;
    display: none
}

.container-reply-btns, .flex-prof-cclog, .right-flex-qoute {
    display: flex;
    width: 100%
}

.right-reply-btn {
    display: flex;
    width: 100px;
    height: 38px;
    background: #6c63ff;
    margin-top: 6px;
    border-radius: 15px 18px 30px 15px;
    transition: .2s
}

.right-reply-btn:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Bulk/Send.svg);
    background: #fff;
    transform: rotate(45deg);
    bottom: 0;
    display: flex;
    margin: auto auto auto 2px
}

.svg, .svg span {
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.right-reply-btn:after {
    content: 'Reply';
    font-weight: 500;
    color: #fff;
    top: 0;
    bottom: 0;
    margin: auto 2px auto auto;
    display: flex;
    line-height: 18px
}

.media-reply-add {
    position: absolute;
    height: 50px;
    display: flex;
    width: 40px;
    margin-right: auto;
    margin-left: auto;
    right: 0;
    left: 0
}

.media-reply-add span {
    -webkit-mask-image: url(../media/svg/Broken/Image%202.svg);
    background: #000007;
    right: 0;
    left: 0;
    margin: auto
}

.share-all-reply {
    left: 0;
    margin-right: auto;
    display: flex;
    margin-left: 10px;
    direction: ltr
}

.share-box-reply {
    width: 50px;
    height: 30px;
    border-radius: 100px;
    background: #ccc;
    margin-top: 10px;
    display: flex
}

.share-box-reply span {
    height: 20px;
    width: 20px;
    background: #f0f0f0;
    border-radius: 50%;
    margin-top: 5px;
    margin-left: 5px
}

.share-all-reply a {
    font-size: 16px;
    font-family: var(--regular);
    line-height: 20px;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-left: 10px;
    margin-bottom: auto
}

.page-header {
    top: 0;
    width: 88%;
    z-index: 11;
    background: #fff
}

.banner-boxoffice img, .links-fildes, .posts-all.posts-all-profile, .stories-main-page.addable .troser-rquine img {
    width: 100%
}

.pico a {
    font-size: 12px;
    font-family: var(--regular);
    line-height: 14px;
    height: 12px;
    color: #999;
    top: 0;
    bottom: 0;
    margin: auto auto auto 5px
}

.msg-qoute, .post-qoute {
    width: 100%;
    display: flex;
    position: relative;
    margin-top: 8px;
    margin-bottom: 20px;
    direction: ltr
}

.inner-msg-qoute, .inner-post-qoute {
    width: 100%;
    border-radius: 20px;
    padding-bottom: 12px;
    margin-left: 60px;
    display: block;
    background: #f5f5f5;
    position: relative
}

.post-qoute-header {
    display: flex;
    width: 100%;
    position: relative
}

.user-msg-image, .user-qoute-image {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    background-image: url("../media/Prof.jpg");
    position: absolute;
    margin-left: 20px;
    margin-top: 12px
}

.msg-qoute-header a, .msg-qoute-header p, .msg-qoute-header span, .post-qoute-header a, .post-qoute-header p, .post-qoute-header span {
    font-size: 14px;
    font-family: var(--regular);
    line-height: 16px;
    top: 50%;
    height: 16px;
    transform: translateY(-50%);
    position: relative
}

.msg-qoute-header span, .post-qoute-header span {
    font-weight: 700;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    word-wrap: break-word;
    word-break: break-all;
    white-space: nowrap;
    margin-left: 8px;
    margin-right: 3px
}

.msg-qoutr-flex-top, .qoutr-flex-top {
    display: flex;
    width: 100%;
    margin-top: 12px;
    height: 20px;
    text-align: left;
    margin-left: 37px
}

.mag-qoutr-flex-top p, .qoutr-flex-top p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #999;
    margin-right: 3px
}

.msg-qoutr-flex-top a, .qoutr-flex-top a {
    margin-right: 20px;
    margin-left: 8px;
    white-space: nowrap;
    color: #999
}

.leftflxstngs a, .nameprofimg span {
    color: #5d5c61;
    font-family: var(--regular)
}

.msg-qoutr-flex-top a:before, .qoutr-flex-top a:before {
    content: '';
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #999;
    margin-top: 6px;
    position: absolute;
    margin-left: -7px;
    display: flex
}

.sets-header-qoute {
    display: grid;
    max-width: 100%
}

.post-qoute-text {
    width: 100%;
    display: flex;
    padding-top: 4px
}

.post-qoute-text p {
    margin-left: 20px;
    font-size: 14px;
    font-family: var(--regular);
    line-height: 20px;
    margin-right: 20px;
    padding-bottom: 5px;
}

.inner-post-qoute:before {
    content: '';
    width: 200px;
    height: 100%;
    position: absolute;
    border: 2px solid #f0f0f0;
    border-radius: 30px 30px 30px 0;
    display: flex;
    top: 0;
    transform: translateY(50%);
    margin-left: -35px;
    z-index: -1;
    border-bottom: none;
    border-right: none
}

.qouted-textarea .post-qoute {
    margin-top: 20px;
    margin-bottom: 0
}

.qouted-textarea .inner-post-qoute {
    margin-left: 20px;
    margin-right: 20px;
    background: 0 0 !important
}

.settngsection .icon, .settngsection section:after {
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background: #5d5c61
}

.noti-header span a {
    font-family: var(--bold);
    margin-right: 5px;
}

.container-story-slider, .inner-story-slider {
    position: absolute;
    height: 100%
}

.dark, .loadmain {
    background: #000007
}

.load, .loadmain {
    z-index: 9999999999
}

.container-story-slider, .inner-story-slider, .load a {
    transition: .2s;
    display: flex
}

.container-story-slider {
    width: 100%;
    transform: translateX(0);
    overflow-x: hidden;
    overflow-y: hidden;
}

.slider-currentsv {
    height: 100%;
    width: 100%;
    display: flex;
    position: relative
}

.qouted-textarea button.send-music {
    top: unset;
    margin-bottom: 20px;
    bottom: 0
}

.qouted-textarea textarea.sendtext {
    margin-top: 20px;
    margin-bottom: 0;
    height: 50px
}

.closecoted-textarea {
    width: 30px;
    height: 30px;
    margin-left: auto;
    right: 0;
    margin-right: 30px;
    margin-top: 30px;
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Broken/Close%20Square.svg);
    background: #999;
    display: none;
    position: absolute
}

.nameprofimg span, .topheadprof {
    margin: auto;
    text-align: center;
    right: 0;
    left: 0
}

.msg-post .inner-post-qoute {
    margin-left: 15px;
    margin-right: 15px
}

.msg-post .post-qoute {
    margin-bottom: 0
}

@keyframes loading-gradient {
    0% {
        background-position: 0 50%
    }

    50% {
        background-position: -100% 50%
    }

    100% {
        background-position: -200% 50%
    }
}

.loading, .loadinghnxer {
    background: linear-gradient(to right, #938e94, #c1bdc1, #938e94);
    background: -webkit-linear-gradient(to right, #938e94, #c1bdc1, #938e94);
    background-size: 200%
}

.loadingpostp {
    background: linear-gradient(to right, #fff, #f0f0f0, #fff);
    background: -webkit-linear-gradient(to right, #fff, #f0f0f0, #fff);
    background-size: 200%
}

.settings {
    z-index: 15
}

.topheadprof {
    height: 120px;
    width: 120px;
    border: 1px solid #f0f0f0;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    display: flex
}

.topheadprof img {
    width: 100px;
    height: 100px;
    border-radius: 50%
}

.nameprofimg {
    width: 100%;
    text-align: center;
    margin-top: 25px
}

.nameprofimg span {
    width: fit-content;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px
}

.mainsetcont {
    overflow: hidden;
    width: 100%;
    height: 525px;
    background: #f6f6f6;
    border-top-right-radius: 50px;
    border-top-left-radius: 50px;
    margin-top: 35px;
    padding-top: 10px;
    padding-bottom: 100px
}

.sectioncont {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    direction: ltr;
    padding-top: 10px
}

.settngsection section {
    width: 85%;
    direction: ltr;
    display: flex;
    right: 0;
    left: 0;
    margin-right: auto;
    margin-left: auto;
    position: relative
}

.containerdzctop {
    height: fit-content
}

.settingspage {
    height: 100%;
    overflow-y: scroll;
    max-width: 600px;
    right: 0;
    left: 0;
    margin: auto;
}

.settngsection.dataextraction {
    border-bottom: none
}

.settngsection.dataextraction span.icon {
    -webkit-mask-image: url(../media/svg/Broken/Download.svg)
}

.settngsection {
    display: flex;
    direction: ltr;
    border-bottom: 1px solid #f0f0f0;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 0;
    position: relative;
    height: 45px;
    transition: .1s
}

.settngsection .icon {
    width: 24px;
    height: 24px;
    top: 50%;
    transform: translateY(-50%);
    position: relative;
    margin-left: 0;
    margin-right: 0
}

.leftflxstngs a {
    font-size: 16px;
    line-height: 16px;
    margin: 0
}

.leftflxstngs p {
    font-size: 14px;
    font-family: var(--regular);
    color: #938e94;
    line-height: 14px;
    margin: 10px 0 0
}

.leftflxstngs {
    display: block;
    margin-left: 20px;
    direction: ltr
}

.section-btn-cclog.login-cclog:before, span.icon.contact {
    -webkit-mask-image: url(../media/svg/Broken/Login.svg)
}

span.icon.genral {
    -webkit-mask-image: url(../media/svg/Broken/Filter.svg)
}

.btn-menu-home.privacy-home:before, span.icon.shield {
    -webkit-mask-image: url(../media/svg/Broken/Shield%20Done.svg)
}

.settngsection section:after {
    content: '';
    position: absolute;
    right: 0;
    width: 22px;
    height: 22px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right.svg);
    top: 0;
    bottom: 0;
    margin: auto
}

.innersetpage {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    padding-top: 10px;
    background: #fff;
    z-index: 99;
    overflow-x: hidden;
    overflow-y: auto;
    transition: .2s;
    transform: translateX(100%)
}

.innerstcstsnm, .reply-page-msg .post-header, .topheadprof {
    position: relative
}

.innerstcstsnm, .innerstcstsnm input {
    height: 50px;
    width: 100%;
    direction: ltr
}

.attach-item.effected, .effectsetsdrk {
    background: #f0f0f0
}

.innerstcstsnm {
    display: flex;
    right: 0;
    left: 0;
    margin: 15px 0 auto auto
}

.innerstcstsnm input {
    padding-right: 25px;
    border-radius: 15px;
    color: #000007;
    text-align: right;
    font-size: 14px;
    background: #f8f8f8
}

.croppie-container .cr-vp-circle, .topheadprof span {
    border-radius: 50%
}

.innerstcstsnm span, .setcoinc {
    height: 20px;
    background-color: #999;
    -webkit-mask-size: cover;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center
}

.innerstcstsnm span {
    position: absolute;
    width: 20px;
    margin-left: 20px;
    margin-top: 15px;
    -webkit-mask-image: url(/../media/svg2/edit.svg)
}

.seionseditsts {
    width: 100%;
    direction: ltr;
    right: 0;
    left: 0;
    margin: 20px auto auto
}

span.ststitlec {
    color: #999;
    font-size: 14px;
    font-family: Cairo;
    line-height: 22px;
    display: flex;
    right: 0;
    width: fit-content;
    text-align: right
}

.anonymous-on a, .privcysec p {
    font-family: var(--regular);
    line-height: 18px
}

.inset-social-btnes, .saledisc, .seionseditsts.settingsrestps, .share-btns:after {
    text-align: center
}

.topheadprof span {
    width: 50px;
    height: 50px;
    position: absolute;
    background: rgb(255 255 255 / 50%);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    background-image: url(../media/svg/Broken/Edit.svg);
    background-size: 24px;
    background-repeat: no-repeat;
    background-position: center;
    transition: .1s
}

.innerstcstsnm.ccxd input {
    padding-right: 45px
}

.setcoinc {
    position: absolute;
    right: 0;
    width: 20px;
    margin-top: 15px;
    margin-right: 15px
}

.banner, .banners_window {
    margin-top: 20px;
    width: 100%
}

.infcpassonpg .innerpagecotst input::placeholder {
    color: silver
}

span.ststitlec p {
    right: 0;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 5px;
    font-size: 12px
}

.confirmd {
    color: #95b195
}

.banner {
    display: block;
    height: 150px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat
}

.errornotfound {
    background-image: url(../media/bn/undraw_server_down_s-4-lk.svg)
}

.banners_window {
    margin-bottom: 20px;
    display: none
}

.privcysec {
    width: 100%;
    right: 0;
    left: 0;
    margin: 35px auto auto;
    direction: ltr;
    position: relative
}

.privcysec:before {
    content: '';
    width: 24px;
    position: absolute;
    height: 24px;
    margin-right: 20px;
    margin-top: auto;
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    background-color: #6c63ff;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Bold/Shield%20Done.svg);
    top: 0;
    bottom: 0;
    margin-bottom: auto
}

.privcysec p {
    font-size: 14px;
    margin-left: 45px;
    color: #000007
}

.inhidcrovrfl {
    width: 308px;
    height: 308px;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 3;
    border-radius: 100%;
    opacity: 0;
    transition: .2s;
    box-shadow: rgb(0 0 0 / 4%) 0 3px 5px
}

.movecrpimgdiv {
    position: absolute;
    width: 100%;
    height: 100%;
    margin-top: -100px
}

.allimgdemocont {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 99999;
    top: 0;
    left: 0
}

.backuplodcont, .croppie-container {
    position: absolute;
    width: 100%;
    height: 100%
}

.backuplodcont {
    z-index: 1;
    background: rgb(255 255 255 / 95%);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px)
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%
}

.backwhitproggset, .btnsubupload, .outrprogressbar {
    margin: auto;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    top: 0
}

.croppie-container .cr-image, .croppie-container .cr-overlay, .croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0)
}

.inset-attach-item span, .msg-post .reply-msgs span {
    transform: rotate(45deg)
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none
}

.croppie-container .cr-resizer, .croppie-container .cr-viewport {
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, .5);
    z-index: 0
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none
}

.info-listing-user.verified-profile span:after, .post-profile-info.verified-profile span:after {
    content: '';
    width: 18px;
    height: 18px;
    display: flex;
    background: #6c63ff;
    -webkit-mask-size: 18px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/verify2.svg);
    margin-top: -3px;
    margin-left: 2px;
    margin-right: -2px
}

.info-listing-user.verified-profile span, .post-profile-info.verified-profile span {
    display: flex !important;
    overflow: visible !important
}

.info-listing-user.verified-profile span:after {
    margin-top: 0 !important
}

.btnsubupload {
    width: 50%;
    height: 300px;
    z-index: 2
}

.btnsubupload button {
    bottom: 0;
    margin-bottom: 0;
    font-size: 14px;
    font-family: var(--regular);
    height: 50px;
    position: absolute;
    width: 50%;
    text-align: center;
    background: rgb(255 255 255 / 25%)
}

button.subuploadimg {
    right: 0;
    color: #9081e4;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px
}

button.cansleupload {
    left: 0;
    color: #999;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px
}

.wrapper {
    width: 328px;
    height: 328px;
    position: absolute;
    clip: rect(0, 328px, 328px, 164px)
}

.circle {
    width: 308px;
    height: 308px;
    border: 10px solid #9081e4;
    border-radius: 50%;
    position: absolute;
    clip: rect(0, 164px, 328px, 0);
    transition: .2s
}

.outrprogressbar {
    width: 328px;
    height: 328px;
    z-index: 1
}

.circle.leftcircle {
    transform: rotate(-180deg)
}

.wrapper.halfprogcomplet {
    clip: rect(auto, auto, auto, auto) !important
}

.subuploadimg::disabled, .trending-search-fetch[load=true] .search-music-btn:after {
    opacity: .2
}

.backwhitproggset {
    width: 308px;
    height: 308px;
    border-radius: 50%;
    background: rgb(255 255 255 / 79%);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    z-index: 999
}

.saledisc {
    position: absolute;
    width: 40px;
    height: 40px;
    z-index: 99;
    background: rgb(149 177 156 / 85%);
    left: 0;
    margin-top: 125px;
    border-radius: 30px 18px 18px;
    margin-left: 17px
}

.box, .link {
    background: #eee;
    display: flex
}

.profile-links {
    display: flex;
    width: 100%;
    flex-wrap: wrap
}

.link {
    height: 40px;
    width: 40px;
    position: relative;
    margin-right: 15px;
    border-radius: 50%;
    transition: .1s;
    margin-top: 15px
}

.textarea .inner-post-qoute {
    border: 1px solid
}

.link.widget.acvlink:after {
    display: flex;
    font-size: 14px;
    font-family: var(--regular);
    text-decoration: none;
    color: #000007;
    margin-top: 10px;
    line-height: 20px;
    margin-left: 5px;
    margin-right: 15px
}

.link.widget.acvlink {
    width: fit-content;
    border-radius: 50px;
    text-decoration: none
}

.link.widget.acvlink:before {
    width: 20px;
    height: 40px;
    margin-left: 15px
}

.anonymous-on {
    display: flex;
    margin-top: 5px;
    width: 100%;
    position: relative;
}

.anonymous-on a {
    font-size: 12px;
    color: #999;
    margin-left: 50px;
    margin-top: -2px;
    position: absolute
}

.link-field-inner a, .link-field-inner input {
    font-size: 14px;
    line-height: 16px;
    font-family: var(--regular)
}

.box {
    width: 38px;
    height: 24px;
    border-radius: 50px;
    transition: .2s
}

.box:after {
    content: '';
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: #fff;
    margin: 3px;
    transition: .2s
}

.link-field-inner a, .link-field-inner input, .link-field-inner span, .link-field-inner:before {
    margin-top: auto;
    margin-bottom: auto
}

.box.checked span {
    margin-left: 17px;
    margin-right: 0
}

.hidesend textarea.sendtext {
    height: 60px
}

.hidesend button.send-btn {
    background: #948e99
}

.send-attach {
    left: 0;
    width: 88%;
    margin: 15px auto auto;
    position: relative;
    right: 0
}

.hidesend, .top-cardshare-desc {
    margin-bottom: 20px
}

.dark .suggest-follow, .hidesend button.send-btn span, .movies-container .logo:before, .movies-container .page-left span, .music-search .logo:before, .music-search .page-left span {
    background: #fff
}

.known-sender button.send-btn:before {
    width: 145px !important
}

.known-sender button.send-btn:after {
    content: 'Send publicly' !important
}

.link.addlink {
    border: 1px solid #f0f0f0;
    background: 0 0;
    width: 112px;
    border-radius: 20px;
    position: relative
}

.link.addlink span {
    background: #999;
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
    margin-left: 0;
    width: 50px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 20px
}

.link-field-inner {
    display: flex;
    width: 100%;
    background: #f5f5f5;
    height: 50px;
    position: relative;
    border-radius: 15px;
    margin-top: 20px
}

.link-field-inner span {
    width: 24px;
    height: 24px;
    top: 0;
    bottom: 0;
    background: #000
}

.link-field-inner a {
    top: 0;
    bottom: 0;
    color: #999;
    direction: rtl
}

.link-field-inner input {
    background: 0 0;
    text-overflow: ellipsis;
    margin-left: 2px;
    width: fit-content;
    pointer-events: none
}

span.left-icon-addlink {
    margin-left: 20px;
    -webkit-mask-image: url(../media/twitter.svg);
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    margin-right: 15px
}

.icon {
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center
}

span.delete-link {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
    right: 0;
    margin-right: 20px;
    position: relative;
    z-index: 9;
    margin-left: auto;
    display: none
}

span.delete-link.icon:after {
    width: 1px;
    height: 20px;
    display: flex;
    z-index: 99
}

.link-field-inner input::placeholder {
    color: #ccc
}

.link-field-inner:before {
    content: '';
    position: absolute;
    width: 5px;
    height: 16px;
    border-right: 1px solid #ddd;
    display: flex;
    right: 0;
    margin-right: 58px;
    top: 0;
    bottom: 0
}

.links-subdiv-add, .save-cansle-btns {
    display: none;
    width: 100%;
    position: relative;
    height: 50px;
    margin-top: 20px;
    border-radius: 15px;
    overflow: hidden;
    direction: rtl;
    background: #eee
}

.links-subdiv-add button {
    height: 50px;
    width: 100%;
    background: 0 0
}

.links-subdiv-add button a, .right-movie-search *, .save-cansle-btns button a {
    font-family: var(--regular);
    font-size: 14px;
}

.movies-container .logo:after, .music-container .logo:after, button.subchangebtn a {
    color: #fff
}

button.subchangebtn {
    border-top-left-radius: 35px
}

.circle-links {
    width: 100px;
    right: 0;
    height: 50px;
    position: absolute;
    overflow: hidden;
    left: 0;
    margin: auto;
    display: block
}

.circle-links:before {
    content: '';
    width: 114px;
    height: 50px;
    margin-right: -69px;
    background: #000007;
    right: 0;
    position: absolute;
    border-top-left-radius: 100px;
    bottom: 0
}

.circle-links:after {
    content: '';
    width: 75px;
    height: 65px;
    background: #eee;
    left: 0;
    position: absolute;
    border-bottom-right-radius: 100px;
    bottom: 0;
    z-index: 5
}

.link-field-inner.inner-link-btn a {
    left: 0;
    right: 0;
    margin: auto;
    font-size: 16px;
    font-family: var(--regular);
    color: #000
}

.link-field-inner.inner-link-btn {
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='15' ry='15' stroke='%23333' stroke-width='2' stroke-dasharray='6%2c 14' stroke-dashoffset='3' stroke-linecap='square'/%3e%3c/svg%3e")
}

.btn-section:before, .link-field-inner.inner-link-btn:after {
    content: '';
    -webkit-mask-size: contain;
    background: #000007;
    position: absolute;
    -webkit-mask-position: center;
    right: 0;
    -webkit-mask-repeat: no-repeat
}

span.edit-link.icon {
    -webkit-mask-image: url(../media/svg/Broken/Edit%20Square.svg);
    right: 0;
    margin-right: 20px;
    position: relative;
    z-index: 9;
    margin-left: auto
}

.link-field-inner.inner-link-btn:after {
    width: 20px;
    height: 20px;
    -webkit-mask-image: url(../media/svg/Broken/Plus.svg);
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    margin-right: 20px
}

.link.addlink:before {
    content: 'Edit links';
    position: absolute;
    white-space: nowrap;
    font-family: var(--regular);
    font-size: 14px;
    line-height: 14px;
    color: #999;
    margin-top: 14px;
    margin-left: 40px;
    background: 0 0 !important
}

.btn-section {
    width: 100px;
    height: 100px;
    border: 1px solid #f0f0f0;
    border-radius: 20px;
    margin-right: 10px;
    margin-left: 10px;
    margin-bottom: 20px;
    position: relative
}

.inset-social-btnes {
    display: flex;
    flex-wrap: wrap;
    right: 0;
    left: 0;
    margin: 20px auto auto;
    width: 100%;
    position: relative;
    justify-content: center
}

.error-section.social-btns {
    width: 100%;
    height: 500px;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: auto;
    align-items: center;
    display: none
}

.btn-section:before {
    width: 40px;
    height: 40px;
    left: 0;
    margin: 20px auto auto
}

.btn-section:after {
    font-size: 14px;
    font-family: var(--regular);
    color: #000007;
    bottom: 0;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto auto 20px
}

.link-field-inner.ig .left-icon-addlink, .sico.ig:before {
    -webkit-mask-image: url(../media/social/instagram.svg)
}

.link-field-inner.ig a:after, .sico.ig:after {
    content: 'Instagram'
}

.link-field-inner.tw .left-icon-addlink, .sico.tw:before {
    -webkit-mask-image: url(../media/social/x.svg)
}

.link-field-inner.tw a:after, .share-btns.twitter:after, .showed-connect.twitter-connect:after, .sico.tw:after {
    content: 'Twitter'
}

.link-field-inner.fb .left-icon-addlink, .sico.fb:before {
    -webkit-mask-image: url(../media/social/facebook.svg)
}

.link-field-inner.fb a:after, .share-btns.facebook:after, .showed-connect.facebook-connect:after, .sico.fb:after {
    content: 'Facebook'
}

.link-field-inner.sp .left-icon-addlink, .sico.sp:before {
    -webkit-mask-image: url(../media/social/spotify.svg)
}

.link-field-inner.sp a:after, .sico.sp:after {
    content: 'Spotify'
}

.link-field-inner.ln .left-icon-addlink, .sico.ln:before {
    -webkit-mask-image: url(../media/social/linkedin-icon.png)
}

.link-field-inner.ln a:after, .sico.ln:after {
    content: 'Linked In'
}
.link-field-inner.gh .left-icon-addlink, .sico.gh:before {
    -webkit-mask-image: url(../media/social/github.png)
}

.link-field-inner.gh a:after, .sico.gh:after {
    content: 'Github'
}

.link-field-inner.sn .left-icon-addlink, .sico.sn:before {
    -webkit-mask-image: url(../media/social/snapchat.svg)
}

.link-field-inner.sn a:after, .sico.sn:after {
    content: 'Snapchat'
}

.link-field-inner.an .left-icon-addlink, .sico.an:before {
    -webkit-mask-image: url(../media/social/anghami.svg)
}

.link-field-inner.an a:after, .sico.an:after {
    content: 'Anghami'
}

.link-field-inner.tk .left-icon-addlink, .sico.tk:before {
    -webkit-mask-image: url(../media/social/tiktok.svg)
}

.link-field-inner.tk a:after, .sico.tk:after {
    content: 'Tiktok'
}

.link-field-inner.bh .left-icon-addlink, .sico.bh:before {
    -webkit-mask-image: url(../media/social/behance.svg)
}

.link-field-inner.bh a:after, .sico.bh:after {
    content: 'Behance'
}

.link-field-inner.wa .left-icon-addlink, .sico.wa:before {
    -webkit-mask-image: url(../media/social/whatsapp.svg)
}

.link-field-inner.wa a:after, .share-btns.whatsapp:after, .sico.wa:after {
    content: 'Whatsapp'
}

.link-field-inner.yt .left-icon-addlink, .sico.yt:before {
    -webkit-mask-image: url(../media/social/youtube.svg)
}

.link-field-inner.yt a:after, .sico.yt:after {
    content: 'Youtube'
}

.link-field-inner.sc .left-icon-addlink, .sico.sc:before {
    -webkit-mask-image: url(../media/social/soundcloud.svg)
}

.link-field-inner.sc a:after, .sico.sc:after {
    content: 'Sound cloud'
}

.link-field-inner.pt .left-icon-addlink, .sico.pt:before {
    -webkit-mask-image: url(../media/social/pintrest.svg)
}

.link-field-inner.pt a:after, .sico.pt:after {
    content: 'Pintrest'
}

.link-field-inner.gm .left-icon-addlink, .sico.gm:before {
    -webkit-mask-image: url(../media/social/gmail.svg)
}

.link-field-inner.gm a:after, .sico.gm:after {
    content: 'Gmail'
}

.link-field-inner.rd .left-icon-addlink, .sico.rd:before {
    -webkit-mask-image: url(../media/social/reddit.svg)
}

.link-field-inner.rd a:after, .share-btns.reddit:after, .sico.rd:after {
    content: 'Reddit'
}

.btn-section.sico.tw:before {
    -webkit-mask-size: 30px
}

.dark .attach-item.add-msg-btn:before {
    background-image: url(../media/bn/undraw_messenger_re_8bky2.svg)
}

.info-field-sets.lastname-set {
    margin-bottom: 40px
}

.link.an:before, .link.tw:before, .tw span.left-icon-addlink {
    -webkit-mask-size: 18px
}

.link-field-inner a:before {
    content: '/'
}

.link:before {
    content: '';
    width: 100%;
    height: 100%;
    -webkit-mask-size: 22px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background: #000007
}

.dir-profile-all {
    position: relative;
    width: 100%;
    overflow: visible
}

.dir-profile-container, .followers-container {
    position: absolute;
    width: 100%;
    overflow: visible;
    transition: .2s;
    transform: translate(0);
    left: 0;
    padding-bottom: 380px
}

.dir-profile {
    width: 100%;
    position: absolute;
    height: fit-content;
    min-height: 100px
}

.following-list {
    transform: translateX(100%);
    padding-bottom: 120px;
    padding-top: 5px
}

.followers-container {
    margin-top: 70px
}

.followers-list {
    padding-bottom: 100px;
    padding-top: 5px
}

.listing-user {
    width: 100%;
    display: flex;
    position: relative;
    padding-bottom: 15px;
    padding-top: 15px;
    transition: .1s
}

.empty-follow-fetch {
    width: 100%;
    height: 200px;
    position: relative;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-repeat: no-repeat;
    background-image: url(../media/bn/undraw_online_friends_re_eqaj.svg);
    background-position: center;
    background-size: contain;
    margin: 30px auto auto
}

.img-user-listing {
    height: 50px;
    width: 50px;
    background: url(/../media/profile/Prof.jpg) center/cover no-repeat;
    display: inline-block;
    border-radius: 50%;
    position: absolute
}

.container-listing-user {
    display: flex;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative
}

.info-listing-user {
    display: grid;
    width: 100%;
    margin-left: 60px
}

.follow-list-user {
    height: 35px;
    width: 35px;
    position: absolute;
    right: 0;
    top: 0;
    background: #fff;
    display: flex;
    border-radius: 35px 20px 25px;
    z-index: 9
}

.info-listing-user a, .info-listing-user p, .info-listing-user span {
    font-size: 14px;
    font-family: var(--regular);
    line-height: 20px
}

.noti-data .usfn {
    max-width: calc(100% + -111px);
}

.info-listing-user span {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: var(--bold);
    font-size: 16px;
    font-weight: 400
}

.info-listing-user p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 80%
}

.info-listing-user a {
    font-weight: 500;
    color: #999
}

.follow-list-user:before, .mask .follow-list-user:after {
    content: '';
    width: 100%;
    position: absolute;
    height: 100%;
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    background: #fff
}

.more-post-btn a, .more-post-btn:after, .more-post-btn:before {
    width: 10px;
    display: flex;
    z-index: 9;
    -webkit-mask-position: center
}

.mask .follow-list-user:before {
    -webkit-mask-image: url(../media/svg/Broken/Add%20User.svg)
}

.mask .follow-list-user:after {
    -webkit-mask-image: url(../media/svg/donefollow.svg);
    visibility: hidden
}

.mask .follow-list-user[datafn=unfollow]:after {
    visibility: visible;
    background: #000007
}

.postdir-all .thred-post {
    padding-bottom: 100%
}

.postdir-all, .search-home-opend .actv-luser:last-child {
    padding-bottom: 100px
}

.tfpo span {
    color: #999;
    font-family: var(--light)
}

.more-post-btn {
    width: 15px;
    height: 25px;
    right: 0;
    top: 0;
    position: absolute;
    display: flex;
    z-index: 9
}

.more-post-btn a, .more-post-btn:after, .more-post-btn:before {
    -webkit-mask-image: url(../media/svg/more.svg);
    -webkit-mask-size: 10px;
    -webkit-mask-repeat: no-repeat;
    background: #999;
    position: absolute;
    margin-left: auto;
    margin-right: 3px;
    right: 0;
    left: 0
}

.more-post-btn:after {
    content: '';
    height: 10px
}

.more-post-btn:before {
    content: '';
    height: 10px;
    margin-top: 4.5px
}

.more-post-btn a {
    height: 10px;
    margin-top: 9px
}

.chat .post {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    padding-top: 10px;
    padding-bottom: 10px
}

.chat .post .inner-post:after {
    margin-left: -35px;
    left: 0
}

.chat .inner-post {
    border-radius: 20px;
    background: #f5f5f5;
    padding: 15px 20px;
    display: grid;
    max-width: 100%;
    width: -webkit-fill-available;
    margin-left: 60px
}

.chat .post-profile-info a, .post.muted .post-profile-info:after {
    font-size: 14px;
    margin-top: -2px
}

.chat .post-profile-info a {
    margin-right: 45px;
    margin-left: 5px
}

.chat .pppi {
    position: absolute !important;
    top: 0
}

.chat .post-text {
    overflow: hidden;
    max-width: 100%;
    position: relative;
    z-index: 2;
    width: 100%;
    word-break: break-word
}

.chat .post .pppi {
    margin-right: 0;
    left: 0;
    margin-left: -60px
}

.chat .post-text p {
    width: 100%;
    line-height: 20px;
    margin-left: 0;
    font-size: 14px;
    margin-top: 5px;
    padding-bottom: 2px;
    display: inline-block;
}

.inset-sets-page, body[state=outlog] .home {
    padding-bottom: 200px
}

.chat .thred-post, .follow-noti .listing-user {
    padding-top: 10px;
    padding-bottom: 10px
}

p.ltr {
    direction: ltr !important;
    text-align: left
}

.chat .post-profile-info span, .post.muted .post-profile-info:before {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
    line-height: 14px;
    max-width: 100%;
    white-space: nowrap;
    font-weight: 700;
    font-family: var(--regular);
    word-wrap: break-word;
    margin-top: 2px
}

.chat .post-profile-info {
    display: flex;
    margin-top: 0;
    margin-left: 0;
    direction: ltr;
    width: 100%;
    position: absolute;
    z-index: 3
}

p.rtl {
    direction: rtl;
    margin-top: 2px
}

.chat .post-footer {
    position: absolute;
    bottom: 0;
    z-index: 1;
    height: 100%;
    width: 100%
}

.chat .icons-post {
    margin-left: 0;
    position: absolute;
    width: 100%;
    height: 100%
}

.chat .post .pico.xupost {
    bottom: 0;
    right: 0;
    margin-right: 14px
}

.chat .pico {
    position: absolute;
    width: 30px;
    justify-content: center
}

.chat .pico:after, .chat .pico:before {
    content: '';
    margin: auto !important;
    right: 0;
    left: 0;
    position: absolute;
    top: 0;
    bottom: 0
}

.chat .pico.xupost a {
    margin-right: 28px;
    position: absolute;
    right: 0
}

.chat .tfpo {
    display: flex;
    margin-top: 15px;
    width: 100%
}

.chat .tfpo span {
    font-size: 12px;
    direction: ltr;
    display: flex;
    line-height: 15px
}

.chat .pico.xupost {
    height: 26px;
    margin-bottom: 10px
}

.chat .tfpo span a, .time-full-post a {
    width: 2px;
    height: 2px;
    background: #999;
    border-radius: 50%;
    margin-right: 4px;
    margin-left: 4px;
    margin-top: 6px
}

.chat .tfpo div {
    font-size: 12px;
    font-family: var(--regular);
    color: #999;
    margin-right: 20px;
    line-height: 15px;
    display: none
}

.chat .tfpo div:after {
    content: '';
    width: 20px;
    height: 20px;
    position: absolute;
    background: #999;
    -webkit-mask-image: url(../media/svg/Broken/Show.svg);
    -webkit-mask-size: 18px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    margin-top: -3px;
    margin-right: 2px
}

.chat .post:nth-of-type(odd) .tfpo div {
    direction: ltr;
    margin-right: 40px
}

.chat .more-post-btn {
    margin-right: 14px;
    margin-top: 14px
}

.chat .post-qoute {
    display: flex;
    margin-top: 0 !important
}

.menu-share-outer, .outer-shring-field {
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 360px;
    background: #fff;
    border-top-right-radius: 35px;
    border-top-left-radius: 35px;
    z-index: 99999;
    transform: translateY(360px);
    transition: .2s
}

.menu-share-outer {
    height: 420px;
    transform: translateY(420px)
}

.outer-shring-field.stshare, .stories-main-page.delete-story .bottom-stories-text {
    z-index: 99999
}

.back-share-menu.stshare {
    z-index: 99991
}

.right-menu.settings-btn span {
    -webkit-mask-image: url(../media/svg/Broken/Setting.svg);
    background: #fff
}

.back-share-menu {
    width: 100%;
    height: 100%;
    position: fixed;
    background: #303036;
    opacity: 0;
    z-index: 1015;
    transition: .2s
}

.top-share-flex {
    width: 100%;
    height: 100px;
    position: relative;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin-right: auto;
    margin-top: 65px
}

.inner-flex-shares {
    display: flex;
    width: 88%;
    flex-wrap: wrap;
    right: 0;
    left: 0;
    margin: auto
}

.share-btns {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    margin-right: 15px;
    margin-left: 15px;
    margin-bottom: 50px;
    position: relative;
    border: 1px solid #f0f0f0;
    justify-content: center;
    display: grid;
    transition: .2s
}

.menu-share-inner {
    width: 100%;
    height: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute;
    overflow: hidden
}

.menu-share-outer:before, .outer-shring-field:before {
    content: '';
    right: 0;
    left: 0;
    margin: 20px auto auto;
    position: absolute;
    top: 0;
    width: 30px;
    height: 4px;
    background: #eee;
    border-radius: 10px
}

.banner-sets-top, .share-btns:before {
    background-repeat: no-repeat;
    background-position: center;
    right: 0;
    left: 0
}

.share-btns:after {
    content: '';
    font-size: 14px;
    top: 0;
    position: absolute;
    font-family: var(--regular);
    right: 0;
    left: 0;
    width: 60px;
    display: block;
    margin-left: -7.5px;
    margin-top: 60px
}

.share-btns:before {
    content: '';
    width: 35px;
    height: 35px;
    margin: auto;
    bottom: 0;
    top: 0;
    position: absolute;
    border-radius: 50%;
    background-size: cover
}

.share-btns.twitter:before {
    background-image: url(../media/social/x.png)
}

.share-btns.facebook:before {
    background-image: url(../media/social/facebook.webp)
}

.share-btns.instagram:before {
    -webkit-mask-image: url(../media/svg/Bulk/More%20Circle.svg);
    -webkit-mask-size: 43px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    background: #999
}

.share-btns.reddit:before {
    background-image: url(../media/social/reddit.png)
}

.share-btns.linkedin:before {
    background-image: url(../media/social/linkedin.png)
}

.share-btns.whatsapp:before {
    background-image: url(../media/social/whatsapp.webp)
}

.share-btns.linkedin:after {
    content: 'Linked In'
}

.share-btns.copylink:after {
    content: 'Copy link'
}

.share-btns.copylink:before {
    -webkit-mask-image: url(../media/social/copylink.png);
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    background: #999
}

.action-menu {
    width: 100%;
    position: relative;
    height: 55px;
    display: flex;
    direction: ltr;
    transition: .1s
}

.top-actions-menu {
    width: 88%;
    display: block;
    right: 0;
    left: 0;
    margin: 40px auto auto
}

.action-menu:before {
    content: '';
    width: 24px;
    height: 24px;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto 20px auto 0;
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background: #000007
}

.action-menu.reply:before {
    -webkit-mask-image: url(../media/svg/Broken/Paper%20Plus.svg)
}

.action-menu:after {
    font-size: 18px;
    height: 18px;
    line-height: 22px;
    top: 0;
    bottom: 0;
    margin: auto auto auto 0;
    text-align: left;
    display: flex;
    font-family: var(--regular);
    color: #000007
}

.action-menu.report:after {
    content: 'Report message'
}

.action-menu.reply:after {
    content: 'Qoute with message'
}

.action-menu.share:before, .section-btn-cclog.share-profile-cclgo:before, .share-story-div:before {
    -webkit-mask-image: url(../media/svg/Broken/Upload.svg)
}

.action-menu.share:after {
    content: 'Share message'
}

.action-menu.mute-user:after {
    content: 'Block user messages'
}

.share-btns.instagram:after {
    content: 'More'
}

.action-menu.reback:after {
    content: 'Undo publish'
}

.action-menu.delete:after {
    content: 'Delete reply'
}

.action-menu.edit:after {
    content: 'Edit reply'
}

.action-menu.reback:before {
    -webkit-mask-image: url(../media/svg/Broken/Paper%20Fail.svg)
}

.time-full-post span {
    color: #999;
}

.action-menu.edit:before {
    -webkit-mask-image: url(../media/svg/Broken/Edit%20Square.svg)
}

.menu-share-outer.insetdir .action-menu.report {
    border-bottom: none;
    padding-bottom: 0
}

.menu-share-outer.center.insetdir, .menu-share-outer.muted-menu {
    height: 300px
}

.chat .thred-post:after {
    position: absolute;
    content: '';
    height: 2px
}

.thred-post .post:last-child .inner-post:before {
    content: '';
    position: absolute;
    height: 2px;
    display: flex;
    bottom: 0;
    margin-bottom: -20px;
    width: 100%;
    border-bottom: 1px solid #f0f0f0
}

.chat .post[dir='res'] .post-text:before {
    position: absolute;
    content: 'Replying to';
    font-size: 14px;
    top: 0;
    margin-top: -20px;
    font-family: var(--regular);
    color: #999;
    margin-right: auto;
    margin-left: 0;
    left: 0;
    line-height: 12px;
    display: flex
}

.chat .post[dir='res'] .post-text {
    margin-top: 22px;
    overflow: visible
}

.chat .post[dir='res'] .post-text:after {
    white-space: nowrap;
    position: absolute;
    content: attr(user);
    font-size: 14px;
    top: 0;
    margin-top: -20px;
    font-family: var(--regular);
    color: #9081e4;
    margin-right: auto;
    left: 0;
    display: flex;
    font-weight: 500;
    margin-left: 75px;
    direction: ltr;
    line-height: 12px
}

.inset-sets-page {
    width: 88%;
    right: 0;
    left: 0;
    margin: 10px auto auto
}

.banner-sets-top {
    height: 150px;
    width: 250px;
    margin: auto;
    display: flex;
    background-size: contain
}

.banner-sets-top.security-banner {
    background-image: url(../media/bn/undraw_active_options_re_8rj3.svg)
}

.genral-sets-section {
    width: 100%;
    margin-top: 50px
}

.checkbox-section {
    display: flex;
    width: 100%;
    direction: ltr;
    height: 50px
}

.box.settings-box {
    top: 0;
    bottom: 0;
    margin: auto 0 auto auto
}

.checkbox-section span {
    font-size: 15px;
    line-height: 20px;
    font-family: var(--regular);
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    max-width: 80%
}

.box.checked, .deactvition-section button.deldeactive, .roller-refresh .lds-roller-main div:after, button.subchangebtn {
    background: #6c63ff
}

.box.checked:after {
    margin-left: 17px
}

.word-block-sets {
    width: 100%;
    background: #f0f0f0;
    border-radius: 15px;
    height: 50px;
    display: flex;
    position: relative;
    margin-top: 20px
}

.word-block-sets input {
    background: 0 0;
    font-size: 14px;
    font-family: var(--regular);
    height: 40px;
    margin-top: 5px;
    margin-left: 55px
}

.logins-fetch-info a, .word-block-sets a, .word-block-sets:before {
    background: #999;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.word-block-sets:before {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    -webkit-mask-size: 24px;
    -webkit-mask-image: url(../media/svg/Broken/Filter%202.svg);
    margin-top: 13px;
    margin-left: 18px
}

.word-block-sets a {
    position: absolute;
    height: 50px;
    width: 60px;
    right: 0;
    -webkit-mask-size: 24px;
    -webkit-mask-image: url(../media/svg/Broken/Plus.svg)
}

.logins-fetch-info a, .logout-btn {
    -webkit-mask-image: url(../media/svg/Broken/Logout.svg)
}

.main-words-breaks, .muted-users-fetch, .username-settings {
    width: 100%;
    margin-top: 40px
}

span.top-list-sets {
    font-size: 22px;
    font-family: var(--bold);
    font-weight: 700;
    display: flex;
    margin-bottom: 10px
}

.stnflex-muted-fetch, .stnflex-words-fetch {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 10px
}

.stnflex-muted-fetch span, .stnflex-words-fetch span {
    padding: 10px 20px;
    font-family: var(--regular);
    font-size: 14px;
    border: 1px solid #f0f0f0;
    border-radius: 20px;
    margin-top: 10px;
    margin-right: 10px;
    word-break: break-word;
    display: flex;
    line-height: 18px
}

.links-edit-filed, .login-activiteis-fetch {
    margin-top: 50px
}

.inset-login-activites {
    width: 100%;
    margin-top: 20px
}

.inset-login-activites span {
    display: flex;
    font-size: 12px;
    font-family: var(--regular);
    line-height: 14px;
    margin-right: 20px;
    position: relative;
    margin-left: 20px;
    word-break: break-word
}

.logins-fetch-info {
    display: flex;
    width: 100%;
    padding-bottom: 15px;
    padding-top: 15px;
    border-radius: 15px;
    border: 1px solid #f0f0f0;
    margin-bottom: 10px
}

.inset-login-activites span:after {
    display: none;
    content: '';
    width: 8px;
    height: 8px;
    background: #8bc34a;
    border-radius: 5px;
    position: absolute;
    margin-top: -15px
}

.inset-login-activites span:before {
    content: 'Active now';
    position: absolute;
    margin-left: 14px;
    margin-top: -16px;
    font-weight: 700;
    display: none
}

.logins-fetch-info.actv-s {
    padding-top: 30px
}

.logins-fetch-info a {
    width: 30px;
    height: 30px;
    -webkit-mask-size: 20px;
    margin-right: 15px
}

.verified-profile .profile-info span:after {
    content: '';
    width: 22px;
    height: 22px;
    display: flex;
    background: #6c63ff;
    -webkit-mask-size: 22px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/verify2.svg);
    margin-left: 2px
}

.banner-sets-top.genral-banner {
    background-image: url(../media/bn/undraw_settings_re_b08x.svg)
}

.language-settings, .theme-settings {
    margin-top: 40px;
    width: 100%;
    position: relative
}

.darkmode-banner {
    height: 100px;
    position: absolute;
    right: 0;
    margin-right: 0;
    margin-top: 5px;
    top: 0;
    width: 100px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../media/bn/undraw_dark_mode_2xam.svg)
}

.info-field-sets, .switch-language, .switch-light-dark {
    display: flex;
    margin-top: 20px
}

.switch-language span, .switch-light-dark span {
    padding: 10px 20px;
    background: #f5f5f5;
    font-size: 16px;
    font-family: var(--regular);
    border-radius: 15px;
    margin-right: 15px;
    line-height: 22px
}

.dark .btn-menu-home.dark-home:after, span.light-mode:before {
    content: 'Light'
}

.ar .arabic, .dark span.dark-mode, .switch-light-dark.dark-swspan.dark-mode, span.english, span.light-mode {
    background: #6c63ff;
    color: #fff
}

.btn-menu-home.dark-home:after, span.dark-mode:after {
    content: 'Dark'
}

.ar span.english, .switch-light-dark.dark-swspan.light-mode {
    background: #f5f5f5;
    color: #000007
}

.banner-sets-top.personinfo-banner {
    background-image: url(../media/bn/undraw_information_tab_re_f0w3.svg)
}

.info-field-sets {
    height: 50px;
    border-radius: 15px;
    background: #f5f5f5;
    position: relative
}

.info-field-sets input {
    background: 0 0;
    font-size: 14px;
    font-family: var(--regular);
    margin-left: 50px;
    pointer-events: none;
    width: 70%;
    text-overflow: ellipsis;
    overflow: hidden
}

.info-field-sets a, .info-field-sets:before {
    width: 20px;
    height: 20px;
    bottom: 0;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 20px;
    display: flex;
    top: 0
}

.info-field-sets:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Broken/Profile.svg);
    background: #999;
    position: absolute;
    margin: auto auto auto 20px
}

.info-field-sets a, .save-cansle-btns:after, .save-cansle-btns:before {
    background: #000007;
    content: '';
    position: absolute
}

.info-field-sets a {
    -webkit-mask-image: url(../media/svg/Broken/Edit%20Square.svg);
    right: 0;
    margin: auto 20px auto auto
}

.save-cansle-btns button:last-child {
    left: 0
}

.save-cansle-btns:before {
    width: calc(50% + -49px);
    border-top-left-radius: 1px;
    height: 50px
}

.save-cansle-btns:after {
    width: 65px;
    height: 27px;
    right: 0;
    left: 0;
    margin: auto;
    transform: translateX(-10px);
    z-index: 0;
    bottom: 0
}

.save-cansle-btns button {
    height: 50px;
    width: 50%;
    background: 0 0 !important;
    position: absolute;
    z-index: 5
}

.banner-sets-top.loginsets-banner, .banner.loginban {
    background-image: url(../media/bn/undraw_login_re_4vu2.svg)
}

.info-field-sets.phone-sets:before {
    -webkit-mask-image: url(../media/svg/Broken/Call.svg)
}

.banner-sets-top.password-banner {
    background-image: url(../media/bn/undraw_forgot_password_re_hxwm.svg)
}

.password-cahnge-sets {
    margin-top: 40px;
    border-top: 1px solid #f0f0f0;
    width: 100%;
    padding-top: 40px
}

.hide-show-pass:after, .hide-show-pass:before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 20px;
    background: #000007;
    opacity: 0
}

.follow-noti .img-user-listing:before, .image-noti-data:before {
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    bottom: 0;
    z-index: 2
}

.hide-show-pass {
    position: absolute;
    width: 55px;
    height: 50px;
    right: 0;
    background: 0 0;
    display: flex
}

.inner-msg-post, .msg-page .msgsload .post-profile-info a, .msg-page .msgsload .post-profile-info span, .msg-page .msgsload .post-text p {
    background: #f5f5f5
}

.hide-show-pass:before {
    -webkit-mask-image: url(../media/svg/Broken/Show.svg);
    opacity: 1
}

.hide-show-pass:after {
    -webkit-mask-image: url(../media/svg/Broken/Hide.svg)
}

.hide-show-pass.show:before {
    opacity: 0
}

.hide-show-pass.show:after, .selector-follow.selected:after {
    opacity: 1
}

.inset-noti-data, .post-msgs-all {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative
}

.msg-post {
    width: 100%;
    position: relative;
    padding-bottom: 10px;
    padding-top: 10px;
    display: flex
}

.post-msg-profile-info a, .post-msg-profile-info span {
    font-size: 14px;
    font-family: var(--regular);
    line-height: 18px
}

.inner-msg-post {
    width: 100%;
    margin-left: 60px;
    border-radius: 20px
}

.post-msg-header .pppi {
    margin-left: -60px
}

.post-msg-profile-info {
    margin-left: 0;
    margin-top: 14px;
    display: flex;
    position: absolute;
    width: 100%
}

.post-msg-profile-info span {
    font-weight: 700;
    color: #000007;
    display: flex;
    margin-right: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: visible;
    margin-left: 20px
}

.post-msg-profile-info a {
    color: #999;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
    margin-right: 25px
}

.msg-post .more-post-btn {
    margin-top: 23px;
    margin-right: 14px
}

.post-msg-text {
    display: grid;
    margin: -10px 20px 10px;
    word-break: break-word
}

.msg-post .time-full-post {
    display: flex;
    width: 100%;
    direction: ltr;
    margin-left: 20px;
    margin-top: 8px;
    margin-right: auto
}

.post-msgs-container {
    overflow: hidden;
    width: 100%;
    height: fit-content;
    position: relative
}

.mask .main-menu-top {
    background: #fff;
    z-index: 2
}

.msg-post .time-full-post span {
    font-size: 12px;
    font-family: var(--regular);
    display: flex;
    line-height: 15px
}

.post-msg-footer {
    direction: rtl;
    width: 100%;
    margin-top: 5px;
    padding-bottom: 8px
}

.empty-pages-banner, .inset-notifcation {
    margin: auto;
    position: absolute;
    right: 0;
    left: 0
}

.post-msg-text p {
    font-size: 16px;
    line-height: 22px;
    font-family: var(--regular);
    padding-top: 0
}

.follow-noti .follow-list-user:before, .inset-alert-messages p, .noti-bottom p, .noti-footer span, .noti-header span {
    font-size: 14px;
    font-family: var(--regular)
}

.share-all-reply .box {
    margin-top: 12px;
    background: #ddd
}

.editlink input, .info-field-sets.edting input, .password-cahnge-sets input {
    pointer-events: visible
}

.inset-notifcation {
    width: 100%;
    padding-bottom: 100px
}

.empty-pages-banner {
    height: 200px;
    width: 250px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    top: 0;
    bottom: 0;
    display: flex;
    transform: translateY(-100px)
}

.noti-bottom, .noti-footer {
    margin-top: 10px
}

.follow-noti .noti-footer span, .noti-bottom, .noti-footer, .noti-header {
    margin-left: 60px
}

.empty-pages-banner:after {
    font-size: 18px;
    font-family: var(--regular);
    color: #000007;
    bottom: 0;
    position: absolute;
    margin-bottom: -65px;
    text-align: center;
    display: flex;
    right: 0;
    width: fit-content;
    left: 0;
    margin-right: auto;
    margin-left: auto
}

.empty-pages-banner.noti-banner {
    background-image: url(../media/bn/undraw_my_notifications_re_ehmk.svg)
}

.empty-pages-banner.noti-banner:after {
    content: 'There\'s no new notification'''
}

.empty-pages-banner.msg-banner {
    background-image: url(../media/bn/undraw_real_time_collaboration_c62i.svg)
}

.empty-pages-banner.msg-banner:after {
    content: 'There\'s no new messages'''
}

.image-noti-data {
    height: 50px;
    width: 50px;
    border-radius: 50%;
    position: absolute;
    background-position: center;
    background-size: cover;
    background-image: url(../media/profile/user.jpg)
}

.noti-data {
    width: 100%;
    position: relative;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 15px;
    padding-top: 15px;
    background: rgb(108 99 255 / 4%)
}

.noti-header span {
    line-height: 14px;
}

.noti-header {
    padding-right: 20px
}

.noti-bottom {
    background: rgb(0 0 0 / 4%);
    border-radius: 15px;
    padding: 5px 15px;
    direction: rtl
}

.noti-bottom p {
    line-height: 20px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.noti-footer span {
    color: #999;
    line-height: 14px
}

.follow-noti .img-user-listing:after, .image-noti-data:after {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    background: #000007;
    border-radius: 50%;
    bottom: 0;
    right: 0
}

.image-noti-data:before {
    content: '';
    position: absolute;
    width: 14px;
    height: 14px;
    display: flex;
    background: #fff;
    right: 0;
    -webkit-mask-image: url(../media/svg/Broken/Message.svg);
    margin-right: 3px;
    margin-bottom: 3px
}

.inset-noti-data:after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #6c63ff;
    margin-top: 10px
}

.follow-noti .noti-footer {
    right: 0;
    left: 0;
    margin: auto;
    width: 88%;
    display: flex
}

.follow-noti .img-user-listing:before {
    border-radius: 0 !important;
    opacity: 1 !important;
    transform: none !important;
    content: '';
    position: absolute !important;
    width: 14px !important;
    height: 14px !important;
    display: flex !important;
    background: #fff !important;
    right: 0;
    -webkit-mask-image: url(../media/svg/Broken/Add%20User.svg);
    margin-right: 3px !important;
    margin-bottom: 3px !important
}

.follow-noti .follow-list-user {
    margin-right: 6%;
    border-radius: 25px;
    width: 100px;
    border: 1px solid #6c63ff;
    background: 0 0;
    height: 28px;
    line-height: 18px
}

.follow-noti .follow-list-user:before {
    content: 'Follow back';
    -webkit-mask-image: none;
    color: #6c63ff;
    text-align: center;
    background: 0 0;
    margin-top: 6px
}

.follow-noti .follow-list-user[datafn=unfollow]:before {
    content: 'Followed';
    color: #fff
}

.follow-noti .follow-list-user[datafn=unfollow] {
    background: #6c63ff;
    width: 80px
}

.noti-data[state=seen] {
    background: 0 0
}

.divalert-messages {
    right: 0;
    left: 0;
    width: 88%;
    display: grid;
    position: relative;
    margin: auto;
    padding-bottom: 10px;
    margin-top: 20px;
}

.inset-alert-messages {
    right: 0;
    left: 0;
    margin: auto;
    width: 100%;
    background: rgb(108 99 255 / 15%);
    border-radius: 15px;
    display: flex;
    position: relative;
    padding: 15px 0
}

.inset-alert-messages:after {
    content: '';
    width: 40px;
    height: 40px;
    background: #6c63ff;
    position: absolute;
    border-radius: 50%;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto auto auto 15px
}

.inset-alert-messages:before {
    content: '';
    width: 24px;
    height: 24px;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto auto auto 23px;
    position: absolute;
    background: #fff;
    z-index: 2;
    transform: translateY(-2px);
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Bold/Danger.svg)
}

.divalert-messages:before, .image-cclog, .mask[muted=muted] .dir-profile-all:before {
    background-repeat: no-repeat;
    background-position: center
}

.inset-alert-messages p {
    margin-left: 70px;
    margin-right: 15px
}

.divalert-messages:before {
    display: none;
    content: '';
    width: 100%;
    position: relative;
    height: 100px;
    background-size: contain;
    background-image: url(../media/bn/undraw_notify_re_65on.svg);
    margin-bottom: 20px
}

.inset-alert-messages p a {
    font-weight: 700;
    color: #6c63ff;
    position: relative
}

.post.muted .pppi {
    background-image: url(../media/profile/user.jpg) !important
}

.post.muted.music .inner-post {
    border-radius: 20px !important
}

.mask[muted=muted] .dir-profile-all:before {
    content: '';
    background-image: url(../media/bn/undraw_resume_re_hkth.svg);
    width: 100%;
    height: 200px;
    background-size: contain;
    position: relative;
    display: flex;
    margin-top: 40px
}

.mask[muted=muted] .dir-profile-all:after {
    content: 'This user is muted';
    font-size: 20px;
    font-family: var(--regular);
    transform: rotate(-90deg) translateY(-72px);
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    margin: auto auto auto 6%;
    display: flex;
    height: 20px
}

.info-cclog a, .info-cclog span, .post.muted .post-text:before {
    font-size: 16px;
    font-family: var(--regular)
}

.post.muted .post-profile-info:before {
    content: 'Muted user'
}

.post.muted .post-profile-info:after {
    content: '#muted_user';
    margin-left: 5px
}

.post.muted .post-text {
    margin-top: 12px;
    display: flex
}

.post.muted .post-text:before {
    content: 'View';
    border: 1px solid #6c63ff;
    color: #6c63ff;
    border-radius: 15px;
    width: 100%;
    text-align: center;
    padding: 5px 0;
    margin-top: 5px;
    height: 20px;
    line-height: 22px
}

.menu-share-outer.muted-menu .action-menu.reply:after {
    content: 'View message content'
}

.menu-share-outer.muted-menu .action-menu.mute-user:after, .menu-share-outer.storemute .action-menu.mute-user:after {
    content: 'Unblock user messages'
}

.menu-share-outer.muted-menu .action-menu.mute-user:before, .menu-share-outer.storemute .action-menu.mute-user:before, .section-btn-cclog.settings-cclog.muted-cclog:before {
    -webkit-mask-image: url(../media/svg/Broken/Volume%20Up.svg)
}

.bottom-logout-cclog {
    position: absolute;
    bottom: 0;
    width: 100%;
    display: grid;
    direction: ltr;
    height: 120px
}

.profile-log-menu {
    right: 0;
    left: 0;
    position: absolute;
    width: 88%;
    margin: auto;
    height: 100%
}

.image-cclog {
    width: 50px;
    height: 50px;
    position: absolute;
    background-size: cover;
    background-image: url(../media/profile/user.jpg);
    border-radius: 50%;
    top: 0;
    bottom: 0;
    margin: auto
}

.logout-btn, .section-btn-cclog:before {
    height: 35px;
    background: #000007;
    right: 0;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute
}

.info-cclog {
    display: block;
    top: 0;
    bottom: 0;
    margin: auto auto auto 60px;
    position: absolute;
    height: 35px
}

.info-cclog span {
    font-weight: lighter;
    line-height: 20px;
    margin-bottom: 0;
    display: flex
}

.info-cclog a {
    line-height: 20px;
    margin-top: 0;
    display: flex;
    color: #999
}

.logout-btn {
    width: 35px;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-mask-size: 24px
}

.sections-cclog {
    position: absolute;
    width: 100%;
    display: block;
    margin-top: 120px
}

.section-btn-cclog {
    transition: .1s;
    width: 50%;
    height: 120px;
    border: 1px solid #f0f0f0;
    margin-bottom: 35px;
    border-radius: 15px;
    position: relative
}

.flex-prof-cclog .section-btn-cclog:first-child {
    margin-right: 35px
}

.section-btn-cclog:after {
    content: 'Settings';
    width: 100%;
    display: flex;
    font-family: var(--regular);
    font-weight: 400;
    text-align: center;
    position: absolute;
    justify-content: center;
    margin-top: 70px
}

.section-btn-cclog:before {
    content: '';
    display: flex;
    left: 0;
    width: 35px;
    margin: 30px auto auto;
    -webkit-mask-size: contain;
    -webkit-mask-image: url(../media/svg/Broken/Setting.svg)
}

.image-sets, .welcomebanner:before {
    background-position: center;
    background-repeat: no-repeat
}

.sections-cclog.blocked-cclog .section-btn-cclog {
    direction: ltr;
    border: none;
    height: 60px;
    width: 100%;
    margin-right: 0;
    margin-bottom: 0;
    display: flex
}

.sections-cclog.blocked-cclog .section-btn-cclog:after {
    justify-content: normal;
    top: 0;
    bottom: 0;
    margin: auto auto auto 40px;
    line-height: 20px;
    font-weight: 700;
    height: 16px
}

.sections-cclog.blocked-cclog .section-btn-cclog:before {
    width: 28px;
    height: 28px;
    margin-top: auto;
    margin-left: 0;
    bottom: 0;
    top: 0;
    margin-bottom: auto
}

.box.cclog-dark {
    right: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto
}

.section-btn-cclog.dark-mode-cclog:after {
    content: 'Dark mode'
}

.section-btn-cclog.share-profile-cclgo:after {
    content: 'Share profile'
}

.section-btn-cclog.report-issue-cclog:after {
    content: 'Support'
}

.section-btn-cclog.report-issue-cclog:before {
    -webkit-mask-image: url(../media/svg/Broken/3%20User.svg)
}

.btn-menu-home.dark-home:before, .section-btn-cclog.dark-mode-cclog:before {
    -webkit-mask-image: url(../media/svg/moon.svg)
}

.inlog-user .section-btn-cclog.settings-cclog:after, .outlog-user .section-btn-cclog.settings-cclog:after {
    content: 'Mute user'
}

.inlog-user .section-btn-cclog.report-issue-cclog:after, .outlog-user .section-btn-cclog.report-issue-cclog:after {
    content: 'Report user'
}

.section-btn-cclog.settings-cclog.muted-cclog:after {
    content: 'Unmute user'
}

.outest-profile-image.viewed .profile-image-full:before, .textarea .inner-post-qoute, .viewed .story-image {
    border-color: #f0f0f0
}

textarea.submit-comment {
    border: none;
    width: 100%;
    font-size: 14px;
    font-family: var(--regular);
    background: 0 0
}

.section-btn-cclog.login-cclog:after {
    content: 'Log in or sign up'
}

.welcomebanner:before {
    content: '';
    width: 100%;
    position: absolute;
    height: 150px;
    background-size: contain;
    background-image: url(../media/bn/undraw_welcome_cats_thqn.svg)
}

.welcomebanner:after {
    content: 'We hope you enjoy your time!';
    font-family: var(--regular);
    font-size: 18px;
    width: 100%;
    display: inline;
    position: absolute;
    margin-top: 170px;
    text-align: center
}

.showed-connect span, .showed-connect:after {
    display: grid;
    right: 0;
    font-family: var(--regular);
    left: 0
}

.image-sets {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background-size: cover
}

.connected-social {
    width: 100%;
    margin-top: 40px;
    border-top: 1px solid #f0f0f0;
    padding-top: 30px;
    position: relative;
    height: 160px
}

.showed-connect:before {
    content: '';
    width: 40px;
    height: 40px;
    -webkit-mask-size: 30px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
    right: 0;
    left: 0;
    margin: 10px auto auto;
    background: #000007
}

.showed-connect:after {
    font-size: 16px;
    text-align: center;
    margin: -60px auto auto;
    width: 100%
}

.inset-connect-login {
    display: flex;
    position: relative
}

.showed-connect {
    position: relative;
    text-align: center;
    justify-content: center;
    width: fit-content;
    align-items: center;
    margin: 5px auto auto
}

.showed-connect.google-connect:after {
    content: 'Google'
}

.showed-connect span {
    padding: 5px 10px;
    font-size: 14px;
    background: #f0f0f0;
    color: #999;
    border-radius: 5px;
    position: relative;
    margin: 90px auto auto;
    width: fit-content
}

.showed-connect span:after {
    content: 'Connect'
}

span.connected:after {
    content: 'Connected'
}

span.connected {
    background: #e8f5e9 !important;
    color: #1b5e20 !important
}

.stnflex-muted-fetch a {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    display: flex;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-right: 5px;
    margin-left: 0
}

.deflex-search-input {
    border-radius: 20px;
    height: 50px;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    background: #f5f5f5;
    display: flex;
    transition: .2s;
    z-index: 9;
    margin-top: 0 !important
}

#menu-home-btn {
    transform: scale(0);
    transition: .2s
}

#menu-home-btn span {
    -webkit-mask-image: url(../media/svg/Broken/Category.svg) !important
}

.timeline {
    margin-bottom: 200px
}

.dark span.light-mode {
    background: #fff;
    color: #000007
}

.search-container {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative
}

.deflex-search-input input {
    width: 100%;
    background: 0 0;
    font-size: 14px;
    font-family: var(--regular);
    margin-left: 50px
}

.deflex-search-input a, .deflex-search-input:before {
    width: 50px;
    height: 50px;
    -webkit-mask-size: 20px;
    content: '';
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute
}

.deflex-search-input:before {
    background: #999;
    -webkit-mask-image: url(../media/svg/Broken/Search.svg)
}

.deflex-search-input a {
    background: #000007;
    -webkit-mask-image: url(../media/svg/Broken/Scan.svg);
    right: 0;
    z-index: 9
}

.search-banner-home {
    width: 88%;
    right: 0;
    left: 0;
    height: 250px;
    margin: 25px auto auto;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../media/bn/undraw_startled_-8-p0r.svg)
}

.search-home-opend {
    z-index: 2;
    height: fit-content;
    overflow: visible;
    position: absolute;
    transition: none;
    min-height: 100%;
    width: 100%;
    margin-top: 60px;
    padding-bottom: 100%;
    background: #fff
}

.search-container.opend-search {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99
}

.search-home-opend.empty {
    background-image: url(../media/bn/search.svg);
    background-repeat: no-repeat;
    background-size: 150px;
    background-position: center 80px
}

.search-home-opend.empty:after {
    content: 'No resaults yet';
    font-family: var(--regular);
    font-size: 14px;
    display: inline;
    position: absolute;
    margin: 220px auto auto;
    text-align: center;
    width: 100%
}

.menu-home-back {
    height: 100%;
    width: 100%;
    position: fixed;
    z-index: 9999;
    background: rgb(0 0 7 / 70%);
    top: 0
}

.inner-menu-home {
    position: fixed;
    width: 80%;
    max-width: 360px;
    transform: scale(0);
    transition: .2s;
    height: fit-content;
    max-height: 500px;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    display: flex;
    z-index: 999999;
    flex-wrap: wrap;
    justify-content: center
}

.btn-menu-home {
    transition: .1s;
    width: 100px;
    height: 100px;
    background: #fff;
    margin-right: 10px;
    margin-left: 10px;
    position: relative;
    margin-bottom: 20px;
    border-radius: 15px;
    justify-content: center;
    display: grid
}

.post-music-image, .timeline-empty-content {
    background-repeat: no-repeat;
    background-position: center
}

.btn-menu-home:before {
    content: '';
    width: 35px;
    height: 35px;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    display: flex;
    background: #000007;
    right: 0;
    left: 0;
    margin: 20px auto auto;
    position: absolute
}

.btn-menu-home.login-home:after {
    content: 'Logout'
}

.btn-menu-home.dark-home:before {
    height: 38px;
    width: 38px
}

.btn-menu-home.terms-home:before {
    -webkit-mask-image: url(../media/svg/Broken/Paper.svg)
}

.btn-menu-home:after {
    font-family: var(--regular);
    font-size: 16px;
    width: 100%;
    text-align: center;
    margin-top: 60px
}

.btn-menu-home.privacy-home:after {
    content: 'Privacy'
}

.btn-menu-home.terms-home:after {
    content: 'Terms'
}

body[state=outlog] .btn-menu-home.login-home:before {
    -webkit-mask-image: url(../media/svg/Broken/Login.svg) !important
}

body[state=outlog] .btn-menu-home.login-home:after {
    content: 'Login' !important
}

.stnflex-words-fetch:empty:after {
    content: 'No black list words added'
}

.stnflex-muted-fetch:empty:after {
    content: 'No muted accounts'
}

.stnflex-muted-fetch:empty:after, .stnflex-words-fetch:empty:after {
    font-family: var(--regular);
    font-size: 14px;
    color: #999;
    width: 100%;
    margin-top: 10px
}

.dark .btn-menu-home.dark-home:before {
    -webkit-mask-image: url(../media/svg/sun.svg);
    width: 35px;
    height: 35px
}

.timeline-empty-content {
    position: relative;
    width: 100%;
    height: 250px;
    background-image: url(../media/bn/undraw_camping_noc8.svg);
    background-size: contain;
    margin-top: 20px;
    margin-bottom: 80px
}

.timeline-empty-content:after {
    content: 'You don\'t have any users you follow,to show messages in your timeline follow some frinds to see their answers';
    font-size: 14px;
    font-family: var(--regular);
    line-height: 16px;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto auto -60px;
    position: absolute;
    bottom: 0
}

body[state=outlog] .timeline .thred-post.actred:last-of-type .inner-post:after {
    content: 'Sign up or log in to ONVO and join our family to receive questions from anonymous users and connect all your social media accounts in one link';
    font-size: 14px;
    font-family: var(--regular);
    line-height: 16px;
    width: 100%;
    right: 0;
    left: 0;
    margin: auto auto -185px;
    position: absolute;
    bottom: 0;
    direction: ltr;
    display: flex;
    background: 0 0;
    color: #999
}

.post.music .inner-post {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.post-music {
    width: 100%;
    position: relative;
    display: flex;
    z-index: 99;
    margin-top: 5px;
}

.post-music-image {
    background-color: rgb(255 255 255 / 20%);
    width: 50px;
    height: 50px;
    border-radius: 15px;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
}

.dark .post-music-image {
    background-color: #303036;
}

.inner-post-music {
    display: grid;
    width: 100%;
    height: 50px;
    position: relative;
}

.info-music-post {
    display: grid;
    margin-left: 60px;
    direction: ltr;
    margin-right: 50px;
    margin-top: 5px;
}

.info-music-post span {
    font-size: 14px;
    font-family: var(--regular);
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 20px;
    height: 20px;
    margin-bottom: 0;
    color: #fff;
}

.info-music-post a {
    font-size: 12px;
    font-weight: 400;
    font-family: var(--regular);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-top: -8px;
    line-height: 20px;
    color: #fff;
    opacity: .5;
    margin-left: 15px;
    display: block;
}

.info-music-post a:before {
    margin-top: -1px;
    content: '';
    width: 15px;
    height: 20px;
    background: #eee;
    position: absolute;
    margin-left: -15px;
    -webkit-mask-image: url(../media/svg/Bulk/Profile.svg);
    -webkit-mask-position: center left;
    -webkit-mask-size: 12px;
    display: flex;
    background: #fff;
    -webkit-mask-repeat: no-repeat;
}

.play-music:after, .play-music:before {
    content: '';
    -webkit-mask-position: center right;
    -webkit-mask-size: 24px;
    width: 100%;
    height: 100%;
    display: flex;
    background: #fff;
    position: absolute;
    -webkit-mask-repeat: no-repeat
}

.delete-textarea-perview, .info-gcsp a:before, .movies-search-input:before, .music-search-input:before, .search-movies-btn:after, .search-music-btn:after, button.send-music:after {
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center
}

.play-music {
    position: absolute;
    right: 0;
    width: 40px;
    height: 40px;
    display: flex;
    margin-top: 8px;
    border-radius: 16px;
}

.post.music .inner-post:after {
    padding-bottom: 80px
}

.play-music:before {
    -webkit-mask-image: url(../media/svg/Broken/Play.svg)
}

.played .play-music:before {
    visibility: hidden;
}

.dark .delete-textarea-perview {
    background: #fff;
}

.play-music:after {
    visibility: hidden;
    -webkit-mask-image: url(../media/svg/pause.svg)
}

.textarea .play-music:before, .textarea .play-music:after {
    -webkit-mask-position: center;
}

.textarea .play-music {
    margin-right: 20px;
    margin-top: 0;
}

.played .play-music:after {
    visibility: visible;
}

.textarea .inner-post-music {
    margin-left: 0;
    margin-bottom: 20px;
}

.textarea .post-music-image {
    margin-left: 50px
}

.textarea .info-music-post {
    margin-left: 120px;
    margin-top: 0;
}

.delete-textarea-perview {
    width: 50px;
    height: 60px;
    position: absolute;
    z-index: 999;
    background: #000007;
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
    -webkit-mask-size: 22px;
    display: flex
}

.add-gcsp, button.send-music:after {
    content: '';
    -webkit-mask-image: url(../media/svg/addsong.svg)
}

button.send-music {
    border-radius: 50%;
    width: 60px;
    height: 55px;
    border: none;
    background: 0 0;
    display: flex;
    position: absolute;
    top: 0;
    right: 0
}

button.send-music:after {
    background: #000007;
    border-radius: 50%;
    border: none;
    width: 100%;
    height: 100%;
    -webkit-mask-size: 24px;
    position: absolute
}

.backdrop-music {
    width: 100%;
    position: fixed;
    height: 100%;
    background: #000007;
    opacity: .7;
    z-index: 99999
}

.inner-music-search {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute
}

.music-deflex-secion {
    left: 0;
    right: 0;
    height: 55px;
    margin: auto;
    width: 88%;
    margin-top: 30px;
    display: flex
}

.search-movies-btn, .search-music-btn {
    width: 55px;
    height: 55px;
    position: absolute;
    border-radius: 10px;
    background: rgb(255 255 255 / 10%)
}

.movies-search-input, .music-search-input {
    overflow: hidden;
    width: 100%;
    display: flex;
    height: 55px;
    background: rgb(255 255 255 / 10%);
    margin-left: 65px;
    border-radius: 15px;
    position: relative
}

.search-movies-btn:after, .search-music-btn:after {
    content: '';
    -webkit-mask-image: url(../media/svg/Broken/Scan.svg);
    background: #fff;
    -webkit-mask-size: 24px;
    width: 100%;
    height: 100%;
    position: absolute
}

.movies-search-input:before, .music-search-input:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Broken/Search.svg);
    background: #fff;
    -webkit-mask-size: 24px;
    width: 24px;
    height: 100%;
    position: absolute;
    opacity: .2;
    margin-left: 15px
}

.movies-search-input input, .music-search-input input {
    padding-right: 20px;
    width: 100%;
    color: #fff;
    background: 0 0;
    border: none;
    font-weight: 400;
    font-family: var(--regular);
    font-size: 16px;
    height: 30px;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    margin-left: 50px;
    position: relative;
}

.movies-search-input input::placeholder, .music-search-input input::placeholder {
    color: rgb(255 255 255 / 20%)
}

.image-gcsp {
    height: 60px;
    width: 60px;
    border-radius: 10px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    justify-content: center;
    display: flex;
    position: absolute
}

.music-get-search {
    width: 100%;
    display: flex;
    margin-top: 22px;
    height: 60px;
    position: relative
}

.search-music-fetch, .search-rowsmusic-fetch {
    left: 0;
    right: 0;
    margin: auto;
    width: 88%;
    height: 100%;
    padding-bottom: 20px;
    padding-top: 2px
}

.info-gcsp a, .info-gcsp span {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #fff;
    font-family: var(--regular);
    line-height: 14px;
    height: 14px;
    margin-top: 5px;
    margin-bottom: auto
}

.info-gcsp {
    margin-left: 75px;
    display: grid;
    margin-right: 70px
}

.add-gcsp, .add-gcsp:after {
    display: flex;
    position: absolute
}

.info-gcsp span {
    font-size: 16px;
    font-weight: 700;
    font-family: gilroy-medium;
    line-height: 18px;
    height: 18px;
    margin-top: auto;
    padding-top: 2px;
    margin-bottom: 0
}

.add-gcsp:after, .info-trending span {
    font-family: var(--regular);
    color: #fff
}

.info-gcsp a {
    font-size: 14px;
    padding-left: 15px;
    opacity: .5
}

.info-gcsp a:before {
    content: '';
    width: 12px;
    height: 12px;
    -webkit-mask-image: url(../media/svg/Bold/Profile.svg);
    background: #fff;
    -webkit-mask-size: contain;
    position: absolute;
    opacity: .5;
    margin-left: -15px
}

.add-gcsp {
    height: 100%;
    width: 40px;
    background: #fff;
    -webkit-mask-size: 30px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    right: 0;
    overflow: visible
}

.image-gcsp:before, .trinding-play {
    -webkit-mask-image: url(../media/svg/Bulk/Play.svg);
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    right: 0;
    top: 0
}

.add-gcsp:after {
    content: '+';
    font-size: 25px;
    font-weight: 700;
    z-index: 999
}

.image-gcsp:before {
    content: '';
    background: #fff;
    width: 30px;
    height: 30px;
    left: 0;
    position: absolute;
    bottom: 0;
    margin: auto
}

span.top-header-spsrqq {
    padding-left: 6%;
    padding-right: 6%;
    font-size: 30px;
    font-weight: lighter;
    margin-top: 32px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 34px;
    font-family: var(--regular);
    color: #fff
}

.trending-section {
    height: 190px;
    width: 210px;
    padding-right: 15px;
    padding-left: 15px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 30px;
    position: relative;
    display: grid;
    margin-right: 15px
}

.bottom-trending, .trending-section.loadtrending span {
    border-radius: 20px;
    margin-top: auto;
    margin-bottom: 20px;
    height: 70px;
    position: relative;
    bottom: 0
}

.bottom-trending {
    width: 100%;
    display: flex;
    background: rgb(55 50 133 / 79%);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px)
}

.info-trending span {
    margin-right: 65px;
    font-size: 14px;
    font-weight: 700;
    line-height: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-bottom: 0;
    margin-top: 20px
}

.info-trending a, .stories-content a {
    line-height: 14px;
    font-family: var(--regular)
}

.info-trending {
    display: grid;
    margin-left: 15px
}

.info-trending a {
    font-size: 10px;
    color: #fff;
    margin-top: -10px
}

.trinding-play {
    height: 50px;
    width: 50px;
    background: #fff;
    position: absolute;
    bottom: 0;
    margin: auto 15px auto auto
}

.add-trending-music {
    height: 40px;
    width: 40px;
    background: #fff;
    -webkit-mask-image: url(../media/svg/Broken/More%20Circle.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 24px;
    position: absolute;
    margin-top: 20px;
    right: 0;
    margin-right: 15px;
    top: 0
}

.story-image span, .user-top-image {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.music-search .page-header {
    background: 0 0 !important
}

.movies-container .header-top p, .music-search .header-top p {
    border-color: rgb(255 255 255 / 15%) !important
}

.music-sections-menu {
    padding-right: 6%;
    width: fit-content;
    display: flex;
    margin-left: 6%;
}

.music-sections-menu span:last-child {
    margin-right: 0 !important;
}

.export-body, .ios .main-menu-top, .ios .page-header, .music-section-container, .safty-body span {
    margin-top: 30px
}

.music-sections-menu span {
    line-height: 18px;
    width: fit-content;
    padding: 6px 8px;
    color: #fff;
    border-radius: 8px;
    display: grid;
    white-space: nowrap;
    margin-right: 15px;
    font-size: 14px;
    font-family: var(--regular)
}

.msg-qoute-text p, .msg-qoutr-flex-top a {
    margin-right: 10px
}

.music-sections-menu span.selected {
    background: linear-gradient(45deg, #4527a0, #673ab7)
}

.played .trinding-play:after {
    content: '';
    width: 5px;
    height: 20px;
    display: flex;
    top: 0;
    bottom: 0;
    margin: auto auto auto 2.5px;
    background: #fff;
    border-radius: 5px
}

.played .trinding-play {
    -webkit-mask-image: none;
    background: rgb(255 255 255 / 44%);
    border-radius: 50%;
    display: flex;
    width: 42px;
    height: 42px;
    margin-right: 20px
}

.played .trinding-play:before {
    content: '';
    width: 5px;
    height: 20px;
    display: flex;
    top: 0;
    bottom: 0;
    margin: auto 2.5px auto auto;
    background: #fff;
    border-radius: 5px
}

.music-get-search.loadmusic:before {
    content: '';
    height: 60px;
    width: 60px;
    border-radius: 15px;
    justify-content: center;
    display: flex;
    position: absolute;
    background: #fff;
    opacity: .1
}

.music-get-search.loadmusic span:before {
    content: '';
    width: 60%;
    margin-left: 70px;
    height: 12px;
    border-radius: 5px;
    background: #fff;
    opacity: .1;
    position: absolute;
    margin-top: 12px
}

.music-get-search.loadmusic span:after {
    content: '';
    width: 40%;
    margin-left: 70px;
    height: 12px;
    border-radius: 5px;
    background: #fff;
    opacity: .1;
    position: absolute;
    margin-top: 35px
}

.trending-section.loadtrending span:after, .trending-section.loadtrending span:before {
    content: '';
    margin-left: 15px;
    height: 12px;
    background: #fff;
    opacity: .1;
    border-radius: 5px;
    position: absolute
}

.trending-section.loadtrending {
    background: rgb(255 255 255 / 20%)
}

.trending-section.loadtrending span {
    width: 100%;
    display: flex;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    background: rgb(255 255 255 / 5%)
}

.trending-section.loadtrending span:before {
    width: 80%;
    margin-top: 20px
}

.trending-section.loadtrending span:after {
    width: 50%;
    margin-top: 42px
}

.msg-qoute-header.verified-profile span:after, .post-msg-profile-info.verified-profile span:after, .stories-content.add-story .story-image:after {
    background: #6c63ff;
    -webkit-mask-size: 18px;
    width: 15px;
    height: 15px;
    right: 0;
    content: '';
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.msg-qoutr-flex-top {
    margin-left: 0;
    margin-top: 10px
}

.inner-msg-qoute {
    margin-left: 20px;
    margin-right: 20px;
    direction: ltr;
    border: 1px solid #e5e5e5;
    border-radius: 20px
}

.sico.loadhrefs:before {
    -webkit-mask-image: url(../media/svg/Broken/Paper%20Download.svg)
}

.user-msg-image {
    margin-left: 10px;
    margin-top: 10px
}

.msg-qoutr-flex-top p {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.msg-qoute-text p {
    font-size: 14px;
    margin-left: 10px;
    font-family: var(--regular);
    line-height: 18px;
}

.msg-qoute {
    margin-bottom: 10px
}

.msg-qoute-header {
    width: 100%;
    display: flex;
    position: absolute
}

.msg-qoute-text {
    margin-top: 35px
}

.containerlog.container_flog .hideshowpaslog, .msg-qoutr-flex-top span {
    margin-left: 35px
}

.msg-qoute-header.verified-profile span:after, .post-msg-profile-info.verified-profile span:after {
    display: flex;
    top: 0;
    -webkit-mask-image: url(../media/svg/verify2.svg);
    margin-top: 0;
    margin-left: 3px;
    margin-right: -2px
}

.msg-qoute-header.verified-profile span {
    margin-right: 5px;
    overflow: visible;
    display: flex
}

.post-msg-profile-info.verified-profile span:after {
    margin-top: 2px
}

.reply-page-msg .post-profile-info {
    display: flex;
    position: absolute;
    top: 0;
    margin-left: 60px;
    margin-top: 0 !important
}

.reply-page-msg .post-profile-info span {
    font-size: 16px;
    font-family: var(--regular);
    font-weight: 700;
    margin-right: 5px;
    white-space: nowrap
}

.reply-page-msg .post-text {
    margin-top: -45px;
    word-wrap: break-word;
    word-break: break-all;
    line-height: 24px
}

.stories-container {
    overflow-y: hidden;
    overflow-x: scroll;
    margin-bottom: 20px;
    width: 100%
}

.stories-inset {
    padding-right: calc(6% + -20px);
    width: fit-content;
    margin-left: 6% !important;
    display: flex
}

.story-image {
    height: 56px;
    width: 56px;
    border-radius: 100px;
    position: relative;
    border: 2px solid #6c63ff;
    display: flex;
    transition: .1s
}

.story-image span {
    background-color: #f0f0f0;
    border: 2px solid #fff;
    width: 52px;
    height: 52px;
    background-image: url(../media/profile/user.jpg);
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    margin: auto;
    border-radius: 100px
}

.stories-content {
    margin-right: 20px;
    width: 60px
}

.stories-content a {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block;
    margin-top: 5px;
    width: 60px;
    text-align: center
}

.outest-profile-image.story .profile-image, .stories-content.add-story .story-image {
    border-color: transparent !important
}

.stories-content.add-story a:after {
    content: 'Add story'
}

.stories-content.add-story .story-image:after {
    border-radius: 50%;
    position: absolute;
    bottom: 0;
    border: 2px solid #fff
}

.stories-content.add-story .story-image:before {
    content: '';
    width: 15px;
    height: 15px;
    background: #fff;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 2px;
    margin-bottom: 2px;
    -webkit-mask-position: center;
    -webkit-mask-size: 8px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/plus.svg);
    z-index: 2
}

.my-story {
    margin-left: -4px
}

.user-top-stories {
    top: 0;
    left: 0;
    position: absolute;
    z-index: 99;
    display: flex;
    margin-left: 6%;
    margin-top: 40px
}

.user-top-image {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #fff;
    margin-left: 40px
}

.user-stoies-info * {
    font-family: var(--regular);
    color: #fff;
    line-height: 16px
}

.user-stoies-info span {
    font-weight: 700;
    margin-top: 5px;
    font-size: 16px
}

.user-stoies-info {
    display: grid;
    margin-left: 10px
}

.user-stoies-info a {
    margin-top: -2px;
    font-size: 14px;
    display: flex
}

.bottom-stories-text p, button.story-add-btn:after, textarea.stroy-title {
    font-size: 16px;
    color: #fff;
    font-family: var(--regular);
    text-align: center
}

.user-stoies-info a p {
    margin-left: 6px;
    display: flex;
    opacity: .5
}

.user-stoies-info a p:before {
    content: '';
    width: 2px;
    height: 2px;
    border-radius: 50%;
    display: flex;
    background: #fff;
    margin-top: 6px;
    margin-right: 6px
}

.user-top-stories:before {
    content: '';
    width: 24px;
    height: 30px;
    -webkit-mask-position: center;
    -webkit-mask-size: 70px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/logo.svg);
    background: #fff;
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    display: flex
}

.top-close-stories:after, .top-close-stories:before {
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Down%202.svg);
    content: '';
    width: 24px;
    height: 24px;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    background: #fff;
    -webkit-mask-position: center
}

.top-close-stories:after, .top-stories-bar {
    margin: 20px auto auto;
    position: absolute;
    left: 0;
    top: 0;
    right: 0
}

.trending-container, .music-section-container {
    overflow-x: scroll;
    overflow-y: hidden;
}

.trending-search-fetch {
    margin-left: 6%;
    padding-right: calc(6% + -20px);
    width: fit-content;
}

.top-stories-bar {
    width: 88%;
    height: 2px;
    background: rgb(255 255 255 / 35%);
    z-index: 99
}

.top-stories-bar span {
    background: #fff;
    height: 100%;
    width: 0;
    position: absolute
}

.scaleffect {
    transform: scale(.8) !important
}

.scaleffectmin {
    transform: scale(.9) !important
}

.bottom-stories-text {
    position: absolute;
    z-index: 99;
    bottom: 0;
    padding-top: 15px;
    padding-bottom: 15px;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto auto 90px;
    border-bottom: 1px solid
}

.bottom-stories-text p {
    direction: rtl;
    line-height: 26px;
    margin-right: 20px;
    margin-left: 20px;
    word-wrap: break-word;
    word-break: break-word
}

.top-close-stories:after {
    transform: rotate(180deg);
    visibility: hidden
}

.top-close-stories {
    position: fixed;
    margin-right: 25px;
    width: 50px;
    height: 50px;
    justify-content: center;
    align-items: center;
    top: 0;
    right: 0;
    margin-top: 25px;
    z-index: 99
}

.left-story-click, .right-story-click {
    margin-top: 100px;
    z-index: 999;
    width: 50px
}

.top-close-stories:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

textarea.stroy-title {
    background: 0 0;
    resize: none;
    width: 100%;
    border: none;
    position: relative;
    display: none
}

.stories-main-page.addable .top-close-stories:after {
    visibility: visible
}

button.story-add-btn {
    align-items: center;
    height: 50px;
    width: 100%;
    right: 0;
    bottom: 0;
    position: absolute;
    background: #6c63ff;
    border-radius: 15px;
    margin-bottom: -75px;
    z-index: 9;
    display: none;
    justify-content: center;
    align-items: center;
    direction: rtl
}

button.story-add-btn:before {
    content: '';
    width: 24px;
    height: 24px;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Bulk/Send.svg);
    background: #fff;
    transition: .2s;
    position: absolute;
    right: 0;
    margin-right: 25px;
    transform: rotate(45deg)
}

button.story-add-btn:after {
    content: 'Add story'
}

.story-add-btn:disabled::after, .story-add-btn:disabled::before {
    opacity: .4
}

.right-story-click {
    right: 0;
    height: 100%;
    position: absolute
}

.left-story-click {
    left: 0;
    height: 100%;
    position: absolute
}

.deletion-section .privcysec:before, .stories-main-page.delete-story button.story-add-btn:before {
    -webkit-mask-image: url(../media/svg/Bulk/Delete.svg)
}

.views-storis-btn {
    position: fixed;
    bottom: 0;
    left: 0;
    padding: 5px 10px;
    border-radius: 20px;
    display: none;
    right: 0;
    margin: auto auto 20px;
    width: fit-content;
    z-index: 999
}

.views-storis-btn:before {
    content: '';
    width: 24px;
    position: relative;
    height: 24px;
    left: 0;
    display: flex;
    top: 0;
    margin-left: 0;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Bulk/Show.svg);
    background: #fff
}

.views-storis-btn a {
    color: #fff;
    font-size: 14px;
    font-family: var(--regular);
    line-height: 14px;
    margin-left: 3px;
    margin-top: 6px
}

.views-storis-btn a:after {
    content: 'View';
    margin-left: 3px
}

.flexers-stories-views {
    width: 100%;
    position: fixed;
    background: rgb(24 24 27 / 75%) !important;
    z-index: 9;
    bottom: 0;
    height: 50%;
    border-top-right-radius: 25px;
    border-top-left-radius: 25px;
    overflow: hidden;
    padding-top: 55px;
    transition: .2s;
    transform: translateY(100%);
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px)
}

.flexers-stories-views .img-user-listing {
    width: 40px;
    height: 40px
}

.flexers-stories-views .info-listing-user span {
    font-size: 14px;
    font-family: var(--regular);
    font-weight: 700;
    line-height: 18px
}

.flexers-stories-views .info-listing-user {
    margin-left: 55px;
    top: 0;
    margin-top: 12px;
    display: flex;
    height: 20px;
    position: absolute
}

.right-vsiew-section div:before, .ropviewsection:before {
    position: relative;
    height: 24px;
    -webkit-mask-size: 24px;
    background: #000007;
    display: flex;
    content: '';
    width: 24px;
    -webkit-mask-repeat: no-repeat;
    left: 0;
    top: 0
}

.ropviewsection {
    position: absolute;
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    top: 0;
    display: flex;
    border-bottom: 1px solid #f0f0f0;
    height: 55px
}

.ropviewsection:before {
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Broken/Show.svg);
    margin-left: 6%;
    margin-top: 15px
}

.ropviewsection a {
    font-size: 14px;
    font-family: gilroy-reqular;
    color: #000007;
    margin-top: 18px;
    margin-left: 5px
}

.right-vsiew-section {
    position: absolute;
    display: flex;
    right: 0;
    margin-right: 6%;
    margin-top: 15px;
    direction: rtl
}

.right-vsiew-section div {
    height: 50px;
    width: 50px;
    direction: rtl
}

.right-vsiew-section div:before {
    bottom: 0;
    right: 0;
    margin: auto 0 auto auto;
    -webkit-mask-position: center right
}

.input-exporting:before, button.exporting-btn:after {
    margin-left: 5px;
    width: 50px;
    -webkit-mask-size: 20px;
    height: 50px
}

.scroll-story-view {
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    padding-bottom: 25px
}

.flexer-stview-cont {
    z-index: 99999999;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0
}

.flexer-back-frvers {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
    background: #000007;
    opacity: .75;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px)
}

span.userdtae {
    direction: ltr;
    right: 0;
    position: absolute;
    font-size: 12px;
    color: #999;
    font-family: var(--regular);
    margin-top: 18px
}

.msg-insetop-flexdnt p, .msg-insetop-flexdnt span, .scroll-story-view.empty:before {
    font-size: 14px;
    color: #fff;
    font-family: var(--regular)
}

.flexers-stories-views .listing-user {
    height: 30px
}

.slider-currentsv.shadowed:before {
    position: absolute;
    width: 100%;
    height: 100px;
    background: rgb(0 0 0 / 75%);
    top: 0;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    content: '';
    z-index: 10
}

.slider-currentsv.shadowed .bottom-stories-text:before {
    position: absolute;
    width: 120%;
    margin-left: -10%;
    height: 113px;
    bottom: 0;
    background: linear-gradient(to top, #000, rgb(0 0 0 / 51%), transparent);
    content: '';
    z-index: -1
}

.back-story-continimg, .back-story-continimg span, .images-story-container {
    width: 100%;
    height: 100%;
    position: absolute
}

.images-story-container {
    display: flex;
    z-index: 9;
    top: 0;
    padding-bottom: 100px
}

.back-story-continimg {
    z-index: 1;
    display: flex;
    background-size: cover;
    background-position: center
}

.back-story-continimg span {
    background: rgb(0 0 0 / 90%);
    /*backdrop-filter: blur(15px);-webkit-backdrop-filter: blur(15px);*/
}

.left-imgs-icons span, button.btn-draw-sub span {
    background-size: cover;
    background-image: url(../media/profile/user.jpg)
}

.troser-rquine {
    width: 100%;
    height: fit-content;
    display: grid;
    top: 0;
    bottom: 0;
    margin: auto;
    position: relative;
    z-index: 9
}

.scroll-story-view.empty:before {
    content: 'No views yet,share your story to get more views';
    opacity: .2;
    text-align: center;
    width: 60%;
    right: 0;
    left: 0;
    position: absolute;
    margin: 25px auto auto
}

.actv-stryuser:last-child, .flexers-stories-views .listing-user:last-child {
    padding-bottom: 50px
}

.swiper-container {
    position: relative;
    width: 100%;
    display: flex
}

.outest-profile-image.story .profile-image-full:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    border: 3px solid #6c63ff;
    padding: 2px;
    border-radius: 50%;
    margin-top: -5px;
    margin-left: -5px
}

.outest-profile-image.story .profile-image-full {
    border-color: #fff
}

.top-notifs-fixed {
    width: 88%;
    height: 70px;
    background: rgb(22 21 29 / 85%);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    position: fixed;
    z-index: 9;
    right: 0;
    left: 0;
    margin: 20px auto auto;
    border-radius: 15px;
    border: 1px solid;
    transition: .2s;
    transform: translateY(-150px)
}

.export-banner, .left-imgs-icons span {
    background-repeat: no-repeat;
    background-position: center
}

.left-imgs-icons:before {
    content: '';
    width: 24px;
    position: absolute;
    height: 24px;
    margin-right: 20px;
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    background-color: #fff;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Bold/Message.svg);
    margin-top: 15px
}

.left-imgs-icons {
    margin-left: 15px;
    margin-top: 5px
}

.left-imgs-icons span {
    width: 15px;
    height: 15px;
    margin-top: 30px;
    position: absolute;
    border-radius: 50%;
    margin-left: 10px
}

.msg-insetop-flexdnt {
    margin-left: 40px;
    display: grid
}

.msg-insetop-flexdnt span {
    margin-top: 15px;
    line-height: 18px
}

.msg-insetop-flexdnt p {
    line-height: 18px;
    opacity: .4;
    margin-top: 2px
}

.notifs-layer-top {
    z-index: 9;
    width: 100%;
    position: fixed;
    top: 0
}

.top-notifs-fixed[type=user] .left-imgs-icons:before {
    -webkit-mask-image: url(../media/svg/Bold/Add%20User.svg)
}

.top-notifs-fixed[type=like] .left-imgs-icons:before {
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg)
}

.top-notifs-fixed[type=view] .left-imgs-icons:before {
    -webkit-mask-image: url(../media/svg/Bold/Show.svg)
}

.export-banner {
    width: 100%;
    height: 200px;
    background-size: contain;
    background-image: url(../media/bn/undraw_data_extraction_re_0rd3.svg);
    right: 0;
    left: 0;
    position: relative;
    display: flex;
    margin: auto
}

.exporting-container {
    right: 0;
    left: 0;
    width: 88%;
    position: absolute;
    margin: auto
}

.export-body span {
    font-size: 30px;
    font-family: var(--regular);
    font-weight: 400;
    line-height: 35px
}

.export-body p, .input-exporting input {
    font-family: var(--regular);
    font-size: 14px
}

.export-body p {
    line-height: 20px;
    margin-top: 5px
}

.input-exporting, button.exporting-btn {
    width: 100%;
    border-radius: 15px;
    margin-top: 20px
}

.input-exporting {
    height: 50px;
    background: #f0f0f0;
    display: flex
}

.input-exporting input {
    background: 0 0;
    margin-left: 50px;
    height: 100%;
    width: 100%
}

button.btn-draw-sub a, button.exporting-btn {
    color: #fff;
    font-size: 16px;
    font-family: var(--regular)
}

button.exporting-btn {
    background: #6c63ff;
    height: 50px;
    position: relative
}

button.exporting-btn:before {
    content: 'Get CuriousCat Answers'
}

.input-exporting:before, .secgion-draw-menu.paint-draw:before, button.btn-draw-sub:after, button.exporting-btn:after {
    content: '';
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.input-exporting:before {
    background: #999;
    -webkit-mask-image: url(../media/svg/Broken/Profile.svg);
    position: absolute
}

.add-box-movie:before, .movie-btn-add:before {
    width: 24px;
    height: 24px;
    left: 0;
    bottom: 0;
    right: 0
}

.input-exporting input::placeholder {
    color: #999
}

button.exporting-btn:after {
    background: #fff;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Left.svg);
    position: absolute;
    display: flex;
    top: 0
}

#draw-color, button.btn-draw-sub {
    display: flex;
    background: #6c63ff
}

.inner-draw-page {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    overflow: visible
}

.canvas-boxing, button.btn-draw-sub {
    border-radius: 15px;
    margin-top: 20px
}

.draw-banner-top {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    background-image: url(../media/bn/undraw_monster_artist_2crm.svg);
    width: 100%;
    height: 200px;
    display: flex;
    position: relative
}

.canvas-boxing {
    overflow: hidden;
    position: relative;
    box-shadow: rgba(0, 0, 0, .1) -4px 9px 25px -6px
}

.canvas-boxing canvas {
    height: 100%;
    width: 100%;
    position: relative
}

.draw-menu, button.btn-draw-sub {
    height: 50px;
    position: relative;
    width: 100%
}

.draw-menu {
    background: #f5f5f5;
    border-bottom-left-radius: 15px;
    padding-right: 6%;
    border-top-left-radius: 15px;
    margin-top: 10px
}

button.btn-draw-sub {
    transition: .2s;
    overflow: hidden
}

button.btn-draw-sub a {
    width: 60%;
    text-align: center;
    line-height: 20px;
    right: 0;
    left: 0;
    margin: auto;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

#draw-color {
    appearance: none;
    -webkit-appearance: none;
    border: none;
    border-radius: 50%;
    outline: 0;
    cursor: pointer;
    overflow: hidden;
    width: 20px;
    height: 20px;
    margin-top: 10px
}

.secgion-draw-menu {
    padding-left: 5px;
    padding-right: 5px;
    margin-left: 5px;
    margin-right: 5px;
    height: 40px;
    margin-top: 5px;
    border-radius: 10px
}

.inner-draw-menu {
    width: 100%;
    height: 100%;
    position: relative;
    margin-top: 10px;
    display: flex;
    padding-left: 10px
}

.secgion-draw-menu.paint-draw:before {
    -webkit-mask-size: 20px;
    background: #000007;
    width: 30px;
    height: 100%;
    display: flex
}

.secgion-draw-menu.erease-draw:before {
    -webkit-mask-image: url(../media/svg/paint/erase.svg)
}

.secgion-draw-menu.backpaint-draw:before {
    -webkit-mask-image: url(../media/svg/paint/rotate.svg)
}

.secgion-draw-menu.paint-draw.pen-draw:before, .share-draw-btn:before {
    -webkit-mask-image: url(../media/svg/paint/pen.svg)
}

.secgion-draw-menu.save-draw.paint-draw:before {
    -webkit-mask-image: url(../media/svg/paint/history.svg)
}

input[type=range] {
    -webkit-appearance: none;
    accent-color: #6c63ff;
    border: none;
    background: #eee
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    height: 20px;
    width: 20px;
    background: #f5f5f5;
    border-radius: 50%;
    border: 2px solid #6c63ff;
    transform: translateY(-9px)
}

button.btn-draw-sub div, button.btn-draw-sub span {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex
}

input[type=range]::-webkit-slider-runnable-track {
    -webkit-appearance: none;
    background: #6c63ff;
    height: 2px
}

.range-draw-input input {
    width: 100%;
    margin-top: 23px;
    display: flex
}

.range-draw-input {
    margin-right: 10px;
    width: 100%;
    margin-left: 10px
}

.switch-anonymous {
    display: none;
    margin-top: 10px;
    margin-bottom: 90px
}

.switch-anonymous span {
    font-size: 14px;
    color: #999;
    margin-left: 10px;
    margin-top: 4px;
    font-family: var(--regular);
    line-height: 16px
}

button.btn-draw-sub:after {
    width: 22px;
    height: 22px;
    position: absolute;
    right: 0;
    margin-right: 20px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right.svg);
    -webkit-mask-size: contain;
    background: #fff;
    margin-top: 14px
}

button.btn-draw-sub span {
    background-position: center
}

button.btn-draw-sub div {
    position: absolute;
    margin-left: 15px;
    margin-top: 11px;
    border: 1px solid;
    padding: 4px
}

.details-draw-footer {
    margin-top: 5px;
    width: 100%;
    position: relative
}

.details-draw-footer p {
    font-size: 12px;
    font-family: var(--regular);
    line-height: 18px;
    color: #999
}

.post-movie-content a, .post-movie-content span, .post-movie-content text {
    font-size: 14px;
    font-family: var(--regular)
}

.details-draw-footer p a {
    color: #6c63ff;
    font-weight: 700
}

.secgion-draw-menu.selected {
    background: #e8e8e8
}

progress#progress-draw {
    width: 60%;
    position: absolute;
    height: 10px;
    transition: .2s;
    right: 0;
    bottom: 0;
    top: 0;
    left: 0;
    border-radius: 10px;
    overflow: hidden;
    margin: auto;
    z-index: 3;
    display: none
}

progress::-webkit-progress-bar {
    background-color: #f0f0f0
}

progress::-webkit-progress-value {
    background-color: #6c63ff;
    transition: .2s
}

progress::-moz-progress-bar {
    background-color: #6c63ff;
    transition: .2s
}

progress::-ms-fill {
    background-color: #6c63ff;
    transition: .2s
}

.post-movie-content a:before, .rates-boxs-movies a, .right-movie-view a:before, span.movie-rating:before {
    background: #ff9529;
    -webkit-mask-size: 14px;
    height: 14px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center
}

button.btn-draw-sub:disabled:after {
    transform: translateX(50px)
}

.proggressing-back-draw {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #000007;
    opacity: .5;
    z-index: 2;
    display: none
}

.movie-image, .post-movie-img {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat
}

.post-msg-draw {
    position: relative;
    width: 100%;
    right: 0;
    left: 0;
    margin: -8px auto auto;
    display: flex;
    min-height: 100px
}

.post-draw {
    width: calc(100% + 40px);
    margin-left: -20px;
    display: flex;
    margin-top: 10px;
    min-height: 100px
}

.attachs-options {
    display: flex;
    margin-top: 15px;
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
}

.attachs-options .swiper-wrapper {
    width: fit-content;
    padding-right: 6%;
    margin-left: 6%;
}

.share-movie-btn:before {
    -webkit-mask-image: url(../media/svg/popcorn.svg)
}

.share-movie-btn:after {
    content: 'Movie'
}

.share-profile-btn:after {
    content: 'Profile'
}

.share-draw-btn:after {
    content: 'Drawing'
}

.share-music-btn:after {
    content: 'Music'
}

.share-music-btn:before {
    -webkit-mask-image: url(../media/svg/music.svg)
}

.top-post-movie {
    display: flex;
    min-height: 70px
}

.post-movie-img {
    width: 50px;
    height: 70px;
    border-radius: 10px;
    position: absolute
}

.post-movie {
    margin-top: 10px;
    z-index: 9
}

.post-movie-content {
    margin-left: 60px;
    display: inline-block;
    line-height: 17px
}

.post-movie-content span {
    font-weight: 700;
    word-break: break-word
}

.post-movie-content a {
    display: flex;
    margin-top: 5px
}

.post-movie-content a:before, .right-movie-view a:before, span.movie-rating:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Bulk/Star.svg);
    width: 14px;
    display: flex;
    margin-right: 5px
}

.section-type-info span:after, button.deldeactive:before {
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right.svg)
}

.post-movie-content a p {
    margin-left: 6px;
    display: flex
}

.post-movie-content text {
    color: #999;
    margin-top: 5px;
    display: flex;
    line-height: 15px
}

.rates-boxs-movies span, span.movie-rating {
    line-height: 18px;
    font-family: var(--regular);
    color: #fff
}

.bottom-post-movie {
    width: 100%;
    margin-top: 10px
}

.post-movie-content a p:before {
    content: '';
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: #999;
    display: flex;
    margin-top: 6px;
    margin-right: 6px
}

.share-alert-prof.section-alert {
    display: none;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 20px;
    grid-row-gap: 20px;
    padding-right: 20px;
    padding-left: 20px;
    margin-top: 25px;
    margin-bottom: 15px
}

.search-movies-fetch {
    display: none;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
}

.inner-movies-search {
    z-index: 99;
    width: 100%;
    right: 0;
    left: 0;
    margin: 70px auto auto;
    position: absolute
}

.movie-card, .movie-image {
    width: 100px;
    position: relative
}

.movie-image {
    border-radius: 15px;
    overflow: hidden;
    height: 145px
}

.movie-card {
    display: grid;
    margin-right: 20px
}

.movie-image img {
    width: 100%;
    min-height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto
}

span.title-movie {
    color: #fff;
    font-size: 12px;
    font-family: var(--regular);
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%
}

span.movie-descripe {
    display: flex;
    width: 100%;
    overflow: hidden;
    direction: ltr
}

span.movie-descripe a {
    font-size: 12px;
    color: #878792;
    font-family: var(--regular);
    border-right: 1px solid #4b4b51;
    margin-right: 5px;
    padding-right: 5px;
    height: 12px
}

span.movie-descripe a:last-child {
    border-right: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

span.movie-rating {
    font-size: 12px;
    display: flex
}

.movie-title-all {
    display: grid;
    margin-top: 10px;
    width: 100%
}

.movie-rating[rate=Norate]:before {
    background: #555
}

.movie-title-all span {
    margin-bottom: 2px
}

.inner-movies-slider {
    width: fit-content;
    display: flex;
    margin-left: 6%;
    margin-right: calc(6% + -20px);
}

.movies-search-input {
    height: 50px;
    margin-left: 0
}

.search-movies-btn {
    height: 50px;
    width: 50px;
    right: 0;
    background: 0 0;
    padding-right: 5px
}

.section-type-info {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    margin-top: 20px
}

.section-type-info span {
    font-size: 16px;
    color: #fff;
    font-family: var(--regular);
    font-weight: 700;
    display: flex
}

.section-type-info a {
    font-size: 14px;
    font-family: var(--regular);
    color: #fff;
    right: 0;
    margin-left: 10px;
    display: none
}

.section-type-info span:after {
    content: '';
    background: #fff;
    -webkit-mask-size: 18px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    width: 18px;
    height: 18px;
    display: flex;
    margin-left: 5px
}

.imdb-btn-search, .movie-btn-add {
    width: 100%;
    height: 75px;
    position: absolute;
    right: 0;
    bottom: 0;
    background: linear-gradient(to top, rgb(0 0 0 / 70%), transparent)
}

.movie-btn-add:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Bulk/Plus.svg);
    background: #fff;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    display: flex;
    position: absolute;
    margin: auto auto 10px
}

.movie-btn-add:after {
    content: 'Add';
    font-size: 12px;
    font-weight: 700;
    font-family: var(--regular);
    color: #fff;
    position: absolute;
    bottom: 0;
    margin-left: 40px;
    margin-bottom: 15px;
    opacity: 0
}

.box-office-item {
    display: flex;
    margin-top: 20px;
    height: 100px
}

.boxoffice-container {
    width: 88%;
    display: grid;
    position: relative;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 100px;
}

.banner-boxoffice {
    width: 80px;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 15px;
    position: absolute
}

.movies-outset-slider {
    overflow-y: hidden;
    overflow-x: scroll;
}

.right-boxflex {
    width: 100%;
    display: block;
    margin-left: 90px;
    margin-right: 35px
}

span.movie-name-box {
    font-size: 14px;
    font-family: var(--regular);
    font-weight: 700;
    color: #fff
}

.rates-boxs-movies a {
    content: '';
    -webkit-mask-image: url(../media/svg/Bold/Star.svg);
    width: 14px;
    display: flex;
    margin-right: 5px
}

.rates-boxs-movies {
    display: flex;
    margin-top: 8px
}

.rates-boxs-movies span {
    font-size: 14px;
    display: flex;
    opacity: .6;
    margin-left: 2px
}

span.movies-conts-box {
    font-size: 12px;
    font-family: var(--regular);
    color: #fff;
    line-height: 14px;
    margin-top: 8px;
    display: flex;
    opacity: .6
}

.right-movie-view a, .right-movie-view p {
    margin-top: -8px;
    font-family: var(--regular)
}

.add-box-movie:before {
    content: '';
    -webkit-mask-image: url(../media/svg/plus2.svg);
    background: #fff;
    -webkit-mask-size: 12px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    display: flex;
    top: 0;
    margin: auto;
    position: absolute
}

.add-box-movie {
    height: 32px;
    width: 32px;
    background: #e11a37;
    position: absolute;
    right: 0;
    border-radius: 8px
}

.rates-boxs-movies a.unrate {
    background: #fff;
    opacity: .4
}

.movie-card.loadmovies {
    height: 200px
}

.movie-card.loadmovies .movie-image {
    background: #fff;
    opacity: .2;
    margin-bottom: 0
}

.movie-card.loadmovies .movie-title-all:after, .movie-card.loadmovies .movie-title-all:before {
    width: 80%;
    display: flex;
    background: #fff;
    border-radius: 10px;
    height: 8px;
    content: '';
    opacity: .2;
    top: 0;
    position: absolute
}

.movie-card.loadmovies .movie-title-all {
    position: absolute;
    height: 100%;
    display: flex;
    margin-top: 158px
}

.movie-card.loadmovies .movie-title-all:after {
    margin-top: 15px;
    width: 50%
}

.movie-card.loadmovies:after {
    width: 60%;
    display: flex;
    background: #fff;
    border-radius: 10px;
    height: 8px;
    content: '';
    opacity: .2;
    top: 0;
    position: absolute;
    margin-top: 188px
}

.movies-search::after, .movies-search::before, .movies-search>.movies-circles, .movies-search>.movies-circles::after, .movies-search>.movies-circles::before {
    filter: blur(75px)
}

.movies-search::after, .movies-search::before {
    display: none;
    position: absolute;
    content: "";
    width: 390px;
    height: 390px;
    border-radius: 100%;
    z-index: -1
}

.movies-search::before {
    background: #ffecf5;
    top: -195px;
    left: -195px;
    z-index: 2;
}

.movies-search::after {
    background: #86e1ef;
    right: -150px;
    top: 50%;
    transform: translateY(-50%)
}

.movies-search>.movies-circles, .movies-search>.movies-circles::after, .movies-search>.movies-circles::before {
    border-radius: 100%;
    position: absolute
}

.movies-search>.movies-circles::after, .movies-search>.movies-circles::before {
    content: "";
    width: 140px;
    height: 140px;
    top: 50%;
    transform: translateY(-50%)
}

.movies-search>.movies-circles {
    width: 230px;
    height: 230px;
    background: #ffc285;
    bottom: -60px;
    left: 75px;
    opacity: .5
}

.movies-search>.movies-circles::before {
    background: #8600ff;
    left: -40%
}

.movies-search>.movies-circles::after {
    background: red;
    right: -20%;
    opacity: .5
}

.back-raw-lmovies {
    width: 100%;
    height: 200%;
    position: fixed;
    background: linear-gradient(to bottom, #000, #000, transparent);
    opacity: .8;
    z-index: 9;
}

.image-movie-search, .left-movie-view {
    background-position: center;
    background-repeat: no-repeat;
    overflow: hidden
}

.box-office-item.boxmload .banner-boxoffice {
    opacity: .2;
    background: #fff
}

.box-office-item.boxmload .right-boxflex:before {
    width: 50%
}

.box-office-item.boxmload .right-boxflex span, .box-office-item.boxmload .right-boxflex:after, .box-office-item.boxmload .right-boxflex:before {
    display: flex;
    background: #fff;
    border-radius: 10px;
    height: 8px;
    content: '';
    opacity: .2;
    top: 0;
    position: absolute
}

.box-office-item.boxmload .right-boxflex span {
    width: 30%;
    margin-top: 20px
}

.box-office-item.boxmload .right-boxflex:after {
    width: 40%;
    margin-top: 40px
}

.box-office-item.boxmload .right-boxflex {
    position: absolute;
    margin-top: 5px
}

.movie-view-textarea {
    width: 100%;
    display: flex;
    margin-bottom: 20px;
    height: 80px;
    direction: ltr
}

.left-movie-view {
    height: 80px;
    width: 60px;
    background-size: cover;
    border-radius: 15px;
    margin-left: 20px;
    position: absolute
}

.right-movie-view {
    display: grid;
    margin-left: 90px;
    margin-right: 50px
}

.right-movie-view span {
    font-family: var(--regular);
    font-weight: 700
}

.right-movie-view * {
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 0
}

.right-movie-view a {
    display: flex
}

.right-movie-view p {
    color: #999
}

.delete-attached-movie {
    position: absolute;
    right: 0;
    width: 35px;
    height: 35px;
    margin-right: 20px;
    justify-content: center;
    align-items: center;
    display: flex;
    border-radius: 50%
}

.delete-attached-movie:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
    background: #000007;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    width: 24px;
    height: 24px;
    display: flex
}

.imdb-btn-search:after, .mov-search-actress:before {
    background: #fff;
    content: '';
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat
}

.msg-page .post-movie {
    width: calc(-40px + 100%);
    margin-left: 20px
}

.movie-search-layer {
    width: 100%;
    background: rgb(255 255 255 / 10%);
    height: 180px;
    border-radius: 15px;
    margin-top: 20px;
    overflow: hidden;
    position: relative;
    display: flex
}

.movie-search-layer:after {
    content: '';
    position: absolute;
    border-radius: 100%;
    width: 30px;
    height: 30px;
    left: 0;
    margin-left: 120px;
    margin-top: -15px;
    top: 0;
    z-index: 0;
    display: none
}

.image-movie-search {
    height: calc(-28px + 100%);
    width: 100px;
    margin-left: 14px;
    margin-top: 14px;
    background-size: cover;
    border-radius: 15px;
    z-index: 1;
    display: flex;
    position: absolute;
    background-color: rgb(255 255 255 / 20%)
}

.card-profile div, .card-profile span, .svgshare-back {
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center
}

.right-movie-search {
    margin-left: 130px;
    margin-top: 30px;
    margin-right: 20px;
    position: relative;
    width: 100%;
    display: grid;
    height: 85px;
}

span.movie-title-search {
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    font-family: var(--regular);
    line-height: 24px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 100%;
}

.mov-search-actress {
    margin-top: 15px;
    opacity: .5;
    width: 100%;
    overflow: hidden;
    position: relative;
    display: grid
}

.mov-search-actress:before {
    -webkit-mask-image: url(../media/svg/Broken/Profile.svg);
    -webkit-mask-size: 14px;
    width: 14px;
    height: 14px;
    display: flex;
    margin-right: 4px;
    position: absolute
}

span.year-rank-search {
    display: flex;
    margin-top: 15px;
    font-size: 14px;
    color: #fff;
    line-height: 16px;
    white-space: nowrap;
}

span.year-rank-search a {
    margin-right: 8px;
    display: flex
}

span.year-rank-search a:after {
    content: '';
    width: 3px;
    height: 3px;
    border-radius: 10px;
    background: rgb(255 255 255 / 25%);
    display: flex;
    margin-left: 8px;
    margin-top: 5px
}

.imdb-btn-search:after {
    -webkit-mask-image: url(../media/svg/Bulk/Plus.svg);
    -webkit-mask-size: 28px;
    width: 28px;
    height: 28px;
    display: flex;
    left: 0;
    bottom: 0;
    position: absolute;
    right: 0;
    margin: auto auto 12px
}

.inset-attach-item span, .svgshare-back:after {
    -webkit-mask-image: url(../media/svg/Broken/Send.svg)
}

.mov-search-actress span {
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    margin-right: 20px;
    width: 88%;
    margin-left: 18px
}

.movie-search-layer.load-search-movies .mov-search-actress, .movie-search-layer.load-search-movies span.movie-title-search, .movie-search-layer.load-search-movies span.year-rank-search {
    background: rgb(255 255 255 / 20%);
    width: 80%;
    height: 10px;
    display: flex;
    border-radius: 15px
}

.movie-search-layer.load-search-movies span.year-rank-search {
    width: 40%;
    margin-top: 15px
}

.movie-search-layer.load-search-movies .mov-search-actress {
    width: 60%;
    margin-top: 15px;
    opacity: 1
}

.exporting-page.page {
    z-index: 99
}

.action-btninner {
    display: flex;
    width: 88%;
    height: 50px;
    right: 0;
    left: 0;
    margin: -100px auto 125px;
    position: relative
}

.bnshare-page, .cards-share-profile, .svgshare-back {
    margin: auto;
    left: 0;
    right: 0
}

.inner-replay-page .post-draw, .inner-replay-page .post-movie {
    margin-left: 60px;
    width: fit-content
}

.stories-main-page.addable .bottom-stories-text {
    margin-bottom: 125px
}

.bnshare-page {
    width: 88%;
    height: 216px;
    position: relative
}

.svgshare-back {
    background-image: url(../media/bn/undraw_social_thinking_re_y8cc.svg);
    width: 100%;
    height: 200px;
    position: absolute
}

.svgshare-back:after {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    margin-top: 84px;
    right: 0;
    left: 0;
    background: #6c63ff;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 24px;
    transform: translateX(-72px)
}

.cards-share-profile {
    width: 88%;
    position: relative;
    padding-bottom: 100px
}

.card-profile {
    position: relative;
    width: 100%;
    display: flex;
    overflow: hidden;
    height: auto;
    border-radius: 20px;
    background: #f0f0f0;
    margin-bottom: 20px
}

.card-profile div {
    z-index: 2;
    width: 100%;
    height: 100%
}

.card-profile span {
    background-image: url("../media/profile_large/user_77260110223012532_1698888332_2.jpeg");
    width: 100px;
    height: 100px;
    position: absolute;
    background-color: #000;
    border-radius: 50%;
    right: 0;
    margin-right: 10%;
    top: 0;
    margin-top: 11%;
    z-index: 1
}

.card-profile p {
    font-size: 1em;
    color: #fff;
    position: absolute;
    z-index: 2;
    font-family: var(--regular);
    width: 50%;
    margin-left: 10%;
    text-align: center;
    margin-top: 20%
}

.top-cardshare-desc:before {
    content: 'Social Card';
    font-size: 35px;
    font-family: var(--regular);
    font-weight: 700;
    line-height: 38px;
    margin-bottom: 8px;
    margin-top: 7px;
    display: flex
}

.top-cardshare-desc:after {
    content: 'Chose below what card you want to share in yor social profile to generate the link';
    font-size: 17px;
    font-family: var(--regular)
}

.card-profile.generated:before {
    content: 'Generated';
    position: absolute;
    z-index: 9;
    font-size: 18px;
    padding-bottom: 2px;
    padding-top: 2px;
    font-family: var(--regular);
    color: #fff;
    background: #00bfa6;
    transform: rotate(-45deg) translate(-32%, 6%);
    width: 51%;
    text-align: center;
    left: 0;
    top: 0;
    margin-top: 0;
    height: fit-content
}

.footer-cards-share:before {
    content: 'it\'s simple, just chose the type of share card you want and put the link to your social account to make your followers see your uniqe profile card!';
    font-size: 12px;
    color: #999;
    font-family: var(--regular);
    line-height: 16px;
    display: flex
}

.banner-sets-top.deactive-banner {
    background-image: url(../media/bn/undraw_throw_down_ub-2-l.svg)
}

.deactvition-section, .deletion-section {
    margin-top: 40px
}

.deactvition-section .privcysec:before {
    -webkit-mask-image: url(../media/svg/Bulk/Time%20Circle.svg)
}

button.deldeactive {
    width: 100%;
    text-align: center;
    height: 50px;
    display: flex;
    background: #ff6685;
    border-radius: 15px;
    outline: 0;
    position: relative;
    margin-top: 15px
}

button.deldeactive:after {
    content: 'Confirm Delete Account';
    font-size: 16px;
    color: #fff;
    font-family: var(--regular);
    height: 20px;
    line-height: 20px;
    width: 100%;
    text-align: center;
    margin-top: 15px
}

button.deldeactive:before {
    content: '';
    position: absolute;
    width: 20px;
    height: 20px;
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background-color: #fff;
    right: 0;
    margin-right: 15px;
    margin-top: 15px
}

.deactvition-section button.deldeactive:after {
    content: 'Deactive Account'
}

.mask.delete:before {
    content: '';
    position: absolute;
    width: 88%;
    height: 350px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
    background-image: url(../media/bn/token.svg);
    margin: 360px auto auto;
    right: 0;
    left: 0
}

.post-qoute.deleted .inner-post-qoute {
    height: 40px
}

.post-qoute.deleted .post-qoute-text p:after {
    content: 'This message has been deleted'
}

.post-qoute.deleted .post-qoute-text {
    align-items: center;
    justify-content: center;
    margin-top: 10px
}

.msg-qoute.deleted .msg-qoute-text {
    justify-content: center;
    display: flex;
    align-items: center;
    margin-top: 10px
}

.msg-qoute.deleted .msg-qoute-text p:after {
    content: 'This message was deleted'
}

.swipe-of-close {
    position: absolute;
    width: 100%;
    top: 0;
    height: 40px;
    z-index: 99
}

.opeffect {
    opacity: .5 !important
}

.bcpost {
    background: #e8e8e8 !important
}

.efbcimg.actv-luser {
    background: #f0f0f0 !important
}

.dark .bcpost, .dark .efbcimg.actv-luser {
    background: rgb(36 36 40 / 65%) !important
}

.usim:before {
    transition: .1s;
    opacity: 0;
    transform: scale(0);
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000007;
    border-radius: 50%
}

.inset-attach-item span, .inset-attach-item:before {
    width: 30px;
    height: 30px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center
}

.efbcimg .usim:before, .efbcimg.usim:before {
    opacity: .5;
    transform: scale(1)
}

.basets {
    background: #eee !important
}

.dark .basets {
    background: rgb(0 0 7 / 25%) !important
}

.container-story-slider {
    width: 100%;
    transform: translateX(0);
    height: 100%;
    position: absolute;
    display: flex;
    transition: .2s
}

.inner-story-slider {
    height: 100%;
    display: flex;
    position: absolute;
    transition: .2s
}

.slider-currentsv {
    height: 100%;
    width: 100%;
    display: flex;
    position: relative
}

.inset-attach-item {
    background: #eee;
    width: 190px;
    height: 50px;
    position: absolute;
    bottom: 0;
    border-radius: 20px;
    margin-bottom: 15px;
    margin-left: 15px;
    z-index: 99
}

.attach-item, .share-section {
    position: relative;
    transition: .1s
}

.add-msg-btn .inset-attach-item:before {
    -webkit-mask-image: url(../media/svg/Bulk/Send.svg)
}

.attach-item {
    width: 220px;
    height: 160px;
    border-radius: 35px;
    margin-right: 15px;
    background: center/cover #f5f5f5;
    overflow: hidden
}

.attach-item:last-child {
    margin-right: 0 !important;
}

.inset-attach-item:before {
    content: '';
    position: absolute;
    left: 0;
    margin: 10px auto auto 16px;
    -webkit-mask-image: url(../media/svg/Bulk/Video.svg);
    -webkit-mask-size: 20px;
    background: #6c63ff
}

.inset-attach-item:after {
    content: 'Ask a question';
    font-size: 14px;
    font-family: var(--regular);
    width: 100%;
    position: absolute;
    text-align: left;
    margin-top: 14px;
    color: #000007;
    margin-left: 50px;
    line-height: 20px
}

.attach-item:after, .attach-item:before, .share-section:after {
    content: '';
    position: absolute;
    background-size: contain;
    background-repeat: no-repeat
}

.flex-prof-section span {
    line-height: 20px
}

.attach-item:after {
    width: 100%;
    height: 70px;
    right: 0;
    background-position: 85%;
    margin-top: 18px;
    z-index: 9;
    background-image: url(../media/bn/undraw_letter_re_8m03.svg);
    opacity: .2
}

.attach-item:before {
    width: 100%;
    height: 70px;
    margin-left: 0;
    background-position: 15%;
    margin-top: 18px;
    z-index: 9;
    background-color: transparent !important
}

.inset-attach-item span {
    position: absolute;
    right: 0;
    background: #bbb;
    margin-top: 15px;
    margin-right: 18px;
    visibility: hidden
}

.attach-item.add-movie-btn:before, .share-section.movies-sh:after {
    background-image: url(../media/bn/undraw_horror_movie_3988.svg)
}

.add-movie-btn .inset-attach-item:after {
    content: 'Suggest movie'
}

.attach-item.add-msg-btn:before {
    background-image: url(../media/bn/undraw_messenger_re_8bky.svg)
}

.add-draw-btn:before, .share-section.draw-sh:after {
    background-image: url(../media/bn/undraw_making_art_re_ee8w.svg)
}

.add-draw-btn .inset-attach-item:before {
    -webkit-mask-image: url(../media/svg/Bulk/Edit.svg)
}

.add-draw-btn .inset-attach-item:after {
    content: 'Draw something'
}

.add-music-btn .inset-attach-item:before {
    -webkit-mask-image: url(../media/svg/Bulk/Play.svg)
}

.add-music-btn:before, .share-section.music-sh:after {
    background-image: url(../media/bn/undraw_happy_music_g6wc.svg)
}

.add-music-btn .inset-attach-item:after {
    content: 'Suggest music'
}

.hidesend .anonymous-on {
    margin-top: 75px
}

.hidesend .attachs-options {
    margin-top: 140px
}

.anonymous-on-box a:after {
    content: 'Anonymous mode disabled, the question will be sent with your identy'
}

.anonymous-on-box.checked a:after {
    content: 'Anonymous mode enabled, the questionwill be sent without showing your identy'
}

.header-top-share {
    font-size: 14px;
    font-family: var(--regular);
    display: none
}

.link-share-text {
    color: #000007;
    font-family: var(--regular);
    font-size: 16px
}

.link-share-text a {
    font-family: var(--regular);
    font-size: 20px;
    color: #6c63ff
}

.share-section:after {
    width: 35%;
    right: 0;
    height: 100px;
    top: 0;
    bottom: 0;
    margin: auto 20px auto auto;
    background-image: url(../media/bn/undraw_messenger_re_8bky2.svg);
    background-position: right center
}

.share-section {
    width: 100%;
    margin-top: 20px;
    background: #f5f5f5;
    border-radius: 35px;
    padding-top: 20px;
    padding-bottom: 25px
}

.inset-section-share {
    width: 100%;
    margin: auto auto auto 25px;
    top: 0;
    bottom: 0;
    height: fit-content;
    min-height: 109px
}

span.topsharesp {
    font-size: 22px;
    font-family: var(--regular);
    font-weight: 700;
    display: flex;
    top: 0
}

.descripe-share {
    font-size: 12px;
    color: #999;
    font-family: var(--regular);
    width: 58%;
    margin-top: 5px;
    z-index: 9
}

.share-now {
    width: 100px;
    height: 30px;
    border-radius: 35px;
    background: rgb(108 99 255 / 15%);
    margin-top: 9px;
    text-align: center
}

.share-now:after {
    content: 'Share now';
    font-size: 14px;
    font-family: var(--regular);
    line-height: 28px;
    color: #6c63ff
}

.selector-follow:after, .suggest-info * {
    color: #000007;
    font-family: var(--regular)
}

.share-section.profile-sh:after {
    background-image: url(../media/bn/prof.svg)
}

.svgshare-back:before {
    content: '';
    width: 100%;
    height: 2px;
    position: absolute;
    bottom: 0;
    background: #fff
}

.share-section.profile-sh {
    margin-top: 5px
}

.safty-banner {
    width: 100%;
    height: 150px;
    background-image: url(../media/bn/security.svg);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat
}

.follower-menu, .safty-content {
    width: 88%;
    margin: auto;
    left: 0;
    right: 0
}

.safty-content {
    padding-bottom: 100px
}

.safty-body p {
    font-size: 14px;
    font-family: var(--regular)
}

.safty-body p a {
    font-weight: 700;
    color: #6c63ff
}

.follower-menu {
    position: absolute;
    height: 60px;
    border-radius: 20px;
    background: #f5f5f6;
    display: flex
}

.sg-bc, .sg-bc a, .suggest-image {
    background-size: cover;
    background-position: center
}

.selector-follow {
    width: 100%;
    height: 44px;
    border-radius: 15px;
    margin: 8px 8px 0;
    justify-content: center;
    align-items: center;
    position: relative
}

.selector-follow:after {
    font-size: 16px;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    line-height: 45px;
    text-align: center;
    opacity: .25
}

.selector-follow.follow-click:after {
    content: 'Followers'
}

.selector-follow.following-click:after {
    content: 'Following'
}

.banner.notfoud {
    background-image: url(../media/bn/notfound.svg)
}

.banner.share_bn {
    background-image: url(../media/bn/undraw_share_link_re_54rx.svg)
}

.banner.security, .banner.social_bn {
    background-image: url(../media/bn/undraw_social_thinking_re_y8cc.svg)
}

.banner.avilable {
    background-image: url(../media/bn/undraw_completing_re_i7ap.svg)
}

.banner.exporting {
    background-image: url(../media/bn/undraw_refreshing_beverage_td3r.svg)
}

.insetdir .action-menu.delete:after {
    content: 'Delete Message'
}

.language-settings .darkmode-banner {
    background-image: url(../media/bn/undraw_font_re_efri.svg)
}

.language-settings span.top-list-sets.genral-sscx:after {
    content: 'Language'
}

span.english:after {
    content: 'English'
}

span.arabic:after {
    content: 'العربية'
}

.ar .language-settings span.top-list-sets.genral-sscx:after {
    content: 'لغة العرض'
}

.user-suggest {
    width: 250px;
    height: 175px;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    margin-right: 20px;
    border: 1px solid #f0f0f0
}

.forgetpass:before, .main-switch-page:before, .sg-bc, .sg-bc a, .sg-bc:before, .sg-cn, .suggest-follow, .suggest-follow:after {
    position: absolute
}

.swiper.swiper-suggest {
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
}

.suggest-image {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    left: 0;
    margin-top: 20px;
    margin-left: 20px;
    margin-right: 20px
}

.suggest-info {
    display: grid;
    padding-left: 20px;
    margin-top: 10px;
    font-size: 13px;
    padding-right: 20px
}

.suggest-info * {
    width: 100%
}

.suggest-info a {
    color: #999;
    font-size: 14px;
    line-height: 20px
}

.suggest-info span {
    width: calc(100% + -70px);
    font-weight: 700;
    font-size: 14px;
    line-height: 16px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.suggest-info p {
    margin-top: 5px;
    line-height: 16px !important;
    font-size: 13px !important;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-height: 3em;
    white-space: normal
}

button.cansle-menu-share, p.switch-description, span.top-switch-header {
    text-align: center;
    line-height: 20px;
    left: 0
}

.sg-cn {
    width: 100%;
    height: 100%;
    z-index: 2
}

.sg-bc {
    width: 100%;
    height: 100px;
    z-index: 1;
    overflow: hidden
}

.forgetpass, .sg-bc a {
    z-index: 2
}

.sg-bc a {
    width: 120%;
    height: 120%;
    filter: blur(40px);
    margin-top: -7%;
    margin-left: -10%
}

.sg-bc:before {
    content: '';
    width: 110%;
    height: 135%;
    background: rgb(255 255 255 / 70%);
    margin-top: -5%;
    margin-left: -5%;
    z-index: 9;
    background: linear-gradient(to top left, rgb(255 255 255), rgb(255 255 255 / 100%), rgb(255 255 255 / 50%))
}

.suggest-follow {
    width: 60px;
    height: 26px;
    right: 0;
    margin-right: 20px;
    background: #6c63ff;
    border-radius: 25px;
    margin-top: 80px;
    display: flex
}

.ar .thred-post.may-know:before {
    content: 'قد يهمك متابعة'
}

.ar .suggest-follow {
    margin-left: 20px;
    left: 0;
    right: unset
}

.suggest-follow:after {
    content: 'Follow';
    font-family: var(--regular);
    font-size: 12px;
    width: 100%;
    text-align: center;
    display: block;
    line-height: 26px;
    color: #fff
}

.thred-post.may-know {
    padding-top: 60px;
    border-top: 1px solid #f0f0f0;
    padding-bottom: 20px;
    border-bottom: 1px solid #f0f0f0;
    margin-top: -1px;
}

.thred-post.may-know:before {
    content: 'People you may know';
    color: #000007;
    top: 0;
    margin-left: 6%;
    margin-right: 6%;
    font-family: var(--regular);
    font-size: 14px;
    position: absolute;
    margin-top: 20px;
    line-height: 22px
}

.ar .sg-bc:before {
    background: linear-gradient(to top right, rgb(255 255 255), rgb(255 255 255 / 100%), rgb(255 255 255 / 50%))
}

.dark .sg-bc:before {
    background: linear-gradient(to top left, rgb(0 0 7 / 100%), rgb(0 0 7 / 100%), rgb(0 0 7 / 50%))
}

.ar .dark .sg-bc:before {
    background: linear-gradient(to top right, rgb(0 0 7 / 100%), rgb(0 0 7 / 100%), rgb(0 0 7 / 50%))
}

.inset-user-suggest {
    margin-left: 6%;
    padding-right: 6%;
    width: fit-content;
}

.user-suggest:last-child {
    margin-right: 0 !important;
}

.dark .suggest-follow:after {
    color: #000007
}

.forgetpass:before {
    content: '';
    width: 20px;
    height: 20px;
    margin-top: 15px;
    -webkit-mask-size: cover;
    -webkit-mask-position: center;
    background-color: #999;
    -webkit-mask-repeat: no-repeat;
    margin-left: 14px;
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
    display: flex
}

.dark .forgetpass:before {
    background-color: #fff
}

.main-switch-page:before {
    content: '';
    width: 30px;
    height: 4px;
    background: #f0f0f0;
    right: 0;
    left: 0;
    margin: 20px auto auto
}

.back-switch-page {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: #303036;
    z-index: 1;
    opacity: .8
}

.main-switch-page {
    position: fixed;
    width: 100%;
    height: fit-content;
    bottom: 0;
    margin-bottom: 0;
    right: 0;
    background: #fff;
    transition: .2s;
    transform: translateY(100%);
    z-index: 9;
    border-top-right-radius: 35px;
    border-top-left-radius: 35px
}

.switch-page {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999999999
}

span.top-switch-header {
    font-size: 18px;
    font-weight: 500;
    font-family: var(--regular);
    color: #000007;
    right: 0;
    margin: 55px auto auto;
    width: 88%;
    display: grid
}

.switch-buttons button, button.cansle-menu-share, p.switch-description {
    font-size: 14px;
    font-family: var(--regular)
}

.banner-switch {
    display: block;
    margin-top: 20px;
    width: 100%;
    height: 85px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat
}

p.switch-description {
    word-break: break-word;
    width: 88%;
    right: 0;
    margin: 14px auto auto;
    display: block;
    color: #999
}

p.switch-description a {
    color: #6c63ff;
}

.switch-buttons {
    width: 88%;
    right: 0;
    left: 0;
    display: block;
    margin: 18px auto 30px;
    height: fit-content
}

.switch-buttons button {
    background: #6c63ff;
    width: 100%;
    height: 50px;
    border-radius: 50px;
    margin-bottom: 13px;
    color: #fff
}

button.cansle-menu-share, button.canslewitcher {
    border: 1px solid #f0f0f0;
    background: 0 0;
    color: #000007
}

button.cansle-menu-share:after, button.canslewitcher:after {
    content: 'Cancel'
}

.ar button.cansle-menu-share:after, .ar button.canslewitcher:after {
    content: 'إلغاء'
}

button.cansle-menu-share {
    position: absolute;
    width: 88%;
    right: 0;
    margin: auto auto 30px;
    bottom: 0;
    border-radius: 50px;
    height: 50px
}

.roller-refresh {
    position: absolute;
    right: 0;
    left: 0;
    margin: 120px auto auto
}

.roller-refresh .lds-roller-main {
    transform: scale(.35) translateY(140px)
}

.refresh-arrow:after {
    content: '';
    width: 20px;
    height: 20px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Down.svg);
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    background: #6c63ff;
    -webkit-mask-position: center;
    right: 0;
    left: 0;
    margin: 50px auto auto;
    display: flex
}

.dark .refresh-arrow:after, .dark .roller-refresh .lds-roller-main div:after {
    background: #878792
}

.ptr--ptr {
    box-shadow: none !important
}

.refresh-arrow {
    margin-bottom: -8px
}

.ios .page-left {
    margin-top: 55px
}

.suggest-follow[datafn=unfollow] {
    background: #6c63ff;
    width: 70px
}

.suggest-follow[datafn=unfollow]:after {
    content: 'Unfollow';
    color: #fff
}

.mask .posts-all-profile[dtload="0"] .thred-post.may-know.actred {
    margin-top: 18px;
    border-top: 0
}

.ar .suggest-follow[datafn=unfollow]:after {
    content: 'متابع';
    color: #fff
}

.ios .inner-movies-search {
    margin-top: 90px
}

.ios .menu-bottom {
    padding-bottom: 20px
}

.ios.dark .menu-bottom {
    background: rgb(36 36 40 / 78%);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

.ios .top-notifs-fixed, .ios .top-stories-bar {
    margin-top: 60px
}

.ios .user-top-stories {
    margin-top: 80px
}

.ios .top-close-stories {
    margin-top: 65px
}

.ar .outest-profile-image.story .profile-image-full:before {
    margin-left: 0;
    margin-right: -5px
}

.ar .top-notifs-fixed {
    direction: rtl
}

.ar .msg-insetop-flexdnt {
    margin-left: 0;
    margin-right: 55px
}

.ar .my-story[dataid], .ar .my-story[datatime] {
    margin-left: 20px;
}

.ar .post-msg-profile-info.verified-profile span:after {
    margin-right: 3px;
    margin-left: -2px;
}

.ar .noti-footer span {
    margin-right: 60px;
}

.ar .inner-post-qoute {
    margin-left: 0;
    margin-right: 60px;
}

.ar .inner-post-qoute:before {
    left: unset;
    margin-left: 0;
    right: 0;
    margin-right: -35px;
    border-left: 0;
    border-right: 2px solid;
}

.dark.ar .inner-post-qoute:before {
    border-color: #303036;
}

.ios .socialogomain.apple {
    border-radius: 10px;
    position: relative;
    direction: ltr;
    padding: 0 5px;
    margin-left: 20px
}

.ios .socialogomain.apple svg {
    right: 0;
    margin-left: 8px
}

.ios .socialogomain.apple:after {
    content: 'Sign in with Apple';
    color: #fff;
    font-size: 10px;
    font-family: var(--regular);
    height: 10px;
    display: flex;
    width: 50px;
    margin-top: 13px;
    margin-left: 10px;
    text-align: left;
    margin-right: 10px;
    line-height: 12px
}

.ios .socialogomain.apple:before {
    content: '';
    position: absolute;
    left: 0;
    height: 20px;
    width: 1px;
    background: #f0f0f0;
    display: flex;
    top: 0;
    bottom: 0;
    margin: auto auto auto -12px
}

.dark.ios .socialogomain.apple:before {
    background-color: #242428
}

.ar.ios .socialogomain.apple:after {
    content: 'التسجيل بواسطة أبل'
}

.ios.ar .sociallogoin {
    direction: ltr
}

.ar.ios .socialogomain.apple {
    margin-left: 0;
    margin-right: 20px
}

.ar.ios .socialogomain.apple:before {
    margin-left: unset;
    left: unset;
    right: 0;
    margin-right: -12px
}

.post-draw img {
    z-index: 9;
    right: 0;
    max-height: 500px;
    max-width: 1000px;
    left: 0;
    margin: auto;
    transition: 0.2s;
}

.ropviewsection a {
    font-family: var(--regular);
}

.exporting-container {
    padding-bottom: 100%;
}

.reply-textarea {
    position: absolute
}

.reply-textarea, .sendtext, .info-field-sets input, .changable-lang, .input-link-add {
    user-select: text;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: text;
}

.container-story-slider {
    scroll-behavior: unset;
}

.zeroscale {
    transform: scale(0) !important;
}

.new-feeds {
    position: fixed;
    top: 0;
    height: 40px;
    right: 0;
    left: 0;
    margin: auto;
    width: fit-content;
    margin-top: 35px;
    background: #6c63ff;
    z-index: 9999;
    border-radius: 20px;
    padding: 0px 15px;
    box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
    display: flex;
    transition: 0.2s;
    transform: translateY(-200px);
    padding-right: 18px;
}

.new-feeds:after {
    content: 'New Feeds';
    font-family: var(--regular);
    color: #fff;
    font-size: 14px;
    margin-top: 10px;
    display: flex;
    line-height: 20px;
}

.new-feeds:before {
    content: '';
    width: 20px;
    height: 20px;
    display: flex;
    position: relative;
    background: #fff;
    margin-top: 10px;
    margin-right: 5px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Up.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    -webkit-mask-size: 18px;
}

.ios .new-feeds {
    -webkit-backdrop-filter: blur(8px);
    background: rgb(108 99 255 / 61%);
    margin-top: 60px;
}

.zerowidth {
    width: 0px !important;
    height: 0 !important;
}

.outest-profile-image.opened .profile-image-full {
    position: fixed;
    width: 250px;
    height: 250px;
    right: 0;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    z-index: 999;
    border: none;
}

.outest-profile-image.opened span {
    content: '';
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgb(0 0 0 / 24%);
    z-index: 99;
    top: 0;
    left: 0;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    transition: 0.2s;
}

.sections-time {
    width: 100%;
    position: relative;
}

.inner-section-time {
    display: flex;
    flex-wrap: wrap;
    /* margin-left: 6%; */
    margin-top: 20px;
}

.section-item {
    height: 38px;
    border-radius: 20px;
    margin: auto;
    padding: 0 18px;
}

.section-item.drawing:after {
    content: 'Drawing';
}

.section-item.all:after {
    content: 'All posts';
}

.section-item.movies:after {
    content: 'Movies';
}

.section-item.music:after {
    content: 'Music';
}

.section-item:after {
    color: #878792;
    font-family: var(--regular);
    line-height: 40px;
    font-size: 14px;
}

.section-item:last-child {
    margin-right: 6%;
}

.section-item:first-child {
    margin-left: 6%;
}

.section-item.selected {
    background: linear-gradient(45deg, #4527a0, #673ab7);

}



.section-item.selected:after {
    color: #fff;
}

.filter-timeline {
    /* background: #242428; */
    right: 0;
    left: 0;
    margin: auto;
    border-radius: 20px;
    position: relative;
}

.icon-filter-time {
    width: 60px;
    height: 100%;
    -webkit-mask-image: url(../media/svg/Broken/Filter.svg);
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    background: #878792;
    -webkit-mask-repeat: no-repeat;
    right: 0;
    position: absolute;
    margin-right: 6%;
    /* display: none; */
}

.inner-filter-tineline {
    width: 100%;
    display: flex;
    height: 38px;
}

.btns-filter-time {
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
}

.btns-filter-time:after {
    content: 'For You';
    color: #878792;
    font-family: var(--regular);
    font-size: 14px;
}

.btns-filter-time.for-following:after {
    content: 'Following';
}

.btns-filter-time.for-following {
    margin-right: 60px;
}

.btns-filter-time.for-you {
    margin-left: calc(6% + 60px);
}

.btns-filter-time.selected {
    background: #242428;
    border-radius: 20px;
    border: 1px solid #878792;
}

.search-btn.search-main {
    margin-right: 50px;
    display: none;
}

.search-btn.search-main:after {
    -webkit-mask-image: url(../media/svg/Broken/Search.svg);
}

.inner-filter-tineline:before {
    border-left: 3px solid #242428;
    border-top: 3px solid #242428;
    height: 70px;
    width: 60px;
    content: '';
    position: absolute;
    margin-left: 42px;
    margin-top: 20px;
    border-top-left-radius: 25px;
}

.search-btn.filter-btnt {
    margin-right: 50px;
}

.search-btn.filter-btnt:after {
    -webkit-mask-image: url(../media/svg/Broken/Filter.svg);
}

.moreview .post:last-child {
    padding-bottom: 0;
    padding-top: 5px;
}

.moreview .post:last-child .inner-post {
    background: no-repeat;
}

.moreview .post:last-child .post-header:before {
    content: 'View Thread';
    position: absolute;
    color: #878792;
    width: 100%;
    text-align: center;
    font-family: var(--regular);
    margin-left: -10px;
    font-size: 14px;
    line-height: 15px;
}

.moreview .post:last-child .pppi {
    width: 25px;
    height: 25px;
    margin-left: -47.5px;
}

.moreview .post:last-child .inner-post {
    padding: 0;
}

.moreview .post:last-child .inner-post:before {
    margin-bottom: -10px !important;
}

.moreview .post:last-child .post-header:after {
    content: '';
    width: 25px;
    height: 25px;
    right: 0;
    position: absolute;
    -webkit-mask-image: url(../media/svg/Bulk/Show.svg);
    -webkit-mask-size: 20px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background: #878792;
    left: 0;
    margin: auto;
    transform: translateX(45px);
    margin-top: -5px;
}

.moreview .post:nth-last-child(2) .inner-post:after {
    height: calc(100% + -25px);
}

.moreview .post:last-child .pppi:after {
    position: absolute;
    width: 2px;
    height: 4px;
    background: #303036;
    margin-top: -10px;
    content: '';
    display: flex;
    margin-left: 12.5px;
}

.pico.xupost.save:before {
    -webkit-mask-image: url(../media/svg/Broken/Bookmark.svg);
}

.pico.xupost.save {
    left: 0;
    right: unset;
    margin-left: 12px;
}

.noti-data .usfn {
    max-width: calc(100% + -110px);
}


a.oplink {
    appearance: none;
    -webkit-appearance: none;
    text-decoration: none;
    color: #9390d0;
    font-weight: bold;
    outline: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    direction: ltr !important;
    width: 200px;
    display: inline-block;
    max-width: fit-content;
    line-height: 20px;
    margin-bottom: -5px;
}

.user-info-list-mov {
    display: flex;
}

.movie-img-list {
    width: 50px;
    height: 50px;
    background: url(../media/profile/user.jpg);
    border-radius: 50%;
    /* right: 0; */
    left: 0;
    /* margin: auto; */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.list-owner-movie {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    margin-top: 10px;
}

.user-name-list {
    display: grid;
    text-align: left;
    margin-left: 12px;
}

.user-name-list * {
    font-family: var(--regular);
    color: #fff;
    font-size: 16px;
    line-height: 22px;
}

.user-name-list a {
    opacity: 0.5;
    margin-top: -5px;
}

.user-name-list span {
    font-weight: bold;
}

.collection-features {
    display: flex;
    height: 46px;
    background: rgb(255 255 255 / 10%);
    border-radius: 50px;
    margin-top: 28px;
    border: 2px solid transparent;
    position: relative;
}

.collection-features:after {
    content: 'Subscribe';
    font-size: 16px;
    color: rgb(255 255 255);
    font-family: var(--regular);
    right: 0;
    left: 0;
    margin: auto;
}

.collection-features:before {
    content: '';
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Broken/Notification.svg);
    display: flex;
    left: 0;
    background: #fff;
    width: 24px;
    height: 24px;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
    margin-top: 12px;
    margin-left: 16px;
}

.collection-features a {
    position: absolute;
    right: 0;
    margin-top: 10px;
    margin-right: 40px;
    color: #fff;
    font-family: var(--regular);
    display: flex;
    opacity: 0.5;
    line-height: 26px;
}

.collection-features a:after {
    content: '';
    -webkit-mask-size: 17px;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Broken/Profile.svg);
    display: flex;
    background: #fff;
    width: 17px;
    height: 24px;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
    margin-top: 0px;
    margin-right: -21px;
    right: 0;
}


.collection-features[subed='true'] {
    background: rgb(255 255 255 / 10%);
    border: 2px solid rgb(255 255 255 / 20%);
}

.collection-features[subed='true']:before, .collection-features[subed='true']:after {
    opacity: 0.5;
}

.collection-features[subed='true']:after {
    content: 'Subscribed';
}

.collection-features[subed='true']:before {
    -webkit-mask-image: url(../media/svg/Broken/Volume%20Up.svg);
}

.menus-lists-add {
    min-height: 250px;
    display: none;
    padding-top: 30px;
    width: 100%;
    overflow: visible;
    transition: 0.2s;
    padding-bottom: 50px;
}

.add-new-list:before {
    content: '+';
    width: 50px;
    height: 50px;
    background: transparent;
    position: absolute;
    border-radius: 15px;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='15' ry='15' stroke='%23FFFFFF' stroke-width='4' stroke-dasharray='6%2c 14' stroke-dashoffset='0' stroke-linecap='square'/%3e%3ctext x='50%25' y='50%25' text-anchor='middle' dy='.3em' font-size='20' fill='%23FFFFFF'%3e%2b%3c/text%3e%3c/svg%3e");
}

.list-sort-sv {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    height: 50px;
    margin-top: 20px;
}

.list-sort-sv:after, .list-sort-sv.closms-vid p {
    content: 'Create new colllection';
    color: #fff;
    display: flex;
    font-family: var(--regular);
    margin-left: 65px;
    margin-top: 15px;
    font-size: 16px;
    position: absolute;
    line-height: 20px;
}



.header-collection {
    background-image: url(../media/bn/undraw_collecting_re_lp6p.svg);
    width: 100%;
    height: 150px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
    margin-top: 20px;
}

.collection-main svg {
    width: 100%;
}

.dark .header-collection {
    background-image: url(../media/bn/dark_collection.svg);
}

.collection-type-set {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 120px;
    margin-top: 25px;
}

.coll-adsv {
    width: 100%;
    background: #1c1c21;
    height: 100px;
    border-radius: 30px;
    margin-top: 15px;
    display: grid;
    position: relative;
    transition: 0.2s;
}

.coll-adsv:before, .coll-adsv:after {
    font-family: var(--bold);
    color: #fff;
    font-size: 16px;
    margin-left: 100px;
    display: flex;
    width: 55%;
    height: 20px;
    line-height: 15px;
}

.coll-adsv:after {
    font-family: var(--regular);
    margin-top: 36px;
    font-size: 14px;
    opacity: 0.6;
    margin-top: -24px;
    margin-bottom: auto;
}

.coll-adsv a {
    position: absolute;
    left: 0;
    width: 60px;
    height: 60px;
    background-image: url(../media/bn/undraw_home_cinema_l7yl.svg);
    background-size: contain;
    background-repeat: no-repeat;
    margin-left: 20px;
    margin-top: 20px;
}

.coll-adsv:before {
    margin-top: 23px;
    margin-bottom: 0;
}

.coll-adsv span {
    position: absolute;
    right: 0;
    width: 40px;
    height: 50px;
    background: #878792;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right%202.svg);
    -webkit-mask-repeat: no-repeat;
    margin-top: 38px;
}


.coll-adsv.art-collection a {
    background-image: url(../media/bn/undraw_art_museum_-8-or4.svg);
    background-size: cover;
    background-position: left;
}


.coll-adsv.music-collection a {
    background-image: url(../media/bn/undraw_mello_otq1.svg);
}

.coll-adsv.movies-collection:before {
    content: 'Movies Collection';
}

.coll-adsv.movies-collection:after {
    content: 'Start rating movies and attract subscribers';/
}

.coll-adsv.art-collection:before {
    content: 'Art Gallery';
}

.coll-adsv.art-collection:after {
    content: 'Curate and showcase your drawings in one gallery';
}

.coll-adsv.music-collection-ad:before {
    content: 'Music Collection';
}

.coll-adsv.music-collection-ad:after {
    content: 'Create your music collection and attract subscribers';
}

.coll-adsv.archive-collection:before {
    content: 'Archive Collection';/
}

.coll-adsv.archive-collection:after {
    content: 'Organize and customize your old messages in topics';
}


.coll-adsv.archive-collection a {
    background-image: url(../media/bn/undraw_resume_folder_re_e0bi.svg);
}


input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    -webkit-appearance: none;
}

.replyinmenu {
    width: 88%;
    display: flex;
    right: 0;
    left: 0;
    margin: auto;
    height: 100px;
    margin-bottom: 20px;
    resize: none;
}

textarea.replyinmenuarea {
    width: 100%;
    background: transparent;
    border: 1px solid #242428;
    padding: 20px;
    border-radius: 20px;
    font-size: 14px;
    font-family: var(--regular);
    resize: none;
    -webkit-appearance: none;
    line-height: 20px;
}

.container-reply .post-qoute {
    margin-left: -30px;
}


.container-reply .inner-post-qoute:before {
    display: none;
}

textarea.replyinmenuarea {
    color: #fff;
}

.container-reply .anonymous-on {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 40px;
}

.switch-buttons button:disabled {
    opacity: 0.5;
}


.flext-sending-something {
    display: flex;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    height: 35px;
    margin-bottom: 10px;
}

.flext-sending-something span:after {
    font-family: var(--regular);
    color: #878792;
}

.flext-sending-something span {
    text-align: center;
    width: 100%;
    margin-right: 5px;
    line-height: 18px;
    height: 15px;
    font-size: 16px;
    align-items: center;
    justify-content: center;
    display: flex;
}

.flext-sending-something .add-movie:after {
    content: 'Send movie';
}

.flext-sending-something .add-music:after {
    content: 'Send music';
}

span.add-movie {
    border-right: 1px solid #242428;
}

.action-menu.quick-reply:before {
    -webkit-mask-image: url(../media/svg/Broken/Send.svg);
}

.action-menu.quick-reply:after {
    content: 'Quick reply the message';
}

.container-reply {
    display: none;
}

.qoute .container-reply {
    display: block;
}

.menu-save .menus-lists-add {
    display: flex;
}

.menu-save .inset-switch {
    display: none;
}

.menu-share-outer.logedin {
    height: 360px;
}

.menu-share-outer.logedin .action-menu.quick-reply {
    display: none;
}

.playlist-name-input {
    margin: auto;
    border: 1px solid rgb(255 255 255 / 10%);
    border-radius: 20px;
    display: flex;
    margin-right: 115px;
}

.playlist-name-input input {
    margin-right: 20px;
    background: transparent;
    height: 50px;
    font-size: 14px;
    font-family: var(--regular);
    margin-left: 20px;
    width: 100%;
    color: #fff;
}

.playlist-name-input input::placeholder {
    color: rgb(255 255 255 / 30%);
}

.noopacity {
    background-color: transparent;
}


.coll-contset {
    position: relative;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    display: none;
    z-index: 9;
}

.flex-collection {
    display: flex;
    flex-wrap: nowrap;
    width: fit-content;
}

.secoll-addvio {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='15' ry='15' stroke='%23fff' stroke-width='4' stroke-dasharray='50%25%2c 13%25' stroke-dashoffset='57' stroke-linecap='butt'/%3e%3c/svg%3e");
    border-radius: 15px;
    width: 135px;
    height: 50px;
    margin-top: 25px;
    display: flex;
    position: relative;
}

.secoll-addvio:after, .secoll-addvio:before {
    color: #fff;
    font-family: var(--regular);
    margin-top: 10px;
    margin-left: 22px;
    font-size: 14px;
}

.secoll-addvio:before {
    font-size: 25px;
    content: '+';
    line-height: 32px;
    margin-left: 15px;
}

.secoll-addvio:after {
    margin-left: 8px;
    content: 'Add section';
    line-height: 30px;
}

.secoll-addvio.adding:before, .secoll-addvio.adding:after {
    display: none;
}

.secoll-addvio.adding input {
    color: #fff;
    background: transparent;
    font-family: var(--regular);
    width: 100%;
    padding-right: 40px;
    padding-left: 40px;
    text-align: center;
    font-size: 14px;
}

.secoll-addvio.adding input::placeholder {
    color: rgb(255 255 255 / 24%);
}

.container-ssvgx {
    margin-top: 235px;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
    margin-left: -6%;
    padding-left: 6%;
    padding-right: 6%;
    scroll-behavior: smooth;
}

.listadxo .header-top p:after {
    content: 'Create Collection';
}

.done-ssvgcol ul {
    display: flex;
}

.secoll-addvio.adding a, .secoll-addvio.adding .edit-ssvgcol span {
    width: 36px;
    height: 50px;
    margin-right: 5px;
    margin-left: 5px;
    position: absolute;
    background: #fff;
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
}

.secoll-addvio.adding .edit-ssvgcol a {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
}

.secoll-addvio.adding .edit-ssvgcol span {
    right: 0;
    -webkit-mask-image: url(../media/svg/Broken/Tick%20Square.svg);
}

.secoll-addvio.adding {
    width: 200px;
}

.secoll-addvio.adding.done {
    width: fit-content !important;
    background: transparent;
    margin-right: 5px;
    margin-left: 0;
}

.edit-ssvgcol {
    display: flex;
    width: 100%;
}

.done-ssvgcol a {
    position: relative !important;
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
}

.done-ssvgcol {
    display: flex;
    width: 100%;
    display: none;
}

.secoll-addvio.adding.done .edit-ssvgcol {
    display: none;
}

.secoll-addvio.adding.done .done-ssvgcol {
    display: flex;
}

.done-ssvgcol span {
    color: #fff;
    font-family: var(--regular);
    margin-left: 10px;
    line-height: 50px;
    max-width: 150px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 14px;
}

.secoll-addvio.adding.done.selected {
    background: rgb(255 255 255 / 10%);
}

.listing-add .music-section-container {
    display: none;
}

.listing-add .music-container-def {
    display: none;
}

.listing-add .coll-contset {
    display: block;
}

.listing-music-it .add-gcsp {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
    -webkit-mask-size: 24px;
}

.listing-music-it .active-search-music:before {
    display: flex;
    width: 40px;
    height: 100%;
    content: '';
    position: absolute;
    left: 0;
    margin-right: 10px;
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/menu.svg);
    background: #fff;
    -webkit-mask-repeat: no-repeat;
}

.active-search-music.added .add-gcsp {
    display: none !important;
}

.active-search-music.added:after {
    content: 'Added';
    position: absolute;
    color: rgb(255 255 255 / 50%);
    right: 0;
    font-family: var(--regular);
    background: rgb(255 255 255 / 15%);
    border-radius: 5px;
    padding: 5px 10px;
    margin-top: 16px;
    font-size: 14px;
}

.listing-add .search-music-fetch .info-gcsp {
    margin-right: 80px;
}

.listing-add .listing-music-it .info-gcsp {
    margin-right: 50px;
}

.inner-music-search.searching .listing-music-it {
    display: none;
}

.listing .music-sections-menu span:after {
    display: none;
}

.listing-music-it {
    padding-bottom: 50px;
    right: 0;
    left: 0;
    margin: auto;
    position: relative;
    width: 100%;
    display: none;
    margin-top: 28px;
}

.listing-add .listing-music-it {
    border-top: 1px solid rgb(255 255 255 / 10%);
}

.listing-music-it section:empty:after, .listing-music-it:empty:after, .listing-music-it.adding:before {
    content: 'There\'s no songs in this section of collection, search for music to add';
    font-family: var(--regular);
    color: #fff;
    opacity: 0.2;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    position: absolute;
    margin: auto;
    width: 88%;
    right: 0;
    left: 0;
    margin-top: 20px;
}

.listing-music-it:empty:after {
    content: 'There\'s no section in your collection yet, type section name and add it';
}

.coll-contset {
    display: none;
}

.create-addname-colmsuc button {
    width: 100px;
    position: absolute;
    right: 0;
    height: 50px;
    background: rgb(255 255 255 / 10%);
    border-radius: 20px;
    top: 0;
    color: #fff;
    font-size: 14px;
    font-family: var(--regular);
    transition: 0.2s;
}

button.add-sub-mscol:after {
    content: 'Create';
}

.list-info-collmus {
    width: 100%;
    position: relative;
    display: none;
}

.listing .music-sections-menu span.selected {
    background: rgb(255 255 255 /10%);
}

.listing .music-sections-menu span {
    border-radius: 50px;
    padding: 10px 20px;
    height: 20px;
    line-height: 18px;
    margin-right: 0;
}

.listing .listing-music-it, .listing-add .listing-music-it, .listing .list-info-collmus {
    display: block;
}

.listing-add .inner-music-search {
    position: relative;
    z-index: 9;
    width: 88%;
}

.music-collection-add .music-deflex-secion {
    display: none;
}

.listing .listing-music-it:empty:after {
    content: 'This collection doesn\'t have any content yet';
    text-align: center;
    width: 100%;
}

.listing .listing-music-it:empty:after {
    content: 'This collection doesn\'t have any content yet';
    text-align: center;
    width: 100%;
}

.listing .listing .listing-music-it {
    background: #000007;
    width: 100%;
    height: 200px;
    margin-top: 139px;
    padding: 0;
}

.likes-cols-nsmg, .share-cols-nsmg {
    position: absolute;
    width: 50px;
    height: 50px;
    right: 0;
    text-align: center;
    top: 0;
    margin-top: -10px;
}

.likes-cols-nsmg:before, .share-cols-nsmg:before {
    content: '';
    background: #fff;
    width: 50px;
    height: 50px;
    -webkit-mask-image: url(../media/svg/Broken/Upload.svg);
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
    opacity: 0.5;
    right: 0;
}

.likes-cols-nsmg a {
    color: #fff;
    font-family: var(--regular);
    margin-top: 43px;
    position: absolute;
    width: 100%;
    text-align: center;
    left: 0;
    font-size: 12px;
    opacity: 0.25;
}

.listing .listing-music-it .active-search-music:before {
    display: none;
}

.listing .listing-music-it {
    background: #000007;
    width: 100%;
    height: 200px;
    margin-top: 139px;
    padding: 0;
}

.listing .listing-music-it .image-gcsp.audio-image {
    margin-left: 0;
    border-radius: 15px;
}

.listing .image-gcsp:before {
    display: none;
}

.swiper.trending-container.favesmcnr {
    margin-top: 95px;
    display: flex;
    position: absolute;
    z-index: 99;
    height: 140px;
    width: 100%;
}

.favesmcnr.trending-container .trending-section.loadtrending span {
    margin-top: 64px;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: transparent;
}

.favesmcnr.trending-container .trending-section.loadtrending span:before {
    height: 10px;
    margin-left: 4px;
    margin-top: 22px;
}

.favesmcnr.trending-container .trending-section.loadtrending span:after {
    height: 10px;
    margin-left: 4px;
    margin-top: 40px;
}

.favesmcnr.trending-container .trending-section.loadtrending {
    background: rgb(255 255 255 / 10%);
}

.listing .add-trending-music {
    -webkit-mask-image: url(../media/svg/pause.svg);
    width: 100%;
    height: 100%;
    margin: 0;
    opacity: 0;
}

.listing .played .add-trending-music {
    opacity: 1;
}

.listing-user.liked.actv-stryuser:after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    background: #fff;
    right: 0;
    margin-right: calc(6% + 35px);
    margin-top: 27px;
    -webkit-mask-position: center;
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg);
}

.listing .listing-music-it .add-gcsp {
    -webkit-mask-image: url(../media/svg/more_dots.svg);
    -webkit-mask-size: 26px;
    -webkit-mask-position: right;
}

.listing-add .inner-music-search.searching {
    border-bottom: 1px solid rgb(255 255 255 / 25%);
}

.likes-cols-nsmg {
    height: 50px;
    width: 50px;
    margin-right: 0;
}

.music-search .header-top p:empty:after {
    content: 'Collections';
}

.likes-cols-nsmg:before {
    -webkit-mask-image: url(../media/svg/Broken/Heart.svg);
    -webkit-mask-size: 24px;
}

.share-cols-nsmg {
    margin-right: 40px;
}

.listing.music-search .header-top p:after {
    display: none;
}


.owner.music-search .collection-features a {
    display: none;
}

.owner.music-search .collection-features:before {
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
}

.owner.music-search .collection-features:after {
    content: 'Edit Collection';
}

.owner.music-search .likes-cols-nsmg {
    display: none;
}

.owner.music-search .share-cols-nsmg {
    margin-right: 0;
}

.edit button.add-sub-mscol:after {
    content: 'Save';
}

.secoll-addvio {
    margin-right: 10px;
    margin-left: 10px;
}

.export-list {
    height: 50px;
    background: linear-gradient(45deg, #4527a0, #673ab7);
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    border-radius: 20px;
    margin-top: 20px;
    display: flex;
    text-align: center;
    position: relative;
    display: none;
}

.export-list:after {
    content: 'Add full list';
    color: #fff;
    font-family: var(--regular);
    width: 100%;
    text-align: center;
    margin-top: 15px;
    line-height: 20px;
}

.export-list:before {
    margin-left: 10px;
    -webkit-mask-image: url(../media/svg/Broken/Download.svg);
    -webkit-mask-position: center;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    background: #fff;
    width: 50px;
    height: 50px;
    left: 0;
    content: '';
    position: absolute;
}

.inner-music-search .export-list.music-list {
    width: 100%;
    background: rgb(255 255 255 / 10%);
}

.list .export-list {
    display: flex;
}

.secoll-addvio:first-child {
    margin-left: 0 !important;
}

button.add-sub-mscol:disabled {
    opacity: 0.5;
}

.remove-list .export-list.music-list:before {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
}

.remove-list .export-list.music-list:after {
    content: 'Remove playlist';
}

.list .add-gcsp {
    display: none;
}

.list .listing-music-it .active-search-music:before {
    display: none;
}

.list .listing-music-it .image-gcsp.audio-image {
    margin-left: 0;
}

.list .info-gcsp {
    margin-left: 70px !important;
}

.searching.list .add-gcsp {
    display: flex;
}

* {
    scroll-behavior: smooth !important;
}

*::-webkit-scrollbar {
    display: none !important;
}

.listing .music-deflex-secion, .listing .span.top-header-spsrqq, .listing .trending-container, .listing .music-container-def .music-section-container, .listing .top-header-spsrqq, .listing .search-rowsmusic-fetch {
    display: none;
}

.viewing-menscv .music-section-container {
    margin-top: 10px;
}

.box.checked.share-rate {
    margin-left: 6%;
    margin-top: 90px;
    background: #2f4552 !important;
}

.rating-versa-colls:before {
    content: 'Chose rating';
    position: absolute;
    font-family: var(--regular);
    color: #fff;
    margin-top: -20px;
    font-size: 16px;
}

.ratetext-contv:after {
    content: 'Select categories :';
    position: absolute;
    color: #fff;
    bottom: 0;
    font-family: var(--regular);
    font-size: 16px;
}

.rating-versa-colls span:first-child {
    margin-left: 0;
}

.rating-versa-colls span:last-child {
    margin-right: 0;
}

.rating-versa-colls {
    height: 50px;
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    position: absolute;
    top: 0;
    width: 100%;
    margin-top: 190px;
}

.listing .trending-container {
    margin-top: 25px;
}

.rating-versa-colls span {
    margin: auto;
    width: 30px;
    height: 30px;
    display: flex;
    position: relative;
    overflow: visible;
    border-radius: 50px;
}

.rating-versa-colls span:before, .rating-versa-colls span:after {
    content: '';
    width: 100%;
    height: 100%;
    display: flex;
    -webkit-mask-image: url(../media/svg/Broken/Star.svg);
    background: #fff;
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
}

.rating-versa-colls span:after {
    visibility: hidden;
    -webkit-mask-image: url(../media/svg/Bold/Star.svg);
    background: #fff;
}

.rating-versa-colls span.selected:after {
    visibility: visible;
}

.rating-versa-colls span.selected:before {
    visibility: hidden;
}

.draw-gallary .header-top p:after {
    content: 'Art gallary';
}

.gallary-item {
    width: 265px;
    height: 150px;
    background-size: cover;
    border-radius: 20px;
    margin-right: 15px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.html-gallary-art {
    width: 100%;
    z-index: 9;
    overflow-y: hidden;
    overflow-x: scroll;
}

.html-gallary-art section {
    width: fit-content;
    display: flex;
    margin-left: 6%;
}

.lk-art {
    position: absolute;
    width: 35px;
    height: 35px;
    background: rgb(255 255 255 / 60%);
    border-radius: 50px;
    bottom: 0;
    right: 0;
    margin-right: 10px;
    margin-bottom: 10px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 9;
}

.contart {
    width: 100%;
    height: 100%;
    transition: 0.2s;
}

.gallary-item:after {
    position: absolute;
    content: '';
    bottom: 0;
    width: 100%;
    background: linear-gradient(to top, black, transparent);
    height: 140px;
    left: 0;
    margin-bottom: -50px;
    visibility: hidden;
}

.lk-art:before, .lk-art:after {
    width: 40px;
    height: 40px;
    background: #000007;
    -webkit-mask-image: url(../media/svg/Broken/Heart.svg);
    -webkit-mask-position: center;
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    content: '';
    position: absolute;
}

.lk-art:after {
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg);
    visibility: hidden;
}

.gallary-grid-art section {
    width: calc(88% + 20px);
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
}

.gallary-grid-art {
    margin-top: 28px;
    margin-bottom: 100px;
}

.gallary-grid-art .lk-art {
    transform: scale(0.65);
    margin-right: 5px;
    margin-bottom: 5px;
    visibility: hidden;
}


.gallary-table-art section {
    width: 88%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: 20px;
    justify-content: center;
}

.gallary-table-art {
    width: 100%;
    height: fit-content;
}

.gallary-item-table {
    width: calc(50% + -10px);
    height: 120px;
    margin: auto;
    border-radius: 20px;
    background-size: cover;
    background-position: center;
    margin-bottom: 20px;
    margin-left: 0;
    position: relative;
}

.gallary-item-table:nth-of-type(even) {
    margin-right: 0;
}

.force-art .gallary-item-table:nth-of-type(even) {
    margin-right: auto;
}

.force-art .gallary-item-table:nth-of-type(3n+2) {
    margin-right: 0;
}

.gallary-item .lk-art:before, .gallary-item .lk-art:after {
    transform: rotate(20deg);
    margin-left: 8px;
    margin-top: 5px;
}

.load-art {
    background-color: #f0f0f0;
}

.gallary-item .lk-art {
    width: 100px;
    height: 100px;
    border-radius: 35px;
    transform: rotate(-20deg);
    margin-bottom: -38px;
    margin-right: -55px;
    background: rgb(255 255 255 / 77%);
    background: #fff;
    backdrop-filter: blur(15px);
}

.gallary-table-art .lk-art:before, .gallary-table-art .lk-art:after {
    width: 35px;
    height: 35px;
}

.gallary-table-art .header-art-gallary {
    /*
    font-weight: normal;
    font-family: var(--regular);
    font-size: 18px;
    margin-top: 30px;*/
}



.force-art .gallary-item-table:nth-of-type(3n+3) {
    width: 100%;
    height: 160px;
    margin-right: 0;
}

.pico.xupost.repost {
    left: 0;
    right: unset;
    margin-left: 40px;
}

.pico.xupost.repost:before {
    -webkit-mask-image: url(../media/svg/Broken/Swap.svg);
    transform: rotate(90deg);
}

.tfpo.ps {
    margin-left: 55px;
    padding-left: 10px;
    border-left: 1px solid rgb(135 135 146 / 49%);
}

.collections-page .header-top p:after {
    content: 'Collections';
}


.collview-prfile {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: 60px;
    position: relative;
    height: 75px;
    display: flex;
}

.collview-prfile a {
    color: #fff;
    display: flex;
    font-family: var(--regular);
    font-size: 16px;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 20px;
    line-height: 20px;
    margin-left: 65px;
    width: 100%;
}

.collview-prfile .forth-sectionns {
    width: 50px;
    height: 50px;
    border-radius: 15px;
    margin-top: 12px;
    display: flex;
    flex-wrap: wrap;
    overflow: hidden;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.forth-sectionns span {
    width: 25px;
    height: 25px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    display: flex;
}



.collview-prfile p {
    font-size: 14px;
    color: #878792;
    font-family: var(--regular);
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 16px;
    line-height: 16px;
    margin-right: 35px;
}

.collview-prfile:after {
    content: '';
    width: 24px;
    height: 24px;
    position: absolute;
    background: #eee;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    -webkit-mask-position: center;
    -webkit-mask-size: 24px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right%202.svg);
}

section[dnload='true'] .load-art {
    display: none;
}

.artist-header {
    width: 100%;
    z-index: 999;
    display: flex;
    position: absolute;
    top: 0;
    margin-top: 130px;
}

.artist-image span {
    width: 75px;
    height: 75px;
    background-image: url(../media/profile/art.jpg);
    background-size: cover;
    background-position: center;
    display: flex;
    border-radius: 50%;
    overflow: hidden;
    background-color: #f0f0f0;
}

.left-artst-fiz {
    background: aliceblue;
    width: 100%;
    height: 325px;
    position: absolute;
    top: 0;
    border-bottom-right-radius: 50px;
}

.back-artist-fize {
    width: 100%;
    height: 250px;
    position: absolute;
    top: 0;
}

.artist-image {
    margin-left: 6%;
    overflow: hidden;
    width: 75px;
    height: 75px;
    border: 5px solid #ffffff2b;
    border-radius: 50%;
}

.left-artst-fiz:before {
    content: '';
    width: calc(6% + 50px);
    height: 91px;
    left: 0;
    position: absolute;
    background: rgb(45 38 51 / 100%);
    bottom: 0;
    margin-bottom: -90px;
    z-index: 2;
}

.artist-name {
    display: grid;
    margin-left: calc(6% + 100px);
    position: absolute;
    margin-top: 15px;
    width: calc(100% + -245px);
}

.artist-name span {
    color: #fff;
    font-family: var(--regular);
    font-weight: bold;
    line-height: 25px;
}

.artist-name a {
    color: #fff;
    font-family: var(--regular);
    opacity: 0.5;
    line-height: 20px;
    font-size: 14px;
}

.artist-name * {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.share-artist-right {
    margin-top: 10px;
    position: absolute;
}

.share-artist-right {
    right: 0;
    margin-right: calc(6% + 50px);
    margin-top: 10px;
    background: rgb(255 255 255 / 20%);
    width: 40px;
    height: 40px;
    border-radius: 37px;
}

.share-artist-right:before, .share-artist-right.like:after {
    content: '';
    width: 100%;
    height: 100%;
    -webkit-mask-image: url(../media/svg/Broken/Upload.svg);
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    background: #fff;
    right: 0;
    position: absolute;
    -webkit-mask-position: center;
}

.share-artist-right.like {
    margin-right: 6%;
}

.share-artist-right.like:before {
    -webkit-mask-image: url(../media/svg/Broken/Heart.svg);
}

.left-artst-fiz span {
    position: absolute;
    width: 100%;
    height: 100%;
    background-image: url(../media/profile/art.jpg);
    background-size: cover;
    background-position: center;
    right: 0;
    border-bottom-right-radius: 50px;
}

.left-artst-fiz:after {
    background: linear-gradient(to top right, rgb(45 38 51 / 100%), rgb(45 38 51 / 72%), rgb(45 38 51 / 43%));
    width: 100%;
    height: 100%;
    position: absolute;
    display: flex;
    content: '';
    right: 0;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-bottom-right-radius: 50px;
    overflow: hidden;
}

.draw-gallary .page-header {
    background: transparent !important;
}

.draw-gallary .header-top p {
    border-color: rgb(255 255 255 / 20%) !important;
}

.draw-gallary .header-top p:after {
    color: #fff;
    opacity: 0.5;
}

.unlock-art, .show-hidden-art {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 0;
    background: rgb(255 255 255 / 56%);
    border-top-left-radius: 20px;
    border-bottom-right-radius: 20px;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 9;
}

.unlock-art:before, .show-hidden-art:before {
    content: '';
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 20px;
    -webkit-mask-position: center;
    -webkit-mask-image: url(../media/svg/Broken/Lock.svg);
    background: #000007;
    position: absolute;
    width: 100%;
    height: 100%;
}

.artist-page-container {
    margin-top: 175px;
}

.ios .artist-page-container {
    margin-top: 145px;
}

.banner-switch.banner.show_id {
    background-image: url(../media/bn/undraw_surveillance_re_8tkl.svg);
    margin-left: -25px;
}

.opened.active-art .contart {
    position: fixed;
    width: 100%;
    height: 50vw;
    top: 0;
    left: 0;
    border-radius: 0;
    bottom: 0;
    margin: auto;
    z-index: 9999;
    overflow: hidden;
}

.active-art, .contart {
    position: relative;
    justify-content: center;
    align-items: center;
}

.closefrm-artview {
    position: fixed;
    z-index: 999;
    height: 100%;
    width: 100%;
    background: rgb(0 0 0 / 90%);
    top: 0;
    left: 0;
    display: none;
}

.ios .closefrm-artview {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.ios .active-art {
    transition: 0.2s;
}

.artist-page-container.opened .closefrm-artview {
    display: block;
}

.active-art img {
    min-width: 100%;
    max-height: 100%;
    position: absolute;
}

.active-art span {
    width: 100%;
    height: 100%;
    display: flex;
    position: relative;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
}

.opened .unlock-art, .opened .show-hidden-art {
    border-radius: 20px;
    margin-left: 10px;
    margin-top: 10px;
}

.openmsg-artview, .rotate-artview {
    width: fit-content;
    position: fixed;
    right: 0;
    left: 0;
    background: rgb(255 255 255 / 10%);
    padding: 10px 20px;
    border-radius: 20px;
    line-height: 20px;
    height: 20px;
    display: none;
    z-index: 9999;
    top: 0;
    bottom: 0;
    margin: auto;
    transform: translateY(150px);
}

.container-rolex-dev {
    margin-top: 31px;
    width: 100%;
    background: #000007;
    border-top-left-radius: 50px;
    position: absolute;
    z-index: 99;
}

.artist-page-container .collection-features {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: -26px;
}

.openmsg-artview:after {
    content: 'View post';
    color: #fff;
    font-family: var(--regular);
}

.artist-page-container.opened .openmsg-artview {
    display: flex;
}

.active-art.opened span {
    border-radius: 0;
}

.opened.gallary-item .lk-art {
    margin-right: 10px !important;
    margin-bottom: 10px !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    width: 35px !important;
    height: 35px !important;
    background: rgb(255 255 255 / 60%) !important;
    border-radius: 50px !important;
    transform: none !important;
}

.opened.gallary-item .lk-art:before {
    transform: none !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    width: 35px;
    height: 35px;
}

.artist-page-container.opened .html-gallary-art {
    overflow: visible !important;
}

.thred-page {
    z-index: 15;
}

.closemsg-artview:before, .closemsg-mvview:before {
    position: absolute;
    width: 50px;
    height: 50px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Down%202.svg);
    transform: rotate(180deg);
}

.closemsg-artview, .closemsg-mvview {
    position: fixed;
    z-index: 99999;
    width: 50px;
    height: 50px;
    right: 0;
    top: 0;
    margin-right: 6%;
    margin-top: 100px;
    display: none;
}

.closemsg-artview:after, .closemsg-mvview:after {
    position: absolute;
    width: 50px;
    height: 50px;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Down%202.svg);
    margin-top: -8px;
}

.closemsg-artview:after, .closemsg-artview:before, .closemsg-mvview:after, .closemsg-mvview:before {
    -webkit-mask-position: center;
    -webkit-mask-size: 24px;
    background: #fff;
    -webkit-mask-repeat: no-repeat;
    content: '';
}

.artist-page-container.opened .closemsg-artview, .artist-page-container.opened .rotate-artview {
    display: flex;
}

.artist-page-container.rotate.opened .opened .contart {
    transform: rotate(90deg);
    height: 100vw;
    width: 200vw;
    border: 0;
    margin-right: 0;
    bottom: 0;
    margin-left: -50%;
    overflow: visible;
}

.artist-page-container.rotate.opened .openmsg-artview {
    transform: rotate(90deg);
    top: 0;
    border: unset;
    margin-top: 100px;
    margin-left: 0;
    z-index: 99999;
}

.artist-page-container.rotate.opened .opened .lk-art {
    margin-bottom: 25px;
    margin-right: 50px;
}

.rotate-artview {
    margin-right: 90px;
}

.rotate-artview:after {
    content: '';
    background: #fff;
    -webkit-mask-image: url(../media/svg/Broken/Image.svg);
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: 20px;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.artist-page-container.opened.rotate .rotate-artview {
    display: none;
}

.gallary-grid-art .gallary-item-table {
    width: 100px;
    height: 100px;
    background-size: cover;
    background-position: center;
    border-radius: 20px;
    margin-right: 14px;
    margin-bottom: 20px;
    position: relative;
}

.draw-gallary.owner.edit-artg .edit-drawgallary:after {
    content: 'Save';
}

.draw-gallary.owner.edit-artg .edit-drawgallary:before {
    -webkit-mask-image: url(../media/svg/Broken/TicK%20Square.svg);
}

.ios .menu-home-back {
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.header-collection-art {
    display: none;
    margin-top: 15px;
}

.draw-gallary.edit-artg .header-collection-art {
    display: block !important;
}

.show-hidden-art {
    display: none;
    overflow: hidden;
    z-index: 1;
}

.show-hidden-art:before {
    -webkit-mask-image: url(../media/svg/Broken/Hide.svg);
}

.gallary-grid-art .show-hidden-art {
    width: 100%;
    height: 100%;
    z-index: 0;
    border-radius: 20px;
    background: rgb(0 0 0 / 48%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.gallary-grid-art .show-hidden-art:before {
    background: #fff;
    margin-top: -10px;
}

.gallary-grid-art .show-hidden-art:after {
    content: 'Not in gallary, tap to add';
    color: #fff;
    font-family: var(--regular);
    font-size: 12px;
    width: fit-content;
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    margin-top: 55px;
    height: 20px;
    text-align: center;
    width: 90px;
}

.gallary-grid-art .unlock-art {
    width: 30px;
    height: 30px;
    border-bottom-right-radius: 10px;
}

.gallary-grid-art .unlock-art:before {
    -webkit-mask-size: 18px;
}

.edit-artg .html-gallary-art .load-art {
    display: none;
}

.edit-artg .html-gallary-art .load-art {
    display: none;
}

.unlock-art.hide-art {
    display: none;
}

.draw-gallary.edit-artg .unlock-art.hide-art {
    display: block;
}

.gallary-item.add-item {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='20' ry='20' stroke='%23fff' stroke-width='4' stroke-dasharray='6%2c 14' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
    border-radius: 20px;
    background-color: #000007;
}

.html-gallary-art .unlock-art.hide-art:before {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
}

.gallary-item.add-item:before {
    content: 'Add draw';
    color: #fff;
    position: absolute;
    top: 0;
    z-index: 9999;
    font-family: var(--regular);
    font-size: 20px;
    text-align: center;
    width: 100%;
    top: 0;
    bottom: 0;
    margin: auto;
    height: 30px;
    line-height: 30px;
    margin-left: 15px;
}

.gallary-item.add-item:after {
    background: #fff;
    height: 40px;
    width: 40px;
    background: #fff;
    visibility: visible;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 0;
    transform: translateX(-55px);
    -webkit-mask-image: url(../media/svg/Broken/Plus.svg);
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
}

.gallary-item.add-item.adding {
    background: #242428;
}

.gallary-item.add-item.adding:before {
    color: #878792;
    content: 'Chose from arts below to add the draw here or tap again to cancel';
    font-size: 14px;
    width: 75%;
    right: 0;
    left: 0;
    margin: auto;
    line-height: 20px;
    margin-top: 55px;
}

.gallary-item.adding:after {
    display: none;
}

.gallary-table-art.gallary-grid-art.adding .gallary-item-table .show-hidden-art:after {
    content: 'Add draw to slider';
    width: 75px;
    margin-top: 60px;
}

.gallary-table-art.gallary-grid-art.adding .gallary-item-table .show-hidden-art:before {
    -webkit-mask-image: url(../media/svg/Broken/Plus.svg);
}

.gallary-table-art.gallary-grid-art.adding .gallary-item-table .show-hidden-art {
    background: rgb(0 0 0 / 25%);
}

.gallary-item.active-art.deleting-vs .show-hidden-art:before {
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
}

.show-hidden-art.vaild-hide {
    display: block;
}

.unlock-art.hide-art:before {
    -webkit-mask-image: url(../media/svg/Broken/Hide.svg);
}

.gallary-table-art.gallary-grid-art.adding .show-hidden-art {
    display: block !important;
}

.gallary-table-art.gallary-grid-art.adding .unlock-art.hide-art {
    display: none;
}

.unlock-art.show-art {
    display: none;
}

.gallary-item.active-art.deleting-vs .show-hidden-art {
    display: block;
}

.gallary-table-art.force-art .unlock-art.hide-art {
    display: none;
}

.html-gallary-art .show-hidden-art {
    display: none !important;
}

.gallary-item.opened {
    z-index: 9999;
}

.show-hidden-art.vaild-hide:before {
    -webkit-mask-image: url(../media/svg/Broken/Show.svg);
}

.banner.repost {
    background-image: url(../media/bn/undraw_share_re_9kfx.svg);
}

.post.reposted .pico.xupost.repost:before {
    visibility: hidden;
}

.rp-dir {
    position: absolute;
    width: 20px;
    height: 100%;
    margin: auto;
    top: 0;
    margin-left: -44px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    margin-top: 42px;
}

.rp-dir span {
    height: 20px;
    width: 20px;
    position: relative;
    border-radius: 50px;
    display: flex;
    margin: 0;
    margin-bottom: 10px;
    background-size: cover;
    background-position: center;
}

.rp-dir a {
    position: relative;
    color: #fff;
    font-size: 12px;
    font-family: Gilroy-regular;
    margin-top: 8px;
    background: #000007;
    padding: 8px;
    line-height: 14px;
}

.rp-dir div {
    width: 20px;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
}

.rp-dir *:last-child {
    margin-top: 0 !important;
    margin-bottom: 5px;
}

.rp-dir a:empty {
    display: none;
}

.svrvmv-ico.repost:after, .reposted .svrvmv-ico.repost:before {
    visibility: hidden;
}

.rp-dir span:after, .rp-dir span:before {
    content: '';
    width: 10px;
    height: 10px;
    background: #f4be75;
    position: absolute;
    border-radius: 50%;
    margin-left: -3px;
    margin-top: -3px;
    display: flex;
}

.pico.xupost.repost:after, .svrvmv-ico.repost:after {
    -webkit-mask-image: url(../media/svg/Bold/Swap.svg);
    transform: rotate(90deg);
    background: #febb68;
}

.reposted .pico.xupost.repost:after, .reposted .svrvmv-ico.repost:after {
    visibility: visible !important;
}

.rp-dir span:after {
    background: #000007;
    -webkit-mask-image: url(../media/svg/Bulk/Swap.svg);
    transform: rotate(90deg);
    -webkit-mask-position: center;
    -webkit-mask-size: 8px;
    -webkit-mask-repeat: no-repeat;
}

.post.profile-post.music .rp-dir {
    margin-top: 72px;
}

.mv-p .post-text p {
    border-top: 1px solid #f0f0f0;
    margin-top: 15px;
    padding-top: 10px;
}

.movies-container {
    z-index: 9999;
    background: #000007;
}

.movies-container.rating {
    background: transparent !important;
}

.movies-container.rating:before {
    content: '';
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: -1;
    backdrop-filter: blur(25px);
    -webkit-backdrop-filter: blur(25px);
}

.movies-container.rating .movies-search {
    opacity: 0.75;
    z-index: 999999999 !important;
}

.shadowing {
    position: fixed;
    width: 100%;
    height: 100%;
    content: '';
    opacity: 1;
    z-index: -1;
}

.movies-circles {
    z-index: 99;
}

.movies-container.rating .trending-movies-fetch {
    display: none;
}

.add-new-movie {
    width: 100%;
    height: 58px;
    background: transparent;
    position: absolute;
    left: 0;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='20' ry='20' stroke='%23fff' stroke-width='4' stroke-dasharray='6%2c 14' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
    direction: rtl;
    display: flex;
    justify-content: center;
    align-items: center;
}

.add-new-movie:before {
    background: #fff;
    height: 40px;
    width: 40px;
    background: #fff;
    visibility: visible;
    top: 0;
    bottom: 0;
    margin: auto;
    right: 0;
    -webkit-mask-image: url(../media/svg/Broken/Video.svg);
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    content: '';
    position: absolute;
    margin-right: 20px;
}

.rating-container {
    width: 100%;
    right: 0;
    left: 0;
    margin: auto;
    position: absolute;
    margin-top: 135px;
    height: auto;
}

.add-new-movie:after {
    content: 'Rate new movie';
    color: #fff;
    font-family: var(--regular);
    font-size: 16px;
    line-height: 20px;
    margin-left: auto;
    margin-right: auto;
}

.movies-container.rating .header-top p::after {
    content: 'Collections';
}

.mvbnzebo {
    width: 100px;
    height: 145px;
    border-radius: 15px;
    background: rgb(238 238 238 / 15%);
    position: absolute;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(https://m.media-amazon.com/images/M/MV5BNDJmMzY0ZGUtYWE1My00OWViLTg1NTctOWMwZWJlNDQzNGRiXkEyXkFqcGdeQXVyMjkwOTAyMDU@._V1_.jpg);
}

.cont-mvxbx {
    display: flex;
    position: absolute;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
}

.rating-container .right-movie-search {
    margin-left: 115px;
    margin-top: 10px;
    margin-right: 0;
}

textarea.movie-rate {
    width: 100%;
    background: transparent;
    height: 75px;
    border: 1px solid rgb(255 255 255 / 15%);
    resize: none;
    border-radius: 20px;
    padding: 25px;
    z-index: 9999;
    font-family: var(--regular);
    color: #fff;
    font-size: 14px;
    line-height: 20px;
}

.ratetext-contv {
    display: flex;
    width: 88%;
    position: relative;
    top: 0;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: 260px;
    padding-bottom: 45px;
}

textarea.movie-rate::placeholder {
    color: rgb(255 255 255 / 20%);
}

.ratetext-contv button {
    width: 100%;
    height: 50px;
}

.sub-new-movie .right-movie-search {
    margin-left: 120px;
}

button.ratsub-mbv {
    height: 50px;
    border-radius: 40px;
    background: rgb(255 255 255 / 10%);
    position: absolute;
    transition: 0.2s;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    margin-top: 20px;
}

.ratsub-mbv:disabled {
    opacity: 0.5;
}

button.ratsub-mbv:after {
    content: 'Add movie to collection';
    color: #fff;
    font-family: var(--regular);
    font-size: 14px;
    line-height: 24px;
}

button.ratsub-mbv:before {
    content: '';
    width: 28px;
    height: 50px;
    display: flex;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right.svg);
    background: #fff;
    -webkit-mask-size: 20px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    position: absolute;
    right: 0;
    top: 0;
    margin-right: 15px;
}

.rating.blured .movies-circles {
    display: none !important;
}

.rating-container .box {
    margin-top: 20px;
    background: rgb(255 255 255 / 20%);
}

.rating-container .box.checked {
    background: linear-gradient(45deg, #4527a0, #673ab7);
}

.rating-container .box:after {
    background: rgb(255 255 255 / 50%);
}

.rating-container .box.checked:after {
    background: #fff;
}

.rating-container .box:before {
    content: 'Share the review as post in your profile';
    color: #fff;
    position: absolute;
    font-family: var(--regular);
    font-size: 14px;
    margin-left: 50px;
    margin-top: 4px;
    opacity: 0.5;
}

.rating-container .box.checked:before {
    opacity: 1;
}

.sub-new-movie {
    position: absolute;
    width: 100%;
    display: none;
}

.movies-container.rating .inner-movies-search {
    margin-top: 108px;
}

.rating-search .add-new-movie {
    display: none;
}

.action-menu.archive:before {
    -webkit-mask-image: url(/media/svg/Broken/Paper%20Upload.svg);
}

.action-menu.archive:after {
    content: 'Archive message';
}

.rating-search .inner-movies-search {
    display: block;
}

.sub-rating .sub-new-movie {
    display: block;
}

.sub-rating .add-new-movie {
    display: none;
}

.messages-menu {
    display: grid;
    width: 88%;
    height: 42px;
    border-radius: 20px;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 10px;
    position: relative;
}

.insetdir .action-menu.quick-reply {
    display: none;
}

.action-menu.archive {
    display: none;
}

.insetdir .action-menu.archive {
    display: flex;
}

.inner-msgs-menu {
    display: flex;
    position: absolute;
    height: 100%;
    right: 0;
    left: 0;
    margin: auto;
}

.msmenusec {
    display: flex;
    right: 0;
    left: 0;
    position: relative;
    margin: auto;
    width: fit-content;
    align-items: center;
    line-height: 20px;
    justify-content: center;
    padding: 0px 15px;
    height: 42px;
}

.msmenusec span:after {
    content: 'Inbox';
    color: #878792;
    font-family: var(--regular);
    font-size: 14px;
    margin-left: 2px;
}

.msmenusec span {
    display: flex;
}

.msmenusec a {
    font-size: 14px;
    color: #878792;
    font-family: var(--regular);
    margin-left: 4px;
}


.msmenusec.archive span::after {
    content: 'Archive';
}

.msmenusec.sent {
    margin-right: 0;
}

.msmenusec.sent span:after {
    content: 'Sent';
}

.msmenusec.inbox {
    margin-left: 0;
}

.msmenusec.selected span:after, .msmenusec.selected a {
    color: #fff;
}

.msmenusec.selected span:before {
    background: #fff;
}

.msmenusec.selected {
    background: #242428;
    text-align: center;
    justify-content: center;
    align-items: center;
    border-radius: 40px;
    line-height: 28px;
}

.msmenusec:before {
    content: '';
    background: #999;
    -webkit-mask-image: url(../media/svg/Bulk/Download.svg);
    -webkit-mask-size: 18px;
    width: 20px;
    height: 20px;
    margin-right: 3px;
    margin-left: -2px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
}

.msmenusec.inbox:before {
    -webkit-mask-image: url(../media/svg/Broken/Download.svg);
}

.msmenusec.inbox.selected:before {
    -webkit-mask-image: url(../media/svg/Bulk/Download.svg);
}

.msmenusec.archive:before {
    -webkit-mask-image: url(../media/svg/Broken/Folder.svg);
}

.msmenusec.archive.selected:before {
    -webkit-mask-image: url(../media/svg/Bulk/Folder.svg);
}

.msmenusec.sent:before {
    -webkit-mask-image: url(../media/svg/Broken/Send.svg);
}

.msmenusec.sent.selected:before {
    -webkit-mask-image: url(../media/svg/Bulk/Send.svg);
}

.inner-msgs-mage[t='s'] .reply-msgs:before {
    -webkit-mask-image: url(../media/svg/Bulk/Delete.svg);
}

.menu-share-outer[t='a'] .action-menu.archive:after {
    content: 'Move to inbox';
}

.menu-share-outer[t='a'] .action-menu.archive:before {
    -webkit-mask-image: url(/media/svg/Broken/Paper%20Download.svg);
}

.view-replied-messages {
    width: 100%;
    height: 50px;
    display: flex;
    background: #6c63ff;
    border-radius: 20px;
    margin-top: 10px;
    margin-bottom: 10px;
    justify-content: center;
    align-items: center;
}

.view-replied-messages:after {
    content: 'View replyed messages';
    color: #fff;
    font-family: var(--regular);
    text-align: center;
    line-height: 20px;
}

.inner-msgs-mage[t='s'] .more-post-btn {
    display: none;
}

.inner-msgs-mage[t='s'] .msg-post.anon .more-post-btn {
    display: block;
}

.inner-msgs-mage[t='s'] .msg-post.anon .more-post-btn a {
    display: none;
}

.inner-msgs-mage[t='s'] .msg-post.anon .more-post-btn:after {
    display: none;
}

.inner-msgs-mage[t='s'] .msg-post.anon .more-post-btn:before {
    -webkit-mask-image: url(../media/svg/Bold/Lock.svg);
    -webkit-mask-size: 20px;
    width: 20px;
    height: 20px;
    margin-top: 0;
}

.inner-msgs-mage[t='s'] .msg-post.anon .more-post-btn {
    width: 20px;
    height: 20px;

}

.inner-msg-post .post-music {
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
}

.media .post-text {
    font-size: 12px !important;
    background: #303036;
    ;
    display: flex !important;
    border-radius: 20px;
}

.media .post-text p {
    padding: 8px 15px;
    line-height: 16px !important;
    font-size: 12px !important;
    margin-top: 0 !important;
}

.media.mv .post-text, .media.ms .post-text {
    margin-top: 12px;
}

.post.media.dw .post-text {
    background: transparent;
    border-radius: 0 !important;
}

.post.media.dw .post-text p {
    padding: 0;
    margin-top: 10px !important;
    text-align: right;
    margin-bottom: 4px;
}

.post-text.em {
    display: none !important;
}

.post[dir='res'] .post-text p {
    margin-top: 2px !important;
}

.music-collection-add.finding .music-deflex-secion {
    display: flex !important;
}

.music-collection-add .header-top p:after {
    content: 'Collections';
}

.music-collection-add .header-top p:after {
    content: 'Collection';
}

button.cancel-mscol:after {
    content: 'Cancel';
}

button.delete-mscol:after {
    content: 'Delete collection';
}

.save-forlater:after {
    content: 'Save for later';
}

.delete-ncrcnl {
    margin-top: 205px;
    margin-bottom: 10px;
    display: none;
    position: absolute;
}

.edit .delete-ncrcnl {
    display: flex;
}

.delete-ncrcnl button {
    padding: 10px 20px;
    height: 45px;
    color: #fff;
    font-family: var(--regular);
    background: rgb(188 188 188 / 10%);
    border: none;
    border-radius: 25px;
    line-height: 20px;
    font-size: 14px;
    display: flex;
    margin-right: 13px;
    justify-content: center;
    align-items: center;
}

.edit .ncr-adverdesc {
    margin-top: 277px;
}

.edit .container-ssvgx {
    margin-top: 300px;
}

.delete-ncrcnl button:before {
    content: '';
    -webkit-mask-size: 20px;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: left;
    width: 30px;
    height: 30px;
    display: flex;
    background: #fff;
    top: 0;
}

button.delete-mscol:before {
    -webkit-mask-image: url(../media/svg/Bulk/Delete.svg);
}

button.cancel-mscol:before {
    -webkit-mask-image: url(../media/svg/Bulk/Close%20Square.svg);
}

.save-forlater span {
    width: 50px;
    height: 50px;
    border-radius: 20px;
    position: absolute;
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23303036' stroke-width='4' stroke-dasharray='50%25%2c 13%25' stroke-dashoffset='19' stroke-linecap='butt'/%3e%3c/svg%3e");
    border-radius: 100px;
    background-color: rgb(36 36 40 / 50%);
}

.save-forlater span:before {
    content: '';
    -webkit-mask-image: url(../media/svg/Broken/Time%20Circle.svg);
    background: #fff;
    -webkit-mask-size: 24px;
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
}

.save-forlater a {
    color: #878792;
    font-size: 14px;
    font-family: var(--regular);
    margin-right: 60px;
    position: absolute;
    right: 0;
    border-right: 1px solid #242428;
    height: 15px;
    padding-right: 15px;
    line-height: 15px;
    margin-top: 19px;
}

.save-forlater a:before {
    content: 'View';
}

.save-forlater p, .rtvs-msadd {
    background: #242428;
    color: #fff;
    padding: 5px 10px;
    position: absolute;
    border-radius: 10px;
    right: 0;
    font-size: 14px;
    font-family: var(--regular);
    line-height: 18px;
    margin-top: 12px;
}

.save-forlater p:after, .rtvs-msadd:after {
    content: 'Add';
}

.save-forlater.added p::after {
    content: 'Remove';
}

.save-forlater.added a {
    margin-right: 85px;
}

.save-forlater p.disabled {
    opacity: 0.5;
}

#febb68.pico.xupost.save:after {
    -webkit-mask-image: url(../media/svg/Bold/Bookmark.svg);
    background: #eee;
}

.saved .pico.xupost.save:after, .saved .svrvmv-ico.share:after {
    visibility: visible;
    background: #6c63ff;
    -webkit-mask-image: url(../media/svg/Bold/Bookmark.svg);
}

.media.mv .post-text .oplink, .media.ms .post-text .oplink {
    line-height: 15px;
}

.saved .pico.xupost.save:before, .svrvmv-ico.share:before {
    visibility: hidden;
}

.menus-lists-add[isin='true'] a {
    display: none;
}

.page.thred-page[coltype='saved'] .header-top p::after {
    content: 'Your Archive';
}

.imgs-colls-bv {
    width: 50px;
    height: 50px;
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    border-radius: 15px;
    overflow: hidden;
}

.imgs-colls-bv span {
    width: 24px;
    height: 23px;
    background: #eee;
    margin-right: 2px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.imgs-colls-bv span:nth-of-type(even) {
    margin-right: 0;
}

.list-sort-sv.closms-vid:after {
    content: '';
}

.list-sort-sv.closms-vid .rtvs-colnb {
    position: absolute;
    right: 0;
    width: 50px;
    height: 50px;
    background: #878792;
    -webkit-mask-image: url(../media/svg/Broken/Arrow%20-%20Right%202.svg);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: 20px center;
    -webkit-mask-size: 24px;
}

.list-sort-sv.closms-vid a {
    color: #878792;
    font-size: 14px;
    font-family: var(--regular);
    margin-right: 40px;
    position: absolute;
    right: 0;
    border-right: 1px solid #242428;
    height: 15px;
    padding-right: 15px;
    line-height: 15px;
    margin-top: 18px;
}

.consts-verdo {
    width: 100%;
}

.sections-verso.consts-verdo {
    display: none;
}

.list-sort-sv.closms-vid.adding-vk a {
    margin-right: 60px;
}

.bcdsesveros:after {
    content: 'Chose what section you want add to in your collection';
    color: #878792;
    font-family: var(--regular);
    font-size: 14px;
    display: flex;
    margin: auto;
    text-align: left;
    width: 88%;
    justify-content: left;
    margin-top: 25px;
    margin-bottom: 30px;
    line-height: 18px;
}

.menus-lists-add.marged {
    width: 200%;
}

.menus-lists-add.marged.vivo {
    transform: translateX(-50%);
}

.menus-lists-add.marged .sections-verso.consts-verdo {
    display: block;
}

button.back-main-vero {
    background: transparent;
    width: 88%;
    height: 50px;
    border-radius: 50px;
    color: #fff;
    border: 1px solid #242428;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 13px;
    display: flex;
    margin-top: 25px;
    justify-content: center;
    align-items: center;
}

button.back-main-vero:after {
    content: 'Back to collections';
    font-size: 14px;
    font-family: var(--regular);
    display: flex;
    line-height: 20px;
    height: 24px;
}

.viewed-scrolnvbsa {
    width: 100%;
    max-height: 420px;
    overflow-y: scroll;
}

.cont-viewedst .closms-vid {
    display: none;
}

.menus-lists-add[type='ms'] .closms-vid.music {
    display: flex;
}

.menus-lists-add[type='profile'] .cont-viewedst .closms-vid {
    display: flex;
}

.menus-lists-add[type='profile'] .inset-cont-bvng {
    display: none;
}

.menus-lists-add[type='profile'] .prof-inset-bvnc {
    display: block;
}

.prof-inset-bvnc {
    display: none;
}

.list-sort-sv.closms-vid.loadcols .imgs-colls-bv span {
    background-color: #242428;
}



.list-sort-sv.closms-vid.frth.loadcols p {
    position: absolute;
    height: 12px;
    background: #242428;
    width: 50%;
    border-radius: 20px;
    margin-top: 20px;
}

.prof-inset-bvnc[dnload='true'] .loadcols {
    display: none !important;
}

.dark .imgs-colls-bv span {
    background-color: #242428;
}

.scrolled.blured {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.scrolled {
    position: fixed;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    height: 60px;
    top: 0;
    margin-top: 60px;
    background: rgb(255 255 255 / 50%);
    z-index: 999;
    border-radius: 100px;
    border: 1px solid rgb(255 255 255 / 50%);
    display: flex;
    transition: 0.2s;
    transform: translateY(-200px);
}


.scrolled .artist-image span {
    border: 0;
    width: 44px;
    height: 44px;
}

.scrolled .artist-image {
    margin-left: 8px;
    top: 0;
    border: none;
    width: 44px;
    height: 44px;
    margin-top: 8px;
}

.scrolled .artist-name {
    margin-left: 67px;
    margin-top: 11px;
}

.scrolled .artist-name span {
    color: #000007;
    line-height: 20px;
    font-weight: lighter;
    font-family: var(--bold);
}

.scrolled .artist-name a {
    color: #000007;
    line-height: 16px;
}

.scrolled .share-artist-right.like {
    display: none;
}

.scrolled .share-artist-right {
    margin-right: 0;
    background: rgb(255 255 255 / 35%);
    width: 38px;
    height: 38px;
    position: absolute;
    right: 0;
    border-radius: 50px;
    margin-right: 12px;
}


.scrolled .share-artist-right:before {
    opacity: 1;
    width: 100%;
    height: 100%;
    -webkit-mask-size: 22px;
    -webkit-mask-image: url(../media/svg/Broken/Notification.svg);
    background: #000007;
}

.arts-count-biov {
    display: none;
}

.scrolled .arts-count-biov {
    position: absolute;
    right: 0;
    margin-right: 68px;
    height: 20px;
    margin-top: 18px;
    display: block;
}

.scrolled .arts-count-biov a {
    line-height: 20px;
    padding-right: 10px;
    border-right: 1px solid rgb(0 0 7 / 15%);
    height: 20px;
    font-family: var(--regular);
    font-size: 14px;
    color: rgb(0 0 7 / 80%);
}

.sections-flexrt {
    display: flex;
    height: 80px;
    margin: auto;
    width: 88%;
    right: 0;
    left: 0;
    position: relative;
}

.sections-flexrt section {
    border-right: 1px solid #242428;
    height: 20px;
    width: 100%;
    margin: auto;
    justify-content: center;
    align-items: center;
    text-align: center;
    display: grid;
}

.sections-flexrt section span {
    color: #fff;
    font-family: var(--regular);
    font-weight: bold;
    font-size: 16px;
    line-height: 22px;
}

.sections-flexrt section:last-child {
    border-right: none;
}

.sections-flexrt section a {
    color: #fff;
    font-family: var(--regular);
    font-size: 14px;
    line-height: 20px;
}

.html-gallary-art section:before {
    content: 'Heighlights arts';
    position: absolute;
    color: #878792;
    transform: rotate(-90deg);
    font-family: var(--light);
    margin-top: 64px;
    font-size: 16px;
    margin-left: -80px;
    display: flex;
    line-height: 20px;
    padding-right: calc(6% + -15px);
}

.swiper-rates-in[dnload='true'] .load-mvos {
    display: none;
}

.html-gallary-art section {
    padding-left: 30px;
}

.owner .collection-features:after {
    content: 'Edit gallary';
}

.owner .collection-features:before {
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
}

.owner .vgr-container.collection-features:after {
    content: 'Edit collection';
}

.edit-valsorvgm {
    position: absolute;
    right: 0;
    width: 50px;
    height: 50px;
    bottom: 0;
    margin-right: 6%;
    margin-bottom: 26px;
}

.outrow-verso-bgr.editing .footer-view-vgrall {
    display: none;
}

.outrow-verso-bgr.editing .edit-valsorvgm {
    margin-bottom: 15px;
    background: rgb(255 255 255 / 10%);
    width: 100px;
    border-radius: 50px;
    height: 40px;
}

.outrow-verso-bgr.editing .svmp-vginner:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    margin-right: 6%;
    -webkit-mask-image: url(../media/svg/Broken/Delete.svg);
    -webkit-mask-size: 20px;
    background: #fff;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
    z-index: 9;
}

.outrow-verso-bgr.editing .svmp-vginner:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 5;
    content: '';
    top: 0;
    opacity: 0.5;
}

.svmp-vginner.adding:after, .svmp-vginner.adding:before {
    display: none;
}

.outrow-verso-bgr.editing .section-mvgr-name a {
    margin-right: calc(6% + 100px);
    margin-top: -10px;
}

.outrow-verso-bgr.editing .edit-valsorvgm:after {
    -webkit-mask-image: url(../media/svg/Broken/Tick%20Square.svg);
    width: 40px;
    right: 0;
    margin-right: 9px;
    -webkit-mask-size: 20px;
}

.outrow-verso-bgr.editing .edit-valsorvgm:before {
    content: 'Done';
    position: absolute;
    color: #fff;
    font-family: var(--regular);
    font-size: 14px;
    line-height: 20px;
    height: 20px;
    margin-top: 9px;
    margin-left: 20px;
}

.edit-valsorvgm:after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    -webkit-mask-image: url(../media/svg/Broken/Edit.svg);
    -webkit-mask-size: 24px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
}

.draw-gallary.owner .collection-features a, .owner .subsect-mvcol.collection-features a {
    display: none;
}

.artist-page-container.opened .container-rolex-dev {
    position: static;
}

.header-collection-art:after {
    height: 1px;
    position: relative;
    display: flex;
    right: 0;
    left: 0;
    margin: auto;
    content: '';
    background: #242428;
    width: 88%;
    margin-top: 20px;
}

section.rank-secart span:after {
    content: 'Rank';
}

section.canvas-secart span:after {
    content: 'Art works';
}

section.likes-secart span:after {
    content: 'Likes';
}

.header-collection-art:after {
    display: none;
}

.liked.lk-art:after {
    background: #fff !important;
}

.lk-art.liked {
    background: rgb(255 255 255 / 25%);
}

.gallary-item .lk-art {
    animation: none;
}

.share-artist-right.like:after {
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg);
    background: #fff !important;
    visibility: hidden;
}

.active-search-movies.nm span.year-rank-search.imdb-charm {
    display: none;
}

.active-search-movies.nm {
    background: no-repeat;
    height: 80px;
    margin-bottom: 30px;
}

.active-search-movies.nm .image-movie-search.imdb-img {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    overflow: visible;
    margin-top: 0;
    direction: rtl;
    margin-left: 0;
}

.active-search-movies.nm .imdb-btn-search {
    background: transparent;
    margin-right: calc(-78vw + 35px);
}

.active-search-movies.nm .mov-search-actress {
    margin-top: -22px;
    height: 20px;
}

.active-search-movies.nm .right-movie-search {
    margin-left: 90px;
    margin-top: 12px;
    width: 50%;
}

.active-search-movies.nm .imdb-btn-search:after {
    margin-bottom: 22px;
    width: 30px;
    height: 30px;
    -webkit-mask-size: 30px;
    margin-right: 0;
}

.active-search-movies.nm:first-child {
    margin-top: 0;
}

.active-search-movies.nm.opened .image-movie-search.imdb-img {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto !important;
    width: 65%;
    height: 41%;
    z-index: 999999999;
    max-width: 290px;
    border-radius: 19px;
    transition: 0.2s;
}

.active-search-movies.nm.opened:before {
    content: '';
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgb(0 0 0 / 50%);
    z-index: 2;
    -webkit-mask: unset;
    top: 0;
    left: 0;
    backdrop-filter: blur(10px);
}


.fullscreen .canvas-boxing {
    position: fixed;
    top: 0;
    border-radius: 0;
    width: auto;
    height: calc(100% + -116px);
    left: 0;
    margin: auto;
    margin-top: 49px;
    z-index: 9999;
    margin-left: 0;
}

.drawing-page.fullscreen {
    z-index: 999999;
}

.drawing-page.fullscreen .draw-menu {
    position: fixed;
    z-index: 99999;
    bottom: 0;
    height: 67px;
    padding: 0;
    margin: 0;
    right: 0;
    border-radius: 0;
}

.page.drawing-page.center.fullscreen:before {
    content: '';
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 9;
}

.page.drawing-page.center.fullscreen:after {
    content: 'Drawing direction ->';
    font-family: var(--regular);
    color: #fff;
    font-size: 16px;
    right: 0;
    z-index: 99999;
    position: fixed;
    transform: rotate(90deg);
    top: 0;
    bottom: 0;
    margin: auto;
    width: 168px;
    height: fit-content;
    margin-right: -37px;
}

.report-reply-stry {
    display: flex;
    width: 88%;
    height: 50px;
    bottom: 0;
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    margin-bottom: 25px;
    z-index: 999;
}

.report-stry:after {
    content: 'Report';
    color: #fff;
    font-family: var(--regular);
    font-size: 12px;
    opacity: 0.5;
}

.like-stry {
    width: 40px;
    height: 40px;
    position: absolute;
    right: 0;
    background: rgb(255 255 255 / 10%);
    border-radius: 50%;
    backdrop-filter: blur(4px);
}

.like-stry:before, .like-stry:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-mask-image: url(../media/svg/Bulk/Heart.svg);
    -webkit-mask-size: 22px;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    background: rgb(255 255 255 / 50%);
}

.like-stry:after {
    -webkit-mask-image: url(../media/svg/Bold/Heart.svg);
    visibility: hidden;
}

.dark textarea.submit-comment.changable-lang {
    color: #fff;
}

textarea.submit-comment.changable-lang {
    resize: none;
}

.report-stry {
    height: 40px;
    width: 69px;
    background: rgb(0 0 0 / 10%);
    border-radius: 200px;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    line-height: 18px;
}

.btn-menu-home.save-later:before {
    -webkit-mask-image: url(../media/svg/Broken/Time%20Circle.svg);
}

.btn-menu-home.save-later:after {
    content: 'Saved';
}

.loadnst .user-top-image.usim {
    border-color: transparent;
    background: rgb(255 255 255 / 10%);
}

.loadnst span.usfn {
    width: 100px;
    height: 12px;
    background: rgb(255 255 255 / 10%);
    position: absolute;
    border-radius: 20px;
}


.loadnst .user-stoies-info a p:before {
    display: none;
}

.loadnst .user-stoies-info a p {
    width: 50px;
    height: 12px;
    background: rgb(255 255 255 / 10%);
    margin-top: 28px;
    margin-left: 0;
    border-radius: 20px;
    opacity: 1;
}

.images-story-container .lds-roller-main {
    top: 0;
    bottom: 0;
    margin: auto;
    transform: scale(0.75);
    opacity: 0.5;
}

.stories-inset[dnload='true'] .storylaods {
    display: none;
}

.music-collection .scrolled {
    bottom: 0;
    top: unset;
    margin-bottom: 20px;
    transform: translateY(200px);
    background: rgb(255 255 255 / 50%);
    border: 1px solid rgb(255 255 255 / 50%);
    display: none;
}

.listing.music-collection .scrolled {
    display: block;
}

.music-collection .scrolled.closed {
    background: rgb(255 255 255 / 10%);
    width: 60px;
    height: 126px;
    right: 0;
    margin-right: 6%;
    border: 1px solid transparent;
    margin-bottom: -40px;
}

.music-collection .scrolled.closed .artist-image, .music-collection .scrolled.closed .artist-name {
    display: none;
}

.music-collection .scrolled.closed .share-artist-right:before {
    -webkit-mask-image: url(../media/svg/Broken/Upload.svg);
    -webkit-mask-size: 20px;
}

.music-collection .closed .share-artist-right.share {
    background: transparent;
    margin-top: 11px;
}

.music-collection .closed .share-artist-right.share:before {
    background: #fff;
}

.music-collection .scrolled .artist-name span {
    font-family: var(--regular);
    font-weight: bold;
    font-size: 14px;
}

.music-collection .artist-name {
    width: 58%;
    margin-top: 10px;
}

.music-collection .scrolled .arts-count-biov a {
    display: none;
}

.music-collection .scrolled .artist-name a {
    font-size: 14px;
}

.prof-inset-bvnc[none='true']:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 130px;
    background-repeat: no-repeat;
    background-image: url(../media/bn/undraw_refreshing_beverage_td3r.svg);
    background-position: top center;
    margin-top: 55px;
}

.prof-inset-bvnc[none='true']:after {
    content: 'No collections found';
    color: #878792;
    width: 88%;
    right: 0;
    left: 0;
    margin: auto;
    display: flex;
    text-align: center;
    justify-content: center;
    margin-top: 35px;
    font-family: var(--regular);
    font-size: 14px;
}

.prof-inset-bvnc[none='true'] .loadcols {
    display: none;
}

.mv-c-pg[dir='wlist'] .lds-roller-main {
    display: none;
}

.mv-c-pg[dir='wlist'] .header-vgrbl-cont.swiper {
    display: none;
}

.flex-inner-actor[dnload='true'] .actor-div.load-vgr {
    display: none;
}

.active-trending-section .insave-colverd {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 0;
    opacity: 0;
    z-index: 9;
}

.movecrpimgdiv .lds-roller-main {
    z-index: 2;
    top: 0;
    transform: translateY(45px) scale(0.75);
    opacity: 0.5;
    margin: auto;
}

.active-trending-section.trending-section.played .insave-colverd {
    opacity: 1;
}

.active-trending-section.trending-section.played .insave-colverd:after {
    -webkit-mask-size: 24px;
}



/* subscriptiom */

.settngsection.subscriptions .icon {
    -webkit-mask-image: url(https://onvo.me/media/svg/new/prico.png);
}

.settngsection.subscriptions .leftflxstngs a:after {
    content: 'ONVO Plus';
}

.settngsection.subscriptions .leftflxstngs p:after {
    content: 'Manage subscription and cobones';
}

.ar .settngsection.subscriptions .leftflxstngs a:after {
    content: 'الاشتراكات';
}

.ar .settngsection.subscriptions .leftflxstngs p:after {
    content: 'تحكم في اشتراكك وكوبونات الهدايا';
}

.explore-flex,.search-flex,.plus-flex,.more-flex {
    display: none;
}

.flex-section.shop:before {
    -webkit-mask-image: url(../media/svg/Bold/Buy.svg);
}

.flex-section.shop:after {
    -webkit-mask-image: url(../media/svg/Broken/Buy.svg);
}

.post-msgs-container .post {
    border-bottom: none;
}

.post-msgs-container .post-footer {
    height: 45px;
}

.reply-msgs {
    position: absolute;
    right: 0;
    width: fit-content;
}

.post-msgs-container .tfpo.ps {
    border-left: 0;
    margin-left: 0;
    padding-left: 0;
    margin-top: 18px;
}

.reply-msgs:before {
    margin-bottom: 3px;
}
.settngsection.subscriptions {
    display: none;
}