/* reset css */
* {
    box-sizing: border-box;
}
html {
    margin: 0em;
    padding: 0;
    height: 100%;
    width: 100%;
}
a {
    outline: none;
}
body {
    margin: 0;
    padding: 0;
    font-family: Roboto, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 14px;
    width: 100%;
    height: 100%;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: 0;
}
p {
    padding: 0;
    margin: 0;
}
img {
    border: 0px;
}
.large_icon {
    width: 100px;
    height: 100px;
}
h1,
h2,
h3 {
    margin: 0;
    padding: 0;
}
h2 {
    font-size: 1.5em;
    margin-bottom: 5px;
    line-height: 1.1em;
}
ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
li {
    list-style: none;
}
button {
    border: none;
    outline: none !important;
    cursor: pointer;
}
textarea,
input {
    resize: none;
    font-size: 14px;
    font-family:
        sans-serif, "trebuchet ms", "lucida grande", "lucida sans unicode",
        arial, helvetica, sans-serif;
}
input {
    font-family:
        "FontAwesome", sans-serif, "trebuchet ms", "lucida grande",
        "lucida sans unicode", arial, helvetica, sans-serif;
}
/* modal css */
.small_modal_out,
.large_modal_out {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    cursor: pointer;
}
.over_modal_out,
.over_emodal_out {
    display: none;
    position: fixed;
    z-index: 1001;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    cursor: pointer;
}
.small_modal_in {
    border-radius: 3px;
    margin: 5% auto;
    max-width: 400px;
    width: 98%;
}
.large_modal_in {
    border-radius: 3px;
    margin: 5% auto;
    max-width: 500px;
    width: 98%;
}
.over_modal_in {
    border-radius: 3px;
    margin: 6% auto;
    max-width: 500px;
    width: 98%;
}
.over_emodal_in {
    border-radius: 3px;
    margin: 6% auto;
    max-width: 500px;
    width: 98%;
}
.modal_top {
    width: 100%;
    display: table;
    table-layout: fixed;
}
.modal_top_text {
    display: table-cell;
    font-size: 15px;
    vertical-align: middle;
}
.modal_top_empty {
    display: table-cell;
    vertical-align: middle;
    font-size: 15px;
    padding: 0 5px;
}
.modal_top_element {
    display: table-cell;
    width: 40px;
    height: 40px;
    text-align: center;
    vertical-align: middle;
    font-size: 20px;
}
.avatar_top_mod {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    width: 40px;
    height: 50px;
    padding: 5px;
}
.avatar_top_mod img {
    display: block;
    margin: 0 auto;
    width: 100%;
    border-radius: 50%;
}
.avatar_top_name {
    display: table-cell;
    padding: 0 5px 0 2px;
    font-size: 14px;
    vertical-align: middle;
    font-weight: bold;
}
.modal_content {
}
.user_item_flag {
    width: 24px;
    text-align: center;
    vertical-align: middle;
}
.user_item_flag img {
    width: 18px;
    height: auto;
    display: inline-block;
    margin: 0 auto;
    border-radius: 2px;
}
.lazy {
    background-image: url("../default_images/default_cover.png");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}

