/* CSS Variables */
:root {
    --color-link: #0083db;
    
    --color-white: #fff;
    --color-black: #111;
    
    --color-gray: #bbbbbb;
    --color-superlightgray: #e3e3e3;
    --color-lightgray: #ddd;
    --color-darkgray: #888;
    
    --color-blue: #0077bb;
    --color-red: #d1213c;
    
    --max-desktop-width: 1200px;
    --max-content-width: 750px;
}

/* Basic CSS reset */
html, body, div, span, a, h1, h2, h3, h4, h5, h6, p, blockquote, img, input, label, select, table, tbody, tfoot, thead, tr, th, td, footer, header, menu, nav, section, video {
    margin: 0; padding: 0; font-size: 100%; box-sizing: border-box; list-style: none; border: 0;
}

html, body {
    height: 100%;
    -webkit-text-size-adjust: 100%;
    text-size-adjust: none;
    line-height: 1.4;
}

html{ scroll-behavior:smooth; }

header, nav, hr, .button, .button_small, label, .show_section, .select, .unselectable, .hide_section, .privacypicker, .statuspicker, .ui-datepicker, .img1, .img2, .img3, .img4, .pg_no, .tag, .api_loader_wrapper, .slider, .circle_button_left, .circle_button_right {
    -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
}

.max_content_width, .img1 {
    max-width: var(--max-content-width);
}

.max_desktop_width {
    max-width: var(--max-desktop-width);
}





/* FRAMEWORK COLOR PALETTE */

.button, .button_small {
    background-color: var(--color-lightgray);
    color: var(--color-black);
}

/*.button:hover, .button_small:hover, .privacypicker:hover, .statuspicker:hover {*/
.button:hover, .button_small:hover {
    background-color: var(--color-gray);
}

.privacypicker, .statuspicker {
    color: var(--color-black);
    background-color: var(--color-lightgray);
}

.ui_bg_lightgray {
    background-color: var(--color-lightgray);
}

.ui_bg_primary {
    background-color: var(--color-link);
    color: var(--color-white);
}

.ui_bg_dark {
    background-color: var(--color-black);
    color: var(--color-white);
}





/* GRAY */
.gray {
    color: var(--color-gray);
}
input, table, th, td, textarea {
    border: 1px solid var(--color-gray);
}
.field_spacer_with_line {
    border-top: 1px solid var(--color-gray);
}



/* BLUE */
.ui-state-active {
    background-color: var(--color-blue);
    color: var(--color-white);
}
a, .blue {
    color: var(--color-blue);
}


/* RED */
.ui_bg_red {
    background-color: var(--color-red);
    color: var(--color-white);
}
.ui_red {
    color: var(--color-red);
}

.ui_bg_red:hover, .ui-state-active:hover, .ui_bg_primary:hover, .ui_bg_dark:hover {
    background-color: var(--color-black);
}








/* Body styles */

.body_no_scroll { overflow: hidden; }

main, .main {
    box-sizing: border-box;
    /*padding: 1.5em 2em 1em 2em;*/
    padding: 1.5em 3em 1em 3em;
    margin: 0 auto;
    width: 100%;
    max-width: var(--max-desktop-width);
    min-height: 300px;
    flex-grow: 1;
}

.main_no_min_height { min-height: 0; }

#page_wrapper { /* This keeps the footer at the bottom. */
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    background: white;
}



.flexbox_wrapper {
    display: flex;
    gap: 0.5em;
    align-content: flex-start;
    width: 100%;
}

.flexbox_wrapper > * {
    flex: 1;
    /*transition: transform .1s;*/
    transition: all .1s;
}

.flexbox_buttons > a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: black;
    padding: 1em 0.5em 0.9em 0.5em;
    position: relative;
}

.flexbox_wrapper .icon {
    display: block;
    margin-bottom: 0.3em;
    width: 5em;
    height: 3.25em;
    object-fit: contain;
}

.button_title {
    font-weight: bold;
    font-size: 0.85em;
    line-height: 1.1;
}






