@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;600&display=swap');

* {
    min-width: 0;
}

.initialChart {
    min-height: 300px;
    display: flex;
    align-items: center;
}
/* For all scrollbars in WebKit browsers */
/* width */
::-webkit-scrollbar {
    width: 6px;
}
/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #202225;
    border-radius: 10px;
}
/* Handle */
::-webkit-scrollbar-thumb {
    background: dimgrey;
    border-radius: 10px;
}
    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #ffffff80;
    }

.loading {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 100vh;
}

.main-survey-quest {
    width: 70%;
}

.main-survey-quest-type {
    width: 30%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.upload-container {
    border: 1px solid hsla(0, 0%, 100%, 0.06);
    background-color: rgb(255,255,255,.10);
    padding: 15px;
    border-radius: 4px;
}

.additionalDetails {
    gap: 20px;
    margin-top: 20px;
    display: flex;
    flex-direction: row;
}

.coming-soon-marketplace {
    position: relative;
    width: 100%;
    height: auto;
}

    .coming-soon-marketplace div {
        position: absolute;
        bottom: 0;
        width: 100%;
        min-height: 80%;
        display: flex;
        align-items: center;
        flex-direction: column;
        background-image: linear-gradient(rgba(40, 39, 39, 0), #282727, rgba(40, 39, 39, 0.5) 140%);
    }

.panels {
    background: #202225;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid rgb(255,255,255,.10);
    width: 100%;
}

    .panels h2, .panels h3, .panels h4 {
        margin-top: 0;
    }

.text-grey {
    color: #95979f;
}

a.flex-vertical {
    color: #ffffff;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 10px;
}

    a.flex-vertical:hover {
        background-color: rgb(255,255,255,.10);
    }

.bttn-frosty-rounded {
    width: 44px;
    height: 44px;
    /*    -webkit-backdrop-filter: blur(6px);*/
    /*    backdrop-filter: blur(6px);*/
    text-align: center;
    background-color: #1e79cb;
    border-radius: 100% !important;
    flex: 0 auto;
    justify-content: center;
    align-items: center;
    display: flex;
    border-color: transparent;
}

.SfDialogContent {
    padding: 30px;
}

.e-flex {
    display: flex;
}

.bttn-frosty-rounded.bttn-large {
    width: 80px;
    height: 80px;
}

.groupFlex {
    justify-content: space-between;
    display: flex;
    align-items: center;
}

.totCharsRemaining {
    font-size: 0.75rem;
    color: var(--dark-grey);
    background-color: var(--trims);
    padding: 2px 8px;
    border-radius: 10px;
}

.loading-container {
    text-align: center;
}

.e-icons.e-medium {
    font-size: inherit;
}

.e-grid {
    font-family: Manrope, sans-serif !important;
}

.pubStatuslabel {
    color: white;
    padding: 5.5px 12px;
    font-size: 14px;
    margin-right: 5px;
    border-radius: 4px;
}

.e-richtexteditor .rte-placeholder {
    left: 18px !important;
    top: 18px !important;
}

.load-more {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height: 90px;
}

.e-sidebar {
    overflow: hidden;
}

.image-info-main-container {
    width: 100%;
    height: 100%;
    position: sticky;
    z-index: 4;
    background-color: rgba(0, 0, 0, 0.80);
}

.image-info-wrapper {
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
    word-wrap: break-word;
    font-size: .835rem;
    background: #202225;
    padding: 0;
    border-radius: 8px;
    width: 100%;
    max-width: 600px;
    height: 640px;
    overflow-y: hidden;
    position: absolute;
    top: 10%;
    bottom: 0;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
}

tr {
    cursor: pointer;
}

.column-3 {
    height: 100%;
    /*position: -webkit-sticky;
    position: sticky;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    */
    height: 100%;
    background-color: #282b2f;
}

.control-wrapper {
    position: relative;
}

    .control-wrapper .loading {
        position: absolute;
        opacity: .8;
        background: #282B2F;
        height: 100%;
        z-index: 2;
    }
/*LOADING SPINNER STYLE*/
.sk-cube-grid {
    width: 40px;
    height: 40px;
    margin: 42px auto;
}

    .sk-cube-grid .sk-cube {
        width: 33%;
        height: 33%;
        background-color: #65ACFD;
        float: left;
        -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
        animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
    }

    .sk-cube-grid .sk-cube1 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    .sk-cube-grid .sk-cube2 {
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s;
    }

    .sk-cube-grid .sk-cube3 {
        -webkit-animation-delay: 0.4s;
        animation-delay: 0.4s;
    }

    .sk-cube-grid .sk-cube4 {
        -webkit-animation-delay: 0.1s;
        animation-delay: 0.1s;
    }

    .sk-cube-grid .sk-cube5 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    .sk-cube-grid .sk-cube6 {
        -webkit-animation-delay: 0.3s;
        animation-delay: 0.3s;
    }

    .sk-cube-grid .sk-cube7 {
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
    }

    .sk-cube-grid .sk-cube8 {
        -webkit-animation-delay: 0.1s;
        animation-delay: 0.1s;
    }

    .sk-cube-grid .sk-cube9 {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

@-webkit-keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }

    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}

@keyframes sk-cubeGridScaleDelay {
    0%, 70%, 100% {
        -webkit-transform: scale3D(1, 1, 1);
        transform: scale3D(1, 1, 1);
    }

    35% {
        -webkit-transform: scale3D(0, 0, 1);
        transform: scale3D(0, 0, 1);
    }
}
/*LOADING SPINNER STYLE END*/

textarea.e-input,
.e-float-input textarea,
.e-float-input.e-control-wrapper textarea,
.e-input-group textarea,
.e-input-group.e-control-wrapper textarea {
    resize: none !important;
}
/*Per Syncfusion, this disables the resize of textarea inputs*/

.pt20 {
    padding-top: 20px;
}

.pt10 {
    padding-top: 10px;
}

.mt0 {
    margin-top: 0 !important;
}

.hidden {
    display: none;
}

.w-layout-grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    grid-row-gap: 16px;
    grid-column-gap: 16px;
}