/* Loading bar */
#loading-bar {
    position: relative;
    z-index: 2147483647;
    top: 0;
    left: -6px;
    width: 0;
    height: 4px;
    background: #1d91f3;
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
    border-radius: 1px;
    -moz-transition:
        width 500ms ease-out,
        opacity 400ms linear;
    -ms-transition:
        width 500ms ease-out,
        opacity 400ms linear;
    -o-transition:
        width 500ms ease-out,
        opacity 400ms linear;
    -webkit-transition:
        width 500ms ease-out,
        opacity 400ms linear;
    transition:
        width 500ms ease-out,
        opacity 400ms linear;
}
/* listing css */
.sub_list_item {
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 10px;
    cursor: pointer;
    margin-bottom: 3px;
    border-radius: 3px;
}
.sub_half_item {
    display: table;
    table-layout: fixed;
    width: calc(50% - 10px);
    padding: 10px;
    cursor: pointer;
    margin: 0 5px 3px 5px;
    float: left;
}
.sub_list_avatar_small {
    width: 36px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.sub_list_avatar_small img {
    width: 36px;
    height: 28px;
    border-radius: 50%;
    display: block;
}
.sub_list_avatar,
.sub_list_img {
    width: 40px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    position: relative;
}
.sub_list_avatar img,
.sub_list_img img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: block;
}
.sub_list_avatar_large {
    width: 60px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.sub_list_avatar_large img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: block;
}
.sub_list_option {
    display: table-cell;
    vertical-align: middle;
    width: 40px;
    text-align: center;
    font-size: 20px;
}
.sub_list_icon {
    display: table-cell;
    vertical-align: middle;
    width: 30px;
    text-align: center;
    font-size: 16px;
}
.sub_list_ricon {
    display: table-cell;
    vertical-align: middle;
    width: 30px;
    text-align: center;
}
.sub_list_state {
    display: table-cell;
    width: 30px;
    vertical-align: middle;
    text-align: center;
    font-size: 16px;
}
.sub_list_selected {
    display: table-cell;
    vertical-align: middle;
    width: 24px;
    text-align: center;
    font-size: 15px;
}
.sub_list_content {
    display: table-cell;
    vertical-align: middle;
}
.sub_list_pcontent {
    display: table-cell;
    vertical-align: middle;
    padding: 0 5px;
}
.sub_list_cell {
    display: table-cell;
    vertical-align: middle;
}
.sub_list_cell_top {
    display: table-cell;
    vertical-align: top;
    width: max-content;
}
.sub_list_name {
    padding: 0 5px;
    display: table-cell;
    vertical-align: middle;
    white-space: nowrap;
    overflow: hidden;
}
.sub_list_active {
    position: absolute;
    bottom: 0;
    right: 0px;
    width: 12px !important;
    height: 12px !important;
}
/* global element css */
.pad_box {
    padding: 15px;
}
.clear {
    width: 100%;
    height: 1px;
    clear: both;
}
.clear5 {
    width: 100%;
    height: 5px;
    clear: both;
}
.clear10 {
    width: 100%;
    height: 10px;
    clear: both;
}
.clear15 {
    width: 100%;
    height: 15px;
    clear: both;
}
.clear25 {
    width: 100%;
    height: 25px;
    clear: both;
}
.clear_top {
    margin-top: 15px;
}
.tmargin3 {
    margin-top: 3px;
}
.tmargin5 {
    margin-top: 5px;
}
.tmargin10 {
    margin-top: 10px;
}
.tmargin15 {
    margin-top: 15px;
}
.tmargin20 {
    margin-top: 20px;
}
.tmargin25 {
    margin-top: 25px;
}
.bmargin3 {
    margin-bottom: 3px;
}
.bmargin5 {
    margin-bottom: 5px;
}
.bmargin10 {
    margin-bottom: 10px;
}
.bmargin15 {
    margin-bottom: 15px;
}
.bmargin20 {
    margin-bottom: 20px;
}
.bmargin25 {
    margin-bottom: 25px;
}
.lmargin3 {
    margin-left: 3px;
}
.lmargin5 {
    margin-left: 5px;
}
.lmargin10 {
    margin-left: 10px;
}
.lmargin15 {
    margin-left: 15px;
}
.lmargin20 {
    margin-left: 20px;
}
.lmargin25 {
    margin-left: 25px;
}
.rmargin3 {
    margin-right: 3px;
}
.rmargin5 {
    margin-right: 5px;
}
.rmargin10 {
    margin-right: 10px;
}
.rmargin15 {
    margin-right: 15px;
}
.rmargin20 {
    margin-right: 20px;
}
.rmargin25 {
    margin-right: 25px;
}
.vmargin3 {
    margin-top: 3px;
    margin-bottom: 3px;
}
.vmargin5 {
    margin-top: 5px;
    margin-bottom: 5px;
}
.vmargin10 {
    margin-top: 10px;
    margin-bottom: 10px;
}
.vmargin15 {
    margin-top: 15px;
    margin-bottom: 15px;
}
.vmargin20 {
    margin-top: 20px;
    margin-bottom: 20px;
}
.vmargin25 {
    margin-top: 25px;
    margin-bottom: 25px;
}
.hmargin3 {
    margin-left: 3px;
    margin-right: 3px;
}
.hmargin5 {
    margin-left: 5px;
    margin-right: 5px;
}
.hmargin10 {
    margin-left: 10px;
    margin-right: 10px;
}
.hmargin15 {
    margin-right: 15px;
    margin-right: 15px;
}
.hmargin20 {
    margin-right: 20px;
    margin-right: 20px;
}
.hmargin25 {
    margin-right: 25px;
    margin-right: 25px;
}
.pad3 {
    padding: 3px;
}
.pad5 {
    padding: 5px;
}
.pad10 {
    padding: 10px;
}
.pad15 {
    padding: 15px;
}
.pad20 {
    padding: 20px;
}
.pad25 {
    padding: 25px;
}
.tpad3 {
    padding-top: 3px;
}
.tpad5 {
    padding-top: 5px;
}
.tpad10 {
    padding-top: 10px;
}
.tpad15 {
    padding-top: 15px;
}
.tpad20 {
    padding-top: 20px;
}
.tpad25 {
    padding-top: 25px;
}
.bpad3 {
    padding-bottom: 3px;
}
.bpad5 {
    padding-bottom: 5px;
}
.bpad10 {
    padding-bottom: 10px;
}
.bpad15 {
    padding-bottom: 15px;
}
.bpad20 {
    padding-bottom: 20px;
}
.bpad25 {
    padding-bottom: 25px;
}
.lpad3 {
    padding-left: 3px;
}
.lpad5 {
    padding-left: 5px;
}
.lpad10 {
    padding-left: 10px;
}
.lpad15 {
    padding-left: 15px;
}
.lpad20 {
    padding-left: 20px;
}
.lpad25 {
    padding-left: 25px;
}
.rpad3 {
    padding-right: 3px;
}
.rpad5 {
    padding-right: 5px;
}
.rpad10 {
    padding-right: 10px;
}
.rpad15 {
    padding-right: 15px;
}
.rpad20 {
    padding-right: 20px;
}
.rpad25 {
    padding-right: 25px;
}
.vpad3 {
    padding-top: 3px;
    padding-bottom: 3px;
}
.vpad5 {
    padding-top: 5px;
    padding-bottom: 5px;
}
.vpad10 {
    padding-top: 10px;
    padding-bottom: 10px;
}
.vpad15 {
    padding-top: 15px;
    padding-bottom: 15px;
}
.vpad20 {
    padding-top: 20px;
    padding-bottom: 20px;
}
.vpad25 {
    padding-top: 25px;
    padding-bottom: 25px;
}
.hpad3 {
    padding-left: 3px;
    padding-right: 3px;
}
.hpad5 {
    padding-left: 5px;
    padding-right: 5px;
}
.hpad10 {
    padding-left: 10px;
    padding-right: 10px;
}
.hpad15 {
    padding-left: 15px;
    padding-right: 15px;
}
.hpad20 {
    padding-left: 20px;
    padding-right: 20px;
}
.hpad25 {
    padding-left: 25px;
    padding-right: 25px;
}
.pwidth20 {
    width: 20px;
}
.pwidth30 {
    width: 30px;
}
.pwidth40 {
    width: 40px;
}
.pwidth50 {
    width: 50px;
}
.pwidth60 {
    width: 60px;
}
.pwidth70 {
    width: 70px;
}
.pwidth80 {
    width: 80px;
}
.pwidth90 {
    width: 90px;
}
.pwidth100 {
    width: 100px;
}
.bold {
    font-weight: bold;
}
.bold900 {
    font-weight: 900;
}
.btable {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.bcell {
    display: table-cell;
}
.bcell_mid {
    display: table-cell;
    vertical-align: middle;
}
.bcell_mid_center {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.bcell_top {
    display: table-cell;
    vertical-align: top;
}
.product_info {
    width: max-content;
}
.bcell_bottom {
    display: table-cell;
    vertical-align: bottom;
}
.bcell_height {
    display: table-cell;
    vertical-align: top;
    height: 100%;
}
.bcell_elips {
    display: table-cell;
    vertical-align: middle;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.large_textarea {
    height: 180px;
    max-height: 180px;
}
.medium_textarea {
    height: 100px;
    max-height: 100px;
}
.small_textarea {
    height: 65px;
    max-height: 65px;
}
.no_break {
    white-space: nowrap;
}
.fright {
    float: right;
}
.fleft {
    float: left;
}
.aleft {
    text-align: left;
}
.aright {
    text-align: right;
}
.bellips {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
.btn_ellips {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
}
.box_height {
    max-height: 500px;
    overflow: hidden;
    overflow-y: auto;
}
.inline_element {
    display: inline-block;
}
.balign_left {
    text-align: left;
}
.balign_right {
    text-align: right;
}
.break_it {
    word-break: break-all;
}
.boom_relative {
    position: relative;
}
.radius3 {
    border-radius: 3px;
}
.radius5 {
    border-radius: 5px;
}
.add_cursor,
.bclick {
    cursor: pointer;
}
.fa {
    cursor: pointer;
}
.modal_open {
    overflow: hidden;
}
.hidden {
    display: none;
}
.text_xsmall {
    font-size: 11px;
}
.text_small {
    font-size: 13px;
}
.text_med {
    font-size: 16px;
}
.text_xmed {
    font-size: 18px;
}
.text_big {
    font-size: 20px;
}
.text_large {
    font-size: 22px;
}
.text_xlarge {
    font-size: 25px;
}
.text_jumbo {
    font-size: 35px;
}
.text_xjumbo {
    font-size: 45px;
}
.text_ultra {
    font-size: 60px;
}
.text_xultra {
    font-size: 70px;
}
.username {
    font-weight: bold;
}
.link_like {
    text-decoration: underline;
}
.no_link_like {
    text-decoration: none;
    cursor: pointer;
}
.system_text {
    display: inline-block;
    max-width: 100%;
    padding: 3px 10px;
    border-radius: 3px;
    margin-top: 5px;
    font-weight: normal !important;
    font-size: 12px;
}
.post_content .system_text {
    display: block;
    text-align: center;
    padding: 10px;
}
.list {
    padding: 15px;
}
.list li {
    list-style: disc;
    padding: 1px 0;
}
#content_page {
    width: 100%;
    height: auto;
}
.noem {
    line-height: normal;
}
.binline {
    display: inline;
}
.binblock {
    display: inline-block;
}
.bblock {
    display: block;
}
.bradius {
    border-radius: 1000px !important;
}
.lradius {
    border-radius: 1000px 0 0 1000px;
}
.rradius {
    border-radius: 0 1000px 0 1000px;
}
.bcentered {
    margin: 0 auto;
}
.bwarp {
    white-space: nowrap;
}
.boomrelative {
    position: relative;
}
.doc_title {
    font-size: 18px;
    font-weight: bold;
}
.doc_text {
    padding: 10px 0;
    font-size: 13px;
}
.doc_sub {
    font-weight: bold;
    padding: 10px 0 0 0;
    font-size: 15px;
}
.doc_list {
    padding: 10px 30px;
}
.doc_list li {
    list-style: disc;
    padding: 3px 0;
    font-size: 13px;
}

/* side css */
#side_content {
    width: 480px;
    max-width: 100%;
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 500;
    display: none;
}
#side_close {
    display: table;
    width: 100%;
    height: 46px;
    table-layout: fixed;
}
.side_close_btn {
    width: 40px;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    font-size: 18px;
    text-align: center;
    cursor: pointer;
}
.side_close_empty {
    display: table-cell;
    vertical-align: middle;
}
#side_inside {
    overflow: hidden;
    overflow-y: auto;
}