.button_basic_2023, .button_action_2023, .button_dummy_2023 {
    -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
    padding: 0.88em 1.3em 0.82em 1.3em;
    border-radius: 8em;
    display: inline-block;
    margin: 0 0.75em 0.75em 0;
    line-height: 1.3;
    box-shadow: none;
    transition: all .1s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    border: 0;
    min-width: 5em;
    text-align: center;
    -moz-box-sizing: content-box; /* or `border-box` */
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.button_basic_2023:hover, .button_action_2023:hover {
    box-shadow: 0.03em 0.2em 0.5em rgba(0, 0, 0, 0.25);
    transform: scale(1.07);
}

.button_red_2023 {
    background-color: var(--color-red) !important;
}

.button_dummy_2023 {
    border: 0.25em solid var(--color-red);
    padding: 0.63em 1em 0.67em 1em; /* offset for border */
    color: var(--color-red);
}

.button_basic_2023 {
    background-color: var(--color-superlightgray);
    color: black;
    cursor: pointer;
}

.light_links .button_basic_2023 { color: black !important; }

.button_basic_2023:hover {
    background-color: var(--color-gray);
}

.button_basic_2023 .icon, .button_action_2023 .icon {
    display: block;
    width: auto;
    height: 1.25em;
    float: left;
    margin-right: 0.5em;
    margin-bottom: 0;
}


.button_action_2023 {
    background-color: var(--color-link);
    color: white;
    cursor: pointer;
}

.button_action_2023:hover {
    background-color: var(--color-black) !important;
}







.button_style_standard > a {
    background: var(--color-superlightgray);
    border-radius: 0.4em;
    min-height: 6.4em; /* 6.25em */
    padding: 0.25em 0.35em 0.25em 0.35em;
}

.button_style_standard > a:hover, .button_style_pill > a:hover, .button_style_smallerbox > a:hover {
    background: white;
    box-shadow: 0.02em 0.2em 0.7em rgba(0, 0, 0, 0.35);
    z-index: 600;
}

.button_style_pill {
    gap: 0.6em;
    flex-wrap: wrap;
}

.button_style_pill > a {
    flex-direction: row;
    flex: none;
    border-radius: 1.5em;
    color: black !important;
    max-width: none;
    padding: 0.8em 0.8em;
    gap: 0.125em;
    min-height: 2.3em;
    background: var(--color-superlightgray);
}

.button_style_pill .icon {
    display: block;
    width: 2em;
    height: 2em;
    margin: -0.5em 0.25em -0.5em -0.5em;
}

a.flexbox_button_selected, a.flexbox_button_selected:hover {
    transform: none;
    background: #1c355e;
    color: white;
    box-shadow: none;
}




.button_style_smallerbox {
    display: inline-flex;
    gap: 0.5em;
}

.button_style_smallerbox > a {
    min-height: 3.125em;
    padding: 0.5em 0.75em;
    background: var(--color-superlightgray);
    border-radius: 0.25em;
}

.button_style_smallerbox .icon {
    width: 2.25em;
    height: 2.25em;
    margin: 0 0 0.25em 0;
}

.button_style_smallerbox a.flexbox_button_selected {
    background: #1c355e;
    color: white;
    box-shadow: none;
}

.button_style_smallerbox .button_title {
    line-height: 1.2;
    font-size: 0.9em;
}



.button_style_linkrow, .button_style_linkrow_large {
    font-size: 1.15em;
    margin-top: -1em;
    /*justify-content: space-around;*/
    justify-content: center;
}

.button_style_linkrow > a {
    max-width: 10em;
    flex: 1;
    padding-top: 0;
    padding-bottom: 0;
}

.button_style_linkrow .icon {
    width: 7em;
    height: 5em;
    margin-bottom: 0.55em;
}



.button_style_linkrow_large > a {
    flex: 0 0 14em;
    padding-top: 0;
    padding-bottom: 0;
}

.button_style_linkrow_large .icon {
    width: 9em;
    height: 7em;
    margin-bottom: 1em;
}







.bigbutton {
    display: inline-block;
    color: white;
    background-color: var(--color-link);
    padding: 1em 1.5em;
    font-size: 1.2em;
    min-width: 12em;
    text-align: center;
    font-weight: bold;
    border-radius: 5em;
}








a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

a[href^=tel] { /* don't recolor phone numbers on mobile */
   text-decoration:inherit;
   color: inherit;
}

input, textarea {
    -webkit-border-radius: 0;
}

.richtext ul, .richtext ol, .jqte_editor ul, .jqte_editor ol {
    margin: 1em;
}

.richtext ul li, .jqte_editor ul li {
    list-style-type: disc;
    margin: 0em 0.5em 0.5em 1em;
}

.richtext ol li, .jqte_editor ol li {
    list-style-type: decimal;
    margin: 0em 0.5em 0.25em 1em;
}

.img1 {
    clear: both;
    margin-bottom: 15px;
}
.img1 img {
    max-width: 100%;
}
.img2 {
    clear: left;
    float: left;
    max-width: 40%;
    margin: 6px 25px 10px 0px;
}
.img3 {
    clear: left;
    float: left;
    width: 8em;
    min-height: 8em;
    margin: 0 1em 0.35em 0;
}
.img3 img {
    width: 8em;
    height: 8em;
    border-radius: 4em;
}
.img4 {
    clear: right;
    float: right;
    max-width: 40%;
    margin: 6px 0 10px 25px;
    text-align: right;
}
.img1 img, .img2 img, .img3 img, .img4 img {
    display: block;
    -webkit-user-select: none;  
    -moz-user-select: none;    
    -ms-user-select: none;      
    user-select: none;
}
.img1 img {
    max-width: 100%;
    max-height: 90%;
    margin: 0 auto;
}
.img2 img {
    max-width: 100%;
    max-height: 280px;
    margin: 0 auto 0 0;
}

.img3 img {
    max-width: 100%;
    max-height: 280px;
    margin: 0 auto 0 0;
}
.img4 img {
    max-width: 100%;
    max-height: 280px;
    margin: 0 0 0 auto;
}

.caption {
    padding: 0;
    text-align: center;
    font-style: italic;
    font-weight: 300;
    -webkit-user-select: text;  
    -moz-user-select: text;    
    -ms-user-select: text;      
    user-select: text;
    outline: none;
    max-width: 650px;
    margin: 4px auto 4px auto;
    font-size: 0.80em;
    display: block;
}

.img2 .caption {
    text-align: left;
}



table {
    border-collapse: collapse;
    margin-top: 0.5em;
}

th, td {
    padding: 0.3em 0.45em 0.15em 0.45em;
}



.text_content {
    line-height: 1.5;
}

.text_content h2 {
    margin-bottom: 0em;
}

.text_content h4 {
    line-height: 1.3;
    font-size: 1.2em;
    margin: 0.75em 0 0.1em 0;
}

.text_content h5 {
    font-size: 1em;
    font-weight: normal;
    margin: 0;
    max-width: var(--max-content-width);
}

.text_content h6 {
    font-weight: normal;
    font-size: 0.85em;
    margin: 0 0 1em 0;
    line-height: 1.4;
    max-width: var(--max-content-width);
}

.text_content p {
    max-width: var(--max-content-width);
    margin: 0 0 1em 0;
}

.text_content ol, .text_content ul {
    margin: 0.125em 0 0.75em 0;
    max-width: var(--max-content-width);
}

.text_content li {
    margin: 0.25em 0;
    line-height: 1.4;
}

.text_content hr {
    border: none;
    height: 1px;
    margin: 1em 0;
    background-color: var(--color-gray);
}





/* UI elements */

.admin_links {
    line-height: 1.6;
    margin: 0em 0 1.65em 0;
}

.admin_links a:hover {
    color: black;
}

.button, .button_small {    
    border: 0;
    text-align: center;
    line-height: 1em;
    display: inline-block;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    border-right: 0.12em solid rgba(0,0,0,0.25);
    border-bottom: 0.12em solid rgba(0,0,0,0.25);
    border-radius: 0.3em;
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    margin: 0 0.5em 0.5em 0;
    white-space: nowrap;
}

.button {
    min-width: 3.5em;
    font-size: 0.9em;
    padding: 0.7em 0.8em 0.6em 0.8em;
}

.button_small {
    min-width: 2.5em;
    font-size: 0.75em;
    padding: 0.6em 0.7em 0.5em 0.7em;
}

.button:hover, .button_small:hover {
    text-decoration: none;
}

.button_processing, .button_processing:hover {
    text-decoration: none;
    background-image: url(/framework/images/button_processing.gif);
    /*border-top: 0.12em solid rgba(0,0,0,0.2);
    border-left: 0.12em solid rgba(0,0,0,0.2);*/
    
    border-left: 0.12em solid rgba(0,0,0,0.25);
    border-top: 0.12em solid rgba(0,0,0,0.25);
        
    border-right: none;
    border-bottom: none;
    cursor: default;
    line-height: 1em;
    /*padding-bottom: 0.6em;*/
    opacity: 0.65;
    
    color: gray !important;
    /*margin-bottom: -2em !important;*/
    
    /*padding: 0.7em 0.8em 0.6em 0.8em;*/
    /*margin: 0 0.5em 0.5em 0;*/
}

.button_icon {
    width: auto;
    height: 1em;
    display: block:
    float: left;
    margin-left: -0.125em;
    margin-right: 0.35em;
    margin-top: -1em;
    margin-bottom: -0.125em;
}

.button_gear {
    min-width: 0;
    width: 1em;
    background-image: url(/framework/images/gear.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.25em 1.25em;
}

.fw_toggle_link {
    cursor: pointer;
}

.fw_toggle {
    height: 2.5em;
    width: 5em;
    margin: 0 auto 0.5em auto;
    background-repeat: no-repeat;
    background-size: 4em auto;
    background-position: center;
}

.fw_toggle_on {
    background-image: url(/framework/images/toggle_on.png);
}

.fw_toggle_off {
    background-image: url(/framework/images/toggle_off.png);
}

.fw_toggle_link .button_title {
    color: black;
    font-size: 0.85rem;
}






/* Generic Animation Classes */
/*.ani_pop { transition: transform .125s ease-in-out; }*/
.ani_pop { transition: all .07s ease-in-out; }
.ani_pop:hover { transform: scale(1.05); }

.no_pop { transition: none !important; transform: none !important; }
.no_pop:hover { box-shadow: none !important; }

.glowy { box-shadow: none; }
.glowy:hover { box-shadow: 0.03em 0.2em 0.5em rgba(0, 0, 0, 0.35); }

/* offset-x | offset-y | blur-radius | spread-radius | color */
/*.boxy { box-shadow: 0.045em 0.045em 0.25em 0.04em rgba(0, 0, 0, 0.4); }*/
.boxy { box-shadow: 0.005em 0.045em 0.35em 0.02em rgba(0, 0, 0, 0.35); }
/*.boxy_nohover { box-shadow: 0.01em 0.01em 0.4em 0.025em rgba(0, 0, 0, 0.15); }*/
.boxy_nohover { box-shadow: 0.05em 0.02em 0.4em 0.025em rgba(0, 0, 0, 0.25); }
.boxy:hover { box-shadow: 0.1em 0.4em 0.8em 0 rgba(0, 0, 0, 0.5); }

.dynamic_size { font-size: 1em; }





/* Modal */

.modal_trigger { cursor: pointer; }

.modal_blackout_wrapper {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 1550;
}

.modal_blackout {
    display: flex;
    position: fixed;
    z-index: 500;
    inset: 0;
    padding: 1em;
    background: rgba(0,0,0,0.72); /* 0.6 */
    -webkit-backdrop-filter: blur(0.65px); /* 0.5 */
}

.modal {
    background: white;
    color: black;
    margin: auto;
    min-width: 25em;
    border-radius: 1.25em;
    transition: transform .5s;
    transform: translate(0, -2em);
    min-height: 10em;
    padding: 0;
    box-shadow: 0 0.25em 2.5em rgba(0, 0, 0, 0.33);
    white-space: normal;
    z-index: 1000;
}

.modal .video-container-wrapper {
    z-index: 1200;
    position: relative;
}

.modal_close_x {
    display: block;
    position: absolute;
    top: 0.75em;
    right: 0.75em;
    width: 2.5em;
    height: 2.5em;
    border-radius: 1.25em;
    background: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    z-index: 1500;
}

.modal_close_x img {
    width: 1.125em;
    height: 1.125em;
    display: block;
    flex: 1;
}

.modal_inner {
    clear: both;
    overflow-y: auto; /* 20231213 DH scroll */
    overflow-x: default;
    max-height: 90vh;
    /*max-width: 550px;*/
    width: 100%;
    padding: 0;
    border-radius: 1.125em 1.125em 0 0;
}

.modal_yt_embed_spinner {
    position: absolute;
    top: 11em;
    width: 100%;
    z-index: 1100;
}

.modal_inner_body {
    text-align: center;
    padding: 1.5em 2.5em 1.75em 2.5em;
}

.modal_banner {
    width: 100%;
    padding-bottom: 50%;
    height: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.modal_title_wrapper {
    text-align: center;
    align-items: center;
    display: flex;
    margin: 0 3.75em 1em 3.75em;
    padding-top: 0em;
}

.modal_title {
    font-weight: bold;
    /*text-align: center;*/
    /*margin: 0 2em 0 3em;*/
    /*background: blue;*/
    font-size: 1.25rem;
    display: block;
    margin: 0;
    flex: 1;
    /*min-height: 3.5rem;*/
}

#modal_edit_html .main_form {
    text-align: left;
    padding-top: 0;
    margin-top: 0;
    min-width: 32em;
}

/*
#modal_edit_html .main_form textarea {
    line-height: 1.4;
}
*/

#modal_edit_html .field:last-child {
    margin-bottom: 0;
}

#edit_modal .modal_title_wrapper {
    margin-bottom: 1em;
}





/* Side-Scroller */

.sidebox_outer {
    position: relative;
}

.sidebox_outer .circle_button_left, .sidebox_outer .circle_button_right {
    opacity: 0;
    display: block;
    transition: all 0.125s ease-out;
    position: absolute;
    z-index: 550;
    background-color: white;
    border-radius: 100%;
    cursor: pointer;
    top: 50%;
    margin: -1.25em 0 0 0;
}

.sidebox_outer:hover > .circle_button_left, .sidebox_outer:hover > .circle_button_right {
    opacity: 0.5;
}

.sidebox_outer .circle_button_left {
    display: none;
    left: 1em;
}

.sidebox_outer .circle_button_right {
    right: 1em;
}

.sidebox_outer .circle_button_left:hover, .sidebox_outer .circle_button_right:hover {
    background-color: white;
    opacity: 1.0;
    transform: scale(1.125);
}