body {
    background-color: var(--bg-lite);
    font-family: Manrope, sans-serif;
    color: #fff;
    font-size: 16px;
    line-height: 1.5;
}

.left-col-1x {
    min-width: 360px;
    background-color: var(--bg-powder-coal);
    min-height: 1px;
    height: calc(100svh - 1px);
    overflow-y: auto;
    padding: 10px;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 6px inset;
    border-right: 1px solid var(--trims);
}

    .left-col-1x.feature-cards-insights {
        font-size: 13px;
        background: transparent;
        padding-top: 15px;
        gap: 10px;
    }

    .left-col-1x .card-analytics {
        margin-bottom: 10px;
    }

        .left-col-1x .card-analytics.fill {
            background-color: var(--trims);
        }

        .left-col-1x .card-analytics.link {
            background-color: transparent;
            transition: all 0.25s ease-out;
            cursor: pointer;
        }

            .left-col-1x .card-analytics.link:hover {
                background-color: var(--trims);
            }

h1 {
    margin-top: auto;
    margin-bottom: auto;
    font-size: 28px;
    line-height: 1.5;
    font-weight: 300;
}

h2 {
    font-size: 24px;
    line-height: 1.5;
    font-weight: 300;
}

h3 {
    margin-top: auto;
    margin-bottom: auto;
    font-size: 24px;
    line-height: 1;
    font-weight: 300;
}

h4 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1.25;
    font-weight: 300;
}

h5 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1;
    font-weight: 400;
}

h6 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-size: 12px;
    line-height: 1;
    font-weight: 400;
}

p {
    margin-bottom: 10px;
    line-height: 1.5;
}

a {
    text-decoration: underline;
}

img {
    display: inline-block;
    max-width: 100%;
}

.text-center {
    text-align: center;
}

.text-bold {
    font-weight: 700;
}

.paragraph-hero {
    font-size: 32px;
    line-height: 1.5;
    font-weight: 300;
}

.box-color {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 300px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-style: solid;
    border-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.06);
}

    .box-color.color-trim {
        background-color: hsla(0, 0%, 100%, 0.06);
    }

    .box-color.color-white {
        background-color: #fff;
    }

    .box-color.color-bg-dark {
        background-color: #282b2f;
    }

    .box-color.color-grey {
        background-color: #95979f;
    }

    .box-color.color-black {
        background-color: #000;
    }

    .box-color.color-blue {
        background-color: #65acfd;
    }

    .box-color.color-bg-lite {
        background-color: #282b2f;
    }

.container {
    width: clamp(89%, 89%, 92%);
    max-width: 100%; /*original max width was 1400px*/
    margin-left: 120px;
    padding: 20px 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    .container.w-container.workspace {
        max-width: 1080px;
    }

.grid {
    display: grid;
}

.searchbar-wrapper {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: sticky;
    top: 1%;
    background-color: rgba(22, 24, 26, 0.5);
    padding: 14px 14px;
    -webkit-backdrop-filter: brightness(100%) blur(5px);
    backdrop-filter: brightness(100%) blur(5px);
    border-radius: 4px;
    margin: 0 4px;
    display: flex !important;
}

.text-right {
    text-align: right;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.sfDashboardWrapper {
    width: 100%;
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: repeat(4, 1fr);
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    margin-bottom: 0;
    padding: 0;
}

.cultureReport h2 {
    margin: 20px 0;
}

.cultureReport h3 {
    font-size: 18px;
    margin: 20px 0;
    font-weight: 700;
}

.cultureReport h4 {
    font-size: 14px;
}

.card-analytics .respondentFeedback h2 {
    font-size: 1rem;
    font-weight: 700;
}

.sfDashboardWrapper-2 {
    width: 100%;
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    gap: 10px;
    grid-template-columns: 0.5fr 1fr 1fr 0.5fr; /*0.75fr 1fr 1fr 1fr;*/
    grid-template-rows: auto auto;
    margin-top: 20px;
    padding: 10px 20px;
}

.bg-clear {
    background: transparent;
}

#insights .sfDashboardWrapper-2 {
    column-gap: 10px;
    row-gap: 0;
    margin-top: 0;
    padding: 0;
}

#insights .container {
    margin-left: auto;
    padding: 0 0% 0 120px;
    width: 100%;
}

#surveys.sfDashboardWrapper-2,
#MainBody.sfDashboardWrapper-2 {
    column-gap: 10px;
    row-gap: 0;
    margin-top: 0;
    padding: 0;
}