/* intro css */
#intro_top {
    height: auto;
    width: 100%;
    padding: 80px 0;
    z-index: 1;
    position: relative;
}
#container_intro {
    width: 1200px;
    height: 300px;
    margin: 0 auto;
    padding: 0 10px;
    display: table;
}
#intro_content {
    display: table-cell;
    vertical-align: middle;
}
#intro_inside {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    padding: 20px;
    border-radius: 10px;
}
.titles_big {
    font-size: 35px;
    padding-bottom: 10px;
    line-height: 36px;
}
.title_small {
    font-size: 18px;
}
.extra_login {
    margin-top: 12px;
}

/* content radius */
.page_menu ul,
.page_element,
.sp_box {
    border-radius: 3px;
}

/* cookie bar */
.cookie_wrap {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999;
}
.cookie_bar {
    display: table;
    width: 100%;
    table-layout: fixed;
    padding: 15px;
}
.cookie_left {
    display: table-cell;
    vertical-align: middle;
    padding: 0 5px;
}
.cookie_right {
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    width: 150px;
}

/* form login & registration css */
.login_select {
    width: 100%;
    padding: 9px;
    margin: 3px 0;
}
.login_select option {
    width: 100%;
    border: none;
    padding-left: 0;
    padding-right: 0;
}
.login_control {
    margin-top: 5px;
}
.rules_click {
    cursor: pointer;
    text-decoration: underline;
}
.login_label {
    margin-top: 5px;
}
.login_title {
    font-size: 17px;
    margin-bottom: 6px;
}
.login_form {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
.input_data {
    width: 100%;
    padding: 10px;
    border-radius: 3px;
    border: none;
    font-size: 16px;
    margin: 3px 0;
}
.forgot_password {
    cursor: pointer;
    padding: 5px 0;
    font-size: 13px;
}
#intro_control {
    margin-top: 20px;
}
.intro_btn {
    padding: 12px 20px;
    border-radius: 25px;
    font-size: 16px;
    margin-bottom: 7px;
    min-width: 200px;
}
.small_intro_btn {
    padding: 8px 12px;
    border-radius: 25px;
    font-size: 14;
    margin-bottom: 5px;
}
.intro_btn_pop {
    padding: 10px;
    border-radius: 3px;
    margin-bottom: 4px;
    font-size: 15px;
}
.val_if {
    display: none;
}
.uploaded_container {
    max-width: 100%;
    display: inline-block;
    margin-top: 5px;
}
.uploaded_file {
    text-decoration: none !important;
    display: block;
    padding: 3px 10px;
    border-radius: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rules_text {
    font-size: 11px;
    margin-top: 6px;
}
#registration_part {
    display: none;
}
.large_select .selectboxit-container span,
.large_select .selectboxit-container .selectboxit-options a {
    height: 40px;
    line-height: 40px;
}
.register_options {
    margin: 3px 0;
}
#register_button {
    margin-top: 5px;
}
.login_content {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.login_right {
    display: table-cell;
    width: 240px;
    vertical-align: top;
    padding: 0 10px;
}
.login_left {
    display: table-cell;
    vertical-align: top;
}
.login_left_pad {
    padding-right: 10px;
}
.not_member {
    padding: 12px 15px;
    font-size: 13px;
    font-weight: bold;
}

/* section css */
.section {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
.section_content {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
.section_inside {
    margin: 0 auto;
}
#intro_section_top {
    text-align: center;
    padding: 100px 0;
}

/* footer css */
#main_footer {
    padding: 15px 0;
    height: auto;
}
#menu_main_footer {
    font-size: 15px;
    width: auto;
}
#menu_main_footer li {
    display: inline-block;
    margin-right: 10px;
    margin-bottom: 6px;
    font-size: 13px;
}
#menu_main_footer li a {
    color: inherit;
    text-decoration: none;
}

/* misc text css */
.page_title {
    padding-bottom: 5px;
    margin-bottom: 15px;
}
.text_title {
    font-weight: bold;
    font-size: 15px;
}
.text_text {
    font-size: 13px;
    margin: 7px 0;
}
.text_box {
    max-height: 500px;
    overflow-y: auto;
}
.panel_element {
    padding: 15px;
}

/* active last */
#last_embed_title {
    font-size: 13px;
    text-align: center;
    padding: 10px 0 0 0;
}
#last_embed {
    width: 100%;
    height: auto;
    text-align: center;
    margin: 10px 0;
}
.active_embed {
    width: 50px;
    height: 50px;
    display: inline;
    margin: 5px;
}
.active_embed_user {
    width: 50px;
    height: 50px;
    border-radius: 50%;
}

/* outpage css */
.out_page_container {
    width: 100%;
    height: 100%;
    display: table;
    table-layout: fixed;
}
.out_page_content {
    display: table-cell;
    text-align: center;
    vertical-align: middle;
    position: relative;
}
.out_page_box {
    max-width: 94%;
    width: 480px;
    margin: 0 auto;
}
.out_page_title {
    font-size: 25px;
    font-weight: bold;
    margin-bottom: 10px;
}
.out_page_text {
    font-size: 16px;
    margin-bottom: 15px;
}
.big_icon {
    font-size: 50px;
    margin-bottom: 10px;
}
.adm_login {
    position: absolute;
    bottom: 5px;
    left: 5px;
    display: block;
    padding: 10px;
}

.work_button {
    display: none;
}

/* element css */
.setting_element,
.chat_settings {
    padding: 8px 0;
}
.admin_elem_option {
    padding: 10px 0;
}

/* avatar css */
.my_avatar {
    display: table-cell;
    width: 36px;
    vertical-align: top;
}
.avatar_post {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    float: left;
    display: block;
}
.avatar_reply {
    width: 32px;
    height: 32px;
    border-radius: 50%;
}
.avatar_userlist {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    float: left;
    display: block;
}
.avatar_menu {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: block;
    float: right;
}

/* input css */
.full_input,
.full_textarea {
    padding: 10px 10px;
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    border: none;
    border-radius: 2px;
}
.edit_page_box {
    min-height: 600px;
}
.large_input {
    font-size: 20px;
}
.selectboxit-container .selectboxit-list {
    width: 100%;
}
.selectboxit-container {
    width: 100%;
}
.selectboxit-container .selectboxit {
    width: 100%;
}
.selectboxit-container .selectboxit-options {
    max-height: 180px;
    border-radius: 2px;
}
.selectboxit-container span,
.selectboxit-container .selectboxit-options a {
    height: 40px;
    line-height: 40px;
}

/* element css */
.centered_element {
    text-align: center;
}
.boom_form {
    padding: 0 0 10px 0;
}
.form_left,
.form_left_full {
    width: 50%;
    float: left;
    padding-right: 3px;
}
.form_right,
.form_right_full {
    width: 50%;
    float: right;
    padding-left: 3px;
}
.form_split {
    width: 100%;
    clear: both;
}