.sidebox {
    overflow-x: scroll;
    overflow-y: visible;
    white-space: nowrap;
    width: 100%;

    -ms-overflow-style: none;
}

.sidebox::-webkit-scrollbar {
    display: none;
}

.sidebox_inner {
    padding: 2em 3em 2em 3em;
    display: flex;
    align-items: center;
}

.sidebox_left {
    text-align: left;
    flex: 0 0 20em;
    display: block;
    padding-right: 1em;
    white-space: normal;
}

.sidebox_title {
    font-weight: bold;
    font-size: 1.75em;
    line-height: 1.2;
}

.sidebox_text p {
    margin-top: 0.75em;
}

.sidebox_content_bar {
    display: flex;
    padding-left: 2em;
    gap: 1.5em;
}

.sidebox_item {
    display: block;
    flex: 1;
    background: white;
    white-space: normal;
}









/*
.eln_sidebox_item {
    border: 2px dashed black;
    max-width: 8em;
    white-space: normal;
}
*/


.sidebox_inner a.sidebox_item, .sidebox_inner a.sidebox_item:hover {
    color: black;
}

.sidebox_seemore {
    /* This is the box at the end of the side-scroller that holds the "See More" button */
    flex: 0 0 auto;
    padding: 3em;
    display: flex;
}


.sidebox_bumper {
    /* This is the space at the far right of a side-scroller */
    flex: 0 0 10em;
    height: 3em;
    display: flex;
}













#popup_msg {
    position: fixed;
    bottom: 10px;
    left: 10px;
    padding: 1em;
    font-size: 1em;
    border-radius: 3px;
    opacity: 0.9;
    background: var(--color-black);
    color: var(--color-white);
    z-index: 2000;
}

.error_box {
    padding: 0.75em 1em;
    margin: 1em 0;
    border-radius: 6px;
    display: inline-block;
    min-width: 200px;
    background-color: var(--color-red);
    color: white;
}

.error_image {
    width: 12em;
    height: 12em;
    margin-bottom: 0.5em;
}

.draft_bar {
    text-align: center;
    background-image: url(/framework/images/draft_light.png);
    background-color: var(--color-gray);
    background-position: center;
    color: var(--color-white);
    padding: 0.28em 0.4em 0.15em 0.4em;
    font-weight: bold;
    font-size: 0.85em;
    letter-spacing: 0.1em;
    margin-bottom: 0.5em;
}



/* Forms */

.main_form {
    margin-top: 1.5em;
}

.badge_wrapper {
    float: right;
    margin-left: 1.5em;
    margin-bottom: 1em;
    padding: 0;
    border-radius: 0.25em;
    background: var(--color-superlightgray);
    color: white;
    text-align: center;
    min-width: 3.5em;
    overflow: hidden;
    cursor: pointer;
}

.badge_wrapper:hover {
    box-shadow: 0 0.1em 0.75em rgba(0, 0, 0, 0.2);
    background: white;
}

.badge_top {
    background: #a8d2e3;
    font-size: 0.65em;
    padding: 0.25em 0 0.2em 0;
}

.badge_inner {
    padding: 0.2em 0.3em;
    color: black;
}

.field {
    margin-bottom: 1.15em;
}

.field_note {
    margin-top: 0.5em;
    font-size: 0.85em;
}

.show_section {
    clear: both;
    cursor: pointer;
    display: block;
    font-size: 0.9em;
    font-weight: bold;
    margin-top: 2em;
    background: var(--color-superlightgray);
    padding: 0.75em 1em;
}

.form_section {
    display: none;
    margin-bottom: 1.5em;
    box-shadow: 0 0.5em 0.7em rgba(0, 0, 0, 0.2);
}

.form_section_inner {
    font-size: 1em;
    padding: 1.5em 2em 1.5em 2em;
    background: white;
}

.field_spacer {
    height: 1.15em;
}

.field_spacer_with_line {
    border-top: 1px solid var(--color-gray);
    margin-top: 0.25em;
    height: 1.15em;
}

label, .privacy_label, .status_label {
    clear: left;
    font-size: 0.85em;
    margin-bottom: 0.25em;
}

label {
    display: block;
}

.label.red {
    font-weight: bold;
}

.hidden_note_toggle {
    width: 1.5em;
    height: 1.5em;
    display: inline-block;
    margin-left: 0.5em;
    margin-bottom: 3px;
    vertical-align: bottom;
    background: var(--color-superlightgray);
    border-radius: 0.4em;
    cursor: pointer;
    text-align: center;
    font-size: 0.65em;
    color: var(--color-darkgray);
    line-height: 1.65em;
    font-weight: bold;
}

.hidden_note_toggle:hover {
    background: var(--color-gray);
}

.field_hidden_note {
    font-size: 0.85em;
    margin: 0.65em 0 0.95em 0;
    display: none;
}

.label_checkbox {
    cursor: pointer;
    display: inline !important;
    float: none;
}

.field .file_preview {
    margin-bottom: 0.5em;
    display: inline-block;
    padding: 0.5em;
    border: 1px solid var(--color-gray);
    border-radius: 0.2em;
    text-align: center;
    position: relative;
}

.field .image_preview {
    max-width: 16em;
    max-height: 8em;
    margin-left: 0;
    margin-bottom: 0;
    width: auto;
    height: auto;
    display: block;
    float: left;
}

.file_link_wrapper {
    display: inline-block;
    font-size: 0.9em;
    margin-right: 0.5em;
    float: left;
}

.file_delete_undo_div {
    display: none;
}

.file_preview .button_small {
    margin: 0 0 0 0.75em;
}

.file_preview .delete_button {
    position: absolute;
    float: none;
    min-width: 0;
    font-weight: bold;
    right: 0.35em;
    top: 0.35em;
    padding: 0.7em 0.7em 0.6em 0.7em;
}

.file_icon {
    width: 1.15em;
    height: auto;
    margin: 0 0.3em -0.3em 0;
}

input {
    margin: 0;
    font-size: 1em;
    display: block;
    padding: 0.25em;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-appearance: none;
    vertical-align: top;
}

input[type=file] {
    border: none;
    padding-bottom: 0.75em;
}

input[type=checkbox] {
    cursor: pointer;
    vertical-align: top;
    margin-top: 0.25em;
    display: inline-block;
    -webkit-appearance: checkbox;
}

select {
    margin: 2px 0;
    font-size: 1em;
    border: 1px solid #aaa;
}

textarea {
    width: 100%;
    box-sizing: border-box;
    font-size: 1em;
    display: block;
    padding: 0.5em 0.75em;
}

.code_textarea {
    font-family: Menlo, Monaco, monospace;
    font-size: 0.85em;
    border: 1px solid black;
    line-height: 1.6;
    background: #111;
    color: white;
    padding: 0.75em 1em;
    min-height: 16em;
    resize: vertical;
}

.input_width_xlarge  { width: 98.5%; max-width: 98.5%; }
.input_width_large  { width: 32em; max-width: 94%; }
.input_width_normal { width: 17em; max-width: 94%; }
.input_width_small  { width: 8em; max-width: 94%; }





.icon_chooser {
    display: flex;
    flex-wrap: wrap;
    gap: 0.125em;
}

.icons_label {
    margin: auto 0;
    padding-right: 0.5em;
}

.icon_chooser_icon {
    cursor: pointer;
    text-align: center;
    flex: 0 0 auto;
    min-width: 3em;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border: 4px solid white;
    border-radius: 8px;
    padding: 0.35em 0.5em;
}

.icon_chooser_icon img {
    width: auto;
    max-height: 2em;
    align-self: center;
    display: block;
}

.icon_chooser_icon p {
    margin: 0.25em auto 0 auto;
    font-size: 0.75em;
    max-width: 6em;    
}

.icon_chooser_icon_selected {
    border: 4px solid var(--color-black);
}

.icon_chooser_icon_selected:hover {
    transform: none;
}





.colorpicker_wrapper {
    overflow: auto;
    margin: -0.25em 0 1.5em -0.25em;
    font-size: 14px;
    padding: 0.25em;
}

.colorpicker {
    width: 2.8em;
    height: 2.8em;
    border: 4px solid white;
    border-radius: 8px;
    float: left;
    margin: 0 0.15em 0 0;
    cursor: pointer;
    transition: all .1s;
}

.colorpicker_custom, .colorpicker_default {
    float: left;
    border-radius: 8px;
    width: 5.2em;
    text-align: center;
    background: var(--color-superlightgray);
    border: 4px solid white;
    margin: 0 0.15em 0 0;
    padding: 0.47em;
    height: 2.8em;
    cursor: pointer;
    transition: all .1s;
}

.colorpicker:hover, .colorpicker_custom:hover, .colorpicker_default:hover {
    transform: scale(1.07);
}

.colorpicker_selected {
    border: 4px solid var(--color-black);
}

.colorpicker_selected:hover {
    transform: none;
}

.colorpicker_wrapper .input {
    display: none;
    width: 5em;
    font-size: 14px;
    text-align: center;
    padding: 0.47em;
    margin: 4px 0 0 4px;
    border-radius: 4px;
    float: left;
    box-sizing: border-box;
}

.privacypicker_wrapper, .statuspicker_wrapper {
    overflow: auto;
    clear: left;
    padding: 0.5em 0 0.25em 0;
    margin: 0.5em 0;
}

.privacy_label, .status_label {
    float: left;
    padding: 0.65em 0.65em 0 0;
    min-width: 4.75em;
}

