﻿html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, img, ins, kbd, q, samp,
sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
    font-family: var(--font-base)
}

:root {
    --color-toast-success: #67c23b;
    --border-color-toast-success: #8be260;
    --bg-color-toast-success: #d6eccc;
    --color-toast-info: #0e6990;
    --border-color-toast-info: #55a8cc;
    --color-danger: #C34E55;
    --bg-color-toast-info: #94DFFF;
    --color-toast-warning: #e2a02d;
    --border-color-toast-warning: #ffce79;
    --bg-color-toast-warning: #faeacd;
    --color-toast-danger: #ca3434;
    --border-color-toast-danger: #fa8080;
    --bg-color-toast-danger: #f2d5d5;
    --font-base: Segoe UI;
    --shadow-white-box: 0 0 0 1px rgba(0, 0, 0, .08), -2px 4px 4px rgba(0,0,0, .14);
    --font-panel: 'Montserrat';
    --color-primary: #4DC591;
    --color-bg-primary: #e4fff3;
    --primary: #FF6A59;
    --secondary: #4CBC9A;
    --secondary-dark: #3a9b7e;
    --primary-hover: #ff3c26;
    --primary-dark: #bf1400;
    --rgba-primary-1: rgba(255, 106, 89, 0.1);
    --rgba-primary-2: rgba(255, 106, 89, 0.2);
    --rgba-primary-3: rgba(255, 106, 89, 0.3);
    --rgba-primary-4: rgba(255, 106, 89, 0.4);
    --rgba-primary-5: rgba(255, 106, 89, 0.5);
    --rgba-primary-6: rgba(255, 106, 89, 0.6);
    --rgba-primary-7: rgba(255, 106, 89, 0.7);
    --rgba-primary-8: rgba(255, 106, 89, 0.8);
    --rgba-primary-9: rgba(255, 106, 89, 0.9);
    --rgba-secondary-1: rgba(76, 188, 154, 0.1);
    --rgba-secondary-2: rgba(76, 188, 154, 0.2);
    --rgba-secondary-3: rgba(76, 188, 154, 0.3);
    --rgba-secondary-4: rgba(76, 188, 154, 0.4);
    --rgba-secondary-5: rgba(76, 188, 154, 0.5);
    --rgba-secondary-6: rgba(76, 188, 154, 0.6);
    --rgba-secondary-7: rgba(76, 188, 154, 0.7);
    --rgba-secondary-8: rgba(76, 188, 154, 0.8);
    --rgba-secondary-9: rgba(76, 188, 154, 0.9);
    --font-family-base: Roboto, sans-serif;
    --font-family-title: Roboto, sans-serif;
    --title: #374557;
    --color-secondary: #9BA1FF;
    --color-bg-secondary: #e6e7fa;
    --color-s-bg-secondary: #f4f5ff;
    --color-light-bg-secondary: #f3f4fc;
    --color-danger: #C34E55;
    --color-tertiary: #ff7648;
    --color-bg-tertiary: #fff2ed;
    --color-main-text: #191B32;
    --color-body-text: #9295A3;
    --color-bg-body-text: #c8c8cc;
    --color-bg-s-body-text: rgba(236, 236, 236, .81);
    --color-warning: #f0c77f;
    --color-bg-warning: #fff9ee;
    --color-primary-gradiant: linear-gradient(360deg, rgba(232,250,248,1) 0%, rgba(134,237,210,1) 100%);
    --color-secondary-gradiant: linear-gradient(180deg, rgba(179,184,250,1) 0%, rgba(126,131,230,1) 100%);
    --color-body-text-color: #a8a8a8;
    --title-1: 26px;
    --title-2: 24px;
    --title-3: 22px;
    --title-4: 20px;
    --body-1: 18px;
    --body-2: 14px;
    --body-3: 13px;
    --bar-color: #38b000;
    --body-color: #222;
    --text-color: white;
    --bar-wrap-back-color: white;
}
/* #### Generated By: http://www.cufonfonts.com #### */


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 100;
    src: url('/Common/font/poppins/Poppins-Thin.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 100;
    src: url('/Common/font/poppins/Poppins-ThinItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 200;
    src: url('/Common/font/poppins/Poppins-ExtraLight.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 200;
    src: url('Poppins-ExtraLightItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 300;
    src: url('/Common/font/poppins/Poppins-Light.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 300;
    src: url('/Common/font/poppins/Poppins-LightItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    src: url('/Common/font/poppins/Poppins-Medium.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 500;
    src: url('/Common/font/poppins/Poppins-MediumItalic.woff') format('woff');
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url('/Common/font/poppins/Poppins-SemiBold.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 600;
    src: url('/Common/font/poppins/Poppins-SemiBoldItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    src: url('/Common/font/poppins/Poppins-Regular.woff') format('woff');
}

@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 900;
    src: url('/Common/font/poppins/Poppins-Bold.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: 900;
    src: url('/Common/font/poppins/Poppins-BoldItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: bold;
    src: url('/Common/font/poppins/Poppins-ExtraBold.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: normal;
    src: url('/Common/font/poppins/Poppins-ExtraBoldItalic.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: bolder;
    src: url('/Common/font/poppins/Poppins-Black.woff') format('woff');
}


@font-face {
    font-family: 'Poppins';
    font-style: italic;
    font-weight: bolder;
    src: url('Poppins-BlackItalic.woff') format('woff');
}

/* montserrat-100 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 100;
    src: url('../font/montserrat/montserrat-v18-latin-100.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-100.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-100.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-200 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 200;
    src: url('../font/montserrat/montserrat-v18-latin-200.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-200.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-200.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-200.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-200.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-200.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-regular - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 400;
    src: url('../font/montserrat/montserrat-v18-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-regular.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-500 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 500;
    src: url('../font/montserrat/montserrat-v18-latin-500.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-500.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-500.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-500italic - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 500;
    src: url('../font/montserrat/montserrat-v18-latin-500italic.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-500italic.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-500italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-700 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 700;
    src: url('../font/montserrat/montserrat-v18-latin-700.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-700.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-700.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-600italic - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 600;
    src: url('../font/montserrat/montserrat-v18-latin-600italic.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-600italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-600italic.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-600italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-800 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 800;
    src: url('../font/montserrat/montserrat-v18-latin-800.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-800.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-800.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-900 - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: normal;
    font-weight: 900;
    src: url('../font/montserrat/montserrat-v18-latin-900.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-900.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-900.svg#Montserrat') format('svg'); /* Legacy iOS */
}
/* montserrat-900italic - latin */
@font-face {
    font-family: 'Montserrat';
    font-style: italic;
    font-weight: 900;
    src: url('../font/montserrat/montserrat-v18-latin-900italic.eot'); /* IE9 Compat Modes */
    src: local(''), url('../font/montserrat/montserrat-v18-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('../font/montserrat/montserrat-v18-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-900italic.woff') format('woff'), /* Modern Browsers */
    url('../font/montserrat/montserrat-v18-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
    url('../font/montserrat/montserrat-v18-latin-900italic.svg#Montserrat') format('svg'); /* Legacy iOS */
}

@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 100;
    src: local('SF UI Display Ultralight'), url('../font/sf-ui/sf-ui-display-ultralight-58646b19bf205.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 200;
    src: local('SF UI Display Thin'), url('../font/sf-ui/sf-ui-display-thin-58646e9b26e8b.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 300;
    src: local('SF UI Display Light'), url('../font/sf-ui/sf-ui-display-light-58646b33e0551.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 400;
    src: local('SF UI Display Medium'), url('../font/sf-ui/sf-ui-display-medium-58646be638f96.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 500;
    src: local('SF UI Display Semibold'), url('../font/sf-ui/sf-ui-display-semibold-58646eddcae92.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 600;
    src: local('SF UI Display Bold'), url('../font/sf-ui/sf-ui-display-bold-58646a511e3d9.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 700;
    src: local('SF UI Display Heavy'), url('../font/sf-ui/sf-ui-display-heavy-586470160b9e5.woff') format('woff');
}


@font-face {
    font-family: 'SF-UI';
    font-style: normal;
    font-weight: 800;
    src: local('SF UI Display Black'), url('../font/sf-ui/sf-ui-display-black-58646a6b80d5a.woff') format('woff');
}

@font-face {
    font-family: 'Caveat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../font/Caveat.woff2") format('woff2');
}
/* latin */
@font-face {
    font-family: 'Caveat';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../font/Caveat2.woff2") format('woff2');
}

.dis-none {
    display: none !important;
}

.dis-block {
    display: block !important;
}


article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}


.modal.fade {
    display: none !important;
    padding: 0 !important
}

html {
    scroll-behavior: smooth;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

blockquote, q {
    quotes: none;
}

a {
    cursor: pointer;
    text-decoration: none !important;
}

#application {
    position: relative;
    z-index: 1;
    font-weight: 400;
    line-height: 1.5;
    color: #777777;
    background-color: #F0F0F0;
    width: 100vw;
    min-height: 100vh;
    font-family: 'SF-UI','Open Sans',sans-serif;
}

.toggle-check-radio .knobs:before, .toggle-check-radio .knobs:after {
    position: absolute;
    top: 4px;
    left: 4px;
    width: fit-content;
    min-width: 5px;
    height: 25px;
    color: #fff;
    font-size: 13px;
    text-align: center;
    padding: 5px 7px;
    background-color: #f44336;
    border-radius: 5px;
    transition: all .3s ease;
    font-weight: 500;
    font-family: var(--font-base);
    line-height: 1;
    display: flex;
    align-items: center;
}

.user-profile-detail .toggle-check-radio .knobs:before, .user-profile-detail .toggle-check-radio .knobs:after {
    font-size: .6rem
}

.toggle-check-radio .knobs:before {
    content: 'Invisible';
}

.toggle-check-radio .knobs[disable-text]:before {
    content: attr(disable-text);
}

.toggle-check-radio .knobs[enable-text]:after {
    content: attr(enable-text);
}

.toggle-check-radio .knobs:after {
    right: -100%;
    left: auto;
    background-color: #03A9F4;
    transition: all 0.3s ease;
}

.toggle-check-radio .checkbox:checked + .knobs:before {
    left: -100%;
    transition: all 0.3s ease;
}

.toggle-check-radio .checkbox:checked + .knobs:after {
    right: 4px;
    transition: all 0.3s ease;
}

.toggle-filter-row .checkbox ~ .layer {
    background-color: #fff7f7;
    box-shadow: 1px 1px 5px rgba(208, 208,208, .87);
}

.button-cover {
    border-radius: 4px;
}

.button-cover, .knobs, .layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.periodic .button {
    position: relative;
    top: 50%;
    width: 80px;
    height: 34px;
    margin: 0;
    overflow: hidden;
}

    .periodic .button, .periodic.button .layer {
        border-radius: 7px;
    }

        .periodic .button.b2 {
            border-radius: 2px;
        }

.periodic .checkbox {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
    z-index: 3;
    transition: all 0.3s ease;
}

.knobs {
    z-index: 2;
    transition: all 0.3s ease;
}

.layer {
    width: 100%;
    background-color: #f4cbcb;
    transition: all 0.3s ease;
    z-index: 1;
}

.toggle-check-radio .checkbox:checked ~ .layer {
    background-color: #ebf7fc;
}

.check-box-control > label > .periodic {
    margin: 1px 4px 0 6px;
}

.check-box-control > label {
    padding: 10px 0 0 0;
    display: flex
}

span.check-box-control > .periodic {
    margin-top: 0 !important;
}

.check-center-control input {
    vertical-align: middle;
    margin-right: 2px
}

@media screen and (min-width: 768px) {
    .mobile-label-wallet {
        display: none !important;
    }
}

.mobile-label-wallet {
    padding: 7px 0;
    min-width: 72px;
}

@media screen and (min-width: 768px) {
    .global-mav-bar-blue p, .global-nav-bar-gold p {
        display: none;
    }
}

@media screen and (max-width:768px) {
    .mobile-label-wallet strong {
        font-weight: 600;
        color: var(--border-color-toast-warning);
    }
}

.frame-core {
    border-radius: 10px;
    background-color: #fff;
    min-height: 1px;
    border: 1px solid #ccc;
    margin-bottom: 10px;
}

.remove-category {
    opacity: 0;
    z-index: 1;
    transform: none;
}

.response-row .item-upload > a, .remove-answer, .remove-category {
    transform: rotate(45deg);
    position: absolute;
    top: -5px;
    right: -8px;
    z-index: 99;
    background-color: var(--color-danger);
    color: #fff !important;
    box-shadow: 1px 1px 5px #b0b0b0;
    width: 15px;
    height: 15px;
    font-size: 11px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .3s ease;
    border: none;
}

.modal-body {
    height: 100%;
    background: #fff;
}

    .modal-body > .row {
        background: #fff;
    }

.owl-disable .owl-stage {
    transform: none !important;
}

.owl-disable .owl-nav {
    display: none !important
}

.response-row .item-upload > a, .remove-answer, .remove-category {
    transform: rotate(45deg);
    position: absolute;
    top: -5px;
    right: -8px;
    z-index: 99;
    background-color: var(--color-danger);
    color: #fff !important;
    box-shadow: 1px 1px 5px #b0b0b0;
    width: 15px;
    height: 15px;
    font-size: 11px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity .3s ease;
    border: none;
}


.book-list-items .item-upload:hover .remove-category,
.file-upload:hover .remove-category,
.link-item:hover .remove-category,
.achievement-list li:hover .remove-category,
.img-magnifier-container:hover .remove-category,
.book-page-voice .item-upload:hover .remove-category,
.question-post:hover .remove-category,
.response-item:hover .remove-answer {
    opacity: 1
}

.remove-category {
    opacity: 0;
    z-index: 1;
    transform: none;
}

.assessment-item:hover .remove-category, .handel-uploader:hover .remove-category {
    opacity: 1;
    z-index: 1;
}

.remove-category.remove-icon-bottom {
    bottom: -2px;
    padding-top: 2px;
    top: auto;
}

.response-item .remove-answer {
    opacity: 0
}

@media (max-width: 575.98px) {
    .promo-container {
        background: #fff;
        position: fixed;
        border-radius: 100%;
        z-index: 12000;
        width: 260px;
        height: 260px;
        left: 50%;
        margin-left: -130px;
        top: 50%;
        margin-top: -130px;
        border: 6px solid #ffbc42;
        padding-top: 45px;
        line-height: 32px;
    }

    .sm-text {
        font-size: 16px;
    }

    .md-text {
        font-size: 20px;
    }

    .promo-container2 {
        background: rgba(216, 0, 50, 0.5);
        position: fixed;
        border-radius: 100%;
        z-index: 1099;
        width: 380px;
        height: 380px;
        left: 50%;
        margin-left: -190px;
        top: 50%;
        margin-top: -190px;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .promo-container {
        background: #fff;
        position: fixed;
        border-radius: 100%;
        z-index: 12000;
        width: 260px;
        height: 260px;
        left: 50%;
        margin-left: -130px;
        top: 50%;
        margin-top: -130px;
        border: 6px solid #ffbc42;
        padding-top: 45px;
        line-height: 32px;
    }

    .sm-text {
        font-size: 16px;
    }

    .md-text {
        font-size: 20px;
    }

    .promo-container2 {
        background: rgba(216, 0, 50, 0.5);
        position: fixed;
        border-radius: 100%;
        z-index: 1099;
        width: 380px;
        height: 380px;
        left: 50%;
        margin-left: -190px;
        top: 50%;
        margin-top: -190px;
    }
}

@media (min-width: 768px) {
    .promo-container {
        background: #fff;
        position: fixed;
        border-radius: 100%;
        z-index: 12000;
        width: 350px;
        height: 350px;
        left: 50%;
        margin-left: -175px;
        top: 50%;
        margin-top: -175px;
        border: 6px solid #ffbc42;
        padding-top: 60px;
        line-height: 40px;
    }

    .sm-text {
        font-size: 20px;
    }

    .md-text {
        font-size: 30px;
    }

    .promo-container2 {
        background: rgba(216, 0, 50, 0.5);
        position: fixed;
        border-radius: 100%;
        z-index: 1099;
        width: 470px;
        height: 470px;
        left: 50%;
        margin-left: -235px;
        top: 50%;
        margin-top: -235px;
    }

    .chars-container {
        position: absolute;
        top: -80px;
        right: -20px;
    }

        .chars-container img {
            width: 90%;
        }
}

.formix {
    display: none !important;
}

.slidecontainer {
    width: 100%;
}

#ApplyDiscountonStoreComponentModal .modal-content {
    background: transparent;
    box-shadow: none;
}

#ApplyDiscountonStoreComponentModal .modal-body {
    background: transparent;
}

.sweetalert {
}

    .sweetalert .main-title {
        font-size: 17px;
    }

    .sweetalert .modal-footer .btn {
        border-radius: 5px;
        min-width: 50%;
    }

    .sweetalert .modal-footer {
        border: none;
        padding-top: 0;
        justify-content: center
    }

.modal .sweetalert .modal-footer {
    padding: 15px 0 0 0
}

.modal .sweetalert .main-title {
    font-size: 18px;
}

.modal .sweetalert .modal-body {
    padding: 30px 0 15px 0;
}

    .modal .sweetalert .modal-body .main-title {
        margin: 0;
        text-align: center
    }

div:where(.swal2-icon) {
    position: relative;
    box-sizing: content-box;
    justify-content: center;
    width: 5em;
    height: 5em;
    margin: 2.5em auto 0.6em;
    border: 0.25em solid rgba(0,0,0,0);
    border-radius: 50%;
    border-color: #000;
    font-family: inherit;
    line-height: 5em;
    cursor: default;
    user-select: none;
}

    div:where(.swal2-icon).swal2-question {
        border-color: #c9dae1;
        color: #87adbd;
        margin: 0 auto 30px auto;
    }

[class^=swal2] {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

div:where(.swal2-icon).swal2-question.swal2-icon-show {
    animation: swal2-animate-error-icon .5s;
}

@keyframes swal2-animate-error-icon {
    0% {
        transform: rotateX(100deg);
        opacity: 0;
    }

    100% {
        transform: rotateX(0deg);
        opacity: 1;
    }
}

div:where(.swal2-icon).swal2-question.swal2-icon-show .swal2-icon-content {
    animation: swal2-animate-question-mark .8s;
}

div:where(.swal2-icon) .swal2-icon-content {
    display: flex;
    align-items: center;
    font-weight: 200;
    font-size: 3.75em;
}

@keyframes swal2-animate-error-icon {
    0% {
        transform: rotateY(-360deg);
    }

    100% {
        transform: rotateY(0);
    }
}

.layer {
    width: 100%;
    background-color: #f4cbcb;
}

.r-modal .content-modal {
    font-size: 14px;
}


.r-modal .btn {
    cursor: pointer;
    padding: 7px 30px;
    min-width: 80px;
    padding: 7px 20px !important;
    margin: 15px 10px 10px 10px;
    font-size: 15px !important;
    font-weight: 500;
    min-height: auto;
    border-radius: 5px;
}

.sort-icon > i:before {
    font-weight: 500;
    content: "\f107";
}

.loading-page-qkids {
    display: block !important
}

.periodic {
    position: relative;
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-end;
    color: #727272;
    padding: 0;
    margin: 0px 18px 3px 10px !important;
}

.big-switch .periodic .button {
    width: 140px
}

.start-el {
    justify-content: flex-start !important;
}

.report-chart-box {
    background-color: #f3f2ef
}

.highcharts-figure {
    padding: 25px 15px;
    background-color: #fff;
    margin: 15px;
    box-shadow: 1px 1px 18px #e5e5e5;
    border-radius: 10px;
}

.switch-pay .periodic {
    margin: -31px 5px 9px 36px !important;
}


.message-danger {
    text-align: center;
    width: calc(100% - 30px);
    padding: 13px;
    background: #fee;
    border-top: 2px solid #ffacac;
    border-radius: 3px;
    margin: auto;
}


.support {
    position: fixed;
    bottom: 75px;
    right: 105px;
    border-radius: 300px;
    background: #1976D2;
    color: #F5F5F5;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    z-index: 8;
    text-align: center;
    border: none;
    box-shadow: 0 0 0 0 rgba(3, 169, 244, .7);
    width: 50px;
    height: 50px;
    cursor: pointer;
}

.modal .phone-area-row {
    display: flex;
    flex-wrap: wrap;
}

    .modal .phone-area-row label {
        width: 100%
    }

.modal .form-group.phone-area-row select.form-control {
    width: 150px;
}

.modal .phone-area-row.form-group select.form-control + input {
    width: calc(100% - 165px);
    margin-left: 13px;
    min-height: 44px;
}

#CrmRequestModal .si-btn.si-pink {
    background-color: #1976D2;
    border-color: #1976D2;
    display: flex;
    text-decoration: none !important;
    color: #fff !important;
    padding: 14px 26px;
    margin: 0 3px;
    font-weight: 600;
    align-items: center;
    border-radius: 6px;
    border: none;
}


.center-child {
    display: flex;
    justify-content: center;
}

.si-btn.si-pink i {
    display: none
}

#CrmRequestModal.modal .form-group, #QkidsRequestDemoComponentQkidsSiteLayoutModal.modal .form-group {
    position: relative;
    margin-bottom: 20px;
}
@media screen and (min-width:768px){

    .modal [class="modal-dialog "] {
        max-width: 100%;
        padding-top: 20px!important;
    }

        .modal [class="modal-dialog "] .modal-content {
            padding: 0;
            width: fit-content;
            max-width: 90%;
            min-width: 650px;
        }

        .modal [class="modal-dialog "] .flashcard-dec {
            padding: 0
        }
}
.btn-success {
    background-color: rgb(86, 199, 96);
    border-color: rgb(86, 199, 96);
}

.btn-dark {
    background-color: rgb(110, 110, 110);
    border-color: rgb(110, 110, 110);
}