/* button css */
.full_button {
    width: 100%;
    text-align: center;
}
.button_half {
    width: 49%;
    text-align: center;
}
.button_left {
    float: left;
}
.button_right {
    float: right;
}
.label {
    margin-bottom: 6px;
    font-size: 13px;
}
.set_button,
.reg_button {
    padding: 8px 10px;
}
.tiny_button {
    padding: 3px 10px;
    margin: 5px 0 0 0;
    min-width: 40px;
}
.small_button {
    padding: 8px 10px;
    min-width: 50px;
}
.pop_button,
.set_button,
.reg_button,
.very_large_button,
.tiny_button,
.small_button,
.button {
    border-radius: 3px;
    cursor: pointer;
}
.pop_button {
    font-size: 15px;
    padding: 8px 0;
}
.login_btn {
    padding: 10px 0;
}
.very_large_button {
    font-size: 18px;
    padding: 10px 0;
    text-align: center;
}
.load_more {
    margin: 0 auto;
    padding: 8px;
    cursor: pointer;
    border-radius: 2px;
}
.space_btn {
    margin-bottom: 5px;
}
.rounded_button {
    border-radius: 100px;
}

/* font and text css */
.titles {
    font-size: 30px;
    padding-bottom: 10px;
}

/* empty zone css */
.empty_zone {
    padding: 30px 15px;
    margin: 0 auto;
    text-align: center;
}
.empty_zone_icon {
    width: 64px;
    height: 64px;
}
.empty_zone_text {
    font-size: 13px;
    margin-top: 10px;
    font-weight: bold;
}
.empty_zone {
    text-align: center;
}
/* switch element */
.switch_item {
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 12px;
}
.switch_item_switch {
    display: table-cell;
    vertical-align: middle;
    width: 60px;
}
.switch_item_text {
    display: table-cell;
    vertical-align: middle;
}
.switch_wrap {
    display: block;
    width: 50px;
    margin: 0 auto;
}
.bswitch {
    display: table;
    width: 50px;
    padding: 2px;
    border-radius: 100px;
}
.bball_wrap {
    display: table-cell;
    vertical-align: middle;
}
.bball {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: block;
}
.offswitch {
    background: #ccc;
}
.onswitch {
    background: #74b20e;
}
.onball {
    background: #fff;
    margin-left: 22px;
}
.offball {
    background: #fff;
    margin-left: 0px;
}

/* post css */
.add_news_box,
.add_post_container {
    padding: 0 0 10px 0;
}
.news_element {
    padding: 10px 0;
}
.new_news {
    padding: 0 5px;
    border-radius: 2px;
    margin-left: 3px;
}
#wall_wrap,
#news_wrap {
    padding: 10px;
}
.page_element #wall_wrap,
.page_element #news_wrap {
    padding: 0;
}
.post_element {
    height: auto;
    padding: 12px 0;
    margin: 0 auto;
}
.post_title {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.post_avatar {
    display: table-cell;
    width: 36px;
    vertical-align: middle;
}
.post_info {
    display: table-cell;
    vertical-align: middle;
    padding: 0 5px;
}
.post_edit {
    display: table-cell;
    vertical-align: middle;
    cursor: pointer;
    width: 40px;
    font-size: 15px;
    text-align: center;
}
.small {
    font-size: 12px;
}
.post_content {
    padding: 10px 0;
    display: table;
    table-layout: fixed;
    width: 100%;
    word-wrap: break-word;
}
.post_control {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.like_container,
.comment_count,
.do_comment {
    display: table-cell;
    vertical-align: middle;
    height: 30px;
}
.like_container {
    text-align: left;
}
.comment_count {
    width: 80px;
    text-align: right;
    padding-right: 10px;
    cursor: pointer;
}
.do_comment {
    width: 40px;
    text-align: center;
    cursor: pointer;
}
.like_count,
.unlike_count {
    float: left;
    cursor: pointer;
    margin-right: 15px;
}
.like_container .count {
    margin-left: 5px;
}
.show_reply {
    height: auto;
    overflow: hidden;
    margin-bottom: 10px;
}
.comment_reply {
    display: table;
    width: 100%;
    table-layout: fixed;
    word-wrap: break-word;
    padding: 7px;
}
.comment_avatar {
    width: 36px;
}
.comment_avatar,
.comment_text {
    display: table-cell;
    vertical-align: top;
}
.comment_text {
    padding: 0;
}
.reply_post {
    padding: 10px 0 0 0;
}
.more_comment {
    cursor: pointer;
    display: block;
    padding: 8px 0;
}
.more_comment:hover,
.open_adco:hover {
    text-decoration: underline;
}
.reply_this {
    float: right;
    padding: 8px 5px 0 0;
    cursor: pointer;
}
.reply_post button {
    margin-top: 5px;
}
.post_image {
    display: table;
    table-layout: fixed;
    width: 100%;
    margin: 10px 0;
}
.post_image img {
    max-width: 100%;
    max-height: 350px;
    width: auto;
    height: auto;
}
.comment_text img {
    max-height: 160px;
}
.open_adco {
    margin: 0 0 5px 0;
    cursor: pointer;
}
.add_comment_zone {
    clear: both;
    display: none;
}
.load_more_post {
    padding: 6px 0;
    text-align: center;
    font-size: 17px;
    cursor: pointer;
}
.show_notified_post {
    padding: 10px;
}
.panel_wrap {
    padding: 15px 15px 30px 15px;
}
.name_ellips {
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    display: inline-block;
    vertical-align: bottom;
}

/* admin section css */
.saved_data {
    padding: 20px;
    font-size: 24px;
    text-align: center;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    display: none;
    z-index: 1002;
}
.ex_admin {
    padding: 5px 0 0 0;
    font-style: italic;
    font-size: 13px;
}
#system_status li {
    padding: 8px 0;
}
.status_title {
    font-size: 22px;
    margin-bottom: 10px;
}
.admin_form {
    width: 100%;
    display: block;
}
#word_list {
    width: 100%;
    height: auto;
    padding: 10px 0;
}
.tab_element {
    display: table;
    width: 100%;
    table-layout: fixed;
    cursor: pointer;
}
.admin_sm_content {
    display: table-cell;
    vertical-align: middle;
    padding: 12px 10px;
}
.admin_sm_avatar {
    display: table-cell;
    width: 50px;
    vertical-align: middle;
    padding: 5px;
}
.admin_sm_username {
    display: table-cell;
    vertical-align: middle;
    padding: 0 10px;
}
.admin_sm_option {
    display: table-cell;
    width: 50px;
    vertical-align: middle;
    text-align: center;
    font-size: 20px;
    cursor: pointer;
}
.admin_sm_button {
    display: table-cell;
    padding: 10px;
    vertical-align: middle;
    text-align: right;
    cursor: pointer;
}
.admin_sm_username {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.admin_search {
    display: table;
    width: 100%;
    overflow: hidden;
    border-radius: 3px;
}
.admin_search_btn {
    display: table-cell;
    width: 50px;
    text-align: center;
    cursor: pointer;
}
.edit_verify {
    margin-top: 8px;
}
.admin_profile_top {
    padding: 15px;
    display: table;
    table-layout: fixed;
    width: 100%;
    position: relative;
}
.room_det {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.warning_box {
    border-radius: 4px;
}
.warning_box_icon {
    width: 32px;
    font-size: 17px;
    text-align: center;
    padding: 8px 0;
}
.warning_box_text {
    padding: 10px 5px;
    font-size: 13px;
}

/* wall input and news input */
.main_post_control {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin-top: 3px;
}
.main_post_data {
    padding: 0 10px 10px 10px;
}
.main_post_data img {
    max-height: 60px;
    max-width: 100%;
}
#post_file_data {
    display: none;
}
.up_file {
    display: inline-block;
}
.up_file_inside {
    display: table-cell;
    position: relative;
    min-width: 80px;
    min-height: 80px;
}
.up_file_image {
    width: 100px;
    height: 100px;
}
.up_file_remove {
    width: 30px;
    height: 30px;
    text-align: center;
    padding-top: 3px;
    font-size: 18px;
    position: absolute;
    bottom: 5px;
    right: 5px;
    border-radius: 20px;
}
.main_post_item {
    display: table-cell;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    font-size: 20px;
    position: relative;
    text-align: center;
}
.main_post_button {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    height: 40px;
}

/* header css */
#wrap_main_header {
    max-width: 99%;
    margin: 0 auto;
    height: 100%;
}
#header2 {
    width: 100%;
    height: 50px;
    margin: 0 auto;
    position: fixed;
    z-index: 4;
}
#chat_head {
    height: 46px;
    padding: 0 6px;
    width: 100%;
    display: table;
    table-layout: fixed;
}
.empty_subhead {
    width: 100%;
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-gap: 10px;
    align-items: stretch;
}
.grid > .store_product {
    border: 1px solid #ccc;
    box-shadow: 0 0 1px 1px #ddd;
}