.privacypicker, .statuspicker {
    border-radius: 0.4em;
    float: left;
    cursor: pointer;
    font-size: 0.85em;
    margin-right: 0.7em;
    margin-bottom: 0.7em;
    min-width: 5.2em;
    box-sizing: border-box;
    transition: all .125s;
}

.privacypicker:hover, .statuspicker:hover {
    transform: scale(1.125);
    box-shadow: 0.03em 0.1em 0.6em rgba(0, 0, 0, 0.15);
    background-color: var(--color-superlightgray);
}

.privacypicker_selected:hover, .statuspicker_selected:hover {
    box-shadow: 0.03em 0.1em 0.4em rgba(0, 0, 0, 0.35);
}

.privacypicker {
    padding: 0.62em 1em 0.58em 1.9em;
    background-size: 1em;
    background-repeat: no-repeat;
    background-position: 0.65em 50%;
}

.statuspicker {
    padding: 0.62em 1em 0.58em 1em;
    text-align: center;
    background-size: 3em;
}

.statuspicker.btn_draft {
    background-image: url(/framework/images/draft_light.png);
}

.privacypicker_selected, .privacypicker_selected:hover, .statuspicker_selected, .statuspicker_selected:hover {
    background-color: var(--color-black);
    color: var(--color-white);
}





.tag_bar { /* public-facing tag bar */
    margin-top: 1em;
}

.tag_bar a {
    display: block;
    float: left;
    margin: 0 0.85em 0.85em 0;
    line-height: 1.5;
    border-radius: 2em !important;
    /*background-color: var(--color-lightgray) !important;*/
    background-color: var(--color-lightgray); /* Don't use "important" */
    /*color: black !important;*/
    color: black; /* Don't use "important" */
    padding: 0.4em 1em 0.35em 1em;
    font-size: 0.85rem;
}

.tag_bar .tag_break {
    clear: left; /* 20230616: was "both" */
    height: 1px;
}



.tag_bay { /* editing page */
    overflow: auto;
    font-size: 0.85em;
    display: inline-block;
}

.tag_bay .tag {
    background: var(--color-lightgray);
    padding: 0.39em 0.45em 0.36em 0.65em;
    float: left;
    border-radius: 0.25em;
    margin: 0 0.45em 0.45em 0;
    cursor: default;
    pointer-events: none;
}
.tag_bay .tag:hover {
    background: var(--color-gray);
}
.tag_bay .tag > .tag_x {
    pointer-events: auto;
}
.tag_bay .tag_x {
    width: 1.2em;
    height: 1.2em;
    margin-left: 0.3em;
    display: block;
    float: right;
    cursor: block;
    background-image: url(/framework/images/close_dark.svg);
    background-size: 65%;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.2;
}
.tag_bay .tag_x:hover {
    opacity: 0.6;
}




.ui-datepicker {
    width: auto;
    height: auto;
    margin-left: -0.5em;
    padding: 1em 1.5em 1.5em 1.5em;
    border-radius: 0.5em;
    background: white;
    display: none;
    box-shadow: 1px 0px 1.25em rgba(0, 0, 0, .2);
}

.ui-datepicker table {
    margin-top: 0.75em;
    width: 100%;
    border-collapse: collapse;
    border: none;
}

.ui-datepicker-header {
    background: white;
    color: var(--color-black);
    padding-bottom: 0.25em;
    font-weight: bold;
    font-size: 0.9em;
}

.ui-datepicker-title {
    text-align: center;
    padding-top: 0.2em;
    font-size: 1.2em;
}

.ui-datepicker-prev {
    float: left;
    cursor: pointer;
    background-position: center -50px;
}

.ui-datepicker-prev, .ui-datepicker-next {
    font-size: 0.9em;
    display: inline-block;
    width: 2.25em;
    margin-top: 0.5em;
    height: 2em;
    color: var(--color-blue);
    text-align: center;
    cursor: pointer;
    border-radius: 0.2em;
}

.ui-datepicker-next {
    float: right;
    cursor: pointer;
    background-position: center 0px;
}

.ui-datepicker th {
    /* weekday names */
    text-transform: uppercase;
    text-align: center;
    padding-top: 0.4em;
    padding-bottom: 0.2em;
    color: var(--color-gray);
    font-size: 0.65em;
    letter-spacing: 0.1em;
    border: none;
}

.ui-datepicker tbody td {
    padding: 0;
    border: 2px solid white;
    border-radius: 0.25em;
}

.ui-datepicker tbody td:last-child {
    border-right: 2px solid var(--color-white);
}

.ui-datepicker tbody tr {
    border: none;
}

.ui-datepicker tbody tr:last-child {
    border: none;
}

.ui-datepicker a {
    text-decoration: none;
}

.ui-datepicker td span, .ui-datepicker td a {
    display: inline-block;
    text-align: center;
    width: 2.25em;
    height: 2em;
    font-size: 1em;
    line-height: 2.1em;
    color: var(--color-white);
}

.ui-datepicker-calendar .ui-state-default {
    color: var(--color-black);
    border-radius: 0.25em;
}

.ui-datepicker-calendar .ui-state-hover {
    background: var(--color-blue);
    color: var(--color-white);
}

.ui-datepicker-calendar .ui-state-active {
    background: var(--color-black);
    font-weight: bold;
    color: var(--color-white);
}

.ui-datepicker-unselectable .ui-state-default {
    background: var(--color-lightgray);
    color: var(--color-white);
}



.ui-autocomplete {
    position: absolute;
    z-index: 1001;
    background: white;
    overflow-y: scroll;
    /*margin: 0 0 0 -2em;*/
    max-height: 300px;
    list-style: none;
    /*border: 1px solid var(--color-gray);*/
    box-shadow: 0.03em 0.2em 0.65em rgba(0, 0, 0, 0.4);
    padding: 0;
    cursor: pointer;
    border-radius: 0.5em;
}

.ui-autocomplete .ui-menu-item-wrapper {
    padding: 0.6em 0.7em;
    font-size: 14px;
    margin: 0;
}

.ui-helper-hidden-accessible {
    display: none;
}







/* Blocks */

.type_chooser_button {
    position: relative;
}

.type_wrapper, .type_wrapper_admin_links {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin: 0.5em 0;
    gap: 0.3em;
    width: 100%;
}
.type_wrapper a, .type_wrapper_admin_links a {
    display: block;
    width: 8.75em;
    min-height: 3.5em;
    font-size: 0.75em;
    text-align: center;
    color: black;
    line-height: 1.2;
    padding: 1em 0.65em 0.75em 0.65em;
    background-color: var(--color-superlightgray);
    border-radius: 0.25em;
}

.type_wrapper_wider_buttons {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}


.type_wrapper_wider_buttons a {
    width: auto;
}

.type_wrapper_admin_links a {
    display: flex;
    align-items: center;
    padding: 0.55em 0.5em 0.45em 0.5em;
}

.type_wrapper a img {
    width: auto;
    height: 3em;
    margin: 0 auto 0.5em auto;
    display: block;
}

.type_wrapper a:hover, .type_wrapper_admin_links a:hover {
    background-color: white;
    box-shadow: 0 0.2em 1.125em rgba(0, 0, 0, 0.25);
    z-index: 600;
}

.type_chooser .button {
    margin: 0 0 0 0.1em;
}

.type_wrapper_admin {
    display: none;
}

.type_wrapper_admin_links a > * {
    width: 100%;
}

.admin_only_type_link {
    font-size: 0.85em;
    /*position: absolute;*/
    color: black;
    /*right: 1.75em;
    bottom: 1.85em;*/
    opacity: 0.33;
    cursor: pointer;
    display: block;
    clear: both;
    padding: 1em 0 0.25em 0;
    margin: 0 auto;
}

.page_banner {
    width: 100%;
    position: relative;
    background-size: cover;
    background-position: right 50%;
}


