#gen-loading {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    display: flex;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: var(--dark-color);
}

#gen-loading img {
    height: 75px;
}

@media (max-width: 479px){
    #gen-loading img {
        height: 60px;
    }
}

.ql-calculator{
    color: var(--kt-text-success) !important;
    width: 24px !important;
    background-image: url("data:image/svg+xml,%3Csvg height='24' viewBox='0 0 128 128' width='24' xmlns='http://www.w3.org/2000/svg'%3E%3Cg id='Flat'%3E%3Cg id='Color'%3E%3Crect fill='%2337474f' height='125' rx='15' width='109' x='9.5' y='1.5'/%3E%3Crect fill='%23ffb300' height='62' rx='6' width='35' x='69.5' y='51.5'/%3E%3Crect fill='%2303a9f4' height='24' rx='6' width='81' x='23.5' y='14.5'/%3E%3Crect fill='%238bc34a' height='27' rx='6' width='36' x='23.5' y='51.5'/%3E%3Cg fill='%23fff'%3E%3Ccircle cx='94.5' cy='26.5' r='3'/%3E%3Ccircle cx='79.5' cy='26.5' r='3'/%3E%3Ccircle cx='64.5' cy='26.5' r='3'/%3E%3Crect height='6' rx='1.403' width='14' x='80' y='73.5'/%3E%3Crect height='6' rx='1.403' width='14' x='80' y='85.5'/%3E%3Cpath d='m48 62h-3.5v-3.5a1.5 1.5 0 0 0 -1.5-1.5h-3a1.5 1.5 0 0 0 -1.5 1.5v3.5h-3.5a1.5 1.5 0 0 0 -1.5 1.5v3a1.5 1.5 0 0 0 1.5 1.5h3.5v3.5a1.5 1.5 0 0 0 1.5 1.5h3a1.5 1.5 0 0 0 1.5-1.5v-3.5h3.5a1.5 1.5 0 0 0 1.5-1.5v-3a1.5 1.5 0 0 0 -1.5-1.5z'/%3E%3C/g%3E%3Crect fill='%23e91e63' height='27' rx='6' width='36' x='23.5' y='86.5'/%3E%3Crect fill='%23fff' height='6' rx='1.5' width='16' x='33.5' y='97'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") !important;
    -moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1
}

.ql-snow > .ql-formats:last-child{
    float: right;
}

#kt_wrapper > div > div.ql-toolbar.ql-snow > span:last-child{
    float: right;
}

#kt_wrapper > div > div.ql-toolbar.ql-snow > span:nth-child(4) > span > span.ql-picker-label {
    padding: 0 4px;
}

.modal-dialog-ended {
    display: flex;
    align-items: end;
    min-height: calc(100% - var(--bs-modal-margin) * 2);
}

#calculation-result-container{
    position: fixed;
    bottom: 512px;
    background: white;
    width: calc(100% - 1rem);
    max-width: var(--bs-modal-width);
    max-height: calc(100% - 512px);
    padding: var(--bs-modal-padding);
    overflow-y: auto;
    left: 50%;
    transform: translateX(-50%);
    margin: 0;
    animation: animationFadeInSlow 1s;
}

#calculator-get-sum-button{
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 2px 5px;
    cursor:pointer;
    display: none;
}

@keyframes animationFadeInSlow {
    0% {
        opacity: 0;
    }

    30% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

#go-note-home-button {
    right: calc(var(--bs-gutter-x) * 0.5);
    margin-left: auto;
    display: none;
}

#change-theme-button{
    right: calc(var(--bs-gutter-x) * 0.5);
    margin-left: auto;
    display: none;
}

.ql-code-block{
    fill: var(--kt-gray-500);
}

.ql-code-block.ql-active{
    fill: #06c;
}

.ql-toolbar-fixed{
    position: fixed;
    z-index: 1001;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 0;
}

.flex-same-width-buttons > button {
    flex: 1 1 0;
}

.home-memo-title {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home-memo-description {
    max-height: 192px;
    overflow: hidden;
    cursor: pointer;
    -webkit-mask: linear-gradient(#000, #0000);
    mask: linear-gradient(#000, #0000);
}

#view-container {
    -webkit-animation: slideViewer 0.5s forwards;
    -webkit-animation-delay: 0s;
    animation: slideViewer 0.5s forwards;
    animation-delay: 0s;

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
}

.view-contents-area{
    margin-top: calc(50px + 0.5rem);
    overflow-y: auto;
    height: calc(100vh - 1rem);
    padding-right: calc(var(--bs-gutter-x) * 1) !important;
    padding-left: calc(var(--bs-gutter-x) * 1) !important;
}

.view-contents-area.view-contents-area-full{
    margin-top: 0;
    height: 100vh;
}

.view-contents-area img,
.view-contents-area video{
    width: 100%;
}

.view-contents-area.for-print{
    padding: 0 !important;
}

.view-contents-area.for-print > .mb-0{
    padding: 2rem calc(var(--bs-gutter-x) * 1) !important;
}

@-webkit-keyframes slideViewer {
    0% {
        transform: translateX(-900px);
    }
    100% {
        transform: translateX(0);
    }
}
@keyframes slideViewer {
    0% {
        transform: translateX(-900px);
    }
    100% {
        transform: translateX(0);
    }
}

@keyframes slideInRight {
    0% {
        -webkit-transform: translateX(100%);
    }
    100% {
        -webkit-transform: translateX(0%);
    }
}

@-webkit-keyframes slide-in {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0%);
    }
}

#share-container {
    -webkit-animation: slideViewer 0.5s forwards;
    -webkit-animation-delay: 0s;
    animation: slideViewer 0.5s forwards;
    animation-delay: 0s;

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
}

#cmp-container {
    -webkit-animation: slideViewer 0.5s forwards;
    -webkit-animation-delay: 0s;
    animation: slideViewer 0.5s forwards;
    animation-delay: 0s;

    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #ffffff;
}

.toast-right-button{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    float: right;
}

.introjs-prevbutton {
    display:none;
}

.youtube-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.youtube-container iframe,
.youtube-container-container object,
.youtube-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.youtube-container > button {
    position: absolute;
    right: 14px;
    top: 0;
    z-index: 100;
}

.youtube-container > button > span {
    color: #fff;
}

#kt_engage_cals_toggle {
    -webkit-animation: slideInRight 1.5s forwards;
    -webkit-animation-delay: 0s;
    animation: slideInRight 1.5s forwards;
    animation-delay: 0s;
}

.card-body.card-body-for-print {
    padding: 0 !important;
}

.card-body.card-body-for-print #kt_stepper_cmp_form div.flex-column.current {
    padding: 1rem 1.2rem;
}