.grid_prev {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    grid-gap: 10px;
    align-items: stretch;
}
.grid_prev > .store_product {
    border: 1px solid #ccc;
    box-shadow: 0 0 1px 1px #ddd;
}

.grid.main_page_data {
    display: block;
}
.grid.main_page_data > .store_product_row {
    border: 0;
    box-shadow: none;
    border-bottom: 1px solid #ddd;
}

.store_product img {
    max-width: 100%;
    max-height: 166px;
    height: 166px;
    width: 100%;
    object-fit: fill;
}
.store_product img:hover {
    opacity: 0.8;
    transition: opacity 0.2s ease-in-out;
}

.store_product_row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 10px;
}
.third_party_row_card {
    position: relative;
    overflow: hidden;
}
.third_party_corner_banner {
    position: absolute;
    top: 0;
    right: 0;
    background: #2b7cff;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-bottom-left-radius: 8px;
    max-width: 55%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.store_product_row .store_product_row_thumb {
    width: 52px;
    height: 52px;
    flex: 0 0 52px;
}
.store_product_row img {
    width: 52px;
    height: 52px;
    max-width: none;
    max-height: none;
    border-radius: 50%;
    object-fit: cover;
}
.store_product_row .store_product_row_content {
    flex: 1;
    min-width: 0;
}
.store_product_row .store_product_row_content .store_product_sub_text {
    margin-top: 4px;
}
.store_product_row .store_product_row_price {
    font-size: 38px;
    line-height: 1;
    white-space: nowrap;
}
.store_product_row img:hover {
    opacity: 1;
}

.preview_grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(80px, 1fr));
    grid-gap: 10px;
    align-items: stretch;
}
.preview_grid > .store_preview img {
    height: 50px;
    max-width: 100%;
    max-height: 166px;
    width: 100%;
}
/* menu css */
#main_header {
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
}
.head_logo,
.chat_head_logo {
    display: table-cell;
    vertical-align: middle;
    width: 152px;
    white-space: nowrap;
}
.mobile_logo {
    display: table-cell;
    vertical-align: middle;
    width: 50px;
    white-space: nowrap;
}
.head_logo img,
.chat_head_logo img {
    height: 45px;
    width: auto;
    display: block;
}
.mobile_logo img {
    display: block;
    max-height: 38px;
}
.login_main_menu {
    display: table-cell;
    text-align: right;
    vertical-align: middle;
    height: 100%;
}
.login_main_menu {
    padding: 0px;
}
.login_main_menu ul li {
    display: inline-block;
    margin-left: 5px;
    padding: 8px 10px;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
}
#login_menu {
    width: 200px;
    height: auto;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 100;
    display: none;
}
#login_menu li {
    display: list-item;
    width: 100%;
    margin: 0;
    text-align: left;
    font-size: 14px;
    text-transform: none;
    cursor: pointer;
}
#mobile_main_menu {
    width: 240px;
    height: auto;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 161;
    display: none;
}
#mobile_main_menu li {
    display: list-item;
    width: 100%;
    margin: 0;
    text-transform: none;
    cursor: pointer;
}
#empty_top_mob {
    display: table-cell;
    vertical-align: middle;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#store_cart_menu {
    display: table-cell;
    vertical-align: middle;
    padding-right: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.head_option {
    display: table-cell;
    width: 40px;
    vertical-align: middle;
    font-size: 16px;
    text-align: center;
    position: relative;
    cursor: pointer;
}
#main_mob_menu {
    display: table-cell;
    vertical-align: middle;
    width: 36px;
    position: relative;
    cursor: pointer;
}
#open_login_menu {
    display: table-cell;
    vertical-align: middle;
    width: 50px;
    font-size: 24px;
    text-align: center;
    position: relative;
}
.av_menu_arrow {
    float: right;
    font-size: 20px;
    margin-left: 5px;
    margin-top: 10px;
}
#back_to_page {
    display: table-cell;
    text-align: right;
    font-size: 17px;
}
#back_button {
    padding: 10px;
    font-size: 17px;
}

