html, body {
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 14px;
    height: 100%;
    width: 100%;
    margin: 0;
}
body {
}
#app {
    overflow-y: hidden;
    height: 100%;
    width: 100%;
}
#popup {
    overflow-y: hidden;
    height: 100%;
    width: 100%;
}

/* override bootstrap5 defaults */
fieldset, legend {
    all: revert;
}
.spinner-border {
    z-index:1031;
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}
.btn-secondary {
    color: #000;
    background-color: #fff;
    border-color: #777;
}
    .btn-secondary:hover {
        color: #000;
        background-color: #e7e7e7;
        border-color: #565e64
    }
    .btn-check:focus + .btn-secondary, .btn-secondary:focus {
        color: #000;
        background-color: #5c636a;
        border-color: #565e64;
        box-shadow: 0 0 0 .25rem rgba(130,138,145,.5)
    }
    .btn-check:active + .btn-secondary, .btn-check:checked + .btn-secondary, .btn-secondary.active, .btn-secondary:active, .show > .btn-secondary.dropdown-toggle {
        color: #000;
        background-color: #565e64;
        border-color: #51585e
    }
        .btn-check:active + .btn-secondary:focus, .btn-check:checked + .btn-secondary:focus, .btn-secondary.active:focus, .btn-secondary:active:focus, .show > .btn-secondary.dropdown-toggle:focus {
            box-shadow: 0 0 0 .25rem rgba(130,138,145,.5)
        }
    .btn-secondary.disabled, .btn-secondary:disabled {
        color: #fff;
        background-color: #6c757d;
        border-color: #6c757d
    }

/* syncfusion base font size */
.e-control, .e-control [class^='e-'], .e-control [class*=' e-'] {
    font-size: 14px !important;
}
/* accordian color */
.e-accordion .e-acrdn-item.e-select .e-acrdn-header {
    background-color: #e1e4e7 !important;
    border-top: 1px solid white !important;
}
/* To specify placeholder font color */
input.e-input::placeholder {
    color: darkgreen !important;
}
input.e-multiselect::placeholder {
    color: darkgreen !important;
}
/* tab colors */
.e-tab .e-tab-header {
    background-color: #e1e4e7 !important;
}
.e-tab .e-tab-header .e-toolbar-item {
    border-right: 1px solid white !important;
}
.e-tab .e-tab-header .e-toolbar-item.e-active {
    background-color: white !important;
}
/* dropdown list shadow */
.e-dropdownbase {
    border: none !important;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px !important;
}
/* checkbox spacing */
.e-checkbox-wrapper {
    padding-bottom: 4.5px;
}
/* To hide datetime time element */
.e-datetime-wrapper .e-input-group-icon.e-time-icon {
    display:none;
}
/* to black combobox group names */
.e-list-group-item {
    background-color: #fff !important;
    color: #000 !important;
    border-top: 1px solid #e1e4e7 !important;
}


.aewiz-container {
    width: 100%;
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr auto;
}
.aewiz-header {
    display: grid;
    gap: 20px;
    padding: 5px 10px;
    grid-template-columns: auto 1fr auto;
    background-color: #c0ffc0;
}
.aewiz-content {
    width: 100%;
    height: 100%;
    overflow-y:auto;
    align-self:start;
    display: grid;
    gap: 10px;
    padding: 20px;
}
.aewiz-footer {
    display: grid;
    gap: 10px;
    padding: 5px 10px;
    align-items: center;
    justify-items: center;
    grid-template-columns: auto 1fr auto auto auto;
    background-color: gainsboro;
    border-top:1px solid darkgray;
}

.ae-grid {
    display: grid;
    grid-gap: 10px;
    padding: 10px;
}
.ae-grid0 {
    display: grid;
    grid-gap: 10px;
    padding: 0;
}
.ae-grid00 {
    display: grid;
    grid-gap: 0;
    padding: 0;
}
.ae-control {
    margin:10px;
}

.ae-green {
    background-color: #c0ffc0 !important;
}
.ae-red {
    background-color: mistyrose !important;
}
.ae-white {
    background-color: white !important;
}
.ae-yellow {
    background-color: yellow !important;
}
.ae-silver {
    background-color: silver !important;
}
.ae-lightyellow {
    background-color: lightyellow !important;
}
.ae-orangered {
    background-color: orangered !important;
}
.ae-lightblue {
    background-color: lightblue !important;
}
.ae-excelgood {
    color: black !important;
    background-color: #C6EFCE !important;
}
.ae-excelneutral {
    color: black !important;
    background-color: #FFEA9C !important;
}
.ae-excelbad {
    color: black !important;
    background-color: #FFC7CE !important;
}
.ae-excelwhite {
    color: black !important;
    background-color: white !important;
}

.ae-text-bold, .ae-text-bold .e-label {
    font-weight: bold !important;
}
.ae-text-green {
    color: darkgreen;
}
.ae-text-red {
    color: darkred;
}
fieldset {
    border: 1px solid gainsboro;
}
.ae-groupbox {
    margin:5px 0 0 0; 
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    padding: 10px;
    overflow: auto;
}
.ae-groupbox-label {
    position: relative;
    top: -4px;
    left: 20px;
    background-color:white;
    text-align: center;
    padding: 3px;
}