.page_banner_overlay {
    position: absolute;
    z-index: 100;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.page_banner_overlay_inner {
    margin: 0 auto;
    display: flex;
    padding: 1em 2.5em;
}

.page_banner_title {
    padding: 0 0.5em 0em 0.5em;
    align-self: flex-end;
    line-height: 1.1;
}

.page_banner_logo {
    flex-grow: 0;
    align-self: flex-end;
}

.page_banner_title a { color: white; }

.page_banner_title_inner, .page_banner_logo_inner {
    flex: 1;
    margin: 0 auto;
    color: white;
}

.page_banner_title_inner h1 {
    line-height: 1.0;
}

.page_banner_logo_inner img {
    width: auto;
    max-width: 100%;
    display: block;
}



.buttonbar_description {
    margin-top: 0;
    margin-bottom: 2em;
}

.buttonbar_description p {
    margin-top: 0;
}

.buttonbar_mobile_menu_wrapper {
    display: none;
    padding-left: 1em;
    align-self: center;
}

.buttonbar_mobile_menu_button {
    display: block;
    width: 1.75em;
    height: 1.75em;
    cursor: pointer;
}




.page_block_main p:last-child {
    /* Remove the bottom margin of the last P in each page block */
    margin-bottom: 0;
}

.page_block_main.light_links .page_block_inner a, .light_links a {
    color: rgba(255,255,255,0.8);
}

.page_block_main.light_links .page_block_inner a:hover, .light_links a:hover {
    color: white;
}

.page_block_main.light_links h4 {
    color: white;
}

.light_links .link a:hover, .light_links .linklist_wrapper a:hover {
    color: black !important;
}



.page_block_main {
    position: relative;
}

.page_block_outer {
    margin: 0 auto;
    width: 100%;
    padding: 0 3em;
    overflow: visible;
}

.page_block_inner {
    margin: 0 auto 0 0;
}

.page_edit_button_wrapper {
    clear: both;
    padding: 3em;
    position: relative;
    text-align: center;
    flex-grow: 0;
    /*display: flex;
    gap: 1em;
    justify-content: center;*/
    background-image: linear-gradient(180deg, #dadada, var(--color-superlightgray), var(--color-superlightgray), var(--color-superlightgray));
    background-color: var(--color-superlightgray);
}

/*
.page_edit_button_wrapper_inner {
    border: 3px solid red;
    margin: 0 auto;
}
*/

.page_block_text {
    display: block;
}

.page_edit_button {
    display: inline-block;
    margin: 0.5em;
    max-width: 12em;
    color: black !important;
    padding: 0.65em 1.25em;
    background: white;
    border-radius: 4em;
    white-space: nowrap;
    box-shadow: 0em 0.07em 0.3em rgba(0, 0, 0, 0.3);
}

.page_edit_button img {
    transition: all .12s ease-in-out;
}

.page_edit_button:hover {
    background: var(--color-link);
    color: white !important;
}

.page_edit_button:hover img {
    filter: invert(1);
}

/*
.page_edit_button_rotate:hover {
    transform: rotate(45deg);
    border: 2px solid black;
}
*/



.page_edit_button_rotate img {
    margin-right: 0.5em;
    transform: scale(1.2);
}

.page_edit_button_rotate:hover > img {
    transform: scale(1.2) rotate(45deg);
}


.api_loader_refresh img {
    transition: all .1s ease-in-out;
}

.api_loader_refresh:hover > img {
    transform: rotate(45deg);
}


/*
.edit_tab_button {
    display: flex;
    gap: 0.25em;
    background: rgba(255,255,255,1.0);
    align-items: center;
    font-size: 0.85em;
    margin-left: 0.9rem;
    padding: 0.3em;
    border-radius: 2em;
    cursor: pointer;
}

.edit_tab_button:hover {
    background: var(--color-link);
}

.edit_tab_button:hover img {
    filter: invert(1);
}

.edit_tab_button:hover > .edit_tab_button_title, .edit_tab_button:hover > .edit_tab_settings_title {
    color: white;
}

.edit_tab_button:hover > .edit_tab_button_icon_large {
    transform: rotate(45deg);
}
*/





.edit_tab_wrapper {
    position: absolute;
    top: 1em;
    right: 0;
    bottom: 0.75em;
    z-index: 1050;
    pointer-events: none;
    /*border: 2px solid purple;*/
}

.edit_tab_wrapper:hover {
    z-index: 1060; /* bump up z on hover to give hovered menu stacking priority */
}

.edit_tab {
    pointer-events: auto;
    position: sticky;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
    
    top: 5em;
    /*margin-bottom: 1em;*/

    gap: 0.5em;
    padding: 0.87em 1.55em 0.87em 0em;
    background: rgba(255,255,255,0.7);
    /*top: 1.25em;*/
    /*right: 0;*/
    border-radius: 2.35em 0 0 2.35em;
    box-shadow: 0 0.125em 0.95em rgba(0, 0, 0, 0.3);
    /*opacity: 0.8;*/
}

/*
.edit_tab * {
    border: 1px solid cyan;
}
*/

.edit_tab:hover {
    /*opacity: 1.0;*/
    background: rgba(255,255,255,0.75);
    box-shadow: 0 0.25em 0.85em rgba(0, 0, 0, 0.45);
}

.edit_tab_settings_title {
    display: none;
}


/*
.edit_tab:hover > .edit_tab_extra {
    display: flex;
}
*/


.edit_tab_button {
    display: flex;
    gap: 0.25em;
    background: rgba(255,255,255,1.0);
    align-items: center;
    font-size: 0.85em;
    margin-left: 0.9rem;
    padding: 0.3em;
    border-radius: 2em;
    cursor: pointer;
    transition: all 0.1s ease-in-out;
}

.edit_tab_button:hover {
    background: var(--color-link);
}

.edit_tab_button img {
    transition: all .1s ease-in-out;
}

.edit_tab_button:hover img {
    filter: invert(1);
}

.edit_tab_button:hover > .edit_tab_button_title, .edit_tab_button:hover > .edit_tab_settings_title {
    color: white;
}

.edit_tab_button:hover > .edit_tab_button_icon_large {
    transform: rotate(45deg);
}



.edit_tab_button_icon {
    width: 1.1rem;
    height: 1.1rem;
    margin: 0.45rem;
    display: block;
}

.edit_tab_button_icon_large {
    width: 1.4rem;
    height: 1.4rem;
    margin: 0.3rem;
    transition: all 2.2s ease-in-out;
}

/*
.edit_tab_button_icon_large:hover {
    transform: rotate(-45deg);
}
*/
.edit_tab_button_title, .edit_tab_settings_title {
    margin-left: 0.65em;
    color: black;
}

/*
.edit_button_gear {
    width: 2rem;
    height: 2rem;
    background-image: url(/framework/images/gear.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.5rem 1.5rem;
}
*/

.edit_tab_extra {
    /*border: 2px solid red;*/
    display: none;
}

.edit_tab_extra_inner {
    display: flex;
    flex-direction: column;
    gap: 0.5em;
    align-items: flex-end;
}








.page_block_title {
    font-weight: bold;
    margin-bottom: 0.25em;
    /*margin-top: 4em;*/
}

h3.page_block_title {
    margin-bottom: 0.6em;
}



.three_col_text {
    display: flex;
    gap: 1.25em;
}

.three_col_text .col {
    flex: 1;
}



.page_block_image {
    height: auto;
    display: block;
    max-width: 100%;
    width: 100%;
}



.attachments_wrapper {
    max-width: 16em;
    float: right;
    clear: both;
    margin: 0 0 0.5em 2em;
}

.attachment {
    font-size: 0.85em;
    margin-bottom: 1em;
}

.attachment_file {
    padding: 0.75em 0.75em;
    border-radius: 0.5em;
    overflow: auto;
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 0.25em;
    line-height: 1.3;
}

.attachment_details, .attachment_details_photo {
    font-size: 0.85em;
    line-height: 1.3;
}

.attachment_details {
    padding: 0 0.75em;
}



.circle_button_left, .circle_button_right {
    background-color: var(--color-superlightgray);
    background-size: 100%;
    box-shadow: 0 0.125em 0.65em rgba(0, 0, 0, 0.25);
    display: inline-block;
    width: 2.5em;
    height: 2.5em;
    margin-left: 0.5em;
    border-radius: 1.25em;
    /*transition: transform .1s;*/
    font-size: 1.25em;
}
.circle_button_left {
    background-image: url(/framework/images/arrow_left.png);
}
.circle_button_right {
    background-image: url(/framework/images/arrow_right.png);
}
.circle_button_left:hover, .circle_button_right:hover {
    background-color: var(--color-gray);
    /*transform: scale(1.08);*/
    box-shadow: 0 0.125em 0.75em rgba(0, 0, 0, 0.35);
}
.circle_button_placeholder {
    display: inline-block;
    width: 2.5em;
    height: 2.5em;
    margin-left: 0.5em;
    font-size: 1.25em;
}







.slider {
    width: 100%;
    position: relative;
    aspect-ratio: 3.333/1;
    overflow: hidden;
    background-color: rgba(0,0,0,0.075);
}

.slide {
    display: none;
    position: absolute;
    inset: 0;
    z-index: 200;
    overflow: hidden;
}

.slider_img {
    width: 100%;
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.slider .circle_button_left, .slider .circle_button_right, .testimonial_slider .circle_button_left, .testimonial_slider .circle_button_right {
    opacity: 0;
    transition: all 0.125s ease-out;
    position: absolute;
    z-index: 500;
    background-color: white;
    cursor: pointer;
}

.slider:hover > .circle_button_left, .slider:hover > .circle_button_right, .testimonial_slider:hover > .circle_button_left, .testimonial_slider:hover > .circle_button_right {
    opacity: 0.5;
}

.slider .circle_button_left:hover, .slider .circle_button_right:hover, .testimonial_slider .circle_button_left:hover, .testimonial_slider .circle_button_right:hover {
    opacity: 1.0;
    background-color: white;
}

.slider .circle_button_left {
    left: 1em;
    top: 50%;
    margin: -1.25em 0 0 0;
}

.slider .circle_button_right {
    right: 1em;
    top: 50%;
    margin: -1.25em 0 0 0;
}




.testimonial_slider .circle_button_left {
    left: 1em;
    top: 8em;
}
.testimonial_slider .circle_button_right {
    right: 1em;
    top: 8em;
}








.testimonial_slider {
    overflow: hidden;
}

.testimonial_slide {
    margin: 0 auto;
    padding: 0em 2em 0 2em;
    display: none;
    position: relative;
}

.testimonial_slide_inner {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 20em;
    overflow: visible;
    justify-content: center;
}

.testimonial_quote {
    /*font-size: 1.2em;*/
    text-align: left;
    padding: 1em 0;
}

.testimonial_details {
    text-align: center;
    margin: 0 auto;
    display: flex;
}

.testimonial_photo {
    display: block;
    border-radius: 3em;
    width: 6em;
    height: auto;
    max-width: 6em;
    margin: 0 1em 0 0;
}

.testimonial_namebox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
}














.pageblock_file {
    padding: 0.6em 0.75em 0.6em 0.6em;
    border-radius: 0.5em;
    overflow: auto;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    margin-bottom: 0.25em;
    margin: 0 auto;
    line-height: 1.3;
}


.video-container {
    position: relative;
    height: 0;
    padding-bottom: 56.25%;
    flex: 0;
    clear: left;
}

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

.linklist_wrapper {
    margin-top: -0.75em;
    margin-bottom: 0.25em;
}

.linklist_wrapper a {
    display: inline-flex;
    padding: 0.28em 0.55em 0.25em 0.5em;
    margin: 0.125em 0 0.125em -0.25em;
    border-radius: 0.5em;
}

.linklist_wrapper a:hover {
    background: white;
    box-shadow: 0 0.1em 0.4em rgba(0, 0, 0, 0.35);
}




.people_wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 3em 2em;
    margin-top: 1.5em;
    margin-bottom: 1em;
}

.people_wrapper_smaller {
    gap: 1.75em;
}

.person_item {
    flex: 0 0 calc(25% - 1.65em);
}

.people_wrapper_smaller .person_item {
    flex: 0 0 calc(19% - 1.125em);
    font-size: 0.85em;
}

.person_item h4, .person_modal h4 {
    margin-top: 0.85em;
    font-size: 0.7em;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    /*color: var(--ipa-green);*/
    line-height: 1.2;
    opacity: 0.45;
}

.person_item .person_name {
    font-size: 1.3em;
    margin: 0.2em 0 0.3em 0;
}

.people_wrapper_smaller .person_item .person_name {
    font-size: 1.1em;
}


.person_item .person_name, .person_modal .person_name {
    font-weight: bold;
}

.person_item p {
    line-height: 1.15;
    margin: 0.25em 0 0.25em 0;
}

/*.person_item a { color: black; }*/

.person_photo {
    width: 100%;
    padding-bottom: 100%;
    border-radius: 50%;
    background-size: cover;
    background-position: center 20%;
    margin-bottom: 0.75em;
}

.person_item .person_photo {
    width: 84%;
    padding-bottom: 84%;
    margin-bottom: 0.85em;
}



/*
.person_modal {
    min-width: 50%;
}
*/

/*
.person_modal .modal_inner {
    padding: inherit 2.5em 2.75em 2.5em;
}
*/

.modal_person_photo_wrapper {
    margin: 1em auto 1.125em auto;
    max-width: 22em;
}

.person_modal h4 {
    color: black !important;
}

.person_modal .person_name {
    font-size: 1.8em;
    margin: 0;
    padding-bottom: 0.15em;
}

.person_modal_details {
    font-size: 1em;
    color: black !important;
}

.person_modal_details p {
    line-height: 1.2;
    margin: 0.3em 0 0.3em 0;
}


.person_modal_bio {
    padding: 0.5em;
}

.person_modal_details a {
    color: var(--color-blue) !important;
}







.org_wrapper {
    margin-top: 2em;
    margin-bottom: 2em;
}

.org_full {
    display: flex;
    flex-direction: column;
    gap: 1em;
}

.org_full .org {
    background: white;
    color: black;
    display: flex;
    border-radius: 0.75em;
    min-height: 14em;
    align-items: center;
    gap: 1em;
    padding: 1.5em;
    box-shadow: 0 0.1em 0.5em rgba(0, 0, 0, 0.32);
}

.org_full .org .org_logo {
    width: 15em;
    max-width: 100%;
}

.org_full .org_logo img {
    display: block;
    margin: auto;
}

.org_full .org a { color: var(--color-link) !important; }
.org_full .org a:hover { color: black !important; }



.org_grid {
    display: flex;
    flex-wrap: wrap;
    gap: 1.5em;
}

.org_grid .org {
    flex: 0 0 calc(25% - 1.65em);
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.85em;
    background: white;
    color: black;
    border-radius: 1em;
    padding: 1em;
    min-height: 12em;
}

.org_grid_large .org {
    flex: 0 0 calc(33% - 1em);
    min-height: 12em !important;
    font-size: 1.1em;
    padding: 2em;
}

.org_grid_small .org {
    flex: 0 0 calc(20% - 1.5em);
    font-size: 0.85em;
}

.org_grid_detailed .org {
    flex: 0 0 calc(33% - 1em);
    gap: 0.125em;
    text-align: left;
    align-items: flex-start;
    padding: 1em 0.75em 1em 1.25em;
}

.org_logo {
    display: block;
}

.org_grid .org_logo {
    max-width: 100%;
    flex-grow: 1;
    display: flex;
}

.org_grid .org_logo img {
    display: block;
    margin: auto;
}

.org_grid .org_name {
    font-size: 1.15em;
    font-weight: normal;
    line-height: 1.2;
    margin: 0 1em;
}

.org_grid .org { color: black !important; }

.org_grid .org p {
    margin: 0;
    line-height: 1.3;
    font-size: 0.85em;
    min-height: 2em;
    padding: 0em 0.5em;
}



.org_text .org a, .org_text .org .nolink {
    display: inline-block;
    width: auto;
    font-size: 1.125em;
    padding: 0.25em 0.55em 0.35em 0.55em;
    border-radius: 0.5em;
}

.org_text .org a:hover {
    background: white;
    color: black !important;
}

.org_featured_flexbox_top {
    margin-top: 1em;
}

.org_featured_box_wrapper {
    flex: 0 0 17em;
}

.org_featured_box {
    margin-left: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.15em;
    max-width: 15em;
    min-height: 9em;
    background: white;
    border-radius: 1em;
}

.org_featured_smalltext_wrapper {
    max-width: 42em;
    margin: 2em auto 0.5em auto;
    align-content: center;
    align-items: center;
}

.org_featured_smalltext {
    padding: 0.25em 0;
    font-size: 0.8em;
    line-height: 1.4;
}

.vap_featured_box_wrapper {
    flex: 0 0 12em;
    align-content: center;
    align-items: center;
    display: flex;
}

.vap_featured_box {
    max-width: 12em;
    margin-bottom: 2em;
    display: block;
    text-align: center;
}

.vap_desc {
    max-width: 36em;
    margin-right: 1.5em;
    margin-top: 1em;
}

.vap_logo img {
    display: block;
    max-width: 12em;
    max-height: 10em;
}










.api_loader_wrapper {
    background: var(--color-superlightgray);
    padding: 4em 2em;
    gap: 0.5em;
    border-radius: 0.5em;
    opacity: 0.5;
    min-height: 11em;
    display: none;
}

.api_loader_inner {
    display: none;
}

.api_loader_inner2 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.api_loader_wrapper p {
    margin: 0;
    flex: 1;
}

.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 30px;
}
.lds-ellipsis div {
    position: absolute;
    top: 7px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #333;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
    left: 8px;
    animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
    left: 8px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
    left: 32px;
    animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
    left: 56px;
    animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}