/* language box */
.intro_language {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.lang_flag {
    width: 26px;
    height: auto;
    display: block;
    margin: 0 auto;
}
.intro_lang {
    width: 26px;
    height: auto;
    display: block;
    margin: 0 auto;
}
.lang_box {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.lang_flag_box {
    display: table-cell;
    width: 40px;
    height: 38px;
    vertical-align: middle;
}
.lang_lang {
    display: table-cell;
    vertical-align: middle;
    padding-left: 2px;
}
.embed_lang {
    padding: 5px;
}

/* list css */
.drop_list {
    display: none;
    cursor: pointer;
}
.drop_list li {
    padding: 10px;
}
.user_lm_box {
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 0 5px;
}
.user_lm_avatar {
    display: table-cell;
    vertical-align: middle;
    width: 46px;
    padding: 3px 5px;
}
.user_lm_data {
    display: table-cell;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user_lm_icon {
    display: table-cell;
    vertical-align: middle;
    width: 24px;
    text-align: center;
}
.lm_option {
    width: 50px;
    text-align: center;
    font-size: 22px;
    vertical-align: middle;
    display: table-cell;
}
.user_count {
    padding: 10px;
    width: 100%;
    font-size: 13px;
    font-weight: normal;
    font-weight: bold;
}
.st_icon {
    font-size: 11px;
}
.icmute,
.icrank,
.icstatus,
.icsex {
    font-size: 16px;
}

/* responsive menu page */
#side_menu {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 220px;
    background: #fff;
    display: none;
    overflow-y: auto;
    z-index: 3;
    padding-top: 50px;
}

/*page css */
#testhide {
    display: none;
}
#page_global {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.page_indata {
    display: table-cell;
    vertical-align: top;
}
.page_menu {
    display: table-cell;
    vertical-align: top;
    width: 250px;
    padding-right: 10px;
}
#page_in_menu,
.side_menu_content {
    border-radius: 12px;
    overflow: hidden;
}
#page_wrapper {
    display: table;
    table-layout: fixed;
    width: 100%;
    position: relative;
    z-index: 1;
}
.page_full {
    width: 100%;
    display: table;
    table-layout: fixed;
}
.page_left {
    display: table-cell;
    vertical-align: top;
    padding-right: 10px;
}
.page_right {
    display: table-cell;
    vertical-align: top;
    padding-left: 10px;
}
.page_350 {
    width: 330px;
    display: table-cell;
    vertical-align: top;
}
.page_40 {
    width: 40%;
    display: table-cell;
    vertical-align: top;
}
.page_quarter {
    width: 25%;
    display: table-cell;
}
.page_half {
    width: 50%;
    display: table-cell;
    vertical-align: top;
}
.page_third {
    width: 33%;
    display: table-cell;
    vertical-align: top;
}
.page_two_third {
    width: 66%;
    display: table-cell;
    vertical-align: top;
}
.page_fourth {
    width: 25%;
    display: table-cell;
    vertical-align: top;
}
.pmenu {
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
}
#page_in_menu > .pmenu,
.side_menu_content > .pmenu {
    min-height: 52px;
    padding: 12px 14px;
}
.psmenu {
    padding: 10px 15px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
}
#page_in_menu > .sub_menu_in .psmenu,
.side_menu_content > .sub_menu_in .psmenu {
    padding-left: 48px;
}
.side_menu_content ul li {
    padding: 10px 8px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.menu_icon {
    width: 36px;
    text-align: center;
    font-size: 16px;
}
.menu_text {
    font-size: 15px;
    font-weight: 500;
}
.page_drop {
    display: none;
}
.page_drop_icon {
    width: 24px;
    text-align: center;
}
.popen {
    display: none;
}
.spec_menu {
    padding-right: 36px !important;
    position: relative;
}
.page_menu ul li:last-child,
.side_menu_content ul li:last-child {
    border-bottom: none;
}
.side_menu_content {
    padding: 0;
}
#page_in_menu > .pmenu:last-child,
.side_menu_content > .pmenu:last-child {
    border-bottom: none;
}
.page_350 img,
.page_full img,
.page_left img,
.page_right img,
.page_40 img,
.page_quarter img,
.page_half img,
.page_third img,
.page_two_third img {
    max-width: 100%;
}
.third_content {
    width: 33%;
    padding: 10px;
    float: left;
}
.page_element {
    padding: 10px;
    margin-bottom: 10px;
}
.page_elemv {
    padding: 0 20px;
}
.page_elemv10 {
    padding: 10px 20px;
}
.empty_page_element {
    padding: 15px;
    margin-bottom: 10px;
    border-radius: 3px;
}
.box_title {
    margin-bottom: 12px;
    padding: 0 0 5px 0;
    font-weight: bold;
}
.split {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.split_left,
.element_left {
    width: 50%;
    display: table-cell;
    padding-right: 5px;
}
.split_right,
.element_right {
    width: 50%;
    display: table-cell;
    padding-left: 5px;
}
.element {
    display: table;
    width: 100%;
    table-layout: fixed;
}
.page_half_left {
    display: table-cell;
    width: 50%;
    padding-right: 5px;
    vertical-align: top;
}
.page_half_right {
    display: table-cell;
    width: 50%;
    padding-left: 5px;
    vertical-align: top;
}
.no_pad {
    padding: 0 !important;
}
.item_page_title {
    padding: 10px 15px;
}
.half_to_full {
    width: 50%;
    float: left;
}
.page_top_elem {
    display: table;
    table-layout: fixed;
    width: 100%;
}
.page_top_title {
    display: table-cell;
    vertical-align: middle;
}
.page_top_option {
    display: table-cell;
    vertical-align: middle;
    width: 120px;
}

.left_item {
    display: table;
    width: 100%;
    table-layout: fixed;
    height: 41px;
}
.status_option {
    display: table;
    width: 100%;
    table-layout: fixed;
    height: 40px;
}
.actual_in,
.left_item_in {
    display: table-cell;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 0 6px;
    vertical-align: middle;
}
.left_notify {
    display: table-cell;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: middle;
    text-align: center;
    width: 36px;
    position: relative;
}

/* sub menu */
.sub_menu {
    border-radius: 2px;
}
.sub_menu_item {
    padding: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.sub_menu_icon {
    width: 30px;
    text-align: center;
}

/* spinner box css */
.large_spinner {
    width: 50px;
    height: 50px;
    position: absolute;
    display: block;
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -25px;
    font-size: 50px;
}
.boom_spinner {
    width: 100%;
}

/* search bar css */
.search_bar {
    position: relative;
}
.search_input {
    width: 100%;
    padding: 10px;
    border-radius: 3px;
    border: none;
}

#page_content {
    width: 100%;
    margin: 0 auto;
    height: auto;
    padding: 10px 10px;
}
.store_product_sub_text {
    color: #888;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
/* profile css */
.choose_avatar {
    position: relative;
}
.avatar_select {
    -webkit-appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

/* profile box */
.profile_top {
    padding: 15px 15px 10px 15px;
    position: relative;
}
.profile_close {
    position: absolute;
    top: 0;
    right: 0;
    padding: 10px 15px;
    font-size: 20px;
    z-index: 2;
    cursor: pointer;
}
.tab_menu_container {
    position: relative;
}
.reg_menu_container {
    position: relative;
}
.modal_menu,
.tab_menu,
.reg_menu {
    font-size: 0px;
}
.reg_zone {
    padding: 15px 0;
}
.tab_menu {
    z-index: 2;
}
.profile_background {
    background-size: cover !important;
    background-position: 50% 50% !important;
}
.modal_menu ul li,
.tab_menu ul li {
    display: inline-block;
    padding: 10px;
    cursor: pointer;
    font-size: 14px;
}
.reg_menu ul li {
    display: inline-block;
    padding: 10px;
    cursor: pointer;
    font-size: 14px;
    font-weight: bold;
}
.hide_zone {
    display: none;
}
.modal_wrap_top {
    position: relative;
}
.my_profile_top {
    padding: 15px;
    display: table;
    table-layout: fixed;
    width: 100%;
    position: relative;
}
.profile_avatar {
    display: table-cell;
    width: 140px;
    height: 140px;
    vertical-align: top;
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}
.avatar_profile {
    width: 140px;
    height: auto;
    cursor: pointer;
    display: block;
    border-radius: 5px;
}
.avatar_control {
    position: absolute;
    bottom: 0;
    width: 100%;
}
.avatar_button {
    width: 50%;
    float: left;
}
.avatar_button_myself {
    width: 50%;
    float: left;
}
.my_profile_name {
    display: table-cell;
    vertical-align: bottom;
    padding: 0 10px 0 10px;
    position: relative;
}
.my_name {
    font-size: 25px;
    font-weight: bold;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.info_pro {
    padding: 8px 0;
}

/* section css */
.staff_list .empty_zone {
    width: 100%;
}

/* other element */
.sp_box {
    width: calc(50% - 10px);
    display: block;
    float: left;
    margin: 5px;
    overflow: hidden;
}
.sp_content {
    width: 100%;
    display: table;
    table-layout: fixed;
}
.sp_icon {
    width: 70px;
    font-size: 30px;
    text-align: center;
    padding: 20px 0;
}
.sp_info {
    padding: 0 10px;
    background: slategray;
}
.sp_title {
    font-weight: bold;
}

/* sub mobile menu and subpage */
#open_sub_mobile {
    display: none;
    width: 36px;
    vertical-align: middle;
    text-align: center;
    font-size: 24px;
}
#close_sub_mob {
    height: 100%;
    display: table;
    width: 100%;
    cursor: pointer;
}
#close_sub {
    display: table-cell;
    vertical-align: middle;
    text-align: right;
    padding: 0 10px;
    font-size: 22px;
}

/* modal control */
.pact_btn {
    margin-top: 10px;
}

/* modal css */
.small_modal_out,
.large_modal_out,
.side_modal_out {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0, 0, 0);
    cursor: pointer;
}
.small_modal_in {
    border-radius: 3px;
    margin: 5% auto;
    max-width: 400px;
    width: 96%;
}
.large_modal_in {
    border-radius: 3px;
    margin: 5% auto;
    max-width: 500px;
    width: 96%;
}
.modal_top {
    height: 40px;
    width: 100%;
    display: table;
    table-layout: fixed;
}
.modal_top_empty {
    display: table-cell;
    vertical-align: middle;
    padding: 0 10px;
    font-size: 15px;
    font-weight: bold;
}
.modal_top_element {
    display: table-cell;
    width: 50px;
    text-align: center;
    vertical-align: middle;
    height: 40px;
    font-size: 20px;
}
.modal_content {
}
.modal_content .post_element {
    padding: 0;
    background: none !important;
    box-shadow: none !important;
    margin-bottom: 0px !important;
}

/* profile box */
.modal_top_menu {
    display: table;
    width: 100%;
    table-layout: fixed;
    margin: 5px 0 5px 0;
    padding: 0 5px;
}
.modal_top_item {
    display: table-cell;
    width: 40px;
    height: 40px;
    vertical-align: middle;
    font-size: 20px;
    text-align: center;
    cursor: pointer;
    position: relative;
}
.modal_top_menu_empty {
    display: table-cell;
    vertical-align: middle;
    width: 10px;
}
.cover_menu {
    display: table-cell;
    vertical-align: middle;
    width: 80px;
}
.cover_item_wrap {
    display: table;
    border-radius: 50px;
    overflow: hidden;
}
.cover_item {
    width: 40px;
    height: 30px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}
.modal_menu,
.tab_menu {
    font-size: 0px;
}
.profile_background {
    background-size: cover !important;
    background-position: 50% 50% !important;
}
.modal_menu ul li,
.tab_menu ul li {
    display: inline-block;
    padding: 10px 15px;
    cursor: pointer;
    font-size: 14px;
}
.hide_zone {
    display: none;
}
.modal_wrap_top {
    position: relative;
}
.profile_top {
    padding: 0 15px 15px 15px;
    position: relative;
    height: 100%;
}
.profile_avatar {
    display: table-cell;
    width: 130px;
    vertical-align: bottom;
    position: relative;
    border-radius: 5px;
    text-align: center;
}
.avatar_profile {
    width: 130px;
    height: 130px;
    cursor: pointer;
    display: block;
    border-radius: 5px;
}
.avatar_button {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    padding: 8px 0;
    position: relative;
}
.avatar_button_myself {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    position: relative;
}
.profile_tinfo {
    display: table-cell;
    vertical-align: bottom;
    padding: 0 10px;
    position: relative;
}
.pro_name {
    font-size: 25px;
    font-weight: bold;
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}
.pro_name_icon {
    width: 18px;
    height: 18px;
    display: block;
}
.pro_ranking {
    height: 15px;
    width: 15px;
}
.pro_mute {
    height: 15px;
    width: auto;
}
.pro_rank {
    font-size: 14px;
    margin-bottom: -3px;
    font-weight: bold;
    display: block;
}
.pro_mood {
    font-size: 12px;
    font-weight: bold;
}
.add_cover {
    position: relative;
}
.profile_info_box {
    font-size: 11px;
    padding: 10px 15px;
}
.level_profile {
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 7px 0;
}
.pro_flag {
    display: inline-block;
    height: 12px;
}
.proli {
    width: 160px;
}
.avatar_control {
    position: absolute;
    display: table;
    table-layout: fixed;
    width: 100%;
    z-index: 40;
    width: 80px;
    left: 27px;
    border-radius: 50px;
    bottom: 10px;
}
.avatar_spin {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    z-index: 30;
}

/* upload box css */
.up_input {
    -webkit-appearance: none;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    padding: 0px !important;
    overflow: hidden;
}

/* extra settings for first-child and last-child */
.list_element:first-child,
.post_element:first-child,
.gprofile_element:first-child,
.setting_element:first-child,
.news_element:first-child,
.store_step li:first-child,
.post_element:first-child,
.sub_list:first-child,
.sub_menu li:first-child,
.sub_list:first-child,
.status_list li:first-child,
.sub_menu_in li:first-child,
.chat_settings:first-child,
.background_reply:first-child,
.listing_elem:first-child,
.elem_in:first-child {
    border-top: none !important;
}
.list_element:last-child,
.post_element:last-child,
.gprofile_element:last-child,
.setting_element:last-child,
.news_element:last-child,
.post_element:last-child,
.store_step li:last-child,
.sub_menu li:last-child,
.sub_menu_in li:last-child,
.chat_settings:last-child,
.status_list li:last-child,
.listing_elem:last-child,
.background_reply:last-child,
.page_menu ul li:last-child,
.side_menu_content ul li:last-child,
.status_option:last-child,
.elem_in:last-child {
    border-bottom: none !important;
}
#container_user .list_element:nth-last-of-type(2),
#container_friends .list_element:nth-last-of-type(2) {
    border-bottom: none !important;
}
.admin_form {
    border-bottom: none !important;
}