/* text buttons */
.btn btn-secondary {
    color: black;
    min-width: 85px;
    height: 32px;
    margin: 3px;
    padding: 0 10px;
    border: 1px solid gray;
    overflow: hidden;
    white-space: nowrap;
}
.btn btn-link {
    color: #0d6efd;
    background-color: transparent;
    height: 32px;
    margin: 3px;
    border: none;
    overflow: hidden;
    white-space: nowrap;
}

/* small image buttons */
.ae-button-arrowright {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/arrow_right.png) no-repeat;
}
.ae-button-checkmark {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/checkmark_icon.png) no-repeat;
}
.ae-button-copy {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/clipboard_copy_icon.png) no-repeat;
}
.ae-button-delete {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/delete_icon.png) no-repeat;
}
.ae-button-down {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/down_icon.png) no-repeat;
}
.ae-button-edit {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/pencil_icon.png) no-repeat;
}
.ae-button-export {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/export_icon_16.png) no-repeat;
}
.ae-button-heart {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/heart.png) no-repeat;
}
.ae-button-heartempty {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/heart_empty.png) no-repeat;
}
.ae-button-next {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/playback_next_icon.png) no-repeat;
}
.ae-button-paste {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/clipboard_paste_icon.png) no-repeat;
}
.ae-button-play {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/playback_play_icon.png) no-repeat;
}
.ae-button-plus {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/plus_icon.png) no-repeat;
}
.ae-button-redo {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/redo_icon.png) no-repeat;
}
.ae-button-refresh {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/refresh_icon.png) no-repeat;
}
.ae-button-reverse {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/reverse_icon.png) no-repeat;
}
.ae-button-stop {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/playback_stop_icon.png) no-repeat;
}
.ae-button-tag {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/tag_icon.png) no-repeat;
}
.ae-button-undo {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/undo_icon.png) no-repeat;
}
.ae-button-up {
    height: 16px;
    width: 16px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/up_icon.png) no-repeat;
}

/* medium image buttons */
.ae-button-cellreference {
    height: 24px;
    width: 24px;
    margin: 3px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/cell_reference24.png) no-repeat;
}


/* login image buttons */
.ae-button-constantcontactlogin {
    height: 46px;
    width: 221px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/constantcontactlogo.png) no-repeat;
}
.ae-button-facebooklogin {
    height: 46px;
    width: 191px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/facebooklogo.png) no-repeat;
}
.ae-button-googlelogin {
    height: 46px;
    width: 191px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/btn_google_signin_dark_normal_web.png) no-repeat;
}
.ae-button-linkedinlogin {
    height: 46px;
    width: 221px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/linkedinlogo.png) no-repeat;
}
.ae-button-mailchimplogin {
    height: 46px;
    width: 221px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/mailchimplogo.png) no-repeat;
}
.ae-button-microsoftlogin {
    height: 46px;
    width: 191px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/microsoftlogo.png) no-repeat;
}
.ae-button-addapikey {
    height: 46px;
    width: 191px;
    margin: 0px;
    border: none;
    vertical-align: middle;
    background-color: #fcfcfc;
    background: url(/images/addapikey.png) no-repeat;
}



.sheet1-left {
    max-width: 40px;
    min-width: 40px;
    margin: 0;
    padding: 0;
    text-align: center;
    user-select: none;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none;
}

.sheet1-top {
    max-width: 75px;
    min-width: 75px;
    margin: 0;
    padding: 0;
    text-align: center;
    user-select: none;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none;
}

.sheet1-cell {
    max-width: 87px;
    user-select: none;
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none;
}
/* white default cell button */
.ae0 {
    background-color: white;
    border: 1px solid white;
    width: 100%;
    height: 100%;
    color: black;
    margin: 0;
    overflow: hidden;
    padding: 1px 3px;
    white-space: nowrap;
    text-align: left;
}
/* query cell button */
.aeq {
    background-color: #C6EFCE;
    border: 1px solid #C6EFCE;
    width: 100%;
    height: 100%;
    color: black;
    margin: 0;
    overflow: hidden;
    padding: 1px 3px;
    white-space: nowrap;
    text-align: left;
}
/* cellref cell button */
.aec {
    background-color: #FFEA9C;
    border: 1px solid #FFEA9C;
    width: 100%;
    height: 100%;
    color: black;
    margin: 0;
    overflow: hidden;
    padding: 1px 3px;
    white-space: nowrap;
    text-align: left;
}
/* debug cell button */
.aeb {
    background-color: #c6efce;
    border: 1px solid #c6efce;
    width: 100%;
    height: 100%;
    color: black;
    margin: 0;
    overflow: hidden;
    padding: 1px 3px;
    white-space: nowrap;
    text-align: left;
}
/* selected cell button */
.aes {
    border: 1px solid blue !important;
}
/* date cell button */
.aed {
    color:indigo !important;
}
/* formula cell button */
.aef {
    color: darkred !important;
}
/* number cell button */
.aen {
    text-align: right !important;
}

.taskpane-btn {
    text-align: left;
    width: 100%;
    border: 1px solid white;
    color: black;
    background-color: white;
    overflow: hidden;
    white-space: nowrap;
    padding: 1px;
    margin: 0;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }
