@font-face {
    font-family: 'AmpleSoftPro Regular';
    src: url('../fonts/AmpleSoftPro-Regular.ttf');
}

@font-face {
    font-family: 'AmpleSoftPro Medium';
    src: url('../fonts/AmpleSoftPro-Medium.ttf')
}

@font-face {
    font-family: 'AmpleSoftPro Bold';
    src: url('../fonts/AmpleSoftPro-Bold.ttf')
}

* {
    box-sizing: border-box;
}

body {
    font-family: Arial;
    margin: 0px;
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
    supported by Chrome and Opera */
    background-color: #f0f4f7;
    overflow: hidden !important;
}

.dashboard {
    position: relative;
    width: var(--seg_width);
    height: var(--s_height);
    float: left;
    background-color: #f0f4f7;
    position: absolute;
    background-image: url(../images/grey_fusion_logo.svg);
    background-repeat: no-repeat;
    background-size: calc(calc(202/750) * var(--seg_width)) calc(calc(282/750) * var(--seg_width));
    background-position: center;
}

.dashboard.overlay::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: var(--s_height);
    background: rgba(0, 0, 0, 0.45);
    z-index: 9999;
}

.dashboard.dark {
    background-color: #2c2946;
    background-image: url(../images/dark_blue_fusion_logo.svg);
}