/* listing element */
.listing_element {
    padding: 15px 10px;
}
.listing_half_element {
    padding: 15px 10px;
    width: calc(50% - 10px);
    float: left;
    margin: 0 5px;
}
.listing_title {
    font-weight: bold;
    padding-bottom: 3px;
}
.listing_text {
    font-size: 13px;
    word-wrap: break-word;
    min-height: 20px;
}
.listing_icon {
    width: 24px;
}

/* forced element overwrite */
.bwidth20 {
    width: 20%;
}
.bwidth25 {
    width: 25%;
}
.bwidth33 {
    width: 33%;
}
.bwidth50 {
    width: 50%;
}
.bwidth66 {
    width: 66%;
}
.bwidth100 {
    width: 100%;
}
.pwidth10 {
    width: 10px;
}
.pwidth20 {
    width: 20px;
}
.pwidth30 {
    width: 30px;
}
.pwidth40 {
    width: 40px;
}
.pwidth50 {
    width: 50px;
}
.pwidth60 {
    width: 60px;
}
.pwidth70 {
    width: 70px;
}
.pwidth80 {
    width: 80px;
}
.pwidth90 {
    width: 90px;
}
.pwidth100 {
    width: 100px;
}
.square20 {
    width: 20px;
    height: 20px;
}
.square30 {
    width: 30px;
    height: 30px;
}
.square40 {
    width: 40px;
    height: 40px;
}
.square50 {
    width: 50px;
    height: 50px;
}
.square60 {
    width: 60px;
    height: 60px;
}
.square70 {
    width: 70px;
    height: 70px;
}
.square80 {
    width: 80px;
    height: 80px;
}
.square90 {
    width: 90px;
    height: 90px;
}
.square100 {
    width: 100px;
    height: 100px;
}
.btauto {
    table-layout: auto;
}
.bcauto {
    width: 1%;
    white-space: nowrap;
}

/* help box */
.docu_box {
    border-radius: 3px;
    margin-bottom: 5px;
}
.docu_head {
    padding: 10px;
    cursor: pointer;
}
.noborder {
    border: none;
}
.docu_content {
    padding: 15px 0;
    display: none;
}
.docu_content_view {
    padding: 0;
}
.docu_content img,
.docu_content_view img {
    max-width: 100%;
}
.docu_list {
    margin: 0;
}
.docu_list li {
    width: 100%;
}
.docu_option_title {
    padding: 5px 10px;
    font-weight: bold;
    font-size: 13px;
}
.docu_option_description {
    padding: 5px 10px;
}
.docu_option_title {
}
.docu_option_description {
    font-size: 13px;
}
.docu_sub_list {
    padding: 10px;
    margin-left: 10px;
}
.docu_sub_list li {
    list-style: disc;
}
.docu_intro_text {
    font-size: 13px;
    padding: 10px;
}
.doc_zone {
    padding: 5px;
    margin-bottom: 10px;
    margin-top: 10px;
    font-weight: bold;
}
/* exception */
.docu_list li:last-child {
    border-bottom: none;
}
.docu_list li:first-child {
    border-top: none;
}

/* text colors */
#save_color {
    margin: 10px 0;
}
.button_color {
    width: 40%;
}
.color_switch {
    float: left;
    width: 12%;
    margin: 0.25%;
    position: relative;
    min-height: 40px;
    text-align: center;
}
.bccheck {
    font-size: 20px;
    color: #fff;
    margin-top: 9px;
}
#boldit {
    padding-left: 15px;
    padding-right: 15px;
    font-weight: bold;
    margin-top: 1px;
}
.bolded {
    font-weight: bold;
}
.open_player {
    color: #fff !important;
}

