/* For the footer */
body {
    height: 100%;
}

.container {
    min-height: 100%;
}

main {
    padding-bottom: 128px;
}

#footer {
    position: relative;
    height: 128px;
    margin-top: 0px;
    clear: both;
}

span.remove-tag {
    cursor: pointer;
}

@media (max-width: 576px) {
    /* xs or Extra small */
    .rounded-top-xs {
        border-top-left-radius: var(--bs-border-radius)!important;
        border-top-right-radius: var(--bs-border-radius)!important;
    }
}
@media (min-width: 576px) {
    .rounded-start-sm {
        border-bottom-left-radius: var(--bs-border-radius)!important;
        border-top-left-radius: var(--bs-border-radius)!important;
    }
}
@media (min-width: 768px) {
    .border-md-start{
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
}
@media (min-width: 992px) {
    .border-lg-start{
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
    .width-lg-10-vw{
        width: 10vw !important;
    }
}
@media (min-width: 1200px) {
    .border-xl-end {
        border-right: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }
    .border-xl-start {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
   }
}
@media (min-width: 1400px) {
    /* xxl or Extra Extra Large */
    .mt-xxl-6 {
        margin-top: 8rem!important;
    }
}

.max-img-all{
    max-width: 96px;
    min-height: 96px;
}

/* For datatable.js on small screen */
#DataTables_Table_0_wrapper > div:nth-child(1) > div:nth-child(1) {
    margin-bottom: .5rem!important;
}
/* For datatable.js on small screen */
#DataTables_Table_0_wrapper > div:nth-child(1) > div:nth-child(2) {
    padding-left: 0;
}
/* For datatable.js on small screen */
@media screen and (max-width: 767px) {
    div.dataTables_wrapper div.dataTables_length, div.dataTables_wrapper div.dataTables_filter, div.dataTables_wrapper div.dataTables_info, div.dataTables_wrapper div.dataTables_paginate {
        text-align: start!important;
    }
    #DataTables_Table_0_paginate > ul{
        justify-content: start !important;
    }
    #DataTables_Table_0_wrapper > div:nth-child(3) > div.col-sm-12.col-md-7{
        padding-left: 0px;
        margin: 8px 0;
    }
}

/* https://getbootstrap.com/docs/5.3/customize/components/ */
.bd-callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    color: var(--bd-callout-color, inherit);
    background-color: var(--bd-callout-bg, var(--bs-gray-100));
    border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

.bd-callout-warning {
    --bd-callout-color: var(--bs-warning-text);
    --bd-callout-bg: var(--bs-warning-bg-subtle);
    --bd-callout-border: var(--bs-warning-border-subtle);
}

.bd-callout+.bd-callout {
    margin-top: -0.25rem;
}

.bd-callout-info {
    --bd-callout-color: var(--bs-info-text);
    --bd-callout-bg: var(--bs-info-bg-subtle);
    --bd-callout-border: var(--bs-info-border-subtle);
}

.bd-callout-danger {
    --bd-callout-color: var(--bs-danger-text);
    --bd-callout-bg: var(--bs-danger-bg-subtle);
    --bd-callout-border: var(--bs-danger-border-subtle);
}

blockquote {
    border-left: 5px solid #ccc;
    font-style: italic;
    margin-left: 0;
    margin-right: 0;
    overflow: hidden;
    padding-left: 1.5em;
    padding-right: 1.5em;
}

hr {
    background: #dedede;
    border: 0;
    height: 4px;
    margin: 15px 0;
}

.btn-vote-up, .btn-vote-down{
    cursor: pointer;
    background-color: transparent;
    border: none;
    color: var(--bs-heading-color,inherit);
}

.btn-vote-up:hover{
    color: var(--bs-blue);
}

.btn-vote-down:hover{
    color: var(--bs-danger);
}

.toasts-box {
    position: fixed;
    top: 1rem;
    left: 1rem;
    z-index: 9999;
    width: fit-content;
}
/* the next line for CKEditor 5*/
main .ck.ck-content {
    font-size: 1em;
    line-height: 1.6em;
    margin-bottom: 0.8em;
    min-height: 200px;
}

.search_box.hide {
    display: none !important;
}

.search_box.show {
    display: flex !important;
}

figure > img {
    max-width: 80vw !important;
}

pre {
    background: hsla(0,0%,78%,.3);
    border: 1px solid #c4c4c4;
    border-radius: 2px;
    color: #353535;
    direction: ltr;
    font-style: normal;
    min-width: 200px;
    padding: 1em;
    tab-size: 4;
    text-align: left;
    white-space: pre-wrap;
}

.ck.ck-sticky-panel .ck-sticky-panel__content_sticky{
    top: 3.6rem !important;
}

div.dataTables_wrapper div.dataTables_info{
    padding-top: 0px !important;
}

div.ck.ck-dropdown.ck-font-size-dropdown > div {
    height: 200px;
    overflow: auto;
}

/* 
 * for new audit record
 * Define the animation
*/

@keyframes new_audit_record {
    0% {
        background-color: #0DCAF0;
        color: #000;
    }
    20% {
        background-color: #93E1FA;
        color: #000;
    }
    40% {
        background-color: #0DCAF0;
        color: #fff;
    }
    60% {
        background-color: #93E1FA;
        color: #fff;
    }
    80% {
        background-color: #0DCAF0;
        color: #000;
    }
    100% {
        background-color: #93E1FA;
        color: #000;
    }
}

/* Apply the animation to the element */
.new_audit_record {
    animation: new_audit_record 2s infinite;
}

/* For reCAPTCHA style*/
div.g-recaptcha > div {
    margin: 0 auto;
}
div.contact-us > div {
    margin: 0 auto 0 0;
}

.border-primary-emphasis{
    --bs-border-opacity: 1;
    --bs-primary-emphasis-rgb: 10, 88, 202;
    border-color: rgba(var(--bs-primary-emphasis-rgb),var(--bs-border-opacity))!important;
 }

.b-example-divider {
    width: 100%;
    height: 3rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 0.5em 1.5em rgba(0, 0, 0, .1), inset 0 0.125em 0.5em rgba(0, 0, 0, .15);
 }

.cursor-pointer{
    cursor: pointer;
}
.text-inherit, .text-inherit:hover, .text-inherit:focus, .text-inherit:checked {
    color: inherit
}
/*
 * N = nrdevo
 * h = height
 * 1 = 1px
 */
.n-h-1{
    height: 1px;
}