.fusion-logo {
    /* float: left; */
    width: calc(calc(202/750) * var(--seg_width));
    height: calc(calc(282/750) * var(--seg_width));
    margin-top: calc(calc(160/750) * var(--seg_width));
    margin-left: auto;
    margin-right: auto;
    background-image: url(images/white_fusion_logo.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.h-50 {
    display: flex;
    flex-direction: column;
    height: 50%;
}

.contents-h-50 {
    display: flex;
    flex-direction: column;
    height: 50%;
    overflow: hidden;
    overflow-y: auto;
}

.user_dashboard_shortcut_icon {
    -webkit-box-shadow: calc(calc(2/750) * var(--s_width)) calc(calc(2/750) * var(--s_width)) calc(calc(5/750) * var(--s_width)) 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: calc(calc(2/750) * var(--s_width)) calc(calc(2/750) * var(--s_width)) calc(calc(5/750) * var(--s_width)) 0px rgba(0, 0, 0, 0.2);
    box-shadow: calc(calc(2/750) * var(--s_width)) calc(calc(2/750) * var(--s_width)) calc(calc(5/750) * var(--s_width)) 0px rgba(0, 0, 0, 0.2);
    float: left;
    border-radius: calc(calc(34/750) * var(--s_width));
    margin-left: calc(calc(33/750) * var(--s_width));
    margin-top: calc(calc(33/750) * var(--s_width));
    color: white;
    height: calc(calc(147.5/750) * var(--s_width));
    width: calc(calc(147.5/750) * var(--s_width));
    cursor: pointer;
}

.user_dashboard_shortcut_icon_text {
    float: left;
    height: calc(calc(46/750) * var(--s_width));
    font-size: calc(calc(26/750) * var(--s_width));
    line-height: calc(calc(46/750) * var(--s_width));
    margin-top: calc(calc(146/750) * var(--s_width));
    text-align: center;
    width: calc(calc(147.5/750) * var(--s_width));
    overflow: hidden;
}

.community-icon,
.content-icon,
.content-community,
.payment-gateway,
.communication-icon,
.widget-content,
.community_icon {
    position: relative;
    background-color: white;
    width: calc(calc(210/750) * var(--seg_width));
    display: block;
    float: left;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    border-radius: calc(calc(45/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    background-color: #3d3b62;
    background-color: #ffffff;
    width: calc(calc(210/750) * var(--seg_width));
    height: fit-content !important;
}

.widget-content {
    display: none;
    width: calc(calc(690/750) * var(--seg_width));
    height: calc(calc(420/750) * var(--seg_width)) !important;
    overflow: hidden;
}

.communication-icon.pointer:after {
    float: left;
    position: absolute !important;
    content: '';
    width: calc(calc(30/750)* var(--seg_width));
    height: calc(calc(30/750)* var(--seg_width));
    top: calc(calc(46/750)* var(--seg_width));
    bottom: calc(calc(46/750)* var(--seg_width));
    right: calc(calc(30/750)* var(--seg_width));
    background-image: url('../images/grey_right_arrow.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.content_text {
    float: left;
    margin-top: calc(calc(22/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    font-family: Arial;
    font-size: calc(calc(26/750) * var(--seg_width)) !important;
    line-height: calc(calc(26/750) * var(--seg_width)) !important;
    font-weight: 600 !important;
    width: calc(calc(210/750) * var(--seg_width)) !important;
    height: auto !important;
    color: #414042;
}

.category_text {
    float: left;
    margin-top: calc(calc(22/750) * var(--seg_width)) !important;
    margin-bottom: calc(calc(22/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    margin-right: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    width: calc(calc(166/750) * var(--seg_width)) !important;
    color: #9d9fa2;
    font-size: calc(calc(22/750) * var(--seg_width)) !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.widget_content_wrap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: transparent;
}

.dashboard.dark .community-icon {
    background-color: #3d3b62 !important;
}

.payment-gateway.inactive:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.70);
    border-radius: calc(calc(45/750) * var(--seg_width));
    z-index: 2;
}

.linked-wallet,
.invite {
    display: block;
    float: left;
    width: var(--seg_width);
}

.linkwallets {
    flex-direction: row !important;
    flex-wrap: wrap;
    align-content: flex-start;
}

.invite-details,
.linked-wallet-details,
.unlinked-wallet-details {
    display: block;
    float: left;
    width: calc(calc(534/750) * var(--seg_width));
    height: calc(calc(250/750) * var(--seg_width));
    margin-left: calc(calc(33/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.unlinked-wallet-details {
    width: calc(calc(690/750) * var(--seg_width));
}

.linked-wallet .wallet_balance {
    display: block;
    float: left;
    width: calc(calc(401/750) * var(--seg_width)) !important;
    margin-top: calc(calc(33/750) * var(--seg_width)) !important;
    text-align: right;
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(40/750) * var(--seg_width)) !important;
}

.unlinked-wallet-details .cta-description {
    float: left;
    width: calc(calc(534/750) * var(--seg_width)) !important;
    margin-top: calc(calc(15/750) * var(--seg_width)) !important;
    margin-bottom: calc(calc(33/750) * var(--seg_width)) !important;
    margin-left: calc(calc(23/750) * var(--seg_width)) !important;
    font-size: calc(calc(30/750) * var(--seg_width)) !important;
    color: #a6a7aa;
}

.vmoola.wallet_balance {
    color: #e7623a !important;
}

.smartworld.wallet_balance {
    color: #379d47 !important;
}

.myimali.wallet_balance {
    color: #323264 !important;
}

.nedbank.wallet_balance {
    color: #02923b !important;
}

.poketmoney.wallet_balance {
    color: #5888D6 !important;
}

.linked-wallet .wallet_name {
    display: block;
    float: left;
    width: calc(calc(534/750) * var(--seg_width)) !important;
    margin-top: calc(calc(40/750) * var(--seg_width)) !important;
    margin-left: calc(calc(23/750) * var(--seg_width)) !important;
    font-size: calc(calc(34/750) * var(--seg_width)) !important;
    font-weight: 500 !important;
}

.linked-wallet .wallet_owner,
.unlinked-wallet-details .wallet_owner {
    display: block;
    float: left;
    width: calc(calc(534/750) * var(--seg_width)) !important;
    margin-top: calc(calc(40/750) * var(--seg_width)) !important;
    margin-left: calc(calc(23/750) * var(--seg_width)) !important;
    font-size: calc(calc(34/750) * var(--seg_width)) !important;
    font-weight: 600 !important;
    text-transform: capitalize;
}

.unlinked-wallet-details .wallet_owner {
    width: calc(calc(690/750) * var(--seg_width)) !important;
    margin-top: calc(calc(20/750) * var(--seg_width)) !important;
}

.linked-wallet .wallet_account_no {
    display: block;
    float: left;
    width: calc(calc(534/750) * var(--seg_width)) !important;
    margin-top: calc(calc(15/750) * var(--seg_width)) !important;
    margin-bottom: calc(calc(33/750) * var(--seg_width)) !important;
    margin-left: calc(calc(23/750) * var(--seg_width)) !important;
    font-size: calc(calc(30/750) * var(--seg_width)) !important;
    color: #a6a7aa;
}

.invite_buttons_container,
.wallet_button_container {
    display: block;
    float: left;
    width: calc(calc(117/750) * var(--seg_width));
    height: calc(calc(250/750) * var(--seg_width));
    margin-left: calc(calc(33/750) * var(--seg_width));
    margin-right: calc(calc(33/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.community-icon .icon,
.community_icon .icon,
.communication-icon .icon,
.content-icon .icon,
.payment-gateway .wallet_icon {
    float: left;
    display: inline-block;
    width: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-left: calc(calc(22/750) * var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
    position: relative;
}

.content-badge {
    position: absolute;
    top: 0;
    right: calc(calc(-18/750)* var(--seg_width));
    background-color: #f44336;
    border-radius: calc(calc(30/750)* var(--seg_width));
    min-width: calc(calc(45/750)* var(--seg_width));
    height: calc(calc(45/750)* var(--seg_width));
    font-size: calc(calc(26/750)* var(--seg_width));
    line-height: calc(calc(45/750)* var(--seg_width));
    color: #ffffff;
    text-align: center;
    justify-content: center;
}

.content-badge.green {
    background-color: #4caf50;
}

.community-icon .community-name,
.community_icon .community-name,
.payment-gateway .wallet_name {
    margin-top: calc(calc(146/750) * var(--seg_width));
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    font-family: Arial;
    font-size: calc(calc(26/750) * var(--seg_width)) !important;
    line-height: calc(calc(26/750) * var(--seg_width)) !important;
    font-weight: 600 !important;
    width: calc(calc(210/750) * var(--seg_width)) !important;
    height: auto !important;
    color: #414042;
}

.dashboard.dark .community-icon .community-name {
    color: #ffffff;
}

.community-icon .community-category,
.community_icon .community-category,
.payment-gateway .wallet_category {
    float: left;
    margin-top: calc(calc(22/750) * var(--seg_width)) !important;
    margin-bottom: calc(calc(22/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    margin-right: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    width: calc(calc(166/750) * var(--seg_width)) !important;
    color: #9d9fa2;
    font-size: calc(calc(22/750) * var(--seg_width)) !important;
    height: fit-content !important;
}

.wallet_icon {
    float: left;
    display: inline-block;
    width: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-left: calc(calc(22/750) * var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
}

#add_community {
    background-color: #05D4FB;
    background-image: url('https://www.vmoola.mobi/src/images/add_community.svg');
    width: calc(calc(147.5/750) * var(--s_width));
    display: block;
    margin-top: calc(calc(250/750)* var(--s_width));
    float: left;
}

#dashboard,
.community-dashboard {
    width: var(--s_width) !important;
    height: var(--s_height);
    float: left;
}

#community_placeholder {
    width: 100%;
    height: 100%;
    float: left;
    display: none;
}

.communities_container,
.groups_container {
    width: var(--s_width);
    height: var(--s_height);
    float: left;
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 999;
    display: none;
}


/* .communities_container:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 888;
} */

.groups_container {
    background: #ffffff;
}

.scan_and_pay {
    background-color: #FF8100;
    background-image: url('https://www.vmoola.mobi/src/images/scan_and_pay.svg');
    width: calc(calc(147.5/750) * var(--s_width));
    display: block;
    margin-bottom: calc(calc(33/750) * var(--s_width));
    float: left;
}

.validation_bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 8px 5px;
    background-color: transparent;
    z-index: 1000000012;
    -webkit-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    font-family: Arial;
    color: #ffffff;
    font-size: 13.866666666667px;
    text-align: center;
    justify-content: center;
    display: none;
    text-decoration: none;
    background-color: #04d5fb !important;
}

.page {
    position: fixed;
    float: left;
    flex-direction: column;
    width: var(--seg_width);
    height: var(--s_height);
    top: 0;
    right: 0;
    bottom: 0;
    display: none;
    z-index: 999;
}

.community-page,
.group-page {
    flex-direction: column;
    background-color: #ffffff;
    position: absolute;
    float: left;
    width: var(--s_width);
    height: var(--s_height);
    z-index: -1;
    /* transition: all 110ms ease; */
}

.group-view {
    background-color: #ffffff;
    width: var(--s_width);
    height: calc(var(--s_height) - calc(178/750 * var(--s_height)));
    overflow: hidden;
    overflow-y: scroll;
}

.page.content-loading {
    width: var(--s_width) !important;
    height: var(--s_height);
    text-align: center;
    z-index: 1000000012 !important;
}

.communty-contents,
.community-page,
.community-management-page,
.community-dashboard-reorder-page {
    background-color: #ffffff;
}

.community-management-heading {
    color: #8bc34a;
}

.community-management-description {
    float: left;
    width: calc(calc(630/750) * var(--seg_width));
    font-size: calc(calc(23/750) * var(--seg_width));
    line-height: calc(calc(26/750) * var(--seg_width));
    margin-top: calc(calc(0/750)* var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    color: #9d9fa2;
}

.community-management-contents,
.community-dashboard-reorder-contents {
    display: flex;
    flex-direction: row !important;
    flex-wrap: wrap;
    align-content: flex-start;
    width: var(--seg_width);
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

.community-management-close-button {
    display: flex;
    justify-content: center;
    font-size: calc(calc(36/750) * var(--seg_width));
    width: var(--seg_width);
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    background: #8bc34a;
    color: #ffffff;
}

.page.home {
    display: none;
    background-color: #f0f4f7;
    background-image: url(../images/fusion_bg.svg);
    background-size: cover;
    background-position: center top;
    width: var(--s_width) !important;
    height: var(--s_height);
}

.page.invites,
.page.plugins,
.page.profile,
.page.communication,
.page.console,
.page.communication-group {
    background-color: #ffffff;
}

.page.plugins {
    z-index: 999999998;
}

.page.options,
.page.components {
    width: var(--seg_width) !important;
    height: var(--s_height);
    z-index: 999999999;
    background-color: #ffffff;
    overflow: hidden !important;
}

.page.components {
    flex-direction: column;
    position: fixed !important;
    top: 0;
    right: 0;
    bottom: 0;
}

.component {
    position: fixed;
    flex-direction: column;
    top: 0;
    width: var(--seg_width) !important;
    height: var(--s_height) !important;
    background-color: #ffffff;
    overflow: hidden !important;
}

.component iframe {
    width: var(--seg_width) !important;
    height: var(--s_height) !important;
}

.page.signup,
.page.options,
.page.forgot-password,
.page.forgot-password-opt,
.page.forgot-password-reset {
    margin-left: calc(calc(var(--s_width) - var(--seg_width)) / 2);
    margin-right: calc(calc(var(--s_width) - var(--seg_width)) / 2);
}

.page.options.stick-right {
    position: fixed;
    right: 0 !important;
    margin: auto !important;
}

.page.communication {
    width: var(--seg_width) !important;
}

.page.media,
.page.fusion-pin-set-request,
.forgotten-password-wrap {
    background-color: #ffffff;
}

.plugin {
    z-index: 999999999;
}

.page.media-search-results {
    position: relative;
    background-color: #ffffff;
    /* z-index: 999999; */
}

.page.signup,
.page.browser,
.page.wallet,
.page.linkwallet,
.page.directory,
.page.community-setting,
.page.content-loading {
    background-color: #ffffff;
}

.page.wallet {
    background-color: #f0f4f7;
}

.page.signup {
    display: none;
}

.page.menu.dark {
    background-color: #2c2946;
}

.page.menu.dark .fusion-theme {
    color: #ffffff;
}

.page .header {
    position: absolute;
    top: 0;
    max-width: var(--s_width);
    width: 100%;
    padding: 12px;
    z-index: 999999;
}

.page .header .menu-button {
    text-decoration: none;
    color: #b9b9b9;
    font-weight: 700;
}

.page-bottom-button {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: var(--seg_width);
    background-color: #04d5fb;
    color: #ffffff;
    text-align: center;
    line-height: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
}

.form-dialog {
    display: flex;
    height: 70%;
    position: fixed;
    /* top: calc(calc(375/750) * var(--s_height)); */
    top: auto;
    left: 0;
    right: 0;
    bottom: 0;
    width: var(--seg_width);
    /* height: calc(calc(375/750) * var(--s_height)); */
    background-color: #ffffff;
    -webkit-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    -moz-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    -ms-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    margin: 0 auto;
}

.form-row {
    float: left;
    position: relative;
}

.form-row.mobile-email {
    display: flex;
}

input[type="text"],
input[type="tel"],
input[type="password"] {
    border: transparent;
    width: 100%;
}

input[type="tel"]:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="checkbox"]:focus {
    outline: none;
}

input[type="checkbox"] {
    vertical-align: middle;
}


/* button {
-webkit-appearance: none;
border: 1px solid transparent;
border-radius: 20px;
background-color: #0c0d23;
color: #ffffff;
padding: 4%;
width: 100%;
margin-top: 5%;
}

button:focus,
button:active {
outline: none;
} */

.div-50 {
    float: left;
    width: 49.9%;
}

.div-50:nth-child(2) {
    text-align: right;
}

.secondary {
    background-color: #04d5fb !important;
}

a {
    text-decoration: none;
}

.font-adjust {
    font-size: 90%;
    vertical-align: middle;
}

.media,
.menu {
    background-color: #fafafa;
}

.community-dashboard,
.communities-dashboard,
.communities-order-dashboard,
.linkedwallets {
    float: left;
    width: var(--s_width);
    height: var(--s_height);
    overflow: hidden;
    overflow-y: auto;
    z-index: 999;
}

.community-dashboard,
.communities-dashboard {
    position: relative;
    flex-wrap: wrap;
    align-content: flex-start;
    z-index: 999;
}

.community-dashboard .community-icon,
.communities-dashboard .community-icon {
    height: fit-content !important;
}

.communities-dashboard {
    height: calc(var(--s_height) - calc(283/750 * var(--seg_width))) !important;
}

.nav {
    position: absolute;
    width: var(--seg_width);
    height: calc(calc(118/750) * var(--seg_width));
    bottom: calc(calc(30/750) * var(--seg_width));
    left: calc(calc(30/750) * var(--seg_width));
    right: calc(calc(30/750) * var(--seg_width));
    margin: 0 auto;
    z-index: 999;
    /* transition: all 110ms ease; */
}

.nav.dark .standard-nav-wrap {
    background-color: #3d3b62 !important;
}

.standard-nav-wrap {
    display: block;
    float: left;
    width: calc(calc(542/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    border-radius: calc(calc(59/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.standard-nav-wrap.add-on {
    display: block;
    float: left;
    width: calc(calc(542/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    border-radius: calc(calc(59/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.main-nav-wrap {
    display: block;
    float: left;
    width: calc(calc(130/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    border-radius: calc(calc(45/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.nav-button {
    width: calc(calc(180.6/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    float: left;
    font-size: calc(calc(26/750) * var(--seg_width));
    line-height: calc(calc(26/750) * var(--seg_width));
    text-align: center;
    vertical-align: middle;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.nav-button[data-page="minimize"] {
    display: none;
}

.standard-nav-wrap.add-on .nav-button {
    width: calc(calc(135.5/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    float: left;
    font-size: calc(calc(26/750) * var(--seg_width));
    line-height: calc(calc(26/750) * var(--seg_width));
    text-align: center;
    vertical-align: middle;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.nav-button.onq-button {
    width: calc(calc(118/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    line-height: calc(calc(118/750) * var(--seg_width));
    margin-top: 0px;
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
    background: transparent !important;
    border-radius: calc(calc(59/750) * var(--seg_width));
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.icon {
    width: calc(calc(30/750) * var(--seg_width));
    height: calc(calc(35/750) * var(--seg_width));
    background-size: contain;
    background-repeat: no-repeat;
}

.menu-icon {
    display: block;
    text-align: center;
    margin: 0 auto;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    background-image: url('../images/blue_menu_icon.svg');
}

.nav.dark .menu-icon {
    background-image: url('../images/white_menu_icon.svg');
}

.minimize-icon {
    display: block;
    text-align: center;
    margin: 0 auto;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    background-image: url('../images/blue_back_icon.svg');
}

.nav.dark .minimize-icon {
    background-image: url('../images/white_back_icon.svg');
}

.search-icon {
    display: block;
    text-align: center;
    margin: 0 auto;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    background-image: url('../images/blue_search_icon.svg');
}

.nav.dark .search-icon {
    background-image: url('../images/white_search_icon.svg');
}

.wallet-icon {
    display: block;
    text-align: center;
    margin: 0 auto;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    /* width: calc(calc(60/750) * var(--seg_width));
    height: calc(calc(60/750) * var(--seg_width)); */
    background-image: url('../images/blue_wallet_icon.svg');
    /* background-image: url('./images/fpay_icon.svg'); */
}

.nav.dark .wallet-icon {
    background-image: url('../images/white_wallet_icon.svg');
}

.fusion-icon {
    display: block;
    text-align: center;
    margin: calc(calc(0/750) * var(--seg_width)) auto;
    width: calc(calc(118/750) * var(--seg_width));
    height: calc(calc(118/750) * var(--seg_width));
    background-image: url('../images/onq_icon.svg');
    border-radius: calc(calc(45/750) * var(--seg_width));
}

.user-profile {
    padding: 10px 0 0 10px;
    background-color: #efefef;
    margin-top: 0;
}

.user-icon {
    display: inline-block;
    width: calc(calc(80/750) * var(--s_width));
    height: calc(calc(80/750) * var(--s_width));
    background-image: url('../images/user-icon.svg');
}

.menu-card,
.profile-card {
    float: left;
    width: calc(calc(690/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-right: calc(calc(30/750) * var(--seg_width));
    border-radius: calc(calc(25/750) * var(--seg_width));
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.10);
    margin-top: calc(calc(60/750) * var(--seg_width));
    /* overflow-x: hidden; */
}

.menu.dark .menu-card {
    background-color: #3d3b62
}

.menu-items,
.profile-items {
    list-style: none;
    padding: 0;
    margin: 0;
}

.dev-menu {
    display: none;
}

.heading-item {
    font-weight: 600;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    padding: 12px 0;
}

.menu-item,
.profile-item,
.community-item,
.directory-item {
    position: relative;
    float: left;
    width: calc(calc(690/750) * var(--seg_width));
    /* border-bottom: 1px solid rgba(0, 0, 0, 0.05); */
}

.community-item,
.directory-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.directory-item {
    width: var(--seg_width);
}

.menu-item:first-child .profile-item:first-child {
    border-radius: calc(calc(25/750) * var(--seg_width)) calc(calc(25/750) * var(--seg_width)) 0 0;
}

.menu-item:last-child,
.profile-item:last-child {
    border-radius: 0 0 calc(calc(25/750) * var(--seg_width)) calc(calc(25/750) * var(--seg_width));
}

.menu-item:after,
.profile-item:after {
    position: absolute;
    content: '';
    background-image: url(../images/grey_right_arrow.svg);
    background-repeat: no-repeat;
    background-size: contain;
    float: left;
    width: calc(calc(30/750) * var(--seg_width));
    height: calc(calc(30/750) * var(--seg_width));
    top: calc(calc(32/750) * var(--seg_width));
    bottom: calc(calc(32/750) * var(--seg_width));
    right: calc(calc(30/750) * var(--seg_width));
}

.menu-item.no-arrow:after {
    position: absolute;
    content: '';
    background-image: none;
    float: left;
    width: calc(calc(30/750) * var(--seg_width));
    height: calc(calc(30/750) * var(--seg_width));
    top: calc(calc(30/750) * var(--seg_width));
    bottom: calc(calc(30/750) * var(--seg_width));
    right: calc(calc(30/750) * var(--seg_width));
}

.profile-item.no-pointer:after {
    content: '';
    background-image: none;
}

.menu-item:not(:last-child):before,
.profile-item:not(:last-child):before {
    position: absolute;
    content: '';
    float: left;
    width: calc(calc(580/750) * var(--seg_width));
    height: calc(calc(30/750) * var(--seg_width));
    left: calc(calc(110/750) * var(--seg_width));
    right: 0;
    bottom: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.menu.dark .menu-item:not(:last-child):before {
    border-bottom: 1px solid #545274;
}

.invites-view .community_icon,
.communities-view .community_icon,
.directory-view .community_icon {
    float: left;
    width: calc(calc(70/750) * var(--seg_width));
    height: calc(calc(70/750) * var(--seg_width)) !important;
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-bottom: calc(calc(22/750) * var(--seg_width));
    background-repeat: no-repeat;
    background-size: contain;
    box-shadow: none !important;
    border-radius: calc(calc(0/750) * var(--seg_width)) !important;
}

.invites-view .community_name,
.communities-view .community_name,
.directory-view .community_name {
    float: left;
    margin-top: calc(calc(28/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    width: calc(calc(450/750) * var(--seg_width));
    font-size: calc(calc(30/750) * var(--seg_width));
    line-height: calc(calc(30/750) * var(--seg_width));
    font-weight: 600;
    color: #4c4b4d;
}

.community_name.none {
    margin-top: calc(calc(42/750) * var(--seg_width)) !important;
}

.invites-view .community_name,
.invites-view .community_category {
    float: left;
    margin-top: calc(calc(28/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    width: calc(calc(690/750) * var(--seg_width));
    font-size: calc(calc(28/750) * var(--seg_width));
    line-height: calc(calc(28/750) * var(--seg_width));
}

.invites-view .community_category {
    margin-top: calc(calc(18/750) * var(--seg_width));
    margin-bottom: calc(calc(28/750) * var(--seg_width));
    color: #989a9d;
}

.communities-view .community_members,
.directory-view .community_members {
    float: left;
    margin-top: calc(calc(18/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(28/750) * var(--seg_width));
    width: calc(calc(290/750) * var(--seg_width));
    font-size: calc(calc(22/750) * var(--seg_width));
    line-height: calc(calc(22/750) * var(--seg_width));
    color: #989a9d;
}

.directory_button,
.default_community_button {
    float: right;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    margin-top: calc(calc(38/750) * var(--seg_width));
    margin-bottom: calc(calc(38/750) * var(--seg_width));
    margin-right: calc(calc(29/750) * var(--seg_width));
    background-repeat: no-repeat;
}

.default_community_button {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('../images/unchecked_icon.svg');
    background-size: contain;
    background-repeat: no-repeat;
}

.default_community_button:checked {
    background-image: url('../images/checked_icon.svg');
    background-size: contain;
}

._directory-item ._community_icon,
.content-item .community_icon {
    border-radius: calc(calc(14/750) * var(--seg_width));
    width: calc(calc(100/750) * var(--seg_width)) !important;
    height: calc(calc(100/750) * var(--seg_width)) !important;
    display: block;
    margin-right: calc(calc(20/750) * var(--seg_width)) !important;
    float: left;
    background-repeat: no-repeat;
}

.content-item .community_icon {
    background-color: #efefef !important;
}

._directory-item ._community_name,
.content-item .community_name {
    float: left;
    font-size: calc(calc(30/750) * var(--seg_width)) !important;
    margin-top: calc(calc(35/750) * var(--seg_width)) !important;
    width: calc(calc(320/750) * var(--seg_width));
}

.payment-gateway .wallet_name,
.linked-wallet .wallet_name,
.linked-wallet .wallet_owner,
.linked-wallet .wallet_balance {
    color: #000000;
}

._directory-item,
.content-item {
    float: left;
    width: var(--seg_width);
    padding: calc(calc(20/750) * var(--seg_width)) calc(calc(10/750) * var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}


/* .payment-gateway {
width: <?php //echo(((690/750) * var(--s_width)) !important;
margin-left: <?php //echo(((30/750) * var(--s_width)) !important;
margin-right: <?php //echo(((30/750) * var(--s_width)) !important;
border-radius: <?php //echo(((20/750)*$screen_width));
?>px;
} */

.invite,
.linked-wallet {
    margin-top: calc(calc(33/750) * var(--seg_width)) !important;
}

._directory_button
/* ,
.wallet_button */

{
    margin-top: calc(calc(25/750) * var(--s_width));
    width: calc(calc(240/750) * var(--s_width));
    height: calc(calc(60/750) * var(--s_width));
    line-height: calc(calc(60/750) * var(--s_width));
    border-radius: calc(calc(35/750) * var(--s_width));
    font-size: calc(calc(32/750) * var(--s_width));
    color: #ffffff;
    text-align: center;
    float: left;
}

.wallet_button.unlink {
    background-image: url('../images/remove_account_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.wallet_button.link {
    background-image: url('../images/blue_wallet_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.invite_button,
.wallet_button {
    margin-left: calc(calc(33/750) * var(--seg_width));
    margin-right: calc(calc(33/750) * var(--seg_width));
    margin-top: calc(calc(49.33/750) * var(--seg_width));
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    color: #000000;
}

._directory_button {
    display: block;
    width: auto;
    height: calc(calc(60/750) * var(--s_width));
    margin-top: calc(calc(22/750) * var(--s_width)) !important;
    font-size: calc(calc(28/750) * var(--s_width)) !important;
    float: right;
}

.contents_button {
    width: auto;
    margin-top: calc(calc(22/750) * var(--seg_width)) !important;
    font-size: calc(calc(28/750) * var(--seg_width)) !important;
    float: right;
}

.contents_button {
    margin-top: calc(calc(35/750) * var(--seg_width)) !important;
    margin-right: calc(calc(10/750) * var(--seg_width)) !important;
}

.invite_button.accept {
    background-image: url('../images/accept_invite_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: calc(calc(10/750) * var(--seg_width));
}

.directory_button.join {
    background-image: url('../images/join_community_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.directory_button.leave {
    background-image: url('../images/leave_community_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.invite_button.decline {
    background-image: url('../images/reject_invite_icon.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.setting-icon {
    float: left;
    width: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-bottom: calc(calc(22/750) * var(--seg_width));
    background-repeat: no-repeat;
}

.setting-icon.user {
    background-image: url('../images/blue_profile_icon.svg');
}

.setting-icon.user.dark {
    background-image: url('../images/white_profile_icon.svg');
}

.setting-icon.theme {
    background-image: url('../images/blue_theme_icon.svg');
}

.setting-icon.theme.dark {
    background-image: url('../images/white_theme_icon.svg');
}

.setting-icon.invites-icon {
    background-image: url('../images/blue_invite_icon.svg');
}

.setting-icon.invites-icon.dark {
    background-image: url('../images/white_invite_icon.svg');
}

.setting-icon.community {
    background-image: url('../images/blue_launch_icon.svg');
}

.setting-icon.my-communities {
    background-image: url('../images/blue_community_search_icon.svg');
}

.setting-icon.community.dark {
    background-image: url('../images/white_launch_icon.svg');
}

.setting-icon.pin {
    background-image: url('../images/password_icon.svg');
}

.setting-icon.dob {
    background-image: url('../images/birthday_icon.svg');
}

.setting-icon.gender {
    background-image: url('../images/gender_icon.svg');
}

.setting-name {
    float: left;
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(22/750) * var(--seg_width));
    width: calc(calc(310/750) * var(--seg_width));
    font-size: calc(calc(30/750) * var(--seg_width));
    line-height: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #4c4b4d;
}

.setting-name.dark {
    color: #ffffff;
}

.setting-description {
    float: left;
    width: calc(calc(200/750) * var(--seg_width));
    font-size: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-bottom: calc(calc(22/750) * var(--seg_width));
    line-height: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    text-align: right;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #989a9d;
}

.setting-description input[type="text"] {
    float: left;
    width: calc(calc(200/750) * var(--seg_width));
    font-size: calc(calc(30/750) * var(--seg_width));
    line-height: calc(calc(50/750) * var(--seg_width));
    height: calc(calc(50/750) * var(--seg_width));
    text-align: right;
    color: #989a9d;
}

.setting-check {
    float: right;
}

.close-icon {
    display: block;
    text-align: center;
    margin: 8px 5px 0 0;
    width: 28px;
    height: 33px;
    background-image: url('../images/close-icon.svg');
    float: right;
}

.directory-search-wrapper,
.media-search-wrapper {
    position: absolute;
    float: left;
    max-width: calc(calc(92/750) * var(--seg_width));
    width: 100%;
    margin: 0 auto;
    bottom: calc(calc(295/750) * var(--seg_width));
    left: calc((100% - calc(calc(295/750) * var(--seg_width))) / 2);
    text-align: center;
}

.directory-view {
    float: left;
    width: calc(calc(690/750) * var(--seg_width));
    width: calc(calc(750/750) * var(--seg_width));
    /* height: calc(var(--s_height) - calc((300/750) * var(--s_height))); */
    height: calc(var(--s_height) - calc((360/750) * var(--seg_width)));
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.communities-view {
    float: left;
    width: calc(calc(690/750) * var(--seg_width));
    height: calc(var(--s_height) - calc((360/750) * var(--s_height)));
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.communication-group-view,
.communication-view {
    float: left;
    width: var(--seg_width);
    height: calc(var(--s_height) - calc((325/750) * var(--seg_width)));
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.menu-view {
    float: left;
    display: flex;
    flex-direction: column;
    width: var(--seg_width);
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.contents {
    display: flex;
    flex-direction: column;
    width: var(--seg_width);
    height: 100%;
    margin: 0 auto;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.signin-heading,
.wallet-heading {
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(60/750) * var(--seg_width));
    color: #0073ff;
    margin-top: calc(calc(60/750) * var(--seg_width));
    margin-left: calc(calc(60/750) * var(--seg_width));
    margin-bottom: calc(calc(60/750) * var(--seg_width));
}

.onq-heading {
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(60/750) * var(--seg_width));
    color: #0073ff;
    margin-top: calc(calc(60/750) * var(--seg_width));
    margin-left: calc(calc(60/750) * var(--seg_width));
}

.fusion-heading,
.wallet-heading {
    float: left;
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(45/750) * var(--seg_width));
    line-height: calc(calc(45/750) * var(--seg_width));
    color: #0073ff;
    width: calc(calc(690/750) * var(--s_width));
    margin-top: calc(calc(90/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-right: calc(calc(30/750) * var(--seg_width));
}

.fusion-sort-button {
    float: right;
    font-size: calc(calc(26/750) * var(--seg_width));
    line-height: calc(calc(45/750) * var(--seg_width));
    color: #989a9d;
}

.dashboard.dark .fusion-theme {
    color: #ffffff;
}

.fusion-description,
.community-description,
.invites-description,
.wallet-description {
    float: left;
    font-family: 'Arial';
    font-size: calc(calc(32/750) * var(--seg_width));
    line-height: calc(calc(42/750) * var(--seg_width)) !important;
    color: #4c4b4d;
    width: calc(calc(690/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.forgot-password-description,
.forgot-password-opt-description {
    float: left;
    font-family: 'Arial';
    font-size: calc(calc(32/750) * var(--seg_width));
    line-height: calc(calc(32/750) * var(--seg_width));
    color: #4c4b4d;
    width: calc(calc(690/750) * var(--seg_width));
    margin-left: calc(calc(60/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.media-tag-results-popup,
.media-tag-popup,
.fusion-pin-set-popup,
.fusion-pin-request-popup,
.fusion-audio-stream-popup {
    display: flex;
    flex-direction: column;
    width: var(--seg_width);
    height: 50%;
    background-color: #ffffff;
    -webkit-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    -moz-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    -ms-box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
    box-shadow: 0 4px 12px rgb(0 0 0 / 50%);
}

.media-tag-popup>* {
    display: flex;
}

.media-tag-results-popup-overlay,
.fusion-pin-request-popup-overlay,
.fusion-pin-set-popup-overlay,
.fusion-about-popup-overlay,
.fusion-audio-stream-overlay {
    flex-direction: column;
    background-color: rgba(0, 0, 0, 0.55);
    position: fixed;
    width: var(--seg_width);
    top: 0;
    bottom: 0;
    z-index: 999;
    display: none;
}

.fusion-audio-stream-overlay {
    justify-content: end;
}

.media-tag-heading,
.fusion-about-heading,
.fusion-pin-heading {
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(60/750) * var(--seg_width));
    color: #0073ff;
    margin-top: calc(calc(66/750) * var(--seg_width));
    margin-left: calc(calc(66/750) * var(--seg_width));
    margin-bottom: calc(calc(46/750) * var(--seg_width));
}

.media-tag-results-message,
.fusion-about-message,
.fusion-pin-message {
    font-size: calc(calc(33/750) * var(--seg_width));
    font-weight: 500;
    color: #464547;
    margin-top: calc(calc(66/750) * var(--seg_width));
    margin-left: calc(calc(66/750) * var(--seg_width));
    margin-right: calc(calc(66/750) * var(--seg_width));
    margin-bottom: calc(calc(46/750) * var(--seg_width));
}

.fusion-about-message {
    margin-top: 0;
    height: calc(calc(375/750) * var(--s_height) - calc((230/750) * var(--s_height)));
    overflow-y: auto;
}

.fusion-pin-set-popup,
.fusion-pin-request-popup {
    height: 50% !important;
}

.media_tag_input,
.text_input {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: calc(calc(630/750) * var(--seg_width)) !important;
    height: calc(calc(86/750) * var(--seg_width)) !important;
    margin-left: calc(calc(60/750) * var(--seg_width)) !important;
    margin-right: calc(calc(60/750) * var(--seg_width)) !important;
    border-radius: 0 !important;
    border-bottom: 2px solid #a1a1a2 !important;
    line-height: calc(calc(86/750) * var(--seg_width)) !important;
    font-size: calc(calc(32/750) * var(--seg_width)) !important;
}

.media_tag_input_wrap {
    display: flex;
    align-items: end;
}

.media_tag_input {
    width: calc(calc(430 / 750) * var(--seg_width)) !important;
    margin-right: calc(calc(30 / 750) * var(--seg_width)) !important;
}

.media_tag_input:focus {
    outline: none;
}

.media_tag_search_button {
    display: flex;
    width: calc(calc(180 / 750) * var(--seg_width));
    height: calc(calc(70 / 750) * var(--seg_width));
    line-height: calc(calc(70 / 750) * var(--seg_width));
    border-radius: calc(calc(70 / 750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(32 / 750) * var(--seg_width));
    color: #ffffff;
    justify-content: center;
    align-items: center;
}

#user_password {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: calc(calc(630/750) * var(--seg_width));
    height: calc(calc(86/750) * var(--seg_width)) !important;
    margin-left: calc(calc(60/750) * var(--seg_width));
    margin-right: calc(calc(60/750) * var(--seg_width));
    border-radius: 0 !important;
    border-bottom: 2px solid #a1a1a2 !important;
    line-height: calc(calc(86/750) * var(--seg_width)) !important;
    font-size: calc(calc(32/750) * var(--seg_width)) !important;
}

#mobile_or_email,
.user-mobile-number {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: calc(calc(498/750) * var(--seg_width)) !important;
    height: calc(calc(86/750) * var(--seg_width)) !important;
    margin-left: calc(calc(15/750) * var(--seg_width)) !important;
    margin-right: calc(calc(0/750) * var(--seg_width)) !important;
    border-radius: 0 !important;
    /* border-bottom: 2px solid #a1a1a2 !important; */
    line-height: calc(calc(86/750) * var(--seg_width)) !important;
    font-size: calc(calc(32/750) * var(--seg_width)) !important;
}

.country_input {
    float: left;
    display: flex;
    text-align: right;
    width: calc(calc(120/750) * var(--seg_width)) !important;
    margin-right: calc(calc(15/750) * var(--seg_width)) !important;
}

.user-country-code {
    float: left;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: var(--seg_width);
    height: calc(calc(86/750) * var(--seg_width)) !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #a1a1a2 !important;
    line-height: calc(calc(86/750) * var(--seg_width)) !important;
    font-size: calc(calc(32/750) * var(--seg_width)) !important;
    text-align: left;
}

.mobile_input_wrap {
    display: flex;
    margin: 0 calc(calc(60/750) * var(--seg_width));
    width: calc(calc(690 / 750) * var(--seg_width));
    border-bottom: 2px solid #a1a1a2 !important;
}

.mobile_input_wrap .mobile_input {
    border-bottom: 0 none transparent !important;
}

.mobile_country_flag {
    display: flex;
    width: calc(calc(50 / 750) * var(--seg_width));
    height: calc(calc(60 / 750) * var(--seg_width));
    margin-top: calc(calc(5 / 750) * var(--seg_width));
    background-image: url('../images/flags/south-africa_flag-eps-round.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center bottom;
}

.mobile_input {
    float: left;
    display: flex;
}

.profile_mobile_input_wrap {
    display: flex;
    width: 100%;
    border-bottom: 1px solid #a1a1a2;
}

.profile_mobile_input_wrap .profile_mobile {
    border-bottom: 0 none transparent !important;
}

.directory_search,
.communities_search,
.communications_search,
.communications_group_search {
    float: left;
    width: calc(calc(690/750) * var(--seg_width)) !important;
    padding: calc(calc(30/750) * var(--seg_width)) !important;
    font-size: calc(calc(30/750) * var(--seg_width));
    line-height: calc(calc(30/750) * var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

.communications_search,
.directory_search {
    width: calc(calc(750/750) * var(--seg_width)) !important;
}

.transparent_text_input {
    width: calc(calc(630/750) * var(--s_width)) !important;
    height: calc(calc(86/750) * var(--s_width)) !important;
    margin-left: calc(calc(60/750) * var(--s_width)) !important;
    margin-right: calc(calc(60/750) * var(--s_width)) !important;
    border-bottom: 0 none transparent !important;
    line-height: calc(calc(86/750) * var(--s_width)) !important;
    font-size: calc(calc(32/750) * var(--s_width)) !important;
}

.transparent_text_input[readonly] {
    background-color: #ffffff;
}

.clear-button {
    position: absolute;
    float: right;
    top: calc(calc(-32/750) * var(--seg_width));
    right: calc(calc(70/750) * var(--seg_width));
    font-size: calc(calc(32/750) * var(--s_width)) !important;
    line-height: calc(calc(86/750) * var(--s_width)) !important;
    height: calc(calc(86/750) * var(--s_width)) !important;
    margin-top: -calc(calc(86/750) * var(--s_width)) !important;
    margin-right: calc(calc(60/750) * var(--s_width)) !important;
    color: #0073ff;
    display: none;
}

.community_code {
    margin-top: calc(calc(90/750) * var(--seg_width));
}

.setup-buttons,
.wallet-buttons,
.media-tag-buttons,
.fusion-pin-buttons,
.fusion-pin-set-buttons,
.fusion-audio-stream-buttons,
.my-profile-buttons,
.my-profile-update-buttons,
.invites-buttons,
.bottom-buttons,
.community-setting-buttons,
.directory-buttons,
.community-dashboard-reorder-buttons,
.communication-buttons,
.communication-group-buttons,
.options-buttons,
.linkwallet-buttons,
.guard-buttons {
    display: flex;
    width: var(--seg_width);
    align-self: flex-end;
    justify-content: center;
}

.guard-buttons {
    width: var(--seg_width);
    margin-left: auto;
    margin-right: auto;
}

.content-guard .fusion-heading {
    margin-top: calc(calc(90/750) * var(--seg_width)) !important;
    text-align: center;
}

.fusion-pin-set-popup {
    height: auto !important;
}

.fusion-pin-buttons {}

.directory-buttons,
.communication-buttons,
.communication-group-buttons {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
}

.directory-buttons>.close-button,
.communication-buttons>.close-button,
.community-dashboard-reorder-buttons>.close-button,
.communication-group-buttons>.close-button {
    margin: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    border-radius: 0 !important;
    width: var(--seg_width) !important;
}

.directory-buttons,
.console-buttons {
    display: flex;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    justify-content: center;
    width: var(--seg_width);
    height: calc(calc(100/750) * var(--seg_width));
}

.directory-back-button,
.console-back-button,
.console-copy-button,
.console-clear-button,
.directory-remove-all-button {
    display: flex;
    flex-direction: column;
    width: calc(var(--seg_width) / 3);
    align-items: center;
}

.directory-back-button .button-icon,
.console-back-button .button-icon,
.console-copy-button .button-icon,
.console-clear-button .button-icon,
.directory-remove-all-button .button-icon {
    display: flex;
    width: calc(calc(45/750) * var(--seg_width));
    height: calc(calc(45/750) * var(--seg_width));
    line-height: calc(calc(45/750) * var(--seg_width));
    margin-top: calc(calc(10/750) * var(--seg_width));
    margin-bottom: calc(calc(10/750) * var(--seg_width));
    background-repeat: no-repeat;
    background-position: center;
}

.directory-back-button .button-text,
.console-back-button .button-text,
.console-copy-button .button-text,
.console-clear-button .button-text,
.directory-remove-all-button .button-text {
    display: flex;
    font-size: calc(calc(26/750) * var(--seg_width));
    line-height: calc(calc(26/750) * var(--seg_width));
    margin-bottom: calc(calc(10/750) * var(--seg_width));
    color: #ffffff;
}

.directory-back-button .button-icon,
.console-back-button .button-icon {
    background-image: url('../images/back_icon.svg');
}

.directory-remove-all-button .button-icon {
    background-image: url('../images/remove_all_icon.svg');
}

.console-copy-button .button-icon {
    background-image: url('../images/copy_icon.svg');
}

.console-clear-button .button-icon {
    background-image: url('../images/white_close_icon.svg');
}

.directory_search {
    width: calc(calc(750/750) * var(--seg_width)) !important;
    margin-top: calc(calc(30/750) * var(--seg_width)) !important;
}


/* .communication-view {
    height: calc(var(--s_height) - calc((137/750) * var(--s_height)))
} */

.communication-view.list-height {
    height: calc(var(--s_height) - calc((194/750) * var(--s_height)));
}

.setup-buttons .signup_next_button,
.setup-buttons .signin_next_button,
.setup-buttons .resend-otp,
.setup-buttons .otp_next,
.setup-buttons .forgot-password-otp-next-button,
.setup-buttons .forgot-password-reset-next-button,
.wallet-buttons .link-wallet,
.media-tag-buttons .go-button,
.bottom-buttons .save-button,
.fusion-pin-buttons .fusion-pin-next-button,
.fusion-pin-buttons .fusion-pin-set-button,
.fusion-pin-buttons .fusion-pin-set-yes-button,
.fusion-pin-set-buttons .fusion-pin-next-button,
.fusion-pin-set-buttons .fusion-pin-set-button,
.fusion-pin-set-buttons .fusion-pin-set-yes-button,
.fusion-pin-set-buttons .fusion-pin-set-yes-button,
.fusion-audio-stream-buttons .stop-button,
.my-profile-buttons .signout-button1,
.my-profile-update-buttons .save-button {
    float: left;
    display: block;
    width: calc(calc(350/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    margin-right: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(33/750) * var(--seg_width));
    color: #ffffff;
}

.signout-button {
    float: left;
    display: block;
    margin-right: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(33/750) * var(--seg_width));
    color: #ffffff;
    position: absolute;
    top: 0px;
    right: 0px;
    width: calc(calc(160/750) * var(--seg_width));
    height: calc(calc(60/750) * var(--seg_width));
    line-height: calc(calc(60/750) * var(--seg_width));
}

.close-button[data-close="menu"] {
    width: calc(calc(690/750) * var(--seg_width)) !important;
}

.setup-buttons .skip-button,
.setup-buttons .otp_back_button,
.setup-buttons .signin_back_button,
.setup-buttons .signup_back_button,
.setup-buttons .back_button,
.setup-buttons .forgot-password-otp-back-button,
.setup-buttons .forgot-password-reset-back-button,
.wallet-buttons .cancel-button,
.fusion-pin-buttons .close-button,
.fusion-pin-set-buttons .close-button,
.fusion-audio-stream-buttons .minimize-button,
.my-profile-buttons .close-button,
.my-profile-update-buttons .close-button,
.bottom-buttons .close-button {
    float: left;
    width: calc(calc(250/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(92/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    border: calc(calc(8/750) * var(--seg_width)) solid #0073ff;
    background-color: #ffffff;
    font-size: calc(calc(33/750) * var(--seg_width));
    color: #0073ff;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.setup-buttons .next_button,
.setup-buttons .forgot-password-next-button,
.invites-buttons .close-button,
.media-tag-buttons .close-button,
.community-setting-buttons .close-button,
.directory-buttons .close-button,
.community-dashboard-reorder-buttons .close-button,
.communication .close-button,
.communication-group-buttons .close-button,
.media-tag-buttons .cancel-button,
.options-buttons .close-button,
.linkwallet-buttons .close-button,
.guard-buttons .close-button {
    /* float: left; */
    display: flex;
    width: calc(calc(630/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(40/750) * var(--seg_width));
    color: #ffffff;
    margin: 0 auto;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
    align-self: flex-end;
    justify-content: center;
}

.setup-buttons .signin_back_button,
.setup-buttons .signup_back_button,
.setup-buttons .otp_back_button {
    margin-right: calc(calc(30/750) * var(--seg_width));
}

.setup-buttons .signup_button,
.setup-buttons .signin_button,
.setup-buttons .otp_next {
    margin-right: 0;
}

.setup-buttons {
    display: flex;
    height: 100%;
    /* position: absolute;
    bottom: 0; */
}

.setup-buttons>* {
    display: flex;
    align-self: flex-end;
    justify-content: center;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
}

.inline>input {
    float: left;
    width: calc(calc(494/750) * var(--s_width));
    margin-left: calc(calc(35/750) * var(--s_width));
    height: calc(calc(80/750) * var(--s_width));
    line-height: calc(calc(50/750) * var(--s_width));
    border-radius: 10px 0 0 10px;
    padding-left: 4%;
    -webkit-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
}

.inline>button {
    float: left;
    width: calc(calc(120/750) * var(--seg_width));
    height: calc(calc(80/750) * var(--seg_width));
    border: 0 none transparent !important;
    border-radius: 0 10px 10px 0 !important;
    position: relative;
    left: -1px;
    top: 1px;
    -webkit-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 1.0666666666667px 1.0666666666667px 2.6666666666667px 0px rgba(0, 0, 0, 0.2);
}

.hidden-group,
.hidden {
    display: none;
}

.forgotten-password-text {
    font-family: 'AmpleSoftPro Medium';
    font-size: calc(calc(30/750) * var(--seg_width));
    line-height: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-left: calc(calc(60/750) * var(--seg_width));
    margin-right: calc(calc(60/750) * var(--seg_width));
    width: calc(calc(690/750) * var(--seg_width));
    color: #0073ff;
    justify-content: center;
    text-decoration: underline;
    display: none;
}

.resend-otp-via-whatsapp-text {
    font-family: 'Arial';
    font-size: calc(calc(32/750) * var(--seg_width));
    line-height: calc(calc(32/750) * var(--seg_width));
    color: #4c4b4d;
    margin-top: calc(calc(30 / 750)* var(--seg_width));
    margin-left: calc(calc(60 / 750)* var(--seg_width));
    margin-right: calc(calc(60 / 750)* var(--seg_width));
}

.resend-otp-via-whatsapp-text span {
    margin-left: calc(calc(10/750) * var(--seg_width));
    text-decoration: underline;
    color: #0073ff;
}

.forgot-password-input-wrap {
    display: flex;
    width: calc(calc(630/750) * var(--seg_width));
    margin-left: calc(calc(60/750) * var(--seg_width));
    margin-right: calc(calc(60/750) * var(--seg_width));
    border-bottom: 2px solid #a1a1a2;
}

.forgot-password-input-wrap input {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: calc(calc(520/750) * var(--seg_width));
    height: calc(calc(86/750) * var(--seg_width));
    line-height: calc(calc(86/750) * var(--seg_width));
    font-size: calc(calc(32/750) * var(--seg_width));
}

.forgot-password-show-hide-button {
    display: flex;
    width: calc(calc(110/750) * var(--seg_width));
    line-height: calc(calc(32/750) * var(--seg_width));
    font-size: calc(calc(32/750) * var(--seg_width));
    justify-content: center;
    align-items: center;
    color: #4c4b4d;
}

.generic-loader,
.gateway-loader,
.plugin-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: var(--seg_width);
    height: var(--s_height);
    line-height: var(--seg_width);
    background-color: rgba(255, 255, 255, 1);
    text-align: center;
    justify-content: center;
    flex-direction: column;
    display: none;
    z-index: 999999999;
}


/**
*  onq section 
**/

.onq-features {
    display: block;
    float: left;
}

.onq-feature {
    position: relative;
    display: block;
    float: left;
    margin-left: calc(calc(33/750) * var(--seg_width));
    margin-top: calc(calc(33/750) * var(--seg_width));
    height: calc(calc(206/750) * var(--seg_width));
    width: calc(calc(206/750) * var(--seg_width));
    height: auto !important;
    border-radius: calc(calc(45/750) * var(--seg_width));
    background-color: #ffffff;
    -webkit-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
}

.onq-feature .icon {
    float: left;
    display: inline-block;
    width: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
    margin-top: calc(calc(22/750) * var(--seg_width));
    margin-left: calc(calc(22/750) * var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
}

.onq-feature .name {
    float: left;
    margin-top: calc(calc(25/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    font-family: Arial;
    font-size: calc(calc(26/750) * var(--seg_width)) !important;
    font-weight: 600 !important;
    width: calc(calc(206/750) * var(--seg_width)) !important;
    color: #414042;
}

.onq-feature .description {
    float: left;
    margin-top: calc(calc(15/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    margin-bottom: calc(calc(22/750) * var(--seg_width));
    text-align: left !important;
    width: calc(calc(206/750) * var(--seg_width)) !important;
    color: #9d9fa2;
    font-size: calc(calc(22/750) * var(--seg_width)) !important;
}

.onq-feature .switch {
    position: relative;
    float: left;
    margin-top: calc(calc(22/750) * var(--seg_width)) !important;
    margin-left: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    width: calc(calc(50/750) * var(--seg_width)) !important;
    height: calc(calc(105/750) * var(--seg_width)) !important;
    border: 1px solid #e7e7e7;
    font-size: calc(calc(22/750) * var(--seg_width)) !important;
    border-radius: calc(calc(45/750) * var(--seg_width));
    z-index: 0;
}

.onq-feature.inactive .switch:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.80);
    border-radius: calc(calc(45/750) * var(--seg_width));
    z-index: 2;
}

.onq-feature.inactive:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.80);
    border-radius: calc(calc(45/750) * var(--seg_width));
    z-index: 0;
}

.onq-feature .switch .button {
    position: absolute;
    width: calc(calc(40/750) * var(--seg_width)) !important;
    height: calc(calc(40/750) * var(--seg_width)) !important;
    border-radius: calc(calc(750/750) * var(--seg_width));
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    left: calc(calc(2/750) * var(--seg_width));
    right: calc(calc(2/750) * var(--seg_width));
    transition: all ease 300ms;
}

.onq-feature .switch .status {
    position: absolute;
    width: calc(calc(40/750) * var(--seg_width)) !important;
    top: calc(calc(4/750) * var(--seg_width));
    left: calc(calc(5/750) * var(--seg_width));
    right: calc(calc(5/750) * var(--seg_width));
    font-size: calc(calc(28/750) * var(--seg_width));
    color: #9d9fa2;
}

.onq-feature .switch .button.on {
    top: calc(calc(4/750) * var(--seg_width));
}

.onq-feature .switch .button.off {
    bottom: calc(calc(4/750) * var(--s_width));
}

.lisnr_icon {
    background-image: url('../images/lisnr_icon.svg');
}

.geofence_icon {
    background-image: url('../images/geofence_icon.svg');
}

.ibeacon_icon {
    background-image: url('../images/ibeacon_icon.svg');
}

.nfc_icon {
    background-image: url('../images/nfc_icon.svg');
}

.qrcode_icon {
    background-image: url('../images/qr_code_icon.svg');
}

.ar_vr_icon {
    background-image: url('../images/ar_vr_icon.svg');
}

.tag-type-wrapper {
    position: absolute;
    bottom: calc(calc(145/750) * var(--s_width));
    width: calc(calc(682/750) * var(--s_width));
    left: calc(calc(34/750) * var(--s_width));
    right: calc(calc(34/750) * var(--s_width));
}

.tag-type {
    float: left;
    width: calc(calc(158/750) * var(--s_width));
    height: calc(calc(100/750) * var(--s_width));
    line-height: calc(calc(100/750) * var(--s_width));
    margin-top: calc(calc(40/750) * var(--s_width));
    margin-left: calc(calc(52/750) * var(--s_width));
    border: calc(calc(1/750) * var(--s_width)) solid #efefef;
    text-align: center;
}

.tag-type:nth-child(3) {
    margin-right: calc(calc(52/750) * var(--s_width));
}

#browser {
    width: var(--seg_width);
    height: 100%;
}

#web-browser {
    width: var(--s_width);
    height: 100%;
}

.browser-close-button {
    display: flex;
    width: var(--seg_width);
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    color: #ffffff;
    text-align: center;
    line-height: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
    justify-content: center;
}

.page.web-browser .browser-close-button {
    display: flex;
    width: var(--s_width);
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    color: #ffffff;
    text-align: center;
    line-height: calc(calc(85/750) * var(--seg_width));
    height: calc(calc(85/750) * var(--seg_width));
    justify-content: center;
}

.payment_gateway {
    width: var(--seg_width);
    height: calc(calc(92/750) * var(--s_width));
    font-size: calc(calc(34/750) * var(--s_width));
    line-height: calc(calc(92/750) * var(--s_width));
    border-bottom: 1px solid #efefef;
}

.bottom_anchored_button {
    position: fixed;
    bottom: 0;
    width: var(--s_width);
    height: calc(calc(92/750) * var(--s_width));
    font-size: calc(calc(34/750) * var(--s_width));
    line-height: calc(calc(92/750) * var(--s_width));
    text-align: center;
    left: 0;
}

.community-loading {
    position: fixed;
    top: 0;
    width: var(--s_width);
    height: var(--s_height);
    line-height: var(--s_height);
    bottom: 0;
    display: none;
}

.message-popup {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: var(--s_width);
    height: var(--s_height);
    background-color: rgba(0, 0, 0, 0.7);
    flex-direction: column;
    justify-content: center;
    display: none;
    z-index: 999999999;
}

.message-box {
    display: flex;
    flex-direction: column;
    width: calc(calc(690/750) * var(--seg_width));
    font-size: calc(calc(34/750) * var(--seg_width));
    text-align: center;
    margin: 0 auto;
    background-color: #ffffff;
}

.message-box .message {
    margin: calc(calc(60/750) * var(--seg_width)) calc(calc(30/750) * var(--seg_width));
    font-size: calc(calc(34/750) * var(--seg_width));
}

.message-box-buttons {
    display: flex;
    width: calc(calc(690/750) * var(--seg_width));
    justify-content: center;
}

.message-box-button:nth-child(1) {
    width: calc(calc(310/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    margin-left: calc(calc(30/750) * var(--seg_width));
    margin-right: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(40/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(33/750) * var(--seg_width));
    color: #ffffff;
}

.message-box-button:nth-child(2) {
    width: calc(calc(370/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    margin-right: calc(calc(30/750) * var(--seg_width));
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(40/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(92/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    border: calc(calc(8/750) * var(--seg_width)) solid #0073ff;
    background-color: #ffffff;
    font-size: calc(calc(33/750) * var(--seg_width));
    color: #0073ff;
}

.message-box-popup-buttons {
    display: flex;
    width: var(--seg_width);
    background-color: #ffffff;
}

.message-box-close-button {
    display: flex;
    width: calc(calc(630/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    background: #0077ff;
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    font-size: calc(calc(40/750) * var(--seg_width));
    margin: 0 auto;
    margin-top: calc(calc(30/750) * var(--seg_width));
    margin-bottom: calc(calc(30/750) * var(--seg_width));
    color: #ffffff;
    display: flex;
    align-self: flex-end;
    justify-content: center;
}

.background-iframes {
    display: none;
}

.transaction_success_popup,
.transaction_error_popup {
    display: none;
}

.menu .switch {
    position: relative;
    float: left;
    margin-left: calc(calc(95/750) * var(--seg_width)) !important;
    margin-right: calc(calc(22/750) * var(--seg_width)) !important;
    text-align: left !important;
    width: calc(calc(105/750) * var(--seg_width)) !important;
    height: calc(calc(50/750) * var(--seg_width)) !important;
    border: 1px solid #e7e7e7;
    font-size: calc(calc(22/750) * var(--seg_width)) !important;
    border-radius: calc(calc(45/750) * var(--seg_width));
}

.menu.inactive .switch:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.80);
    border-radius: calc(calc(45/750) * var(--s_width));
    z-index: 2;
}

.menu .switch .button {
    position: absolute;
    width: calc(calc(40/750) * var(--seg_width)) !important;
    height: calc(calc(40/750) * var(--seg_width)) !important;
    border-radius: calc(calc(750/750) * var(--seg_width));
    background-image: linear-gradient(to right, #00C6FF, #0072FF);
    top: calc(calc(2.5/750) * var(--seg_width));
    left: calc(calc(4/750) * var(--seg_width));
    right: calc(calc(4/750) * var(--seg_width));
    transition: all ease 300ms;
}

.mb_decode_numericentity .switch .status {
    position: absolute;
    width: calc(calc(40/750) * var(--s_width)) !important;
    top: calc(calc(4/750) * var(--s_width));
    left: calc(calc(5/750) * var(--s_width));
    right: calc(calc(5/750) * var(--s_width));
    font-size: calc(calc(28/750) * var(--s_width));
    color: #9d9fa2;
}

.menu .switch .button
/* .off  */

{
    left: calc(calc(4/750) * var(--seg_width));
    right: auto;
}

.menu .switch .button.on {
    right: calc(calc(4/750) * var(--seg_width));
    left: auto;
}

.ui-keyboard {
    top: 68%;
    border: 1px solid #aaa0;
}

.ui-keyboard-button,
.ui-keyboard-actionkey:not(.ui-keyboard-dec):not(.ui-keyboard-combo) {
    min-width: calc(100%/11);
    height: 2.8em;
    line-height: 2.8em;
}

.ui-keyboard-actionkey:not(.ui-keyboard-dec):not(.ui-keyboard-combo) span {
    font-size: 0.8em;
    position: relative;
    top: auto;
    left: auto;
}

.ui-keyboard-keyset {
    width: var(--seg_width);
}

.ui-keyboard-lockedinput {
    margin-bottom: calc(calc(8/750) * var(--s_width));
    border-radius: 0 !important;
}

.ui-keyboard-lockedinput:focus {
    outline: none !important;
}

.ui-keyboard-accept {
    background: #0073ff !important;
    color: #ffffff !important;
}

.clear-btn {
    /* float: left; */
    position: absolute;
    right: 0;
    width: calc(calc(30/750) * var(--seg_width));
    height: calc(calc(30/750) * var(--seg_width));
    margin: calc(calc(30/750) * var(--seg_width));
    display: none;
}

.stick-right {
    left: auto !important;
    right: 0;
}

.tablet-overlay {
    content: '';
    position: fixed;
    width: var(--s_width);
    height: var(--s_height);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 9999;
    display: none;
}

.content-loading {
    z-index: 9999;
}

.content-loading .icon {
    width: calc(calc(200/750) * var(--seg_width));
    height: calc(calc(200/750) * var(--seg_width));
    margin-left: auto;
    margin-right: auto;
    margin-top: calc(calc(161/750) * var(--s_height));
    margin-bottom: calc(calc(32/750) * var(--seg_width));
    background-position: center;
    background-size: contain;
}

.content-loading .text {
    font-size: calc(calc(32/750) * var(--seg_width));
    margin: 0 auto;
}

.content-loading .close-button {
    position: relative;
    background-color: red;
    width: calc(calc(630/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    border-radius: calc(calc(50/750) * var(--seg_width));
    text-align: center;
    font-size: calc(calc(40/750) * var(--seg_width));
    color: #ffffff;
    margin: 0 auto;
    margin-top: calc(calc(322/750) * var(--s_height));
    margin-bottom: calc(calc(32/750) * var(--seg_width));
}

.play_stop_button {
    position: relative;
    float: left;
    width: calc(calc(85/750)* var(--seg_width));
    height: calc(calc(85/750)* var(--seg_width));
    margin-top: calc(calc(22/750)* var(--seg_width));
    margin-left: calc(calc(22/750)* var(--seg_width));
    background-image: url('../images/play_icon.svg');
    background-position: center;
    background-size: contain;
    transition: all ease;
}

.play_stop_button.play:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: calc(calc(85/750)* var(--seg_width));
    height: calc(calc(85/750)* var(--seg_width));
    background-image: url('../images/buffering_icon.svg');
    background-position: center;
    background-size: contain;
    transition: all ease;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
}

.content_caption {
    float: left;
    margin-top: calc(calc(53.5/750)* var(--seg_width)) !important;
    margin-bottom: calc(calc(22/750)* var(--seg_width)) !important;
    margin-left: calc(calc(22/750)* var(--seg_width)) !important;
    margin-right: calc(calc(22/750)* var(--seg_width)) !important;
    text-align: left !important;
    width: calc(calc(166/750)* var(--seg_width)) !important;
    color: #9d9fa2;
    font-size: calc(calc(22/750)* var(--seg_width)) !important;
}

.audio_stream_content {
    width: calc(calc(450/750)* var(--seg_width)) !important;
}

.audio_stream_content .icon {
    float: left;
    display: inline-block;
    width: calc(calc(85/750)* var(--seg_width)) !important;
    height: calc(calc(85/750)* var(--seg_width)) !important;
    margin-top: calc(calc(22/750)* var(--seg_width)) !important;
    margin-left: calc(calc(22/750)* var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
}

.audio_stream_content .content_text {
    float: left;
    width: calc(calc(406/750)* var(--seg_width)) !important;
    margin-top: calc(calc(34/750)* var(--seg_width)) !important;
    /* float: none !important; */
}

.fusion_audio_streamer {
    display: none;
}

.audio-stream-box {
    float: left;
    width: calc(calc(626/750) * var(--seg_width));
    height: 100%;
    margin-top: calc(calc(96/750) * var(--seg_width));
    margin-left: calc(calc(63/750) * var(--seg_width));
    margin-right: calc(calc(63/750) * var(--seg_width));
    margin-bottom: calc(calc(46/750) * var(--seg_width));
    background-color: #ffffff;
}

.audio-stream-box .icon {
    float: left;
    display: inline-block;
    width: calc(calc(134/750)* var(--seg_width));
    height: calc(calc(134/750)* var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
}

.audio-stream-box .play_stop_button {
    position: relative;
    float: left;
    margin-left: calc(calc(0/750)* var(--seg_width)) !important;
    margin-right: calc(calc(55/750)* var(--seg_width)) !important;
    width: calc(calc(80/750)* var(--seg_width)) !important;
    height: calc(calc(80/750)* var(--seg_width)) !important;
}

.audio-stream-box .play_stop_button.play:after {
    position: absolute;
    content: '';
    width: calc(calc(80/750)* var(--seg_width)) !important;
    height: calc(calc(80/750)* var(--seg_width)) !important;
}

.audio-stream-box .content_caption {
    text-align: left;
    margin-top: calc(calc(45/750)* var(--seg_width));
    margin-right: calc(calc(0/750)* var(--seg_width)) !important;
    margin-bottom: calc(calc(24/750)* var(--seg_width)) !important;
    font-family: Arial;
    font-size: calc(calc(34/750) * var(--seg_width)) !important;
    line-height: calc(calc(34/750)* var(--seg_width)) !important;
    width: calc(calc(325/750)* var(--seg_width)) !important;
    height: auto !important;
    color: #9d9fa2;
}

.audio-stream-box .content_text {
    width: calc(calc(626/750)* var(--seg_width)) !important;
    font-size: calc(calc(40/750) * var(--seg_width)) !important;
    line-height: calc(calc(40/750) * var(--seg_width)) !important;
}

.audio-stream-box .content_text marquee {
    width: calc(calc(626/750)* var(--seg_width)) !important;
}

.audio-stream-box .category_text {
    float: left;
    margin-top: calc(calc(0/750)* var(--seg_width)) !important;
    text-align: left !important;
    color: #9d9fa2;
    font-size: calc(calc(34/750)* var(--seg_width)) !important;
}

.mini-audio-streamer {
    position: fixed;
    background-color: #ffffff;
    width: calc(calc(118/750)* var(--seg_width));
    height: calc(calc(118/750)* var(--seg_width));
    border-radius: calc(calc(118/750)* var(--seg_width)) 0 0 calc(calc(118/750)* var(--seg_width));
    -webkit-box-shadow: 7px 7px 10px rgb(0 0 0 / 25%);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgb(0 0 0 / 25%);
    top: calc(calc(60/750)* var(--seg_width));
    right: 0;
    z-index: 999;
    display: none;
}

.mini-audio-streamer .icon {
    position: relative;
    width: calc(calc(85/750)* var(--seg_width));
    height: calc(calc(85/750)* var(--seg_width));
    margin-top: calc(calc(16.5/750)* var(--seg_width));
    margin-bottom: calc(calc(16.5/750)* var(--seg_width));
    margin-left: calc(calc(22/750)* var(--seg_width));
    background-image: url('../images/play_icon.svg');
    background-position: center;
    background-size: contain;
    transition: all ease;
}

.mini-audio-streamer .icon.play:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: calc(calc(85/750)* var(--seg_width));
    height: calc(calc(85/750)* var(--seg_width));
    background-image: url('../images/buffering_icon.svg');
    background-position: center;
    background-size: contain;
    transition: all ease;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
}

.audio_stream_content {
    width: calc(calc(450/750)* var(--seg_width)) !important;
}

.spin {
    transform-origin: center;
    -webkit-animation: spin 4s linear infinite;
    -moz-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
}

.options_search {
    float: left;
    width: calc(calc(690/750)* var(--seg_width)) !important;
    padding: calc(calc(30/750)* var(--seg_width)) !important;
    font-size: calc(calc(30/750)* var(--seg_width));
    line-height: calc(calc(30/750)* var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.05) !important;
}

.select-options {
    float: left;
    width: calc(calc(690/750)* var(--seg_width));
    height: calc(calc(var(--s_height) - calc((515/750)* var(--seg_width))));
    height: calc(calc(var(--s_height) - calc((600/750)* var(--seg_width))));
    overflow: hidden;
    overflow-y: auto;
}

.option-item {
    float: left;
    width: calc(calc(690/750)* var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.option-item .option-icon {
    float: left;
    width: calc(calc(50/750)* var(--seg_width));
    height: calc(calc(50/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    margin-top: calc(calc(30/750)* var(--seg_width));
    margin-bottom: calc(calc(30/750)* var(--seg_width));
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.option-item .option-icon.icon-as-name {
    float: left;
    margin-top: calc(calc(30/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    margin-bottom: calc(calc(30/750)* var(--seg_width));
    width: calc(calc(390/750)* var(--seg_width));
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left center;
}

.option-item .option-name {
    float: left;
    margin-top: calc(calc(30/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    margin-bottom: calc(calc(30/750)* var(--seg_width));
    width: calc(calc(490/750)* var(--seg_width));
    font-size: calc(calc(30/750)* var(--seg_width));
    color: #4c4b4d;
}

.option-item .option-description {
    float: left;
    margin-top: calc(calc(-15/750)* var(--seg_width));
    margin-bottom: calc(calc(30/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    width: calc(calc(490/750)* var(--seg_width));
    font-size: calc(calc(26/750)* var(--seg_width));
    color: #4c4b4d;
}

.container {
    float: left;
    width: var(--seg_width);
}

.s-container {
    float: left;
    width: var(--seg_width);
}

.container .seg-12 {
    float: left;
    width: calc(var(--seg_width) / 1);
}

.s-container .seg-12 {
    float: left;
    width: calc(calc(var(--seg_width) - calc(var(--seg_width) * 120/750)));
    margin-left: calc(var(--seg_width) * 60/750);
    margin-right: calc(var(--seg_width) * 60/750);
}

.container .seg-6 {
    float: left;
    width: calc(var(--seg_width) / 2);
}

.s-container .seg-6 {
    float: left;
    width: calc(calc(var(--seg_width) - calc(var(--seg_width) * 120/750)) / 2);
    margin-left: calc(var(--seg_width) * 60/750);
    margin-right: calc(var(--seg_width) * 60/750);
}

.container .seg-5 {
    float: left;
    width: calc(var(--seg_width) / 5);
}

.s-container .seg-5 {
    float: left;
    width: calc(calc(var(--seg_width) - calc(var(--seg_width) * 120/750)) / 5);
    margin-left: calc(var(--seg_width) * 60/750);
    margin-right: calc(var(--seg_width) * 60/750);
}

.container .seg-4 {
    float: left;
    width: calc(var(--seg_width) / 4);
}

.container .seg-3 {
    float: left;
    width: calc(var(--seg_width) / 3);
}

.flex_text_input {
    float: left;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: var(--seg_width);
    height: calc(calc(86/750) * var(--seg_width)) !important;
    border-radius: 0 !important;
    border-bottom: 1px solid #a1a1a2 !important;
    line-height: calc(calc(86/750) * var(--seg_width)) !important;
    font-size: calc(calc(32/750) * var(--seg_width)) !important;
}

.seg-row {
    float: left;
    width: var(--seg_width);
    display: flex;
}

.s-container .seg-row {
    float: left;
    /* width: calc(calc(var(--seg_width) - calc(var(--seg_width) * 120/750))); */
}

.stb-30 {
    margin-top: calc(var(--seg_width) * 30/750);
    margin-bottom: calc(var(--seg_width) * 30/750);
}

.st-30 {
    margin-top: calc(var(--seg_width) * 30/750);
}

.st-60 {
    margin-top: calc(var(--seg_width) * 60/750);
}

.sb-30 {
    margin-bottom: calc(var(--seg_width) * 30/750);
}

.sb-60 {
    margin-bottom: calc(var(--seg_width) * 60/750);
}

.stb-60 {
    margin-top: calc(var(--seg_width) * 60/750);
    margin-bottom: calc(var(--seg_width) * 60/750);
}

.fusion_user_profile_picture {
    background-image: url('../images/fusion_bg.svg');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    height: calc(var(--seg_width) * 380/750);
}

.fusion_user_profile_picture label {
    float: left;
    width: var(--seg_width);
    height: calc(var(--seg_width) * 380/750);
}

.fusion-user-profile-view {
    height: calc(var(--s_height) - calc((590/750) * var(--seg_width)));
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.fusion_user_profile_picture .gallery-icon {
    background-image: url('../images/gallery_icon.svg');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    width: calc(var(--seg_width) * 95/750);
    height: calc(var(--seg_width) * 86/750);
    margin: calc(var(--seg_width) * 147/750) auto;
}

.fusion_user_profile_picture .menu-card {
    margin-top: calc(var(--seg_width) * 250/750);
    ;
    background-color: #ffffff;
}

.fusion_user_profile_picture input[type="file"] {
    display: none;
}

.page.community-guard,
.community-guard-popup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: var(--s_width) !important;
    background-color: #ffffff;
}

.page.content-guard {
    display: none;
    width: var(--s_width) !important;
    background-color: #ffffff;
    z-index: 999999998 !important;
}

.page.screen-wide {
    width: var(--s_width);
}

.right_container {
    position: absolute;
    right: 0;
    z-index: 9999;
    width: var(--seg_width);
}

.fusion-body.fusion-overlay::before {
    position: absolute;
    content: '';
    position: fixed;
    width: var(--s_width);
    height: var(--s_height);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 9999;
}

.media-library-page,
.media-library-upload-page {
    display: none;
    position: fixed;
    flex-direction: column;
    width: var(--seg_width) !important;
    height: var(--s_height);
    z-index: 999999999;
}

.media-library-page .media-library-overlay,
.media-library-upload-page .media-library-upload-overlay {
    background: rgba(0, 0, 0, 0.45);
    width: var(--seg_width);
    height: 50%;
}

.media-library-page .media-library-contents {
    background-color: #ffffff;
    display: flex;
    flex-direction: row;
    align-content: flex-start;
    flex-wrap: wrap;
    height: 50% !important;
}

.media-library-upload-page .media-library-upload-contents {
    display: flex;
    flex-direction: column;
    background-color: #ffffff;
    height: 50% !important;
}

.media-library-close-button,
.media-library-upload-save-button {
    display: flex;
    justify-content: center;
    width: var(--seg_width);
    height: calc(calc(100/750) * var(--seg_width));
    font-size: calc(calc(36/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    background: #eb4f3d;
    color: #ffffff;
}

.media-library-button {
    background-color: white;
    display: flex;
    flex-direction: column;
    -webkit-box-shadow: 7px 7px 10px rgb(0 0 0 / 25%);
    -moz-box-shadow: 7px 7px 10px rgba(0, 0, 0, 0.25);
    box-shadow: 7px 7px 10px rgb(0 0 0 / 25%);
    border-radius: calc(calc(45/750)* var(--seg_width));
    margin-top: calc(calc(30/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    background-color: #ffffff;
    width: calc(calc(210/750)* var(--seg_width));
    height: auto;
    overflow: hidden;
}

.media-library-button .media-library-button-icon {
    float: left;
    width: calc(calc(85/750)* var(--seg_width));
    height: calc(calc(85/750)* var(--seg_width));
    margin-top: calc(calc(22/750)* var(--seg_width));
    margin-left: calc(calc(22/750)* var(--seg_width));
    background-size: contain !important;
    background-repeat: no-repeat;
}

.media-library-button-name {
    margin-top: calc(calc(30/750)* var(--seg_width));
    margin-bottom: calc(calc(35/750)* var(--seg_width));
    margin-left: calc(calc(22/750)* var(--seg_width));
    text-align: left;
    font-family: Arial;
    font-size: calc(calc(26/750)* var(--seg_width));
    line-height: calc(calc(26/750)* var(--seg_width));
    font-weight: 600;
    width: calc(calc(160/750)* var(--seg_width));
    height: auto;
    color: #414042;
    overflow: hidden;
    overflow-wrap: break-word;
}

.media-library-input-wrap {
    display: flex;
    align-items: center;
    background-color: #ffffff;
    width: var(--seg_width);
    height: calc(calc(95/750)* var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    padding: 0;
}

.media-library-input,
.media-library-input-description {
    display: flex;
    font-family: Arial;
    font-size: calc(calc(30/750)* var(--seg_width));
    line-height: calc(calc(90/750)* var(--seg_width));
    width: calc(calc(565/750)* var(--seg_width)) !important;
    height: calc(calc(90/750)* var(--seg_width));
    margin-left: calc(calc(30/750)* var(--seg_width));
    padding: 0;
}

.media-library-media-visibility-switch-wrap {
    display: flex;
    width: auto;
}

.media-library-media-visibility-switch {
    display: flex;
    width: calc(calc(125 / 750)* var(--seg_width));
    height: calc(calc(60 / 750)* var(--seg_width));
    margin-left: calc(calc(30 / 750)* var(--seg_width));
    margin-right: calc(calc(30 / 750)* var(--seg_width));
    border-radius: calc(calc(125 / 750)* var(--seg_width));
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    appearance: none;
    background-image: url('../images/transparent_no_toggle.svg');
    background-repeat: no-repeat;
    background-size: contain;
}

.media-library-media-visibility-switch:checked {
    background-image: url('../images/transparent_yes_toggle.svg');
}

.media-library-upload-file-area {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: var(--seg_width);
    height: 100%;
    background-color: #f0f4f7;
    background-image: url('../images/cloud_upload_icon.svg');
    background-repeat: no-repeat;
    background-size: calc(calc(220/750)* var(--seg_width));
    background-position: center;
}

.media-library-upload-file-preview {
    display: flex;
    width: var(--seg_width);
    justify-content: center;
}

.media-library-recorder {
    display: none;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: var(--seg_width);
    height: 100%;
    background-color: #f0f4f7;
}

.media-library-recorder-timer {
    font-family: "Open Sans", sans-serif;
    font-size: calc(calc(50/750)* var(--seg_width));
    font-weight: 600;
    color: #8f8f8f;
    line-height: calc(calc(100/750)* var(--seg_width));
}

.media-library-recorder-record-button {
    background-color: #f44336;
    width: calc(calc(230/750)* var(--seg_width));
    border-radius: calc(calc(60/750)* var(--seg_width));
    font-family: Arial;
    font-size: calc(calc(30/750)* var(--seg_width));
    line-height: calc(calc(90/750)* var(--seg_width));
    font-weight: 600;
    text-align: center;
    color: #ffffff;
}

.media-library-recorder-record-button.inactive {
    background-color: #bebebe;
}

.media-library-upload-file-preview img {
    /* width: 100%; */
    max-height: calc(calc(500/750)* var(--seg_width))
}

.media-library-upload-file-preview audio {
    margin-top: calc(calc(60/750)* var(--seg_width));
}

.media-library-upload-file-preview audio::-webkit-media-controls-panel {
    background-color: #eb4f3d;
    background-color: #cddc39;
}

.media-library-upload-file-preview video {
    width: 100%;
    max-height: calc(calc(375/750)* var(--s_height));
}

.media-library-upload-file-preview object {
    display: flex;
    width: var(--seg_width);
    height: 100%;
    background-color: #f0f4f7;
    justify-content: center;
}

.media-library-upload-file-preview object div {
    background-color: #f44336;
    width: calc(calc(360/750)* var(--seg_width));
    border-radius: calc(calc(60/750)* var(--seg_width));
    font-family: Arial;
    font-size: calc(calc(30/750)* var(--seg_width));
    line-height: calc(calc(90/750)* var(--seg_width));
    font-weight: 600;
    text-align: center;
    color: #ffffff;
}

.media-library-upload-file {
    display: none;
}

.media-library-input-clear-button {
    width: auto;
    font-size: calc(calc(30/750)* var(--seg_width));
    height: calc(calc(100 / 750)* var(--seg_width)) !important;
    line-height: calc(calc(100/750)* var(--seg_width)) !important;
    margin-left: calc(calc(30 / 750)* var(--seg_width));
    margin-right: calc(calc(30 / 750)* var(--seg_width));
    text-align: center;
    justify-content: center;
    align-items: center;
    color: #eb4f3d;
    display: none;
}

.media-library-upload-back-button {
    display: flex;
    justify-content: center;
    font-size: calc(calc(36/750) * var(--seg_width));
    width: calc(calc(100/750) * var(--seg_width));
    height: calc(calc(100/750) * var(--seg_width));
    line-height: calc(calc(100/750) * var(--seg_width));
    color: #ffffff;
    position: absolute;
    left: 0px;
    bottom: 0px;
    background-color: #fe554b;
}

.console-items {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow-y: auto;
    margin-top: calc(calc(30/750) * var(--seg_width));
}

.console-item {
    display: flex;
    flex-direction: column;
    padding: calc(calc(15/750) * var(--seg_width)) calc(calc(30/750) * var(--seg_width));
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}

.console-timestamp {
    display: flex;
    font-size: calc(calc(30/750) * var(--seg_width));
    color: #4c4b4d;
    justify-content: end;
}

.console-name {
    display: flex;
    font-size: calc(calc(32/750) * var(--seg_width));
    font-weight: 600;
    color: #0077ff;
}

.console-data {
    display: flex;
    font-size: calc(calc(32 / 750) * var(--seg_width));
    padding: calc(calc(15/750) * var(--seg_width)) 0;
    overflow-wrap: anywhere;
}

.page.screen-wide[class*="-qrcode-page"],
[data-close*="-qrcode-page"] {
    width: var(--seg_width) !important;
}

[class*="-qrcode-image"] {
    align-self: auto !important;
    height: auto !important;
}

@-moz-keyframes spin {
    100% {
        -moz-transform: rotate(360deg);
    }
}

@-webkit-keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}