/* message error colors */
.saved_ok {
    background-color: rgba(0, 102, 0, 0.8);
    color: #fff;
}
.saved_error {
    background-color: rgba(255, 0, 0, 0.8);
    color: #fff;
}

.olay {
    background-color: rgba(0, 0, 0, 0.5);
    color: #fff;
}

/* store css added */
.avstore {
    width: 50px;
}
.store_edit {
    width: 30px;
}
.store_btn {
    margin-top: 5px;
    min-width: 100px;
    padding: 5px;
    border-radius: 3px;
}
.icon_large_container {
    width: 45px;
}
.icon_xlarge_container {
    width: 70px;
}
.icon_jumbo_container {
    width: 80px;
}
.icon_top_container {
    height: auto;
    width: 200px;
}
.icon_buy_container {
    height: 110px;
    width: 175px;
}
.icon_cover_container {
    max-width: 100%;
    height: 300px;
    width: 100%;
    object-fit: fill;
}
.icon_cover_container:hover {
    opacity: 0.8;
    transition: opacity 0.2s ease-in-out;
}
.icon_reg_container {
    width: 40px;
}
.icon_small_container {
    width: 36px;
}
.icon_xsmall_container {
    width: 28px;
}
.icon_xlarge {
    width: 64px;
    height: auto;
    border-radius: 5px;
    display: block;
}
.icon_jumbo {
    width: 70px;
    height: auto;
    border-radius: 5px;
    display: block;
}
.icon_large {
    width: 36px;
    height: auto;
    border-radius: 5px;
    display: block;
}
.icon_reg {
    width: 40px;
    height: auto;
    border-radius: 5px;
    display: block;
}
.icon_small {
    width: 36px;
    height: auto;
    border-radius: 50%;
    display: block;
}
.icon_xsmall {
    width: 28px;
    height: auto;
    border-radius: 50%;
    display: block;
}
.icon_item_large {
    width: 100px;
    height: 100px;
    border-radius: 50%;
}
.store_slide {
    max-width: 100%;
    height: auto;
    max-height: 420px;
    display: block;
    margin: 0 auto;
}
.slide_button {
    width: 50px;
    height: 40px;
    text-align: center;
}
.slide_button_left {
    border-radius: 50%;
    height: 50px;
    width: 50px;
    text-align: center;
    position: absolute;
    left: 5px;
    top: 45%;
    z-index: 10;
    opacity: 0;
}
.slide_button_right {
    border-radius: 50%;
    height: 50px;
    width: 50px;
    text-align: center;
    position: absolute;
    right: 5px;
    top: 45%;
    z-index: 10;
    opacity: 0;
}
.slide_content:hover .slide_button_right {
    opacity: 1;
}
.slide_content:hover .slide_button_left {
    opacity: 1;
}
.slide_content {
    position: relative;
}
.store_plan {
    width: 33%;
    height: 70px;
}
.plan_content {
    height: 100%;
}
.cart_btn {
    padding: 0px 5px 0 5px;
    border-radius: 20px;
}
.over_item:hover {
    background: #ededed;
    cursor: pointer;
}
.item_list {
    padding: 5px 15px;
}
.item_list li {
    list-style: disc;
    padding: 1px 0;
}
.opt_cell {
    width: 40px;
    text-align: center;
    font-size: 22px;
}
.modal_opt {
    width: 36px;
    height: 36px;
    text-align: center;
}
.price_cell {
    width: 60px;
}
.price_tag:before {
    content: "$";
    font-size: 11px;
    vertical-align: text-top;
}
.discount_cell {
    width: 120px;
}
.download_cell {
    width: 110px;
    text-align: right;
}
.discount_back {
    background: #012832;
    color: #fff;
}
.discount_text {
    font-family: "Arial Black", Gadget, sans-serif;
    text-shadow: 2px 2px 5px #000;
}
.discount_text2 {
    text-shadow: 2px 2px 5px #000;
}
.type_btn {
    padding: 2px 8px;
    border-radius: 20px;
}
.price_up {
    margin-top: -5px;
}
.item_btn {
    margin-right: 25px;
    font-size: 15px;
    float: left;
    line-height: 1.4em;
    margin-top: 10px;
    cursor: pointer;
    display: inline;
}
.empty_over {
    height: 2px;
    z-index: 1;
    margin-top: -2px;
    position: relative;
    margin-bottom: -2px;
}
#store_menu {
    height: auto;
    width: 100%;
    position: fixed;
    top: 50px;
    z-index: 3;
}
#store_menu_in {
    height: auto;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}
.store_li {
    float: left;
    position: relative;
    padding: 15px;
    font-weight: bold;
    cursor: pointer;
    font-size: 15px;
}
.store_li:hover {
    background: #012832;
}
.drop_addons {
    display: none;
    min-width: 180px;
    height: auto;
    position: absolute;
    padding: 0;
    left: 0;
    top: 100%;
}
.drop_sub {
    padding: 12px 12px;
    background: #023c4b;
}
.drop_sub:hover {
    background: #03add8;
}
.info_price {
    width: 70px;
}

.menu_info {
    display: inline-block;
    padding-right: 15px;
    font-weight: bold;
    font-size: 14px;
}

.lic_btn {
    width: 50px;
    font-size: 20px;
    text-align: center;
}
.lic_box {
    border-radius: 5px;
}

/* store news */
.store_news_title_block {
    margin-bottom: 10px;
}
.page_left .store_news_title {
    font-size: 16px !important;
    font-weight: 700;
    line-height: 1.2;
}
.page_left .store_news_title i {
    margin-right: 6px;
    font-size: 14px !important;
    vertical-align: middle;
}
.store_news_card {
    border-radius: 14px;
    padding: 12px;
    margin-bottom: 10px;
}
.store_news_head {
    display: flex;
    align-items: center;
    gap: 10px;
}
.store_news_avatar {
    width: 44px;
    min-width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
}
.store_news_avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.store_news_meta {
    flex: 1;
    min-width: 0;
}
.page_left .store_news_author {
    font-size: 13px !important;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 2px;
}
.page_left .store_news_date {
    font-size: 12px !important;
}
.store_news_divider {
    height: 1px;
    margin: 10px 0;
}
.store_news_body {
    font-size: 13px;
    line-height: 1.5;
    white-space: normal;
}
.store_news_body p {
    margin: 0 0 8px;
}
.store_news_body p:last-child {
    margin-bottom: 0;
}
.store_news_actions {
    margin-left: auto;
}
.news_delete_btn {
    padding: 5px 9px;
    border-radius: 14px;
    font-size: 11px;
}

@media screen and (max-width: 768px) {
    .store_plan {
        width: 50%;
    }
}

/* premium */
.premium_square {
    width: 18px;
    height: 18px;
    position: absolute;
    z-index: 2;
    bottom: 3px;
    left: 3px;
    border-radius: 50%;
    overflow: hidden;
}
.premium_square img {
    width: 18px;
    height: 18px;
}
.premium_profile {
    width: 20px;
    height: 20px;
    border-radius: 50%;
}

/* radius border for item */
.blist,
.blisting {
    border-radius: 0px;
}
.brad0 {
    border-radius: 0px;
}
.brad2 {
    border-radius: 2px;
}
.brad3 {
    border-radius: 3px;
}
.brad5 {
    border-radius: 5px;
}
.brad8 {
    border-radius: 8px;
}
.brad10 {
    border-radius: 10px;
}
.brad50 {
    border-radius: 50%;
}
.brad100 {
    border-radius: 200px;
}