html {
    position: relative;
    min-height: 100%;
    --textFontFamily: 'Open Sans', sans-serif;
    --titleFontFamily: 'Montserrat', sans-serif;
    --accentFontFamily: 'Rock Salt', cursive;
}

body {
    /* Required because of the fixed top navbar to push the site content down and
       prevent overlapping (P.Gasser, 281222)
    */
    padding-top: 64px;
    /* Margin bottom by footer height */
    margin-bottom: 60px;
}

.footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    /* Set the fixed height of the footer here */
    height: 60px;
}

.text-warning {
    --bs-text-opacity: 1;
    color: var(--bs-orange) !important;
}

.border-default {
    --bs-border-opacity: 1;
    border-color: var(--bs-orange) !important;
}

.bg-default {
    --bs-bg-opacity: 1;
    background-color: var(--bs-orange) !important;
}

.btn-default {
    --bs-btn-font-weight: 600;
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-orange);
    --bs-btn-border-color: var(--bs-orange);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-black);
    --bs-btn-hover-border-color: var(--bs-orange);
    --bs-btn-focus-shadow-rgb: var(--bs-orange);
    --bs-btn-active-color: var(--bs-orange);
    --bs-btn-active-bg: var(--bs-black);
    --bs-btn-active-border-color: var(--bs-orange);
}

.btn-default-inverse {
    --bs-btn-font-weight: 600;
    --bs-btn-color: var(--bs-orange);
    --bs-btn-bg: var(--bs-black);
    --bs-btn-border-color: var(--bs-orange);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-orange);
    --bs-btn-hover-border-color: var(--bs-orange);
    --bs-btn-focus-shadow-rgb: var(--bs-orange);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-orange);
    --bs-btn-active-border-color: var(--bs-white);
}

a.link-black {
    color: var(--bs-black);
    text-decoration: none;
}

a.link-black:hover {
    color: var(--bs-black);
    text-decoration: none;
}



a.link-default {
    color: var(--bs-orange);
    text-decoration: none;
}

a.link-default:hover {
    color: var(--bs-orange);
    font-weight: bolder;
    text-decoration: none;
}

a.link-default-animated {
    color: var(--bs-orange);
}

a.link-default-animated:link {
    color: var(--bs-orange);
    transition: all 200ms;
}

a.link-default-animated:hover {
    color: var(--bs-black);
    text-shadow: 2px 2px 5px black;
    transition: all 200ms;
}

a.no-underline {
    text-decoration: none;
}

.form-control:focus {
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    border-color: var(--bs-orange);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.25);
}

.form-check-input:focus {
    border-color: var(--bs-orange);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.25);
}

.form-check-input:checked {
    background-color: var(--bs-orange);
    border-color: var(--bs-orange);
    color: var(--bs-black);
}

.form-check-input:checked[type=checkbox] {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.secretlist-accordion-zero-border-ext {
    --bs-accordion-body-padding-x: 0.1rem;
    --bs-accordion-body-padding-y: 0.1rem;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.05rem rgba(253, 126, 20, 0.25);
}

.secretlist-accordion-ext {
    --bs-accordion-body-padding-x: 0.5rem;
    --bs-accordion-body-padding-y: 0.5rem;
}

.accordion {
    --bs-accordion-border-color: var(--bs-orange);
    --bs-accordion-btn-color: var(--bs-black);
    --bs-accordion-btn-bg: var(--bs-white);
    --bs-accordion-btn-focus-border-color: var(--bs-orange);
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.25);
    --bs-accordion-active-color: var(--bs-black);
    --bs-accordion-active-bg: var(--bs-orange);

    --bs-accordion-border-radius: 0rem;
    --bs-accordion-inner-border-radius: 0rem;


    /*
    --bs-accordion-color: var(--bs-body-color);
    --bs-accordion-bg: var(--bs-body-bg);
    --bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
    --bs-accordion-border-color: var(--bs-border-color);
    --bs-accordion-border-width: var(--bs-border-width);
    --bs-accordion-border-radius: var(--bs-border-radius);
    --bs-accordion-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
    --bs-accordion-btn-padding-x: 1.25rem;
    --bs-accordion-btn-padding-y: 1rem;
    --bs-accordion-btn-color: var(--bs-body-color);
    --bs-accordion-btn-bg: var(--bs-accordion-bg);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-icon-width: 1.25rem;
    --bs-accordion-btn-icon-transform: rotate(-180deg);
    --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230a58ca'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-focus-border-color: #86b7fe;
    --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
    --bs-accordion-body-padding-x: 1.25rem;
    --bs-accordion-body-padding-y: 1rem;
    --bs-accordion-active-color: var(--bs-primary-text);
    --bs-accordion-active-bg: var(--bs-primary-bg-subtle);

    */
}

.card.card-glow-default {
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    border-color: var(--bs-orange);
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(253, 126, 20, 0.25);
    /* 
        Animates the changes as soon as the class is added. This performs much better than jquerui.addClass()/removeClass() functions!
        (P.Gasser, 270423)
    */
    transition: all 200ms;
}

