body {
    background-color: steelblue;
    /* https://app.haikei.app/ */
    background-image: url('/static/images/site_background.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

body>.body_container {
}

/* #System-Nav-Menu { } */
#Site-Header { }
#Site-Nav-Menu {  }
#System-Notifications { }
#Main-Body {
}
#Main-Notifications { }
#Main-Nav-Menu { }
#Main-Content { }
#Site-Footer { }
/* #System-Footer { } */
/* #System-Nav-Menu-Float { } */
/* #System-Debug { } */


/* #System-Nav-Menu { outline: dashed thin red; } */
/* #Site-Header { outline: dashed thin red; } */
/* #Site-Nav-Menu { outline: dashed thin pink; } */
/* #System-Notifications { outline: dashed thin red; } */
/* #Main-Body { outline: dotted thin green; } */
/* #Main-Notifications { outline: dotted thin blue; } */
/* #Main-Nav-Menu { outline: dotted thin blue; } */
/* #Main-Content { outline: dotted thin blue; } */
/* #Site-Footer { outline: dotted thin blue; } */
/* #System-Footer { outline: dashed thin red; } */
/* #System-Debug { outline: dashed thin red; } */


#System-Nav-Menu {
    border: solid thick transparent;
    border-top: none;
    border-left: solid thick hsl(var(--hue-green),var(--saturation-least),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-green),var(--saturation-least),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-green),var(--saturation-least),var(--lum-darkest));
    border-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-green),var(--saturation-least),var(--lum-darkest)),
                    transparent
    ) 1;

    background-color: hsla(0,0%,100%,.98);
}

#System-Nav-Menu:hover {
    border-left: solid thick hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    /* background-color: hsla(0,0%,80%,1); */
    background-image: linear-gradient(to right, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest).1) 0%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.9) 3%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.9) 97%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.1) 100%);

}

#System-Nav-Menu img {
}
#System-Nav-Menu:hover img {
}

.system_menu_clicked {
    border-left: solid thick hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image: linear-gradient(to right, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest).1) 0%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.9) 3%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.9) 97%, hsla(var(--hue-yellow), var(--saturation-less), var(--lum-lightest),.1) 100%);
}


.system_menu_begin {
    /*border: solid thin red;*/

    text-shadow: 0 0 .25rem hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),1), 0 0 .75rem hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),1), 0 0 1rem hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),1);

    color: black;

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),.9) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),.9) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),0) 100%);*/
}
.system_menu_begin:hover {
}

.system_menu_center {
    /*border: solid thin blue;*/

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-mid),.1) 25%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-mid),.8) 50%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-mid),.9) 75%);*/
}

.system_menu_end {
    /*border: solid thin red;*/

    text-shadow: 0 0 .25rem white, 0 0 .75rem hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),1), 0 0 1rem hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),1);

    color: black;

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.6) 20%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.6) 80%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 100%);*/
}
.system_menu_end:hover {
}

.system_menu_hidden {
    border-bottom: solid thin gray;

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.9) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.9) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 100%);*/
}
.system_menu_hidden:hover {
}

.system_menu_visible {
    /*border-bottom: solid thin gray;*/

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.9) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.9) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 100%);*/
}
.system_menu_visible:hover {
}

.system_menu_name {
    /*border: dashed thin blue;*/

    background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.8) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.8) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 100%);
}

.system_menu_name img {
}

.system_menu_information {
    /*border: dashed thin green;*/

    background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.8) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.8) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),0) 100%);
}
.system_menu_information:hover {
    /*background-color: gray;*/

    /*background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),.9) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),.9) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lighter),0) 100%);*/

    background-image: linear-gradient(to right, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.0) 0%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.97) 3%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.97) 97%, hsla(var(--hue-blue), var(--saturation-least), var(--lum-lightest),.0) 100%);

}

/* Set style based on the user's permissions */
.system_menu.user_super {
    border-left: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest)),
                    transparent
    );
}

.system_menu.user_manager {
    border-left: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-orange),var(--saturation-most),var(--lum-darkest)),
                    transparent
    );
}

.system_menu.user_administrator {
    border-left: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-yellow),var(--saturation-most),var(--lum-darkest)),
                    transparent
    );
}

.system_menu.user_verified {
    border-left: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-yellow),var(--saturation-most),var(--lum-darkest)),
                    transparent
    );
}

.system_menu.user_authenticated {
    border-left: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-right: solid thick hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-bottom: solid thin hsl(var(--hue-red),var(--saturation-most),var(--lum-darkest));
    border-image:
    linear-gradient(
        to top,
        hsl(var(--hue-green),var(--saturation-most),var(--lum-darkest)),
                    transparent
    ) 1;

    background-image:
    linear-gradient(
        to bottom,
        hsl(var(--hue-cyan),var(--saturation-most),var(--lum-darkest)),
                    transparent
    );
}