#SurveySectionBody .container,
#MainBodySection .container {
    margin-left: auto;
    padding: 0 0% 0 120px;
    width: 100%;
}

.card-analytics {
    display: flex;
    max-width: 100%;
    min-height: 1px;
    padding: 10px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1;
    text-align: center;
    background-color: #201f1f;
    box-shadow: 0 4px 4px 1px rgba(0, 0, 0, 0.15);
    transition: box-shadow 0.2s;
    border: 1px #414040 solid;
    border-radius: 8px;
    color: #ffffff;
    position: relative;
    overflow-wrap: anywhere;
}

    .card-analytics.nofill {
        background-color: transparent;
        border: 0;
        box-shadow: none;
    }

.bottom-container {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 10px;
    align-items: baseline;
    width: 100%;
    justify-content: center;
}

.flex-horizontal {
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

    .flex-horizontal._20gap {
        grid-column-gap: 120px;
    }

    .flex-horizontal.justify-end {
        justify-content: space-between;
        align-items: center;
    }

.container.flex-horizontal {
    display: flex;
    flex-direction: row;
    align-items: stretch;
}

.flex-vertical {
    display: flex;
    flex-direction: column;
}

.container.flex-vertical {
    display: flex;
    flex-direction: column;
}

.section {
    z-index: 999;
    flex: 1;
}

    .section.login-main {
        position: relative;
        z-index: 4;
        display: flex;
        height: 100vh;
        padding-top: 20px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        overflow: hidden;
    }

.image {
    height: auto;
    max-width: 100%;
}


.heading-hero {
    z-index: 1;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 60px;
    font-weight: 300;
}

.workspacepanel {
    display: flex;
    min-height: 1px;
    flex-direction: column;
    gap: 10px;
}

.drawer-menu-container {
    overflow: auto;
    height: 100vh;
    width: 100%;
    padding-bottom: 60px;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.column-1 {
    position: sticky;
    top: 0px;
    background-color: #202225;
}

.my-personal-information {
    display: block;
    max-width: 470px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.drawer-menu-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-radius: 0;
    cursor: pointer;
    border-bottom: 1px solid rgb(255,255,255,.10);
    padding-left: 60px;
}

    .drawer-menu-item:last-of-type {
        border-bottom: 0;
    }

    .drawer-menu-item:hover, .drawer-menu-item.active {
        background-color: #282b2f;
    }

    .drawer-menu-item.no-link:hover {
        background-color: transparent;
    }

.caption {
    font-size: 13px;
}

    .caption.colorgrey {
        padding-top: 4px;
        color: #95979f;
    }

.column-2 {
    padding-bottom: 60px;
}

.drawer {
    position: fixed;
    left: 0%;
    top: 100%;
    right: 0%;
    bottom: 0%;
    z-index: 999;
    display: block;
    width: 100%;
    background-color: #282b2f;
}

.drawer-header {
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: auto;
    z-index: 2;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 10px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #202225;
}

.bttn-w-icon {
    margin-right: 20px;
    background-color: transparent;
    color: #95979f;
    cursor: pointer;
}

.text-field {
    width: 100%;
    padding-top: 24px;
    padding-bottom: 24px;
    border-style: solid;
    border-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.06);
    background-color: transparent;
    color: #fff;
}

.field-label {
    margin-top: 15px;
    color: #95979f;
    font-size: 14px;
    font-weight: 600;
}

    .field-label.colorwhite {
        color: #fff;
    }

.dropdown-toggle {
    color: #fff;
}

.brand {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.drawer-title {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    margin-top: 0;
}

.avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 140px;
    height: 140px;
    margin-bottom: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 100%;
    background-color: #65acfd;
    cursor: pointer;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.default-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 140px;
    height: 140px;
    margin-bottom: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 100%;
    background-color: #65acfd;
    cursor: pointer;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

.directory-listing-avatar {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 35px;
    height: 35px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 100%;
    background-color: #65acfd;
    cursor: pointer;
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
    font-size: 13px;
}

.avatar.shadow {
    background-color: #354b76;
}

.marketplace-listing-avatar {
    min-width: 44px;
    width: 44px;
    height: 44px;
    border-radius: 100%;
    background-color: transparent;
    overflow: hidden;
}

    .marketplace-listing-avatar img {
        width: 100%;
    }

.my-notifications {
    display: flex;
    flex-direction: column;
    gap: 40px;
    max-width: 470px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.notification-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 10px;
    padding-bottom: 10px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

    .notification-item:hover {
        background-color: #282b2f;
    }

.my-security {
    display: block;
    max-width: 470px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.card-status-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: transparent;
}

.page-header {
    display: flex;
    margin-bottom: 20px;
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    justify-content: space-between;
}

    .page-header .bttn-primary {
        -webkit-box-flex: 0;
        -webkit-flex: 0;
        -ms-flex: 0;
        flex: 0;
    }
/*.page-header {
  display: -ms-grid;
  display: grid;
  margin-bottom: 20px;
  grid-auto-columns: 1fr;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-columns: 1fr -webkit-max-content;
  -ms-grid-columns: 1fr max-content;
  grid-template-columns: 1fr -webkit-max-content;
  grid-template-columns: 1fr max-content;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
}*/
.no-flex {
    flex: 0 !important;
    -ms-flex: 0 !important;
    -webkit-flex: 0 !important;
}

.e-font-16 {
    font-size: 1rem;
}

.sidebar-footer {
    position: -webkit-sticky;
    position: sticky;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: auto;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 10px;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #202225;
}

.sidebar-body {
    overflow: auto;
    padding: 10px 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

    .sidebar-body.grid_2x2 {
        display: grid;
        grid-auto-columns: 1fr;
        grid-template-columns: 1fr 0.35fr;
        grid-template-rows: auto;
        gap: 20px;
        padding: 10px 20px;
    }

    .sidebar-body.flex-vertical {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

.sidebar-header {
    position: sticky;
    top: 0px;
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 16px 20px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #202225;
    border-bottom: 1px solid hsla(0, 0%, 100%, 0.06);
}

    .sidebar-header .flex-vertical > span {
        font-size: 13px;
        color: var(--dark-grey);
    }

.sidebar-menu-item {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding: 10px 20px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border-radius: 4px;
    cursor: pointer;
}

    .sidebar-menu-item:hover {
        background-color: hsla(0, 0%, 100%, 0.06);
    }

    .sidebar-menu-item.flex-horizontal {
        -webkit-flex-direction: row !important;
        -ms-flex-direction: row !important;
        flex-direction: row !important;
        gap: 10px;
    }

        .sidebar-menu-item.flex-horizontal .flex-vertical {
            max-width: 80%;
        }

.noresults {
    justify-content: end;
    align-items: center;
    flex-direction: column;
    display: flex;
    min-height: 280px;
    margin: 40px 0;
    background: url(../images/nocomments-01.svg) center top / 200px no-repeat;
}

.item-container {
    display: flex;
    text-align: center;
    height: 70%;
    padding: .5rem;
    font-size: 2rem;
    font-weight: 400;
    gap: 10px;
}

    .item-container.income {
        color: #17a00e
    }

    .item-container.balance {
        color: #008cff;
    }

    .item-container.transaction {
        color: #f41127;
    }

    .item-container.expense {
        color: #ca765a;
    }

.e-panel-content {
    padding: 1rem;
}

.sidebar-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
}

.bttn-secondary {
    margin-right: 4px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: transparent;
    color: #95979f;
    text-align: center;
}

.text-red, .color-red {
    color: #ff5356 !important;
}

.bttn-secondary.text-red {
    color: #ff5356;
}

.bttn-primary {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    background-color: #354b76;
    color: #cae3ff;
    text-align: center;
    align-self: center;
    justify-self: center;
}

.bttn-outlined {
    margin-right: 4px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 4px !important;
    border: 1px solid #65ACFD !important;
    background-color: transparent;
    color: #cae3ff;
    text-align: center;
    align-self: center;
    justify-self: center;
}

.span-2 {
    grid-column: span 2;
}

.span-3 {
    grid-column: span 3;
}

.span-4 {
    grid-column: span 4;
}

.sidebar-extended {
    position: fixed;
    left: auto;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 999;
    display: block;
    width: 100%;
    min-width: 600px;
    height: 100vh;
    max-width: 100%;
    background-color: #282b2f;
    box-shadow: 0 0 16px 8px rgba(32, 34, 37, 0.6);
}

.wrapper {
    display: block;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

    .wrapper.grid {
        display: -ms-grid;
        display: grid;
        grid-auto-columns: 1fr;
        grid-column-gap: 16px;
        grid-row-gap: 0px;
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
        -ms-grid-rows: auto;
        grid-template-rows: auto;
    }

        .wrapper.grid.ccinfo {
            grid-column-gap: 8px;
            grid-row-gap: 8px;
        }

    .wrapper.flex-horizontal {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .wrapper.flex-vertical {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        align-items: flex-start;
        -webkit-align-items: flex-start;
    }

.list.flex-horizontal {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.list.flex-vertical {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    align-items: normal;
    -webkit-align-items: normal;
    min-height: 500px;
    row-gap: 3px;
}

.justify-left {
    justify-content: left;
}

.header-section-title-wbreak {
    margin-top: 30px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid hsla(0, 0%, 100%, 0.06);
    /*color: #65acfd;*/
    color: #ffffff;
}

.drawer-body {
    overflow: scroll;
    height: 100vh;
}

.bttn-submenu {
    padding: 9px 15px;
    border-radius: 4px;
    background-color: transparent;
    text-align: center;
    cursor: pointer;
}

    .bttn-submenu.visible-mobile {
        display: none;
    }

.utility-page-wrap {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100vw;
    height: 100vh;
    max-height: 100%;
    max-width: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

.utility-page-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 260px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
}

.utility-page-form {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.control-wrapper {
    background-color: #16181a;
}

.main-panel {
    width: 60%;
}

.side-panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 40%;
}

.grid-2 {
    grid-template: 1fr 1fr / 1fr 1fr;
    display: grid;
    gap: 10px;
}

.panel-details {
    min-width: 900px;
    max-width: 900px;
    padding: 40px;
    min-height: 1500px;
    flex: 1;
    margin-bottom: 50px;
}

    .panel-details.ContCat {
        min-width: 900px;
        max-width: 900px;
    }

.dropdown {
    display: block;
    border-style: solid;
    border-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.06);
}

.cover-image-preview {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    max-height: 286px;
    margin-bottom: 20px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 8px;
    background: linear-gradient(136deg, #E96443 0.56%, #904E95 75.32%);
    -o-object-fit: cover;
    object-fit: cover;
}

    .cover-image-preview.shadow {
        box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.30);
    }

.cover-img-wrapper {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bttn-update-cover-img {
    position: absolute;
}

.bttngroup-wrapper-fixed {
    bottom: 0;
    left: 25%;
    position: fixed;
    display: flex;
    gap: 4px;
    width: 73.5%;
    min-width: 1px;
    min-height: 1px;
    padding: 10px 30px;
    background: #282b2f;
}

.bttngroup-wrapper {
    display: flex;
    gap: 4px;
    width: 100%;
    min-width: 1px;
    min-height: 1px;
    padding: 10px 0;
}

    .bttngroup-wrapper.justify-right, .bttngroup-wrapper-fixed.justify-right {
        justify-items: end;
        justify-content: flex-end;
    }

    .bttngroup-wrapper.justify-left, .bttngroup-wrapper-fixed.justify-left {
        justify-items: start;
        justify-content: flex-start;
    }

.episode-caption-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-column-gap: 4px;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
}

.panel-series-episodes, .panel-dept-team {
    display: block;
    max-width: 100%; /*720px*/
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.e-accordion {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-row-gap: 4px;
    justify-content: flex-start;
    background: none;
    border: none; /*1px solid #414040*/
}

    .e-accordion .e-acrdn-item.e-selected.e-select {
        background: #201f1f;
        border: 1px solid #414040
    }

.episode-wrapper, .team-wrapper {
    padding-bottom: 20px;
}

.team-wrapper-grid, .episodes-wrapper-grid, .collections-wrapper-grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: repeat(2, 1fr);
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
}

.accordion-item {
    overflow: hidden;
    margin-bottom: 20px;
    border-style: solid;
    border-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.06);
}

.accordion-item-cover-image {
    position: absolute;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.accordion-item-overview {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    padding: 4px 18px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end;
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    -webkit-backdrop-filter: brightness(100%) blur(5px);
    backdrop-filter: brightness(100%) blur(5px);
    text-wrap: balance;
}

.accordion-item-header {
    position: absolute;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    min-height: 340px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    background-color: #202225;
    cursor: pointer;
    width: 100%;
    top: 0;
}

.accordion-header-title {
    margin-top: 0px;
    margin-bottom: 10px;
    line-height: 1.26;
    font-size: 1.2rem;
}

.episode-caption-wrapper .caption {
    text-transform: uppercase;
}

.accordion-body {
    display: -ms-grid;
    display: grid;
    min-height: 200px;
    padding: 20px 10px 10px;
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    border-top: 0px solid hsla(0, 0%, 100%, 0.06);
}

.card-wrapper.grid {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    -ms-grid-columns: 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
}

.card-type-caption {
    padding: 0px 10px 0px;
    color: #95979f;
    font-size: 13px;
}

.card-cover-image {
    width: 100%;
    max-height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.card-header {
    padding: 10px;
}

.shadow {
    box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.15);
}

.card-cover-image-wrapper {
    overflow: hidden;
    max-height: 160px;
    border-radius: 10px;
}

.file-upload {
    max-width: 820px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.panel-analytics {
    max-width: 100%;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.panel-external-url-reference {
    max-width: 820px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.panel-text-editor {
    max-width: 100%;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.panel-link-media {
    max-width: 1200px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.text-block {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.bttn-dashed {
    margin-right: 4px;
    padding: 30px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-style: dashed;
    border-width: 1px;
    border-color: hsla(0, 0%, 100%, 0.06);
    border-radius: 4px;
    background-color: hsla(0, 0%, 100%, 0.06);
    color: #95979f;
    text-align: center;
}

.header-section-title-nobreak {
    margin-top: auto;
    margin-bottom: auto;
    padding-bottom: 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #65acfd;
}

    .header-section-title-nobreak.colorwhite {
        color: #fff;
    }

.my-system-preferences {
    display: block;
    max-width: 470px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.my-integrations {
    display: block;
    max-width: 100%;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.my-billing {
    display: block;
    max-width: 940px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.flex-grow {
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
}

.row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin: 20px 0 0 0;
}

.align-right {
    justify-content: end;
    text-align: right;
}

.align-left {
    align-items: flex-start;
}

.fullWidth {
    width: 100%;
}

.fullHeight {
    height: 100%;
}

.autoWidth {
    width: auto !important;
}

hr {
    border: 1px solid hsla(0, 0%, 100%, 0.06);
    margin: 20px 0 20px 0;
}

.creditcard {
    max-width: 480px;
    padding: 30px;
    border-radius: 12px;
    background-color: #8688bc;
}

.ccimage {
    height: 64px;
}

.my-domains {
    display: block;
    max-width: 470px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.html-embed {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}


.assets.body-grid { /*this is used to create the 4 column grid for asset library module*/
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    grid-column-gap: 4px;
    grid-row-gap: 4px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: repeat(4, 1fr);
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
    margin-bottom: 40px;
    padding: 10px 40px;
}

.grid-images { /*this is used to keep images inside of a grid proportionate within asset library module*/
    width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    cursor: pointer;
}

.drawer-details-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    /*    max-width: 83.44333333%;*/
    max-width: 100%;
    overflow-x: hidden;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.80);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: fixed;
    top: 0;
    right: 0; /*bring it in to 2%**/
}

.image-snippet {
    height: 250px;
    width: 100%;
    object-fit: cover;
}

.image-info-wrapper-header {
    position: sticky;
    top: 0;
    background: #202225;
    padding: 8px 8px 8px 0;
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.4);
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

    .image-info-wrapper-header .bttn-primary {
        flex-grow: 0;
    }

.image-info-wrapper-footer {
    background: #202225;
    padding-top: 10px;
    padding-bottom: 10px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    grid-column-gap: 4px;
}

.image-info-container {
    padding: 10px;
    overflow-y: auto;
    height: 590px;
}

.image-info-wrapper.no-selection {
    display: flex;
    font-size: 14px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}

#w-node-span4-on-grid {
    grid-row-start: span 1;
    grid-row-end: span 1;
    grid-column-start: span 4;
    grid-column-end: span 5;
    margin-bottom: 0px;
    column-gap: 8px;
}

#span-2-4 {
    grid-row: span 4;
    grid-column: span 2;
}

#w-node-span2-on-grid {
    grid-row-start: span 1;
    grid-row-end: span 1;
    grid-column-start: span 2;
    grid-column-end: span 2;
    margin-bottom: 0px;
    display: inline-flex;
    column-gap: 8px;
}

#w-node-span3-on-grid {
    grid-row-start: span 1;
    grid-row-end: span 1;
    grid-column-start: span 3;
    grid-column-end: span 3;
    margin-bottom: 0px;
    display: inline-flex;
    column-gap: 8px;
}

.panel-subscribe {
    max-width: 820px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.panel-linked-resources {
    max-width: 820px;
    padding: 40px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.container-login {
    max-width: 476px;
}

.alert-g2d {
    position: fixed;
    left: 0%;
    top: 0%;
    right: 0%;
    bottom: 0%;
    z-index: 99999;
    display: none;
    width: 100%;
    height: 100%;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: rgba(22, 24, 26, 0.9);
    -webkit-backdrop-filter: blur(9px);
    backdrop-filter: blur(9px);
}

.alert-g2d-container {
    max-width: 960px;
    padding: 40px 20px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: #e87461;
    text-align: center;
}

    .alert-g2d-container.flex-horizontal {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
    }

    .alert-g2d-container.flex-vertical {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

.login-wrapper, .forgotpass-wrapper, .verify-sms-wrapper, .verify-alt-wrapper, .onboard-step1-wrapper, .onboard-step2-wrapper, .onboard-confirm2FA-wrapper, .chooseportal-wrapper {
    z-index: 1;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    gap: 4px;
    width: 476px;
    min-height: 344.19px;
    max-width: 100%;
    padding-right: 10px;
    padding-left: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-flex: 0;
    -webkit-flex: 0 auto;
    -ms-flex: 0 auto;
    flex: 0 auto;
}

.dept-share-mgmt-form {
    min-height: 400px;
    max-height: 500px;
    background: #202225;
    padding: 10px;
    border-radius: 10px;
    border: 1px solid rgb(255, 255, 255, .10);
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    gap: 20px;
    margin: 20px 0;
}

.list.flex-vertical {
    min-height: 400px;
    max-height: 500px;
}

.m0 {
    margin: 0;
}

.mlmr20 {
    margin-left: 20px;
    margin-right: 20px;
}

.pb0 {
    padding-bottom: 0;
}

.ml-4 {
    margin-left: 4px;
}

.login-footer {
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}

.container-login-footer {
    max-width: 476px;
    padding-bottom: 20px;
}

.login-splash-left {
    position: absolute;
    z-index: -1;
    left: -30px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 320px;
    height: 100%;
    background-image: url('../images/login-pattern2.png');
    background-position: 0% 50%;
    background-size: auto;
    background-repeat: repeat-x;
    opacity: 0.2;
}

.login-splash-right {
    position: absolute;
    z-index: -1;
    left: auto;
    top: 0%;
    right: -30px;
    bottom: 0%;
    width: 320px;
    height: 100%;
    background-image: url('../images/login-pattern2.png');
    background-position: 100% 50%;
    background-size: auto;
    background-repeat: repeat-x;
    opacity: 0.2;
}

.bg-dark {
    background-color: #202225;
}

.brand-login {
    padding-bottom: 20px;
}

.navi {
    /*width: clamp(120px, 5%, 1200px); min-ideal-max*/
    width: clamp(120px, 120px, 1200px); /*min-ideal-max*/
    position: fixed;
    left: 0px;
    background-color: #202225;
    z-index: 999;
    height: 100%;
    display: flex;
    padding: 0;
    box-shadow: inset 0px 0px 6px rgba(0, 0, 0, 0.25);
    border-right: 1px solid var(--trims);
}

#workspaceHub.container {
    margin-right: 0;
    width: clamp(89%, 89%, 92%);
    padding-left: 20px;
    margin-left: 120px;
}

@media screen and (min-width: 992px) and (max-width: 1280px) {
    #workspaceHub.container {
        margin-left: 120px;
        width: 89%;
    }
}

.navi-menu {
    display: flex;
    flex-grow: 1;
    overflow: hidden;
    background-color: transparent; /*#202225*/
    flex-direction: column;
    align-items: center;
    width: 100%;
    padding: 0 8px;
}

.container-navi {
    justify-content: space-between;
    flex: 1;
    flex-direction: column;
    display: flex;
    margin-right: auto;
    margin-left: auto;
    padding: 0px;
}

.navi-link {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 14px;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.25s ease-out;
    border-bottom: 2px #202225 solid;
    gap: 6px;
    width: 100%;
    border-radius: 0;
}

    .navi-link .e-icons.e-medium {
        font-size: 18px;
    }

    .navi-link label {
        font-size: 11px;
        font-weight: 700;
        margin: 0;
        cursor: pointer;
    }

    .navi-link:hover {
        background-color: #282b2f;
    }

    .navi-link.active {
        background-color: #282b2f;
        width: 100%;
    }

.bttn-navi {
    display: none;
    padding: 9px 15px;
    border-radius: 4px;
    background-color: transparent;
    text-align: center;
    cursor: pointer;
}

    .bttn-navi.visible-mobile {
        display: none;
    }

.navi-brand {
    position: static;
}

@media screen and (min-width: 1920px) {
    .column-1 {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: end;
        -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
        justify-content: flex-end;
    }

    .column-3 {
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-pack: start;
        -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
        justify-content: flex-start;
    }
}

@media screen and (max-width: 991px) {
    .navi-link label {
        display: none;
    }

    .container {
        padding-right: 20px;
        padding-left: 20px;
    }

    .drawer-menu-container {
        padding-bottom: 0px;
    }

    .my-personal-information {
        padding-right: 20px;
        padding-left: 20px;
    }

    .column-2 {
        background-color: #282b2f;
    }

    .my-notifications {
        padding-right: 20px;
        padding-left: 20px;
    }

    .my-security {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-details {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-series-episodes, .panel-dept-team {
        padding-right: 20px;
        padding-left: 20px;
    }

    .card-wrapper.grid {
        -ms-grid-columns: 1fr 1fr;
        grid-template-columns: 1fr 1fr;
    }

    .file-upload {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-analytics {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-external-url-reference {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-text-editor {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-link-media {
        padding-right: 20px;
        padding-left: 20px;
    }

    .my-system-preferences {
        padding-right: 20px;
        padding-left: 20px;
    }

    .my-integrations {
        padding-right: 20px;
        padding-left: 20px;
    }

    .my-billing {
        padding-right: 20px;
        padding-left: 20px;
    }

    .my-domains {
        padding-right: 20px;
        padding-left: 20px;
    }

    .assets.body-grid {
        padding-right: 20px;
        padding-left: 20px;
    }

    .menu-button {
        background-color: transparent;
    }

        .menu-button.w--open {
            background-color: transparent;
        }

    .panel-subscribe {
        padding-right: 20px;
        padding-left: 20px;
    }

    .panel-linked-resources {
        padding-right: 20px;
        padding-left: 20px;
    }

    .login-splash-left {
        left: 0%;
        top: 0%;
        right: auto;
        bottom: auto;
        width: 100%;
        height: 37%;
        background-repeat: repeat-x;
        opacity: 0.2;
    }

    .login-splash-right {
        left: auto;
        top: 0%;
        right: 0%;
        bottom: auto;
        width: 100%;
        height: 403px;
        background-position: 50% 0%;
        background-repeat: repeat-x;
        opacity: 0.2;
    }

    .brand-login {
        text-align: center;
    }

    .navi-menu {
        position: fixed;
        top: 52px;
        z-index: 999;
        width: 100%;
        display: block;
    }

    .container-navi {
        padding-right: 0px;
        padding-left: 0px;
        justify-content: space-between;
    }

    .navi-link {
        display: block;
    }

        .navi-link:hover {
            background-color: #282b2f;
        }

    .bttn-navi {
        display: block;
        margin-right: 20px;
    }

    .navi-brand {
        padding-left: 20px;
        -webkit-box-flex: 1;
        -webkit-flex: 1;
        -ms-flex: 1;
        flex: 1;
    }

    .alert-g2d {
        position: fixed;
        left: 0%;
        top: 0%;
        right: 0%;
        bottom: 0%;
        z-index: 9999;
        display: -webkit-box;
        display: -webkit-flex;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
        height: 100%;
        -webkit-box-pack: center;
        -webkit-justify-content: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -webkit-align-items: center;
        -ms-flex-align: center;
        align-items: center;
        background-color: rgba(22, 24, 26, 0.95);
    }

    .alert-g2d-container {
        padding-right: 20px;
        padding-left: 20px;
    }
}

@media screen and (max-width: 767px) {
    .paragraph-hero {
        -webkit-box-flex: 0;
        -webkit-flex: 0 auto;
        -ms-flex: 0 auto;
        flex: 0 auto;
    }

    .heading-hero {
        position: relative;
    }

    .workspacepanel {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .workspacebttn {
        max-width: 100%;
    }

    .drawer-menu-container {
        overflow: hidden;
        height: auto;
        padding-bottom: 0px;
    }

    .column-1 {
        position: fixed;
        top: 62px;
        z-index: 999;
    }

    .my-personal-information {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .drawer-menu-item.hidden-mobile {
        display: none;
    }

    .drawer-title {
        font-size: 30px;
        text-align: center;
    }

    .my-notifications {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .my-security {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .sidebar-extended {
        width: 100%;
    }

    .bttn-submenu.visible-mobile {
        display: block;
    }

    .panel-details {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-series-episodes, .panel-dept-team {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .accordioin-item-overview {
        padding-right: 10px;
        padding-left: 10px;
    }

    .card-wrapper.grid {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .file-upload {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-analytics {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-external-url-reference {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-text-editor {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-link-media {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .drawer-status {
        display: none;
    }

    .hidden-mobile {
        display: none;
    }

    .my-system-preferences {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .my-integrations {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .my-billing {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .my-domains {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .assets.body-grid {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-subscribe {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .panel-linked-resources {
        max-width: 100%;
        padding-right: 10px;
        padding-left: 10px;
    }

    .navi-menu {
        position: fixed;
        top: 52px;
        z-index: 999;
        width: 100%;
        display: block;
    }

    .container-navi {
        padding-right: 0px;
        padding-left: 0px;
    }

    .navi-link {
        display: block;
    }

    .bttn-navi.visible-mobile {
        display: block;
    }

    .column-3 {
        position: fixed;
        top: 62px;
        z-index: 999;
    }
}

@media screen and (max-width: 479px) {
    .paragraph-hero {
        font-size: 25px;
    }

    .container {
        padding-right: 20px;
        padding-left: 20px;
    }

    .heading-hero {
        padding: 0px;
        font-size: 30px;
    }

    .workspacepanel {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .my-personal-information {
        padding-right: 0px;
        padding-left: 0px;
    }

    .container-nav {
        padding-right: 20px;
        padding-left: 20px;
    }

    .drawer-header {
        padding-right: 0px;
        padding-left: 0px;
    }

    .drawer-title {
        font-size: 25px;
    }

    .my-notifications {
        padding-right: 0px;
        padding-left: 0px;
    }

    .my-security {
        padding-right: 0px;
        padding-left: 0px;
    }

    .page-header {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .bttn-secondary {
        width: 100%;
    }

    .bttn-primary {
        width: 100%;
    }

    .wrapper.grid {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
    }

    .panel-details {
        padding-right: 0px;
        padding-left: 0px;
    }

    .bttngroup-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .panel-series-episodes, .panel-dept-team {
        padding-right: 0px;
        padding-left: 0px;
    }

    .file-upload {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-analytics {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-external-url-reference {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-text-editor {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-link-media {
        padding-right: 0px;
        padding-left: 0px;
    }

    .my-system-preferences {
        padding-right: 0px;
        padding-left: 0px;
    }

    .my-integrations {
        padding-right: 0px;
        padding-left: 0px;
    }

    .my-billing {
        padding-right: 0px;
        padding-left: 0px;
    }

    .my-domains {
        padding-right: 0px;
        padding-left: 0px;
    }

    assets.body-grid {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-subscribe {
        padding-right: 0px;
        padding-left: 0px;
    }

    .panel-linked-resources {
        padding-right: 0px;
        padding-left: 0px;
    }

    .login-splash-right {
        background-position: 0% 0%;
        display: none;
    }
}

#w-node-a4cad426-2990-77c6-206c-9e5b8043b36a-77cc8b62 {
    -ms-grid-column-align: end;
    justify-self: end;
}

#w-node-_99d1478b-6561-c7ff-6282-99059c677207-77cc8b62 {
    -ms-grid-column-align: end;
    justify-self: end;
}

#w-node-b56630d0-c90c-1202-348a-4c999df84981-115bfc40 {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    -ms-grid-column-align: center;
    justify-self: center;
}


#w-node-b56630d0-c90c-1202-348a-4c999df84981-46408baf {
    -webkit-align-self: center;
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    -ms-grid-column-align: center;
    justify-self: center;
}

@media screen and (max-width: 479px) {
    #w-node-a4cad426-2990-77c6-206c-9e5b8043b36a-77cc8b62 {
        -ms-grid-column-align: start;
        justify-self: start;
    }

    #w-node-_99d1478b-6561-c7ff-6282-99059c677205-77cc8b62 {
        -ms-grid-column-span: 1;
        grid-column-end: 2;
        -ms-grid-column: 1;
        grid-column-start: 1;
        -ms-grid-row-span: 1;
        grid-row-end: 3;
        -ms-grid-row: 2;
        grid-row-start: 2;
    }

    #w-node-_99d1478b-6561-c7ff-6282-99059c677207-77cc8b62 {
        -ms-grid-column-align: start;
        justify-self: start;
    }

    #w-node-b56630d0-c90c-1202-348a-4c999df84981-115bfc40 {
        -ms-grid-column-align: auto;
        justify-self: auto;
    }

    #w-node-b56630d0-c90c-1202-348a-4c999df84981-46408baf {
        -ms-grid-column-align: auto;
        justify-self: auto;
    }

    .alert-g2d-container {
        padding-right: 20px;
        padding-left: 20px;
    }
}