/*
    CSS hide element trick without using display: none, which doesn't support transition.
    No jumps in UI, no flickering, no covered other elements.
    (P.Gasser, 210523)
*/
.step.step-hide {
    overflow: hidden;
    margin-right: -9999px;
    height: 0px;
    opacity: 0;
}

.step.step-show {
    opacity: 1;
    transition: all 500ms;
}

.alert.alert-hide {
    overflow: hidden;
    margin-right: -9999px;
    height: 0px;
    padding: 0px;
    border: 0px;
    opacity: 0;
}

.alert.alert-show {
    opacity: 1;
    transition: opacity 500ms;
}

div.student-address-hide {
    overflow: hidden;
    margin-right: -9999px;
    height: 0px;
    opacity: 0;
}

div.student-address-show {
    opacity: 1;
    transition: all 500ms;
}

div.hide {
    overflow: hidden;
    margin-right: -9999px;
    height: 0px;
    opacity: 0;
    transition: opacity 1s;
}

div.show {
    opacity: 1;
    transition: opacity 500ms;
}

.ui-front {
    z-index: 9999 !important;
}

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
    border: 1px solid var(--bs-orange) !important;
    background: var(--bs-orange) !important;
    color: var(--bs-black) !important;
}

/* No underline for JQuey-UI Autocomplete menu items. */
.ui-menu-item-wrapper {
    text-decoration: none;
}


.dropdown-menu {
    --bs-dropdown-link-hover-color: var(--bs-black);
    --bs-dropdown-link-hover-bg: var(--bs-orange);
    --bs-dropdown-link-active-color: var(--bs-black);
    --bs-dropdown-link-active-bg: var(--bs-orange);
}

img.qrcode {
    width: 3.5cm;
    height: 3.5cm;
}

/* Adjust layout for checkbox groups */
.checkbox-group .col-4 {
    width: 32%;
}

.checkbox-group .mb-3:nth-last-child(-n+3) {
    margin-bottom: 0 !important;
}

/* Format comma separated list */
.comma-separated {
    display: inline-block;
}

.comma-separated::after {
    content: ",\00a0";
}

.comma-separated:last-child:after {
    content: "";
}

/*
.dot {
    height: 25px;
    width: 25px;
    background-color: #bbb;
    border-radius: 50%;
    display: inline-block;
}*/

.btn-white {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-white);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-white);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(255 255 255);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-white);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-yellow {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-yellow);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-yellow);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(255, 216, 0);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-yellow);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-orange {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-orange);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-orange);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(255, 106, 0);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-orange);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-green {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-green);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-green);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(0, 255, 33);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-green);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-blue {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-blue);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-blue);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(0, 38, 255);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-blue);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-brown {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-brown);
    --bs-btn-border-color: var(--bs-white);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-brown);
    --bs-btn-hover-border-color: var(--bs-white);
    --bs-btn-focus-shadow-rgb: rgba(253, 126, 20, 0.25);
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-brown);
    --bs-btn-active-border-color: var(--bs-white);
}

.btn-red {
    --bs-btn-color: var(--bs-black);
    --bs-btn-bg: var(--bs-red);
    --bs-btn-border-color: var(--bs-black);
    --bs-btn-hover-color: var(--bs-black);
    --bs-btn-hover-bg: var(--bs-red);
    --bs-btn-hover-border-color: var(--bs-black);
    --bs-btn-focus-shadow-rgb: rgb(255, 0, 0);
    --bs-btn-active-color: var(--bs-black);
    --bs-btn-active-bg: var(--bs-red);
    --bs-btn-active-border-color: var(--bs-black);
}

.btn-violet {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-purple);
    --bs-btn-border-color: var(--bs-white);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-purple);
    --bs-btn-hover-border-color: var(--bs-white);
    --bs-btn-focus-shadow-rgb: rgb(178, 0, 255);
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-purple);
    --bs-btn-active-border-color: var(--bs-white);
}

.btn-black {
    --bs-btn-color: var(--bs-white);
    --bs-btn-bg: var(--bs-black);
    --bs-btn-border-color: var(--bs-white);
    --bs-btn-hover-color: var(--bs-white);
    --bs-btn-hover-bg: var(--bs-black);
    --bs-btn-hover-border-color: var(--bs-white);
    --bs-btn-focus-shadow-rgb: rgb(0, 0, 0);
    --bs-btn-active-color: var(--bs-white);
    --bs-btn-active-bg: var(--bs-black);
    --bs-btn-active-border-color: var(--bs-white);
}


div.traffic_light {
    /*padding-top: 0.1cm;
    padding-bottom: 0.1cm;*/
    height: .8cm;
    width: auto;
    text-align: center;

}

div.traffic_light img {
    height: .8cm;
    width: auto;
}


span.traffic_light {
    /*padding-top: 0.1cm;
    padding-bottom: 0.1cm;*/
    height: .8cm;
    width: auto;
    text-align: center;
}

span.traffic_light img {
    height: .8cm;
    width: auto;
}