@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(0);
    }
}
@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(24px, 0);
    }
}






.api_layout_course_box {
    margin: 1.5em 0 1em 0;
    display: grid;
    gap: 2em;
    grid-template-columns: repeat(auto-fill,minmax(20%, 1fr));
}

.api_layout_course_box a {
    display: block;
    border-radius: 0.5em;
    /*background: white;*/
    overflow: hidden;
}

.api_layout_course_box_inner {
    padding: 0.1em 0.75em 0.8em 0.75em;
}

.api_layout_course_box_inner h5 {
    color: black;
    font-size: 1.0em;
    line-height: 1.2;
    margin: 0 0 0.5em 0;
}

.api_layout_course_box_inner p {
    font-size: 0.75em;
    color: black;
    margin: 0;
}

.api_layout_course_box .thumbnail {
    width: 100%;
    padding-bottom: 50%;
    display: block;
    margin-bottom: 0.5em;
    background-size: cover;
    background-position: center; /* center 33% */
}

.api_layout_list {
    margin-top: 1.25em;
}

.api_layout_list h5 {
    font-size: 1.2em;
    font-weight: bold;
    margin: 0;
    line-height: 1.2;
}

.api_layout_list h5 a { color: black; }

.api_layout_button {
    display: inline-block;
    padding: 0.85em 1.5em;
    border-radius: 6em;
    margin-top: 1em;
    margin-right: 0.5em;
    font-size: 0.85em;
    font-weight: bold;
    background: #015997;
    color: white;
}

.api_course_box_modal {
    padding: 1.25em 0 0 0;
}

.api_course_box_modal .modal_inner {
    max-width: 550px;
    padding: 0 0 0.75em 0;
    border-radius: 1.125em;
}