.system_menu .user_status_options {
    font-size: .8rem;
    line-height: 1rem;
}
/* *** END *** System *** System Menu (root menu) *** */


/* *** BEGIN *** System *** System Menu Floating/Fixed (root menu) *** */
#System-Nav-Menu-Float {
    background-color: rgba(220,175,175,.8);
}
/* *** END *** System *** System Menu Floating/Fixed (root menu) *** */


#Site-Header {
    background-color: hsla(0,0%,100%,.98);
}

#Site-Header img {
}


/* *** BEGIN *** System *** System Site Nav Menu *** */
#Site-Nav-Menu {
    background-color: hsla(0,0%,100%,.98);
    border-bottom: solid thin hsla(0,0%,80%,1);

    font-size: 1.2rem;
}

#Site-Nav-Menu ul {
}

#Site-Nav-Menu ul>li {
    /* background-color: var(--site_menu_btn_bg_color); */
    /* border: solid thin var(--site_menu_btn_border_color);
     *   border-radius: .25rem; */
    /* font-weight: var(--btn_font_weight_default); */
    /* color: var(--site_menu_btn_color); */
}

#Site-Nav-Menu ul>li:hover {
    /* background-color: var(--site_menu_btn_hover_bg_color); */
    /* border: solid thin var(--site_menu_btn_hover_border_color); */
    /* color: var(--site_menu_btn_hover_color); */
}

#Site-Nav-Menu ul>li.nav_disabled {
    /* background-color: var(--site_menu_btn_disabled_bg_color);
     *   border: solid thin var(--site_menu_btn_disabled_border_color);
     *
     *   font-weight: var(--btn_font_weight_disabled);
     *   color: var(--site_menu_btn_disabled_color);
     *   text-decoration: line-through; */
}
#Site-Nav-Menu ul>li.nav_active {
    /* font-weight: var(--btn_font_weight_active); */
}
#Site-Nav-Menu ul>li.nav_primary {
    font-weight: var(--btn_font_weight_primary);
    /* border-right: solid thin hsla(0,0%,50%,.5); */
}

#Site-Nav-Menu .btn {
    border-color: hsla(0,0%,90%,.1);
    background-color: hsla(0,0%,90%,.1);
}
/* *** END *** System *** System Site Nav Menu *** */

#System-Notifications {
    background-color: hsla(0,0%,100%,.98);
}


#Main-Body {
    background-color: hsla(0,0%,100%,.98);
}

#Main-Notifications {
    /* background-color: hsla(var(--hue-info),var(--saturation-least),var(--lum-lighter),.1); */
    /* background-color: hsla(0,0%,100%,.98); */
}


/* *** BEGIN *** Main *** Main Nav Menu *** */
#Main-Nav-Menu {

}

#Main-Nav-Menu ul {
}

#Main-Nav-Menu ul>li {
}

#Main-Nav-Menu ul>li:hover {
}

#Main-Nav-Menu ul>li.disabled {
    background-color: var(--site_menu_btn_disabled_bg_color);
    border: solid thin var(--site_menu_btn_disabled_border_color);

    font-weight: var(--btn_font_weight_disabled);
    color: var(--site_menu_btn_disabled_color);
    text-decoration: line-through;
}
#Main-Nav-Menu ul>li.active {
    font-weight: var(--btn_font_weight_active);
}
#Main-Nav-Menu ul>li.primary {
    font-weight: var(--btn_font_weight_primary);
}




#Main-Nav-Menu .m_btn {
    appearance: button;

    cursor: pointer;

    background-color: var(--site_menu_btn_bg_color);

    border: solid thin var(--site_menu_btn_border_color);
    border-radius: .25rem;

    /* line-height: 1rem; */
    /* font-size: 1rem; */
    font-weight: var(--btn_font_weight_default);
    text-align: center;

    color: var(--site_menu_btn_color);

    /* NOTE: transition when hover ends */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_out_delay); /* short delay */
    transition-duration: var(--btn_trans_out_duration);
    transition-timing-function: linear;
}

#Main-Nav-Menu .m_btn:hover {
    /* background-color: var(--site_menu_btn_hover_bg_color); */

    /* border: solid thin var(--site_menu_btn_hover_border_color); */

    /* color: var(--site_menu_btn_hover_color); */

    /* NOTE: transition when hover starts */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_in_delay); /* no delay */
    transition-duration: var(--btn_trans_in_duration);
    transition-timing-function: linear;
}
/* *** END *** System *** System Main Nav Menu *** */

#Main-Content {
}


/* *** BEGIN *** System *** Site Footer *** */
/* site_footer or site_footer or site_status is the global (root) footer or status bar */
#Site-Footer {
    background-color: var(--site_footer_bg_color);

    border-top: solid thin var(--site_footer_border_color);

    color: var(--site_footer_color);
}

