@media only screen and (min-width: 0px) {
    .bubbles-inner .bubbles-container {
        max-height: 480px;
    }
    #anonymous-pm-show {
        padding-bottom: 60px;
    }
    #anonymous-pm-show > .header {
        width: 100%;
        height: 60px;
        position: absolute;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }
    #anonymous-pm-show > .header .row {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -ms-flex-pack: end;
        justify-content: flex-end;
        height: 100%;
        width: 100%;
        padding: 8px;
    }
    .anonymous-pm-parent .container {
        padding: 10px 20px;
    }

    #anonymous-pm-show .container .form {
        padding: 20px 10px;
        padding-bottom: 0;
    }

    #anonymous-pm-show .container .form .form-success p {
        padding-top: 2px;
    }

    #anonymous-pm-show .container .form .form-success i {
        font-size: 20px;
        margin: 8px;
        color: #fff;
    }

    #anonymous-pm-show .container .form .form-success {
        margin-bottom: 20px;
        background: #4caf50;
        font-size: 15px;
        text-align: center;
        color: #fff;
        height: 40px;
        padding: 0 8px;
        display: none;
        border-radius: 4px;
        -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    }

    #anonymous-pm-show .container .form .form-error {
        margin-bottom: 20px;
        background: #e6123d;
        font-size: 15px;
        text-align: center;
        color: #fff;
        height: 40px;
        display: none;
        border-radius: 4px;
        -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    }

    #anonymous-pm-show .container .form .send-box {
        min-height: 288px;
    }

    #anonymous-pm-show .container .form .box {
        margin-bottom: 20px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        position: relative;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    #anonymous-pm-show .container .form .box .buttons {
        position: absolute;
        top: 10px;
        left: 10px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        z-index: 100;
    }

    #anonymous-pm-show .container .form .box .buttons .button {
        height: 35px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border: 1px solid #eee;
        width: 35px;
        color: #808080;
        background: rgba(0, 0, 0, 0.05);
        font-size: 16px;
        margin-right: 8px;
        background: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(#FFF), to(transparent)), -webkit-gradient(linear, left top, left bottom, from(#DDD), to(#DDD)), radial-gradient(38px circle at 19px 19px, #DDD 50%, transparent 51%), -webkit-gradient(linear, left top, left bottom, from(#DDD), to(#DDD));
        background: -o-linear-gradient(left, transparent, #FFF, transparent), -o-linear-gradient(#DDD, #DDD), -o-radial-gradient(19px 19px, 38px circle, #DDD 50%, transparent 51%), -o-linear-gradient(#DDD, #DDD);
        background: linear-gradient(0.25turn, transparent, #FFF, transparent), linear-gradient(#DDD, #DDD), radial-gradient(38px circle at 19px 19px, #DDD 50%, transparent 51%), linear-gradient(#DDD, #DDD);
        background-color: #fff;
        background-repeat: no-repeat;
        background-size: 315px 200px, 315px 130px, 100px 100px, 225px 30px;
        background-position: -315px 0, 0 0, 15px 140px, 65px 145px;
        -webkit-animation: loading 1.5s infinite;
        animation: loading 1.5s infinite;
        border-radius: 50%;
    }

    .dark #anonymous-pm-show .container .form .box .buttons .button {
        background: rgb(40 41 61 / 1);
    }
    #anonymous-pm-show .container .form .box .buttons .button img{
        border-radius: 50%;
    }
    #anonymous-pm-show .container .form .box .area-box {
        width: 100%;
        background: rgb(243 244 246 / 1);
        border-radius: 15px 15px 0 0;
        position: relative;
        -webkit-transition: height ease .5s;
        -o-transition: height ease .5s;
        transition: height ease .5s;
        -webkit-box-shadow: none;
        box-shadow: none;
    }


    .dark #anonymous-pm-show .container .form .box .area-box {
        background: rgb(50 51 77 / 1);
    }

    #anonymous-pm-show .container .form .box .area-box .setting {
        width: 100%;
        padding: 15px;
        min-height: 200px;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        padding: 12px 0;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select {
        width: 50%;
        padding: 8px;
        position: relative;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select .input {
        position: absolute;
        top: 0;
        visibility: hidden;
        opacity: 0;
        right: 0;
        -webkit-transition: all ease .2s;
        -o-transition: all ease .2s;
        transition: all ease .2s;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select.active .input {
        visibility: visible;
        opacity: 1;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select.active .row {
        border: 1px solid rgb(0, 149, 246);
        -webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select .input .icon {
        height: 23px;
        width: 23px;
        color: #fff;
        background: rgb(0, 149, 246);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border-radius: 50%;
        border: 3px solid #fff;
        border: 2px solid rgb(0, 149, 246);
    }

    #anonymous-pm-show .container .form .box .area-box .setting .selection .select .row {
        width: 100%;
        background: #fff;
        border-radius: 10px;
        padding: 10px 5px;
    }

    #anonymous-pm-show .container .form .box .area-box .setting .title {
        width: 100%;
        font-size: 18px;
        color: #494949;
        font-weight: 600;
    }

    #anonymous-pm-show .container .form .box .area-box .user {
        position: absolute;
        width: 100%;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        padding: 20px;
        border: 2px solid rgb(74 75 109 / 1);
        border-radius: 18px;
        height: 287px;
        background: rgb(243 244 246 / 1);
    }

    .dark #anonymous-pm-show .container .form .box .area-box .user {

        background: rgb(50 51 77 / 1);
    }

    #anonymous-pm-show .container .form .box .area-box .user .profile {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .area-box .user .profile img {
        width: 120px;
        border-radius: 50%;
        border: 5px solid #fff;
        -webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    }

    .anonymous-pm-parent .container .banner .image.profile {
        -webkit-backdrop-filter: 3px;
        backdrop-filter: 3px;
    }
    #anonymous-pm-show .container .form .box .area-box .user .username {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font-size: 24px;
        font-weight: 600;
        color: #404040;
        padding: 10px;
    }

    .dark #anonymous-pm-show .container .form .box .area-box .user .username {
        color: #fff;
    }

    #anonymous-pm-show .container .form .box .area-box .user .username span {
        padding-top: 4px;
        letter-spacing: 1.8px;
        padding-right: 5px;
        direction: ltr;
    }

    #anonymous-pm-show .container .form .box .area-box .user .user-buttons {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .area-box .user .user-buttons > *:first-child {
        background: #32323c;
        color: #fff;
    }

    .dark #anonymous-pm-show .container .form .box .area-box .user .user-buttons > * {
        border: 1px solid rgb(74 75 109 / 1);
    }

    #anonymous-pm-show .container .form .box .area-box .user .user-buttons > *:last-child {
        background: rgba(0, 149, 246);
        color: #fff;
    }

    #anonymous-pm-show .container .form .box .area-box .user .user-buttons > * {
        width: 100px;
        background: #fff;
        height: 45px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: 0 5px;
        font-size: 13px;
        border-radius: 6px;
    }

    #anonymous-pm-show .container .form .box .area-box textarea::-webkit-scrollbar-corner {
        width: 6px;
        background: #aaa;
        border-radius: 20px;
    }

    #anonymous-pm-show .container .form .box .area-box > .word-count {
        position: absolute;
        top: 5px;
        left: 10px;
        color: #aaa;
        font-size: 12px;
        font-weight: 600;
        padding: 3px 0;
        -webkit-transition: all ease 0.5s;
        -o-transition: all ease 0.5s;
        transition: all ease 0.5s;
    }

    #anonymous-pm-show .container .form .box .area-box .tag {
        padding: 10px;
        padding-top: 0;
    }


    #anonymous-pm-show .container .form .box .area-box .tag .word-count {
        position: absolute;
        bottom: 0;
        left: 5px;
        color: #aaa;
        font-size: 14px;
        font-weight: 600;
        padding: 3px 0;
        -webkit-transition: all ease 0.5s;
        -o-transition: all ease 0.5s;
        transition: all ease 0.5s;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row {
        background: rgba(37, 79, 195, 0.1);
        border-radius: 10px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0 10px;
        position: relative;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input {
        width: calc(100% - 20px);
        padding: 0 8px;
        height: 100%;
        font-size: 16px;
        color: #404040;
        font-weight: 600;
    }

    .dark #anonymous-pm-show .container .form .box .area-box .tag .row input {
        color: #fff;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input::-webkit-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input::-moz-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input:-ms-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input::-ms-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row input::placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row .close button {
        position: absolute;
        top: 0;
        left: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px);
        background: #254fc3;;
        color: #fff;
        border-radius: 50%;
        height: 24px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 24px;
    }

    #anonymous-pm-show .container .form .box .area-box .tag .row .icon {
        background: #254fc3;
        color: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 30px;
        width: 30px;
        border-radius: 8px;
    }


    #anonymous-pm-show .container .form .box .area-box .link {
        padding: 10px;
        padding-top: 0;
    }


    #anonymous-pm-show .container .form .box .area-box .link .row {
        background: rgba(252, 74, 26, 0.1);
        border-radius: 10px;
        height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0 10px;
        position: relative;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input {
        width: calc(100% - 20px);
        padding: 0 8px;
        height: 100%;
        font-size: 16px;
        color: #404040;
        font-weight: 600;
    }

    .dark #anonymous-pm-show .container .form .box .area-box .link .row input {
        color: #fff;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input::-webkit-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input::-moz-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input:-ms-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input::-ms-input-placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row input::placeholder {
        font-size: 14px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row .close button {
        position: absolute;
        top: 0;
        left: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px);
        background: rgba(252, 74, 26, 1);
        color: #fff;
        border-radius: 50%;
        height: 24px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 24px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row .icon {
        color: #254fc3;
        height: 30px;
        width: 30px;
    }

    #anonymous-pm-show .container .form .box .area-box .link .row .icon img {
        width: 100%;
    }

    #anonymous-pm-show .container .form .box .area-box .word-count.over {
        color: #e6123d;
        font-size: 16px;
    }

    #anonymous-pm-show .container .form .box .area-box textarea {
        width: 100%;
        padding: 15px 20px;
        color: #404040;
        font-size: 16px;
        font-weight: 600;
        height: 200px;
        line-height: 30px;
        resize: none;
    }

    .dark #anonymous-pm-show .container .form .box .area-box textarea {
        color: #fff;
    }

    #anonymous-pm-show .container .form .box .footer-box {
        direction: ltr;
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        border-radius: 0 0 20px 20px;
        z-index: 5;
        background: rgb(243 244 246 / 1);
        padding: 15px 10px;
    }

    .dark #anonymous-pm-show .container .form .box .footer-box {
        background: rgb(50 51 77 / 1);
    }

    #anonymous-pm-show .container .form .box .footer-box .f-box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        background: var(--main-color);
        padding: 8px;
        border-radius: 15px;
        -webkit-box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
        box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
        background-image: url('../../../common/media/background/section-pattern.png') !important;
    }

    #anonymous-pm-show .container .form .box .footer-box .button {
        direction: rtl;
        height: 45px;
        border-radius: 30px;
        -webkit-transition: width ease 0.5s;
        -o-transition: width ease 0.5s;
        transition: width ease 0.5s;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        white-space: nowrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 14px;
        min-width: 100px;
        color: var(--menu-color);
        color: #fff;
        background: #fff;
        padding: 0 8px;
        -webkit-transition: all ease .5s;
        -o-transition: all ease .5s;
        transition: all ease .5s;
    }

    #anonymous-pm-show .container .form .box .uploader {
        width: 100%;
        padding: 10px;
        background: #f2f5f8;
    }

    #anonymous-pm-show .container .form .box .footer-box .button.loading .loader {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .footer-box .button .loader {
        display: none;
        margin-right: 6px;
    }

    #anonymous-pm-show .container .form .box .footer-box .button .sended {
        color: #4caf50;
        margin-right: 6px;
        display: none;
    }

    #anonymous-pm-show .container .form .box .footer-box .button .error {
        color: #e6123d;
        margin-right: 6px;
        display: none;
    }

    #anonymous-pm-show .container .form .box .footer-box .button .spinner {
        color: var(--main-color);
    }

    #anonymous-pm-show .container .form .box .footer-box .button.submit {
        background: #fff;
        color: #54595F;
        font-size: 14px;
        font-weight: 600;
        -webkit-transition: all ease 0.2s;
        -o-transition: all ease 0.2s;
        transition: all ease 0.2s
    }
    #anonymous-pm-show .container .form .box .footer-box .button.submit:active{
        -webkit-transform: scale(0.9);
        -ms-transform: scale(0.9);
        transform: scale(0.9);
    }
    #anonymous-pm-show .container .form .box .footer-box .media {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        position: relative;
    }

    #anonymous-pm-show .container .form .box .footer-box .media .dropup {
        position: absolute;
        display: none;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 100px;
        background: #fff;
        border-radius: 10px 10px 0 0;
        bottom: 0;
        -webkit-transform: translateY(-45px);
        -ms-transform: translateY(-45px);
        transform: translateY(-45px);
        right: 0;
        z-index: 5;
        -webkit-box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    }

    #anonymous-pm-show .container .form .box .footer-box .media button {
        max-width: 100px;
    }

    #anonymous-pm-show .container .form .box .footer-box .media .dropup button {
        direction: rtl;
        height: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        border-bottom: 1px solid rgba(0, 0, 0, 0.15);
        width: 100%;
        font-size: 14px;
        font-weight: 600;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        padding: 0 8px;
    }

    #anonymous-pm-show .dropup button.a i {
        color: #ff6200;
    }

    #anonymous-pm-show .dropup button.b i {
        color: #39ae00;
    }

    #anonymous-pm-show .dropup button.c i {
        color: #941b80;
    }

    #anonymous-pm-show .dropup button.d i {
        color: #e6123d;
    }

    #anonymous-pm-show .dropup button.e i {
        color: #254fc3;
    }

    #anonymous-pm-show .container .form .box .footer-box .media .dropup button span {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding-top: 3px;
        color: #000;
        width: calc(100% - 25px);
    }

    #anonymous-pm-show .container .form .box .footer-box .media .dropup button i {
        height: 30px;
        width: 20px;
        margin-left: 5px;
        font-size: 16px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .footer-box .media > button.active {
        border-radius: 0 0 18px 18px;
        border-top: none;
    }

    #anonymous-pm-show .container .form .box .footer-box .media > button {
        background: rgba(255, 255, 255, 0.1);
        width: 90px;
        margin-left: 6px;
        font-size: 14px;
        -webkit-transition: all ease 0.5s;
        -o-transition: all ease 0.5s;
        transition: all ease 0.5s;
    }

    #anonymous-pm-show .container .form .box .footer-box .button span {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        padding-top: 2px;
        font-size: 14px;
        font-weight: 600;
    }


    #anonymous-pm-show .container .form .chat-button {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        position: absolute;
        bottom: -37px;
    }

    #anonymous-pm-show .container .form .chat-button .dv {
        background: #fff;
        width: calc(50% - 75px);
        height: 38px;
        z-index: 2;
    }

    .dark #anonymous-pm-show .container .form .chat-button .dv {
        background: rgb(28 28 40 / 1)
    }

    #anonymous-pm-show .container .form .chat-button .dv.right {
        border-radius: 22px 0 0 0;
    }

    #anonymous-pm-show .container .form .chat-button .dv.left {
        border-radius: 0 22px 0 0;
    }

    #anonymous-pm-show .container .form .chat-button .button .dvb {
        height: 20px;
        width: 36px;
        position: absolute;
        top: 0;
        background: #1d2447;
    }

    #anonymous-pm-show .container .form .chat-button .button .dl {
        left: 0;
        -webkit-transform: translateX(-100%);
        -ms-transform: translateX(-100%);
        transform: translateX(-100%);
    }

    #anonymous-pm-show .container .form .chat-button .button .dr {
        right: 0;
        -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
        transform: translateX(100%);
    }

    #anonymous-pm-show .container .form .chat-button .button .number {
        height: 20px;
        width: 20px;
        font-size: 12px;
        border-radius: 50%;
        margin-left: 8px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        background: #e6123d;
    }

    #anonymous-pm-show .container .form .chat-button .button.active {
        border-bottom: 3px solid #e6123d;
    }

    #anonymous-pm-show .container .form .chat-button .button {
        white-space: nowrap;
        position: relative;
        border-left: 1px solid #1d2447;
        border-right: 1px solid #1d2447;
        background: #1d2447;
        width: 155px;
        height: 38px;
        border-radius: 0 0 20px 20px;
        color: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        font-size: 14px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0 25px;
    }

    #anonymous-pm-show .container .form .chat-button .button i {
        height: 20px;
        width: 20px;
        font-size: 12px;
        border-radius: 50%;
        margin-right: 8px;
        margin-bottom: 2px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        background: rgba(255, 255, 255, 0.1);
    }

    #anonymous-pm-show .container .form .form-submit {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding-top: 45px;
    }


    #anonymous-pm-show .container .form .form-submit > * {
        width: calc(50% - 5px);
        color: #fff;
        height: 48px;
        border: 3px solid #fff;
        border-radius: 30px;
        -webkit-transition: width ease 0.5s;
        -o-transition: width ease 0.5s;
        transition: width ease 0.5s;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        white-space: nowrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 14px;
        margin-bottom: 15px;
        background-image: url('../../../common/media/background/section-pattern.png') !important;
    }

    .dark #anonymous-pm-show .container .form .form-submit > * {
        border: 3px solid #000
    }

    #anonymous-pm-show .container .form .form-submit > * span {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .form-submit > *.copy {
        background: var(--main-color);
        border: 3px solid var(--main-color);
    }

    #anonymous-pm-show .container .form .form-submit > *.learn {
        background: #7580E3;
        border: 3px solid #7580E3;
    }

    #anonymous-pm-show .container .form .form-submit > *.open .counter {
        position: absolute;
        top: 0;
        left: 6px;
        background: red;
        width: 28px;
        height: 28px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-transform: translate(-50%, -10px);
        -ms-transform: translate(-50%, -10px);
        transform: translate(-50%, -10px);
        border-radius: 50%;
    }

    #anonymous-pm-show .container .form .form-submit > *.open {
        background: #2e7b32;
        position: relative;
        border: 3px solid #2e7b32;
    }

    #anonymous-pm-show .container .form .form-submit > *.create {
        width: 100%;
        background: rgb(78 129 251 / 1);
        font-size: 16px;
    }

    #anonymous-pm-show .container .form .form-submit .title {
        width: 100%;
        text-align: center;
        padding-top: 30px;
        padding-bottom: 10px;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        color: #54595F;
        font-size: 18px;
        font-weight: 800;
    }


    #anonymous-pm-show .container .form .box .area-box .media {
        padding: 10px;
        z-index: 11;
    }

    #anonymous-pm-show .container .form .box .area-box .media .size {
        position: absolute;
        bottom: 0;
        left: 5px;
        color: #aaa;
        font-size: 14px;
        font-weight: 600;
        padding: 3px 0;
        -webkit-transition: all ease 0.5s;
        -o-transition: all ease 0.5s;
        transition: all ease 0.5s;
    }


    #anonymous-pm-show .container .form .box .area-box .media .image-preview {
        width: 100%;
        height: 150px;
        padding: 10px 0 0 0;
        display: none;
    }

    #anonymous-pm-show .container .form .box .area-box .media .image-preview .img {
        background: #202020;
        border-radius: 10px;
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .area-box .media .video-preview {
        width: 100%;
        height: 150px;
        padding: 10px 0 0 0;
        display: none;
    }

    #anonymous-pm-show .container .form .box .area-box .media .video-preview .video {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #anonymous-pm-show .container .form .box .area-box .media .video-preview .video video {
        height: auto;
        width: auto;
        border-radius: 10px;
        max-height: 140px;
    }

    #anonymous-pm-show .container .form .box .area-box .media .image-preview .img img {
        height: auto;
        width: auto;
        max-height: 140px;
        max-height: 140px;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row {
        border-radius: 10px;
        min-height: 50px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0 10px;
        position: relative;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row progress[value] {
        padding: 0;
        width: 100%;
        direction: ltr;
        background: #efefef;
        margin: 0;
        margin-bottom: 10px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        color: #39ae00;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row progress[value]::-webkit-progress-bar {
        background-color: #eee;
        border-radius: 30px;
        overflow: hidden;
        -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row progress {
        background-color: whiteSmoke;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row progress[value]::-webkit-progress-value {
        color: #39ae00;
        background-color: #39ae00;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row progress[value]::-moz-progress-bar {
        background-media: -moz-linear-gradient(
            135deg,
            transparent 33%,
            rgba(0, 0, 0, 0.1) 33%,
            rgba(0, 0, 0, 0.1) 66%,
            transparent 66%
        ),
        -moz-linear-gradient(
            top,
            rgba(255, 255, 255, 0.25),
            rgba(0, 0, 0, 0.25)
        ),
        -moz-linear-gradient(
            left,
            #09c,
            #f44
        );
        border-radius: 30px;
        overflow: hidden;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row .wdb {
        width: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        height: 100%;
        height: 50px;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row p {
        width: calc(100% - 30px);
        padding: 0 8px;
        height: 100%;
        font-size: 14.5px;
        color: #656565;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        white-space: nowrap;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start;
        font-weight: 600;
        -o-text-overflow: ellipsis;
        text-overflow: ellipsis;
        overflow: hidden;

    }

    .dark #anonymous-pm-show .container .form .box .area-box .media .row p {
        color: #efefef;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row .close button {
        position: absolute;
        top: 0;
        left: 0;
        -webkit-transform: translateY(-5px);
        -ms-transform: translateY(-5px);
        transform: translateY(-5px);
        color: #fff;
        border-radius: 50%;
        height: 24px;
        z-index: 3;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 24px;
    }

    #anonymous-pm-show .container .form .box .area-box .media .row .icon {
        color: #fff;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        height: 30px;
        width: 30px;
        border-radius: 8px;
        z-index: 3;
    }

    #anonymous-pm-show .container .form .box .area-box .media.video .row .icon {
        background: rgba(148, 27, 128, 1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.video .row .close button {
        background: rgba(148, 27, 128, 1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.video .row {
        background: rgba(148, 27, 128, 0.1);
    }


    #anonymous-pm-show .container .form .box .area-box .media.image .row .icon {
        background: rgba(57, 174, 0, 1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.image .row .close button {
        background: rgba(57, 174, 0, 1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.image .row {
        background: rgba(57, 174, 0, 0.1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.audio .row .icon {
        background: rgba(225, 38, 76, 0.8);
    }

    #anonymous-pm-show .container .form .box .area-box .media.audio .row .close button {
        background: rgba(230, 18, 61, 1);
    }

    #anonymous-pm-show .container .form .box .area-box .media.audio .row {
        background: rgba(230, 18, 61, 0.2);

    }

    #chatbox {
        width: 100%;
        margin-top: 30px;
        margin-bottom: 35px;

    }

    #chatbox .row {
        border-radius: 30px 10px 10px;
        overflow: hidden;
    }

    #chatbox .chatbox-content .list {
        padding: 20px 15px;
        position: relative;
        overflow-y: scroll;
        min-height: 180px;
        max-height: 400px;
    }

    #chatbox .chatbox-header {
        background-color: #7580E3;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 0 15px;
        height: 68px;
    }

    #chatbox .chatbox-buttons button {
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        height: 36px;
        background: rgba(255, 255, 255, 0.08);
        width: 84px;
        border-radius: 30px;
        font-size: 13px;
        border: 1px solid rgba(255, 255, 255, 0.12);
        color: #fff;
    }

    #chatbox .chatbox-header .label * {
        color: #fff;
        font-size: 18px;
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        padding: 5px 0;
        font-weight: 500;
    }

    #chatbox .chatbox-content {
        border-radius: 22px;
        margin-top: -16px;
        -webkit-box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        position: relative;
        overflow: hidden;
    }

    .bubbles-inner {
        min-height: 450px;
        overflow-y: scroll;
        padding-bottom: 10px !important;
    }
}

/*end pm show*/