.api_course_box_modal_thumbnail {
    width: 100%;
    padding-bottom: 50%;
    height: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.api_course_box_modal_details h5 {
    font-size: 1.4em;
    margin-bottom: 0.5em;
}

.api_course_box_buttons {
    margin-top: 0.25em;
    text-align: center;
}

.api_course_box_buttons a {
    background-color: var(--color-blue);
    color: white;
    display: inline-block;
    vertical-align: top; /* removes whitespace underneath */
    font-weight: bold;
    background: var(--color-link);
    padding: 1em 2em;
    line-height: 1.15;
    font-size: 1em;
    height: 3.1em;
    border-radius: 1.55em;
    margin: 1em auto 0 auto;
    text-align: center;
    transition: transform 0.15s ease-in-out;
}

.api_course_box_buttons a:hover {
    transform: scale(1.1);
    box-shadow: 0.35em 0.35em 0.5em rgba(0, 0, 0, 0.15);
    filter: brightness(1.05);
}









/* Basic page */

.basic_top_buttons {
    margin-top: 1em;
    float: left;
}



.list_modal_buttons {
    margin-top: 1em;
}




.button_modal {
    margin: 0 0 1em 0.5em;
    min-width: 0;
}

.button_modal img {
    width: 0.9em;
    height: 0.9em;
    float: left;
    margin: 0em 0.4em 0 -0.1em;
}


.button_modal {
    float: left;
}


.list_search {
    margin: 0 0 1em 1em;
    text-align: right;
    white-space: nowrap;
}

.list_search form {
    float: none;
}

.list_search input[type=text] {
    width: 7em;
    display: inline-block;
    margin: 0 0.5em 0 0;
    padding: 0.38em;
}

.pageblock_search input[type=text] {
    width: 7em;
    display: inline-block;
    margin: 0 0.5em 0 0;
    padding: 0.38em;
}

.list_search .button, .pageblock_search .button {
    margin: 0;
    width: 1em;
    display: inline-block;
    float: none;
    min-width: 1em;
    background-image: url('/framework/images/search_dark.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 1.25em 1.25em;
}

.list_search_icon {
    width: 1.25em;
    height: 1.25em;
    position: absolute;
    right: 0;
}

.list_search_keyword {
    margin: 0 0 0 0;
    float: right;
    clear: both;
    font-size: 0.85em;
}



.pageblock_search_wrapper {

}

.pageblock_search {
    flex: 0 0 20em;
    text-align: right;
    margin-top: 0.25em;
}




.basic_list {
    clear: both;
    margin-top: 1em;
    padding: 0;
}

.basic_list li {
    padding: 0.35em 0;
    background: var(--color-white);
    border-top: 1px solid var(--color-gray);
    border-bottom: 1px solid var(--color-gray);
    margin-bottom: -1px;
    display: flex;
    align-items: center;
}

.basic_grid {
    clear: both;
    margin-top: 1em;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5em;
    padding: 0;
}

.basic_grid li {
    box-sizing: border-box;
    text-align: center;
    display: flex;
    flex-direction: column;
    flex-basis: calc(20% - 1.5%);
    align-items: center;
    border: 1px solid var(--color-gray);
    box-sizing: border-box;
    padding: 0 0 0.5em 0;
}




.list_item_chk {
    padding: 0em 0.5em 0.25em 0;
    display: flex;
}

.list_item_img {
    margin: 0 0.5em 0 0;
    width: 2.5em;
    height: 2.5em;
    display: block;
    position: relative;
}
.basic_grid .list_item_img {
    width: 100%;
    padding-bottom: 56%;
    margin: 0 0 0 0;
    text-align: center;
}

.list_item_img img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    position: absolute;
}
.list_item_img img.rounded {
    border-radius: 50%;
}

.list_preview {
    width: auto;
    height: 4em;
}

.list_preview img {
    position: relative;
}

.basic_grid .list_item_img img {
    position: absolute;
    margin: auto auto 0 auto;
    left: 0px;
    right: 0px;
    text-align: center;
}
.basic_list .list_file_icon img {
    max-height: 2em;
}
.basic_grid .list_file_icon img {
    max-height: 3.5em;
}


.list_item_icon {
    width: 1.2em;
    height: 1.2em;
    margin-right: 0.5em;
    margin-top: -0.05em;
    display: block;
}

.list_item_name {
    display: block;
    margin-right: 1em;
}
.basic_grid .list_item_name {
    font-size: 0.75em;
    line-height: 1.3;
    margin: 0.5em 0 0.7em 0;
}

.list_item_detail {
    font-size: 0.75em; /* 0.7em */
    margin-top: 0.15em;
    letter-spacing: 0.02em;
    color: var(--color-black);
}

.list_buttons {
    text-align: right;
    margin: -0.25em 0 -0.25em auto;
}
.basic_grid .list_buttons {
    margin: auto 0 0 0;
}

.list_buttons a {
    margin-left: 8px;
}

.list_buttons .button_small, .list_buttons .handle {
    margin: 0.25em 0 0.25em 0.5em;
}
.basic_grid .list_buttons .button_small, .basic_grid .list_buttons .handle {
    margin: 0.25em 0.125em 0 0.125em;
}

.handle {
    font-size: 0.75em;
    background-image: url(/framework/images/handle_bg3.png);
    background-size: 50%;
    background-position: 45% 45%;
    background-repeat: no-repeat;
    border-left: 0.12em solid rgba(0,0,0,0.2);
    border-top: 0.12em solid rgba(0,0,0,0.2);
    border-radius: 0.3em;
    cursor: move;
    box-sizing: border-box;
    display: block;
    float: right;
    line-height: 1em;
    width: 30px;
    padding: 0.6em 0.7em 0.5em 0.7em;
    margin: 0;
    background-color: var(--color-lightgray);
    -webkit-appearance: none;
    -moz-appearance: none;
}

.basic_list li.list_placeholder {
    background-color: var(--color-lightgray);
    background-image: url(/framework/images/draft_light.png);
    background-size: 4em;
}

.handle:hover {
    background-color: var(--color-lightgray);
}



.basic_list_numbers {
    margin: 2em 0 0 0;
    overflow: auto;
    padding-bottom: 0.25em;
}

.page_label {
    font-weight: bold;
    float: left;
    margin: 0.2em 0.4em 0 0;
}

.basic_list_numbers .pg_no {
    display: inline-block;
    line-height: 1.91em;
    height: 1.8em;
    width: 1.8em;
    border-radius: 0.9em;
    margin-left: 0.35em;
    text-align: center;
    color: var(--color-white);
    font-weight: bold;
}

a.pg_no {
    background-color: var(--color-link);
}

a.pg_no:hover {
    background-color: var(--color-black);
}

div.pg_no {
    background-color: var(--color-gray);
}

.section_title {
    padding: 0.75em 1.25em;
}

.section_title p {
    font-size: 2em;
    margin: 0;
    font-weight: 300;
}



.key_wrapper {
    clear: both;
    margin-top: 2em;
    padding-top: 2em;
}

.key_label {
    float: left;
    font-weight: bold;
}

.key_item {
    float: left;
    margin-left: 1.25em;
}

.key_wrapper .list_item_icon {
    margin-right: 0.25em;
    float: left;
}



.import_sources a {
    color: #111;
    font-size: 0.85em;
    display: inline-block;
    border-radius: 0.35em;
    width: 10em;
    padding: 1.5em 1em 1.25em 1em;
    margin: 0.5em;
    background: var(--color-superlightgray);
    transition: transform .1s;
}

.import_sources a:hover {
    transform: scale(1.075);
    background: #eee;
}

.import_source_icon {
    width: 85%;
    margin: 0 auto;
    height: 4em;
    margin-bottom: 1em;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.import_source_img {
    max-width: 10em;
    max-height: 5em;
    margin: 0.5em 0;
}

.import_settings {
    border: 1px solid var(--color-gray);
    margin: 1em auto;
    text-align: left;
    padding: 1em;
    margin-bottom: 2em;
}

.import_settings_row {
    margin: 1em 0;
}

.import_settings_row label {
    float: left;
    width: 40%;
    margin: 0.3em 1em 0 0;
    text-align: right;
}

.import_rows_wrapper {
    margin-top: 1em;
    text-align: left;
}

.import_row {
    border-radius: 0.25em;
    margin-bottom: 0.5em;
    background: var(--color-superlightgray);
    opacity: 1.0;
}

.import_row_disabled {
    opacity: 0.5;
}

.import_row_header {
    padding: 0.35em 0.25em 0.35em 0.5em;
    display: flex;
    flex-direction: row;
    align-items: center;
}

.import_row_header_box {
    text-align: left;
}

.import_row_header_box input[type=checkbox] {
    margin: 0.15em 0.75em 0 0.5em;
}

.import_row_preview_detail {
    font-size: 0.75em;
    margin-top: 0.25em;
    color: var(--color-darkgray);
}

.import_row_details_toggle {
    margin-left: 1em;
}

.disclosure {
    width: 36px;
    height: 36px;
    flex-grow: 0;
	flex-shrink: 0;
    cursor: pointer;
    opacity: 0.4;
    transform: scale(0.75) rotate(0deg);
    transition: all 0.15s ease;
}

.disclosure:hover {
    opacity: 1.0;
}

.disclosure_opened {
    transform: scale(0.75) rotate(-90deg);
}


.disclosure:hover > img {
    transform: scale(1.0);
}

.disclosure img {
    width: 85%;
    height: 85%;
    margin-top: 0.15em;
    transform: scale(0.8);
    transition: transform .3s;
}

.import_row_details {
    clear: both;
    display: none;
    padding: 0 1em 1em 1em;
    font-size: 0.85em;
}

.import_details_col_label {
    padding: 0.15em 0;
    float: left;
    text-align: right;
    width: 25%;
}

.import_details_col_value {
    padding: 0.15em 0 0.15em 0.75em;
    text-align: left;
    margin-left: 25%;
}

.import_details_col_value p:first-child {
    margin-top: 0;
}

.basic_list_footer {
    margin-top: 1em;
    overflow: auto;
}

.basic_list_footer a {
    display: inline-block;
    cursor: pointer;
}

#basic_list_with_checked {
    display: inline-block;
    font-weight: normal;
    margin-left: 1.25em;
}

#basic_list_with_checked a {
    font-weight: bold;
}