#Site-Footer:hover {
    background-color: var(--site_footer_hover_bg_color);

    border-top: solid thin var(--site_footer_hover_border_color);

    color: var(--site_footer_hover_color);
}

.site_footer .footer_left {
}
.site_footer .footer_right {
}
/* *** END *** System *** Site Footer *** */



/* *** BEGIN *** System *** System Footer *** */
/* system_footer or system_footer or system_status is the global (root) footer or status bar */
#System-Footer {
    font-size: .8rem;

    background-color: var(--system_footer_bg_color);

    border-top: solid thin var(--system_footer_border_color);

    color: var(--system_footer_color);

    /* NOTE: transition when hover ends */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_out_delay); /* short delay */
    transition-duration: var(--btn_trans_out_duration);
    transition-timing-function: linear;
}

#System-Footer:hover {
    background-color: var(--system_footer_hover_bg_color);

    border-top: solid thin var(--system_footer_hover_border_color);

    color: var(--system_footer_hover_color);

    /* NOTE: transition when hover starts */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_in_delay); /* no delay */
    transition-duration: var(--btn_trans_in_duration);
    transition-timing-function: linear;
}

.system_footer .footer_left {
}
.system_footer .footer_right {
}
/* *** END *** System *** System Footer *** */


/* *** BEGIN *** System *** Debug *** */
#hidden_system_debug {
}

#System-Debug {
    /* background-color: rgba(220,175,175,.95); */
    background-color: rgba(220,175,175,1);

    border: dashed thin pink;

    font-size: .7rem;

    opacity: .75;
    transition: opacity .95s linear .5s;
}

#System-Debug:hover {
    border: solid thin pink;

    opacity: .95;

    /* background-color: rgba(220,175,175,1); */
}

.view_system_debug {
    cursor: help;
}
/* *** END *** System *** Debug *** */


/* *** BEGIN *** System *** Buttons *** */
a.btn {
    /* font-family: inherit; */
    /* font-size: inherit; */
    /* font-style: inherit; */
    /* font-weight: inherit; */
    /* line-height: inherit; */
    text-decoration: none;
}

button.btn {
    /* font-family: inherit; */
    /* font-size: inherit; */
    /* font-style: inherit; */
    /* font-weight: inherit; */
    /* line-height: inherit; */
    /* text-decoration: none; */
}

.btn {
    appearance: button;

    display: inline-block;

    border: solid thin var(--default_btn_border_color);
    border-radius: .25em;

    margin: .0em;
    padding: .25em .5em;

    line-height: 1em;
    font-size: 1em;
    text-align: center;

    cursor: pointer;

    /*display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;*/

    /* NOTE: transition when hover ends */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_out_delay); /* short delay */
    transition-duration: var(--btn_trans_out_duration);
    transition-timing-function: linear;
}
.btn:hover {
    /* NOTE: transition when hover starts */
    transition-property: color, background-color, border-color;
    transition-delay: var(--btn_trans_in_delay); /* no delay */
    transition-duration: var(--btn_trans_in_duration);
    transition-timing-function: linear;
}

.btn_default {
    color: var(--default_btn_color);
    background-color: var(--default_btn_bg_color);
    border: solid thin var(--default_btn_border_color);
}
.btn_default:hover {
    color: var(--default_btn_hover_color);
    background-color: var(--default_btn_hover_bg_color);
    border: solid thin var(--default_btn_hover_border_color);
}

.btn_outline_default {
    color: var(--default_btn_outline_color);
    background-color: var(--default_btn_outline_bg_color);
    border: solid thin var(--default_btn_outline_border_color);
}
.btn_outline_default:hover {
    color: var(--default_btn_hover_color);
    background-color: var(--default_btn_hover_bg_color);
    border: solid thin var(--default_btn_hover_border_color);
}

.btn_primary {
    font-weight: var(--btn_font_weight_primary);
    color: var(--primary_btn_color);
    background-color: var(--primary_btn_bg_color);
    border: solid thin var(--primary_btn_border_color);
}
.btn_primary:hover {
    color: var(--primary_btn_hover_color);
    background-color: var(--primary_btn_hover_bg_color);
    border: solid thin var(--primary_btn_hover_border_color);
}

.btn_outline_primary {
    font-weight: var(--btn_font_weight_primary);
    color: var(--primary_btn_outline_color);
    background-color: var(--primary_btn_outline_bg_color);
    border: solid thin var(--primary_btn_outline_border_color);
}
.btn_outline_primary:hover {
    color: var(--primary_btn_hover_color);
    background-color: var(--primary_btn_hover_bg_color);
    border: solid thin var(--primary_btn_hover_border_color);
}