.import_duplicates {
    background: var(--color-superlightgray);
    color: var(--color-darkgray);
    text-align: left;
    margin: 1px 0;
    overflow: auto;
    padding: 0.25em;
}

.import_duplicates_title {
    padding: 0.6em 1em;
}

.import_duplicates_toggle {
    float: right;
    font-size: 0.9em;
    font-weight: bold;
    margin-top: 0.125em;
    cursor: pointer;
}

.import_duplicates_wrapper {
    margin: 0.25em 1em 1em 1em;
    display: none;
    clear: both;
    font-size: 0.85em;
    color: var(--color-black);
}

.import_duplicate_row {
    border-top: 1px solid #ccc;
    padding: 1em 0;
}

.inline_padlock {
    display: inline-block;
    width: 0.75em;
    height: 0.75em;
    margin: 0 0.25em;
}




@media screen and (min-width: 1100px) and (max-width: 1400px) {

    .dynamic_size { font-size: 1.2em; }
    
    .button_style_linkrow, .button_style_linkrow_large { font-size: 1.25em; }
    
    .sidebox_inner { padding: 2.5em 4em 2.5em 5em; }
    /*.sidebox_left { flex: 0 0 25em; }*/
    /*.sidebox_item { margin-right: 2em;*/
    
    flex: 0 0 calc(19% - 1.125em);
    
}


@media screen and (min-width: 800px) and (max-width: 1100px) {
    
    .org_grid {
        gap: 1.25em;
    }
    
    .org_grid_small {
        gap: 1em;
    }
    
    .org_grid .org {
        flex: 0 0 calc(33% - 0.75em);
        min-height: 10em;
    }
    
    .org_grid_small .org {
        flex: 0 0 calc(25% - 1em);
    }
    
    
    
    .org_grid .org_name {
        font-size: 1.1em;
        margin: 0 0.5em;
    }
    
    .page_block_outer {
        padding: 0 2em;
    }
    
    .person_item {
        flex: 0 0 calc(33% - 2em);
    }
    
    .people_wrapper_smaller .person_item {
        flex: 0 0 calc(19% - 1.25em);
    }

    .sidebox_inner { padding: 2em 3em 2em 2em; }
    
    .type_wrapper, .type_wrapper_admin_links {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
    
}



@media screen and (max-width: 800px) {

    /* MOBILE */
    
    html, body { font-size: 14px; }
    
    main, .main { padding: 1em 1.5em; }
    
    .dynamic_size { font-size: 0.85em; }
    
    
    
    .edit_tab {
        padding: 0.87em 0.87em 0.87em 0em;
    }
    
    
    
    .flexbox_mobile_cols {
        flex-direction: column;
    }
    
    .flexbox_wrapper {
        flex-wrap: wrap;
        gap: 0.35em;
    }
    
    .button_style_pill .icon {
        margin: -0.125em 0.25em -0.125em 0;
        width: 1.5em;
        height: 1.5em;
    }
    
    .button_style_smallerbox .icon {
        margin: 0 0 0.5em 0;
        width: 2.5em;
        height: 2.5em;
    }
    
    .button_title {
        font-size: 1em;
    }
    
    .button_style_standard .draft_bar {
        left: auto;
    }

    .button_style_linkrow, .button_style_linkrow_large {
        font-size: 0.9em;
        gap: 1.5em 1.5em;
        padding-left: 0.5em;
        padding-right: 1em;
        justify-content: space-around;
    }

    .button_style_linkrow > a, .button_style_linkrow_large a {
        max-width: 20%;
    }
    
    .basic_top_buttons {
        float: none;
        clear: both;
    }
    
    .list_modal_buttons {
        overflow: auto;
        margin-top: 0em;
    }
    
    .basic_top_buttons {
        margin-top: 0.75em;
    }
    
    .button_modal {
        /*margin: 0.75em 0.5em 0 0;*/
        margin: 0.75em 0.5em 1em 0;
    }
    
    .button_modal:last-of-type {
        margin-right: 1em;
    }
    
    .modal_blackout {
        padding: 1em 1em 2em 1em;
    }
    
    .modal {
        margin: auto;
        min-width: 18em;
        max-width: 97%;
        /*width: 97%;*/
    }
    
    .modal_inner_body {
        padding: 1.5em 1.75em 2em 1.75em;
    }
    
    .list_search {
        float: left;
        text-align: left;
        margin: 0.75em 1em 0 0em;
    }
    
    .list_search form {
        float: left;
    }
    
    .list_search .button {
        margin-right: 0.75em;
    }
    
    .list_search_keyword {
        float: left;
        clear: left;
        margin-top: 1em;
    }
    
    .page_banner_overlay_inner  {
        padding: 1em 1em 1em 1.25em;
        align-content: center;
    }
    
    .page_banner_logo {
        min-width: 6em;
        margin-right: 0.5em;
    }
    
    .page_banner_title_inner h1 {
        font-size: 1.8em;
    }
    
    .page_top_spacer {
        height: 0.75em;
    }
    
    .button_bar {
        flex-wrap: wrap;
    }
    
    .button_bar_button {
        flex: 1 1 auto;
    }
    
    .buttonbar_mobile_menu_wrapper {
        display: block;
    }
    
    .circle_button_left, .circle_button_right {
        font-size: 1.5em;
    }
    
    
    
    .org_grid {
        gap: 1em;
    }
    
    .org_grid .org {
        flex: 0 0 calc(49% - 0.5em);
        min-height: 8em;
    }
    
    .org_grid_small .org {
        flex: 0 0 calc(33% - 0.65em);
    }
    
    .org_grid .org_name {
        font-size: 1em;
        margin: 0 0.25em;
    }
    
    
    .org_full .org {
        align-items: flex-start;
        flex-direction: column;
    }
    
    .org_full .org .org_logo {
        width: 100%;
    }
    
    .org_featured_flexbox_top {
        flex-direction: column-reverse;
        text-align: center;
        align-items: center;
    }
    
    .org_featured_flexbox_top > div {
        flex: 1;
        width: 100%;
    }
    
    .org_featured_box, .vap_featured_box {
        margin-left: auto;
        margin-right: auto;
    }
    
    .vap_featured_box {
        margin-bottom: 0em;
        min-height: 0;
    }
    
    .org_featured_box_wrapper, .vap_featured_box_wrapper {
        flex: auto;
        padding-left: 0;
        margin-bottom: 1em;
    }
    
    .org_featured_smalltext_wrapper {
        margin-top: 1em;
    }
    
    .org_featured_smalltext {
        padding: 0.65em 0;
        font-size: 0.75em;
        /*text-align: center;*/
        max-width: 34em;
    }
    
    .vap_desc {
        margin: 1em auto 0 auto;
    }

    
    
    
    
    .pageblock_search {
        text-align: left;
    }
    
    .basic_grid li {
        flex-basis: calc(33.33% - 1.5%);
    }
    
    .page_block_outer {
        padding: 0 1.5em;
    }
    
    
    .page_block_text {
        flex-direction: column-reverse;
    }
    
    
    .three_col_text {
        display: block;
    }
    
    .three_col_text .col:not(:first-child) {
        margin-top: 1em;
    }
    
    .three_col_text .col_no_margin_mobile:not(:first-child) {
        margin-top: 0;
    }
    
    .people_wrapper {
        gap: 1.25em;
        padding-left: 0.5em;
        padding-right: 0;
    }
    
    .person_item {
        flex: 0 0 calc(50% - 0.7em);
    }
    
    .people_wrapper_smaller .person_item {
        flex: 0 0 calc(33% - 1.25em);
    }
    
    .person_modal {
        min-width: 20em;
    }
    
    .person_modal .modal_inner {
        padding: 0.25em 1.5em 0.5em 1.5em;
    }
    
    .person_modal_bio {
        padding: 0.25em;
    }
    
    .modal_person_photo_wrapper {
        max-width: 18em;
    }
        
    .attachments_wrapper {
        max-width: none;
        margin: 1em 0 1em 0;
        width: auto;
        float: none;
        overflow: visible;
    }
    
    .attachment {
        float: left;
        margin-right: 1em;
    }
    
    .section_title {
        padding: 0.55em 1em;
        font-size: 0.85em;
    }
    
    
    .sidebox_inner { padding: 2em 0 2em 1.35em; }
    
    .sidebox_left { flex: 0 0 12em; font-size: 0.85em; }
    
    .sidebox_content_bar { gap: 1em; }
    
    
    .testimonial_slide_inner {
        height: 27em;
    }
    
    
    .type_wrapper, .type_wrapper_admin_links {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    
    .type_wrapper a, .type_wrapper_admin_links a {
        width: auto;
    }
    
    .api_layout_course_box {
        gap: 1.25em;
        grid-template-columns: repeat(auto-fill,minmax(40%, 1fr));
    }
    
    
    .page_edit_button_wrapper {
        padding: 2em;
    }

}



/* input placeholder text color */
::-webkit-input-placeholder {   color: #ccc; }
:-moz-placeholder {             color: #ccc; }
::-moz-placeholder {            color: #ccc; }
:-ms-input-placeholder {        color: #ccc; }