.btn_secondary {
    font-weight: var(--btn_font_weight_default);
    color: var(--secondary_btn_color);
    background-color: var(--secondary_btn_bg_color);
    border: solid thin var(--secondary_btn_border_color);
}
.btn_secondary:hover {
    color: var(--secondary_btn_hover_color);
    background-color: var(--secondary_btn_hover_bg_color);
    border: solid thin var(--secondary_btn_hover_border_color);
}

.btn_outline_secondary {
    font-weight: var(--btn_font_weight_default);
    color: var(--secondary_btn_outline_color);
    background-color: var(--secondary_btn_outline_bg_color);
    border: solid thin var(--secondary_btn_outline_border_color);
}
.btn_outline_secondary:hover {
    color: var(--secondary_btn_hover_color);
    background-color: var(--secondary_btn_hover_bg_color);
    border: solid thin var(--secondary_btn_hover_border_color);
}

.btn_info {
    color: var(--info_btn_color);
    background-color: var(--info_btn_bg_color);
    border: solid thin var(--info_btn_border_color);
}
.btn_info:hover {
    color: var(--info_btn_hover_color);
    background-color: var(--info_btn_hover_bg_color);
    border: solid thin var(--info_btn_hover_border_color);
}

.btn_outline_info {
    color: var(--info_btn_outline_color);
    background-color: var(--info_btn_outline_bg_color);
    border: solid thin var(--info_btn_outline_border_color);
}
.btn_outline_info:hover {
    color: var(--info_btn_hover_color);
    background-color: var(--info_btn_hover_bg_color);
    border: solid thin var(--info_btn_hover_border_color);
}

.btn_success {
    color: var(--success_btn_color);
    background-color: var(--success_btn_bg_color);
    border: solid thin var(--success_btn_border_color);
}
.btn_success:hover {
    color: var(--success_btn_hover_color);
    background-color: var(--success_btn_hover_bg_color);
    border: solid thin var(--success_btn_hover_border_color);
}

.btn_outline_success {
    color: var(--success_btn_outline_color);
    background-color: var(--success_btn_outline_bg_color);
    border: solid thin var(--success_btn_outline_border_color);
}
.btn_outline_success:hover {
    color: var(--success_btn_hover_color);
    background-color: var(--success_btn_hover_bg_color);
    border: solid thin var(--success_btn_hover_border_color);
}

.btn_warning {
    color: var(--warning_btn_color);
    background-color: var(--warning_btn_bg_color);
    border: solid thin var(--warning_btn_border_color);
}
.btn_warning:hover {
    color: var(--warning_btn_hover_color);
    background-color: var(--warning_btn_hover_bg_color);
    border: solid thin var(--warning_btn_hover_border_color);
}

.btn_outline_warning {
    color: var(--warning_btn_outline_color);
    background-color: var(--warning_btn_outline_bg_color);
    border: solid thin var(--warning_btn_outline_border_color);
}
.btn_outline_warning:hover {
    color: var(--warning_btn_hover_color);
    background-color: var(--warning_btn_hover_bg_color);
    border: solid thin var(--warning_btn_hover_border_color);
}

.btn_danger {
    color: var(--danger_btn_color);
    background-color: var(--danger_btn_bg_color);
    border: solid thin var(--danger_btn_border_color);
}
.btn_danger:hover {
    color: var(--danger_btn_hover_color);
    background-color: var(--danger_btn_hover_bg_color);
    border: solid thin var(--danger_btn_hover_border_color);
}

.btn_outline_danger {
    color: var(--danger_btn_outline_color);
    background-color: var(--danger_btn_outline_bg_color);
    border: solid thin var(--danger_btn_outline_border_color);
}
.btn_outline_danger:hover {
    color: var(--danger_btn_hover_color);
    background-color: var(--danger_btn_hover_bg_color);
    border: solid thin var(--danger_btn_hover_border_color);
}

/* Button Modifiers */
.btn.btn_active {
}
.btn.btn_disabled {
    /* background-color: var(--site_menu_btn_disabled_bg_color); */
    /* border: solid thin var(--site_menu_btn_disabled_border_color); */

    font-weight: var(--btn_font_weight_disabled);
    /* color: var(--site_menu_btn_disabled_color); */
    text-decoration: line-through;
}
.btn.btn_sm {
    line-height: 1em;
    font-size: .9em;
}
.btn.btn_md {
    line-height: 1em;
    font-size: 1em;
}
.btn.btn_lg {
    line-height: 1em;
    font-size: 1.1em;
}

ul.btn_list>li {
    display: block;
    /* margin: .75rem 0rem; */
    /* padding: 0; */
}
ul.btn_list>li:hover {
    outline: dashed thin pink;
}
/* *** END *** System *** Buttons *** */


/*x-Small devices (portrait phones, less than 576px)*/
@media (max-width: 575px) {
    .btn {
        padding: .1em .1em;
    }
}

/*Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767px) {
    .btn {
        padding: .1em .25em;
    }
}