:root{
    --menu_max_width:280px;
    --menu_min_width:60px;
    --primary_color:midnightblue;
    --primary_color_transparent:rgba(25, 25, 112, 0);
    --stained_glass:rgba(25, 25, 112, .7);
    --stained_glass_b:rgba(0, 76, 54, .7);
    --stained_glass_dark:rgba(25, 25, 112, .9);
    --stained_glass_light:rgba(25, 25, 112, .5);
    --secondary_color:dodgerblue; /*#1E90FF*/
    --secondary_color_fade:rgba(30, 144, 255, .8); /*#1E90FF*/
    --secondary_color_transparent:rgba(30, 144, 255, 0); /*#1E90FF*/
    --link_color:deepskyblue;
    --highlight_color:lightsteelblue;
    --highlight_color_light:rgb(200, 206, 219);
    --highlight_color_fade:rgba(176, 196, 222, .5);
    --highlight_color_fade_less:rgba(176, 196, 222, .9);
    --alert:rgb(194, 0, 82); /*#c20052*/
    --alert_secondary:crimson;
    --go_highlight:rgb(0, 220, 86); /* #00DC5A */
    --slate_grey:rgb(72, 72, 72); /*#484848*/
    --incomplete_grey:rgb(171, 171, 171);
    --cancel_grey:gainsboro;
    --button_text:white;
    --glass_background:rgba(255, 255, 255, .3);
    --glass_blur:rgba(255, 255, 255, .6);
    --glass_blur_bright:rgba(255, 255, 255, .8);
    --admin_primary:goldenrod;
    --admin_secondary:darkgoldenrod;
    --admin_primary_fade:rgba(218, 165, 32, .6);
    --admin_primary_fade_light:rgba(218, 165, 32, .2);
    --admin_secondary_fade:rgba(184, 134,11, .6);
    --admin_secondary_fade_light:rgba(184, 134,11, .2);
    --admin_dark:sienna;
    --admin_text:rgb(68, 28, 0);
}

html{scroll-behavior:smooth;}

body{display:grid; width:1fr; height:100vh; overflow:hidden; padding:0; margin:0; font-family:'Roboto', sans-serif; font-weight:400; font-size:16px; color:var(--primary_color); background-color:royalblue; background-position:left; background-repeat:no-repeat; background-size:cover;

    grid-template:
        [HS] "H1 H2 H3 H4 H5" 100px [HE]
        [AS] "A1 A2 A3 A4 A5" 1fr [AE]
        [BS] "B1 B2 B3 B4 B5" 1fr [BE]
        [CS] "C1 C2 C3 C4 C5" 1fr [CE]
        [DS] "D1 D2 D3 D4 D5" 50px [DE]
      / min-content 800px 1fr 1fr 400px;

    animation: loadEffect .6s ease 0s 1 forwards;
}

h1{font-family:'Montserrat', sans-serif; font-weight:900; font-size:1.5em; margin:0; padding:0; line-height:1;}
h2{font-family:'Roboto', sans-serif; font-weight:900; font-size:1.1em; margin:0; padding:0; line-height:1;}

.scroll::-webkit-scrollbar{width:20px;}
.scroll::-webkit-scrollbar-track{background-color:transparent;}
.scroll::-webkit-scrollbar-thumb{background:var(--primary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}
.scroll::-webkit-scrollbar-thumb:hover{background:var(--secondary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}

.scroll_light::-webkit-scrollbar{width:20px;}
.scroll_light::-webkit-scrollbar-track{background-color:transparent;}
.scroll_light::-webkit-scrollbar-thumb{background:var(--highlight_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}
.scroll_light::-webkit-scrollbar-thumb:hover{background:var(--secondary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}

.scroll_side::-webkit-scrollbar{width:20px;}
.scroll_side::-webkit-scrollbar-track{background-color:lightslategray;}
.scroll_side::-webkit-scrollbar-thumb{background:var(--slate_grey); border:6px solid transparent; border-radius:20px; background-clip:content-box;}
.scroll_side::-webkit-scrollbar-thumb:hover{background:var(--primary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}

.material-icons.md-48{font-size:48px;}

/* Autofill for Input Fields - color control */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-text-fill-color: var(--primary_color) !important;
}

/* LOGIN ========================================*/

.login_body{width:100vw; height:100vh; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}

.login_start{width:450px; height:auto;}

.login_container{overflow:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:space-around; margin:0; padding:10px; background:var(--glass_blur); border-radius:40px; border:solid 1px white; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);}
.login_container h1{flex:0 1 400px; margin-top:10px; text-align:center; font-size:2em;}
.login_container p{flex:0 1 400px; text-align:center; margin:10px;}
.login_container label{flex:0 1 400px;}
.login_container label input{flex:0 1 400px;}
.login_container label b{flex:0 1 400px;}
.login_container a{font-size:.8em; padding:10px;}
.login_container div{flex:0 1 400px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
.login_container i{font-size:.8em;}
.login_container section{width:100%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}

.login_button{flex:0 0 380px; margin:20px 5px 10px 5px; padding:12px 20px; text-decoration:none; font-weight:500; text-align:center; border:none; border-radius:5px; color:var(--button_text); background:var(--secondary_color); transition:.3s; cursor:pointer;}
.login_button:link, .login_button:visited{text-decoration:none; color:var(--button_text);}
.login_button:hover, .login_button:active{text-decoration:none; background:var(--go_highlight);}

.login_extra_button{flex:0 1 160px; margin:5px; padding:12px 20px; text-decoration:none; font-weight:600; text-align:center; border:none; border-radius:5px; color:var(--button_text); background:var(--secondary_color); transition:.3s; cursor:pointer;}
.login_extra_button:link, .login_extra_button:visited{text-decoration:none; color:var(--button_text);}
.login_extra_button:hover, .login_extra_button:active{text-decoration:none; background:var(--go_highlight);}

.login_logo img{width:200px; margin:50px 30px 30px 30px;}

.login_end{grid-area:HS / H2 / DE / D5;}

/* MAIN MENU ========================================*/

.hub_menu{grid-area:HS / H1 / DE / D1; overflow:hidden; display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:flex-start; margin:10px 10px 10px 0; padding:0; color:var(--button_text);}
.hamburger:after{content:'\2630'; font-size:1.8em; margin:12px 0 12px 11px; padding:10px; color:var(--button_text); cursor:pointer; transition:.5s;}
.hub_menu div{width:60px; margin-top:10px; transition:.5s;}
.menu p{display:flex; justify-content:flex-start; align-items:center; flex-flow:row nowrap; margin:0; padding:12px 10px 12px 22px; font-size:.9em; border-radius:0 10px 10px 0; cursor:pointer; transition:.5s;}
.menu p:hover{font-weight:700; font-size:1em; background:var(--highlight_color); color:var(--primary_color); transition:.5s;}
.menu p b{flex:1 1 auto; overflow:hidden; white-space:nowrap; margin-left:10px; user-select:none;}

/* HEADER ========================================*/

.hub_header{display:flex; flex-flow:row nowrap; justify-content:space-between; align-items:center; align-content:center; margin:0; padding:20px 10px 5px 5px; background:var(--glass_blur); border-radius:40px 0 0 0;}
.header_full{grid-area:HS / H2 / HE / H5;}
.header_aside{grid-area:HS / H2 / HE / H4;}

.header_greeting{flex:1 1 30%; padding:0; margin:0 10px 0 20px; text-align:left; display:flex; flex-flow:row wrap; justify-content: flex-start; align-items:center; align-content:center;}
.header_greeting section:first-of-type{flex:1 1 90%; display:flex; flex-flow:row wrap; justify-content: flex-start; align-items:center; align-content:center;}
.header_greeting section:last-of-type{flex:1 1 8%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center;}
.header_greeting h1{flex:1 1 100%; margin:5px;}
.header_greeting p{display:flex; justify-content:flex-start; align-items:center; flex-flow:row nowrap; margin:5px; padding:0;}
.header_greeting a{display:flex; justify-content:flex-start; align-items:center; flex-flow:row nowrap; margin:5px; padding:0;}
.header_greeting a:link, .header_greeting a:visited{text-decoration:none; color:var(--primary_color);}
.header_greeting a:active, .header_greeting a:visited:active{color:var(--secondary_color);}
.header_greeting a:hover{animation:flareLink .5s forwards ease-in-out;}

.hub_search{display:flex; margin:5px 10px 5px 5px; position:relative;}
.hub_search label{display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; padding-left:10px; border:solid 1px var(--primary_color); border-radius:30px;}
.hub_search input[type=text]{flex:1 1 80%; width:280px; border:none; background:transparent; color:var(--primary_color);}
.hub_search input[type=text]:focus{outline:none; background:transparent;}
.hub_search input[type=text]:active{outline:none; background:transparent;}
.hub_search input::placeholder{color:var(--primary_color);}
.hub_search span{cursor:pointer; padding:5px;}
.hub_search span:hover{color:var(--secondary_color);}
.hub_search img{flex:1 1 20px; cursor:pointer; width:20px;}
.hub_search_mobile{display:none;}

.search_dropdown{position:absolute; top:36px; left:15px; z-index:99999; width:290px; margin:0; padding:5px; background:var(--stained_glass_dark); color:white; box-shadow:4px 4px 12px rgba(0, 0, 0, .6); transition:.3s; border-radius:0 0 5px 5px;}
.search_dropdown dd{margin:0; padding:8px; font-weight:400; color:white;}
.search_dropdown dd:hover{background:var(--highlight_color); color:var(--primary_color); cursor:pointer;}

.logo{display:flex;}
.logo img{width:150px; padding:5px;}
.logo_mobile{display:none;}

/* NOTIFICATIONS ========================================*/

.notification{position:relative; display:inline-block;}
.notification_numbers{position:absolute; top:6px; left:12px; padding:2px 6px; font-style:normal; font-size:.9em; border-radius:50%; background:var(--alert); color:var(--button_text);}

.header_alert{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
.header_alert p{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; margin:0 0 0 5px; padding:0; cursor:pointer;}
.alert{margin:0 20px 0 10px; border-radius:50%; cursor:pointer; width:36px; height:36px; font-size:36px; transition:.5s;}
.alert:hover{color:white;}
.alert_button_default{color:var(--alert); animation:alertPulse 2s infinite;}
.alert_button_active{color:var(--primary_color); animation:none;}

.promotion{display:flex; flex:1 1 10%; padding:5px 10px 15px 10px; font-size:60px; color:white; text-shadow:0 0 5px black; cursor:pointer; animation:jiggle 0.25s ease-in 1s 25, colorChange .5s infinite 8s; transition:.5s;}
.promotion:hover{color:orangered;}

/* MAIN BODY ========================================*/

.hub_main{overflow:hidden; margin:0; padding:10px; background:linear-gradient(180deg, var(--glass_blur), var(--glass_background));}
.hub_main_bottom{overflow-x:hidden; overflow-y:hidden; margin:0; padding:10px; background:linear-gradient(180deg, var(--glass_blur), var(--glass_background)); border-radius:0 0 0 40px;}
.hub_main_scroll{overflow-x:hidden; overflow-y:scroll; margin:0; padding:10px; border-top:solid 1px var(--primary_color); border-bottom:solid 1px var(--primary_color); background:rgba(255, 255, 255, .6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
.hub_main_special{overflow:hidden; margin:0; padding:0; border-top:solid 1px var(--primary_color); border-bottom:solid 1px var(--primary_color); background:rgba(255, 255, 255, .7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}

.main_columns{display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:stretch;}
.main_rows{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
.main_rows_stretch{display:flex; flex-flow:row wrap; justify-content:space-between; align-items:stretch; align-content:stretch; gap:10px;}
.main_rows_center{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}

.main_home{grid-area:AS / A2 / CE / C3;}
.main_full{grid-area:AS / A2 / DE / D5;}
.main_full_aside{grid-area:AS / A2 / DE / D4;}
.main_aside{grid-area:AS / A2 / CE / C4;}
.main_mid{grid-area:AS / A2 / CE / C5;}

/* MAIN MODULES ========================================*/

.hub_main_module{flex:1 1 99%; height:90%; overflow:visible; margin:10px; padding:0; display:flex; flex-flow:row wrap; justify-content:space-around; align-items:center; text-align:center; background:var(--glass_blur); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}
.hub_newsfeed_container{width:100%; height:96%; overflow-x:hidden; margin:10px 0 10px 10px; border-radius:10px;}
.hub_newsfeed{width:100%; padding:0; display:flex; flex-flow:row wrap; justify-content:space-around; align-items:center; text-align:center;}
.hub_newsfeed article:first-of-type{flex:1 1 96%; padding:0 0 10px 0; border-bottom:solid 1px var(--primary_color);}
.hub_newsfeed article{flex:1 1 96%; padding:10px 0 10px 0; border-bottom:solid 1px var(--primary_color);}
.hub_newsfeed iframe{width:550px; margin:auto; border:solid 2px lightgray !important; border-radius:15px; background:white;}
.hub_newsfeed article div iframe{margin:auto; justify-content:center;}

.hub_newsfeed img{width:100%; cursor:pointer;}
.hub_newsfeed h1{text-align:center;}

.newsfeed_social{margin:10px;}
.newsfeed_social_border{width:100%; margin:10px; border-bottom:solid 1px var(--primary_color);}

/* You're all caught up! Messaging animation in newsfeed. */
.newsfeed_end{display:flex; flex-flow:column nowrap; justify-content:center; align-items:center; align-content:center;}
.newsfeed_end dt{position:relative; margin:10px; font-family:'Roboto', sans-serif; font-weight:900; font-size:1.5em; color:transparent;}
.newsfeed_end dt:after{content:attr(data-content);}
.newsfeed_end dt:before{position:absolute; width:0; overflow:hidden; content:attr(data-content); white-space:nowrap; animation:colorChange 5s ease-in-out 1s infinite backwards;}

@keyframes colorChange {
    0%{transform:translateX(0); color:transparent;}
    100%{transform:translateX(100%); color:darkorange;}
}

.hub_main br{border-bottom:solid 1px var(--primary_color); padding:5px;}

.news_module{position:relative; margin:5px; padding:0; overflow:hidden; border:solid 1px white; border-radius:20px; color:white;}
/* GRADIENT BEHIND FEATURED NEWS HEADLINE Added 1 line Nichole 8/29/23 */
.news_module:before{content:''; position:absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events:none; background:linear-gradient(to top, var(--secondary_color_fade), var(--secondary_color_transparent) 50%);}
.news_module img{width:100%; height:100%; object-fit:cover; border-radius:20px}
.news_module:hover{animation:moduleGlow .5s forwards ease-in-out;}
.news_module div{position:absolute; bottom:15px; left:15px; margin:5px;}
.news_module h1{margin:0; font-size:1.5em; font-weight:700; text-shadow:0 0 5px black;}
.news_module p{margin:5px 0 0 0;}

.news_highlight_a{flex:2 1 60%; height:64%;}
.news_highlight_b{flex:1 1 30%; height:64%;}
.news_highlight_c{flex:1 1 15%; height:34%;}

.mobile_space{display:none;}

/* NEW MARKETING PAGE - updated 6 lines Nichole 3/13/24 */
.featured_module{height:60%; overflow:visible; margin:10px; padding:0; display:flex; flex-flow:row wrap; justify-content:space-around; align-items:center; text-align:center; background:var(--glass_blur); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}

.featured_item{margin:10px; height:96%; overflow:hidden; display:flex; flex-flow:row wrap; justify-content: center; align-items:flex-start; align-content:center;}
.featured_item h1{flex:1 1 98%; margin:5px;}
.featured_item h2{flex:1 1 98%; margin:5px;}
.featured_item p{flex:1 1 98%; margin:5px;}
.featured_item a{flex:1 1 30%; height:30%;}
.featured_item img{height:90%; width:auto; margin:10px;}
.featured_details{flex:1 1 70%; height:30%; display:flex; flex-flow:row wrap; justify-content:center;}
.featured_extra_module{flex:1 1 26%; max-height:36%; overflow:visible; margin:10px; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px; text-align:center;}
.featured_extra_module h2{margin:3% 1% 1% 1% !important;}
/*.highlights_module article{flex:1 1 15%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center;}*/
.featured_extra_module article{flex:1 1 15%; height:100%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center;}
.featured_extra_icon{flex:1 1 15%; height:100%; margin:0; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-content:center;}
/* Different in Mobile version - should that be updated? */
.featured_extra_module b{font-family:'Montserrat', sans-serif; font-weight:900; font-size:1.5em;}
.featured_extra_module p{margin:5px;}
.featured_extra_module img{width:80%;}
.featured_extra_document{padding:5px; max-height:50px; min-width:280px;}
/*.highlights_module img{width:90%;}*/
/*.mobile_highlight{display:none; justify-content:center;}*/


/* added 8 lines Nichole 10/11/23 */
.clear_container{margin:5px; padding:5px; flex:1 1 90%; height:80%; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
.clear_container img{width:40px;}
.clear_container article{overflow:hidden; flex:0 1 28%; height:60px; margin:5px; padding:10px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px; text-decoration:none; cursor:pointer;}
.clear_container a:hover, .clear_container article:hover{animation:moduleGlowLight .5s forwards ease-in-out;}
.clear_container a div:first-of-type, .clear_container article div:first-of-type{flex:0 1 40px; height:90%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
.clear_container a div:last-of-type, .clear_container article div:last-of-type{flex:1 1 70%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:space-around; text-align:left;}
.clear_container p{margin:0 5px; padding:0}
.clear_container span{margin:5px;}

/* DOCUMENTS */
.glass_container{margin:5px; padding:5px; flex:1 1 90%; height:80%; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}
.glass_container::-webkit-scrollbar{display:none;}
.glass_container img{width:50px;}
.glass_container_full{height:98%;}
.glass_container_aside{height:84%;}
.glass_container a, .glass_container article{overflow:hidden; flex:0 1 30%; height:60px; margin:5px; padding:10px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px; text-decoration:none; cursor:pointer;}
.glass_container a:hover, .glass_container article:hover{animation:moduleGlowLight .5s forwards ease-in-out;}
.glass_container a div:first-of-type, .glass_container article div:first-of-type{flex:0 1 50px; height:90%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
.glass_container a div:last-of-type, .glass_container article div:last-of-type{flex:1 1 70%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:space-around;}
.glass_container p{margin:0 5px; padding:0}
.glass_container span{margin:5px;}

.priority{background:rgba(255, 255, 255, .4); border:solid 1px var(--alert); color:var(--alert);}
.priority i:after{content:'NEW';}
.priority i{margin:0 5px 0 0; padding:2px 6px 2px 6px; font-size:.7em; color:white; background:var(--alert); border-radius:50%; text-transform:uppercase;}
.normal{background:rgba(255, 255, 255, .4); border:solid 1px white; color:var(--primary_color);}

.personnel_cards{display:flex; flex-flow:row wrap; justify-content:flex-start; width:100%; height:auto; perspective:1000px;}
.personnel_cards h1{flex:1 1 98%; margin:5px; padding:10px; background:var(--glass_background); border-radius:10px;}
.personnel_cards h3{flex:1 1 98%; margin:5px 10px; padding:10px; background:rgba(255, 255, 255, .1); border-radius:10px; font-family:'Montserrat', sans-serif; font-weight:900;}
.personnel_cards h2{padding:10px;}
.personnel_cards article{flex:0 0 250px; width:250px; height:250px; text-align:center; transition:transform .8s; transform-style:preserve-3d; margin:10px; box-shadow:8px 8px 10px 0 rgba(0,0,0,0.2); border-radius:20px;}

.personnel_cards article div{position:absolute; width:100%; height:100%; backface-visibility:hidden; border-radius:20px;}
.personnel_cards article div p{width:95%; margin:3px; padding:10px; text-align:left;}
.profile_image{width:calc(100% - 26px); margin:10px; border-radius:12px; font-family:'Satisfy', cursive; color:var(--primary_color);}
.status_border_default{border:3px solid var(--highlight_color);}
.status_border_manager{border:3px solid var(--primary_color);}
.status_border_milestone{border:3px solid var(--admin_primary);}
.profile_image img{width:50px; height:50px;}
.personnel_cards article div:first-of-type{background-color:ghostwhite; box-shadow:inset -2px -2px 6px 2px lightgrey;}

/* BEHIND CARD - turned off */
.personnel_cards article div:last-of-type{display:none;}
.text_on_image{display:none;}

/* BEHIND CARD - FLIP ANIMATION - back of card */
/*
.personnel_cards article:hover{transform:rotateY(180deg);}
.personnel_cards article div:last-of-type{background-color:var(--secondary_color); color:white; transform:rotateY(180deg);}
.text_on_image{position:absolute; bottom:5px; left:5px; font-family: 'Satisfy', cursive; color:darkorange; font-size:2.4em; text-shadow:1px 1px 0 var(--primary_color);}
 */

.cards_contact{width:230px; margin:10px 10px 10px 20px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
.cards_contact p{flex:1 1 90%; margin:0; padding:2px;}
.cards_contact i{flex:1 1 90%; margin:0; padding:2px;}
.cards_contact h2{flex:1 1 90%; padding:5px 2px 2px 2px;}
.cards_contact a{flex:1 1 90%; padding:2px; font-weight:700; color:var(--primary_color); text-decoration:none; transition:.5s; word-break:break-all;}
.cards_contact a:hover{color:var(--secondary_color);}
.cards_contact b{flex:1 1 90%; margin:0; padding:2px; cursor:pointer;}
.cards_contact b:hover{color:var(--secondary_color);}

.email{font-family: 'Roboto Condensed', sans-serif; font-weight:700;}

.milestone_symbol{position:absolute; top:-5px; right:-5px; z-index:2000; animation:growReveal ease-in-out 1.6s; width:75px;}

.back_to_top{display:block; width:50px; height:50px; margin:0; justify-content:center; align-items:center; position:fixed; bottom:40%; right:30px; border-radius:50%; color:var(--primary_color); cursor:pointer;}
.back_to_top span{font-size:48px;}
.back_to_top:hover{animation:flare_up .2s forwards ease-in-out;}

.gallery article{flex:1 1 15%; margin:5px;}
.gallery_thumbnails{padding-bottom:10px;}
.gallery_thumbnails a{text-decoration:none;}
.gallery_thumbnails img{object-fit:cover; width:240px; height:200px; border-radius:5px; border:solid 1px white;}
.gallery_thumbnails img:hover{animation:moduleGlowLight .5s forwards ease-in-out;}
.gallery p{margin:0; padding:3px;}
.gallery b{font-weight:900; font-size:1.125em;}

.testimonial_main{position:relative; width:100%; height:100%; margin:0; padding:0; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; z-index:0;}

.testimonial_card_container{overflow-x:hidden; height:100%; width:500px; padding:10px; z-index:2; scroll-snap-type:y mandatory;}
.testimonial_card_container::-webkit-scrollbar{display:none;}
.testimonial_card_group{width:480px;}
.testimonial_card_group article{height:140px; margin:20px; padding:10px; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px; scroll-snap-align:center; cursor:pointer;}
.testimonial_card_group h2{margin:3px; padding:3px;}
.testimonial_card_group p{margin:3px; padding:3px;}
.testimonial_card_group img{width:60px; height:60px; margin:10px; border:solid 1px white; border-radius:50%;}
.testimonial_profile_pic{width:60px; height:60px; margin:10px; border:solid 1px white; border-radius:50%; background:var(--secondary_color);}
.testimonial_card_blank{display:flex; height:140px; margin:20px; padding:10px; border:solid 1px transparent;}
.testimonial_card_blank:hover{background:transparent;}
.testimonial_card{display:flex; border:solid 1px white;}
.testimonial_card:hover{background:rgba(255, 255, 255, .5);}
.card_selected{ display:flex; box-shadow:5px 5px 20px var(--primary_color); background:var(--glass_background); border:solid 1px white;}

.testimonial_content{width:600px; height:60%; margin:20px; padding:10px; display:flex; flex-flow:column nowrap; justify-content:center; align-items:flex-start; align-content:center; z-index:3;}
.testimonial_content span{font-size:48px;}
.testimonial_content h2{margin:0; padding-top:10px; font-size:2em;}
.testimonial_content p{margin:0; padding:0; font-size:1.2em;}
.testimonial_content p i{font-size:1em;}

.testimonial_clipped{position:absolute; bottom:-10px; right:-100px; height:100%; z-index:1;}
.testimonial_clipped img{opacity:.6; height:100%;}

.benefits_form{display:flex; flex-flow:row wrap; justify-content:space-between; align-items:stretch; align-content:stretch; gap:10px;}

.benefits_module{flex:1 1 90%; margin-left:10px; margin-right:10px; overflow:hidden; padding:0; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-radius:20px;}
.module_information{flex:1 1 98%; height:100%; display:flex; flex-flow:row nowrap; justify-content:space-around; align-items:center; align-content:center;}
.module_admin_edit{flex:fit-content; height:100%; display:flex; flex-flow:row nowrap; justify-content:center; align-items:flex-start; align-content:center;}
.benefits_module div{padding:5px;}
.benefits_module p{margin:3px;}
.benefits_module:hover{animation:moduleGlowLight .5s forwards ease-in-out;}

.priority_task{background:rgba(255, 255, 255, .6); color:var(--primary_color); border:solid 2px var(--alert);}
.default_task{background:rgba(255, 255, 255, .4); color:var(--primary_color); border:solid 2px white;}
.priority_task section:first-of-type b{color:var(--alert);}
.completed_task{background:rgba(180, 180, 180, .4); color:var(--primary_color); border:solid 2px slategray;}

.task_number{flex:1 1 10%; margin:0; padding:0;}
.task_number img{width:80%; margin:0; padding:0;}
.task_instructions{flex:1 1 80%; margin:0; padding:0; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
.task_instructions p{flex:1 1 96%;}
/* updated 1 line Nichole 5/24/23 */
.task_instructions a{margin:2px; padding:2px 5px; background-color:var(--highlight_color); border:solid 1px var(--primary_color); border-radius:10px;text-decoration:none; color:var(--primary_color); font-size:.8em; transition:.3s;}
.task_instructions a:hover{background:var(--secondary_color); color:var(--button_text);}

.benefits_task input[type=checkbox]{position:absolute; opacity:0;}
.benefits_task label{margin:5px; padding:10px; position:relative; display:flex; flex-flow:row nowrap; align-items:center; -webkit-touch-callout:none; -webkit-user-select:none; border-radius:10px; cursor:pointer; border:solid 5px var(--incomplete_grey); transition:border .4s;}
.benefits_task label:hover{border:solid 5px var(--primary_color);}
.benefits_task input[type=checkbox] + label::before{content:"\2705"; line-height:1.2; transform:scale(0); transition:transform .3s ease-in-out;}
.benefits_task input[type=checkbox]:checked + label{border:solid 5px transparent;}
.benefits_task input[type=checkbox]:checked + label::before{content:"\2705"; transform:scale(3.3); transition:transform .3s ease-in-out;}

/* updated 2 lines Nichole 5/23/23 */
.stained_glass_module{flex:1 1 90%; margin-left:10px; margin-right:10px; margin-bottom:-5px; padding:5px 10px 5px 10px; background:var(--stained_glass); color:var(--button_text); backdrop-filter: blur(8px); border:solid 2px var(--stained_glass); border-radius:20px 20px 5px 5px;}
.stained_glass_module_b{flex:1 1 90%; margin-left:10px; margin-right:10px; padding:5px 10px 5px 10px; background:var(--stained_glass_b); color:var(--button_text); backdrop-filter: blur(8px); border:solid 2px var(--stained_glass_b); border-radius:5px 5px 20px 20px;}
.contact_table{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; font-size:.7em;}
.contact_table a{color:var(--link_color); text-decoration:none; transition:.5s;}
.contact_table a:hover{color:var(--highlight_color);}
.contact_table table{width:100%; padding:0;}
.contact_table thead{text-align:left; padding:0; text-transform:uppercase;}
.contact_table th{position:relative;}
.contact_table td{padding:0; text-align:left;}

.contact_list{display:none;}

/* FILTERS ========================================*/

.filters{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; font-size:.8em;}
.filters input[type=checkbox]{position:absolute; opacity:0;}
.filters label{margin:3px; padding:6px; position:relative; display:flex; flex-flow:row nowrap; align-items:center; -webkit-touch-callout:none; -webkit-user-select:none; background:var(--primary_color); border:solid 1px var(--primary_color); border-radius:5px; color:var(--button_text); cursor:pointer;}
.filters label::before{content:"\25A2"; margin-right:6px; transition:transform .3s ease-in-out;}
.filters input[type=checkbox]:checked + label::before{content:"\2714"; transform:rotate(-360deg); transition:transform .3s ease-in-out;}
.filters input[type=checkbox]:checked + label{background:var(--secondary_color); color:var(--button_text); border:solid 1px var(--primary_color); transition:all .2s;}
.filters input[type=checkbox]:focus + label{border:solid 1px var(--secondary_color);}
.filters label:hover{background:var(--highlight_color); color:var(--primary_color); transition:.5s;}
.filters span{display:flex; font-size:18px; margin-right:5px;}

.filters_open{padding:15px; border-bottom:solid 1px var(--highlight_color); animation:expandCollapse .5s forwards;}
.filters_closed{max-height:0; opacity:0; display:none;}

.expand_button{width:max-content; padding:0; color:var(--button_text) !important; cursor:pointer; align-self:center;}
.expand_button b{padding:3px; margin:0 3px; border:1px solid var(--primary_color); background:var(--primary_color); border-radius:20px; -webkit-touch-callout:none; -webkit-user-select:none; transition:.5s;}
.expand_button b:hover{background-color:var(--secondary_color); border:1px solid var(--secondary_color);}
.expand_button b:active, .expand_button b:focus{background-color:var(--primary_color); border:1px solid var(--primary_color);}

.go_to_buttons{flex:1 1 98%; margin:5px 5px 10px 5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:stretch; font-size:.8em;}
.go_to_buttons a{margin:3px; padding:6px 12px; display:flex; flex-flow:row nowrap; align-items:center; -webkit-touch-callout:none; -webkit-user-select:none; text-decoration:none; background:var(--primary_color);  border:solid 1px var(--primary_color); border-radius:5px; color:var(--button_text); cursor:pointer; transition:.5s;}
.go_to_buttons span{display:flex; font-size:18px; margin-right:5px;}
.go_to_buttons a:hover{background:var(--highlight_color); color:var(--primary_color);}

/* RIGHT ASIDE ========================================*/

/* TODO - FINISH - updated 2 lines Nichole 2/28/24 */
.hub_highlights{grid-area:AS / A4 / CE / C5; overflow:visible; margin:0; padding:10px; display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:stretch; background:linear-gradient(180deg, var(--glass_blur), var(--glass_background));}
/*.highlights_module{flex:1 1 26%; overflow-x:visible; overflow-y:scroll; margin:10px 20px 10px 0; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px; text-align:center; cursor:pointer;}*/
/*.highlights_module::-webkit-scrollbar{display:none;}*/
.highlights_module{flex:1 1 26%; max-height:36%; overflow:visible; margin:10px 20px 10px 0; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px; text-align:center; cursor:pointer;}
/*.highlights_module article{flex:1 1 15%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center;}*/
.highlights_module article{flex:1 1 15%; height:100%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center;}
.highlights_module article div:first-of-type{flex:1 1 15%; height:100%; margin:0; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-content:center;}
.highlights_content{flex:2 1 60%; height:100%; overflow-y:scroll; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:flex-start;}
.highlights_content{flex:2 1 70%; height:100%; overflow-y:scroll; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:flex-start;}
/*.highlights_content{flex:2 1 60%; height:100%; overflow-y:scroll; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:flex-start;}*/
.highlights_content::-webkit-scrollbar{display:none;}
.highlights_content h2{flex:1 1 90%; margin:8% 1% 1% 1%; text-decoration:none;}
.highlights_content p{flex:1 1 90%;}
.highlights_content i{flex:1 1 90%;}
.highlights_link{text-decoration:none;}
a.highlights_module:link, a.highlights_module:visited, a.highlights_module:hover, a.highlights_module:active{text-decoration:none; color:var(--primary_color);}

/* Different in Mobile version - should that be updated? */
.highlights_module b{font-family:'Montserrat', sans-serif; font-weight:900; font-size:1.5em;}
.highlights_module p{margin:5px;}
.highlights_module img{width:80%;}
/*.highlights_module img{width:90%;}*/
.highlights_module:hover{animation:moduleGlow .5s forwards ease-in-out;}
.mobile_highlight{display:none; justify-content:center;}

.side_menu{grid-area:HS / H5/ DE / D5; overflow-x:hidden; margin:0; padding:10px; display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:flex-start; background:rgba(176, 196, 222, .7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
.side_menu::-webkit-scrollbar{display:none;}
.side_menu h2{margin:0; padding:5px 0 0 10px;}
.side_menu ul{list-style-type:none; font-size:.85em; padding:0 0 0 10px;}
.side_menu li{text-decoration:none; font-weight:500; padding:.1em .2em .1em .2em; border-radius:5px; cursor:pointer; transition:.5s;}
.side_menu li:hover{color:var(--button_text); background:linear-gradient(90deg, var(--primary_color) 0%, rgba(30, 144, 255) 50%,  rgba(30, 144, 255, 0) 100%);}
.side_menu ul ul li{font-weight:400;}
.side_menu li a{text-decoration:none; font-size:1em; font-weight:400; color:var(--primary_color);}
.side_menu li a:hover{text-decoration:none; color:var(--button_text);}

/* news, benefits, covid, gallery */
.side_news_recent{grid-area:HS / H5/ DE / D5; overflow-x:hidden; margin:0; padding:0; display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:flex-start;}
.side_news_recent header{width:93%; padding:20px; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; align-content:center; border-bottom:solid 1px var(--highlight_color);}
.side_news_recent header h1{flex:1 1 60%;}
.side_news_recent article{width:98%; margin:0; padding:5px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; border-bottom:solid 1px var(--highlight_color); cursor:pointer; }
.side_news_recent article div:first-of-type{flex:1 1 86%; padding:5px 15px 5px 15px;}
.side_news_recent article div:last-of-type{display:flex; flex:1 1 10%; padding:5px; align-self:center;}
.side_news_recent article h2{margin:5px 15px 5px 0; padding:0;}
.side_news_recent article p{margin:0; padding:0;}
.side_news_recent article p:first-of-type{font-size:.75em;}

/* documents and video links */
.side_links_recent{grid-area:HS / H5/ DE / D5; overflow-x:hidden; margin:0; padding:0; display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:flex-start;}
.side_links_recent header{width:93%; padding:20px; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; align-content:center; border-bottom:solid 1px var(--primary_color);}
.side_links_recent header h1{flex:1 1 60%;}
.side_links_recent article{width:98%; margin:0; padding:5px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; border-bottom:solid 1px var(--primary_color); cursor:pointer;}
.side_links_recent a{flex:1 1 86%; padding:5px 15px 5px 15px; text-decoration:none; color:var(--highlight_color);}
.side_links_recent article div{display:flex; flex:1 1 10%; padding:5px; align-self:center;}
.side_links_recent article h2{margin:5px 15px 5px 0; padding:0;}
.side_links_recent article p{margin:0; padding:0;}
.side_links_recent article p:first-of-type{font-size:.75em;}

.side_news_light{background:rgba(176, 196, 222, .7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);}
.side_news_light article{transition:.5s;}
.side_news_light article:hover{background:var(--highlight_color); transition:.5s;}

.side_links_dark{background:rgba(25, 25, 112, .7); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); color:var(--highlight_color);}
.side_links_dark article{transition:.5s;}
.side_links_dark article:hover{background:var(--primary_color);}

/* a div in the aside panel that holds the articles -> filter results */
.results_group{width:100%;}


/* FOOTER ========================================*/

.hub_footer{overflow:hidden; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; margin:0; padding:0; background:var(--glass_background); border-radius:0 0 0 40px; color:var(--button_text);}
.social_media_icons img{height:32px; padding:8px 20px 8px 20px; transition: 0.2s ease-in-out;}
.social_media_icons:hover img{transform:scale(0.95); filter:blur(2px);}
.social_media_icons img:hover{height:42px; padding:3px 15px 3px 15px; filter:blur(0px); transform:scale(1);}
.footer_full{grid-area:DS / D2 / DE / D5;}
.footer_aside{grid-area:DS / D2 / DE / D4;}

.add_user{display:flex; width:max-content; padding:0; color:var(--button_text) !important; cursor:pointer; align-self:center;}
.add_user b{padding:3px; margin:0 3px; border:1px solid var(--admin_primary); background:var(--admin_primary); border-radius:20px; -webkit-touch-callout:none; -webkit-user-select:none;}
.add_user b:hover{color:var(--primary_color);}

/* OVERLAYS ========================================*/

/*Check if these are not even using the grid because the parent element is display block instead of grid.*/
.overlay_container{grid-area:HS / H1 / DE / D5; height:99.5vh; overflow:hidden; background:rgba(255, 255, 255, .5); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 3px white; border-radius:20px; position:relative;}
.overlay_container::-webkit-scrollbar{display:none;}
/*For mobile, make it overflow:visible overflow-x:hidden*/

.overlay_header{grid-area:HS / H1 / HE / H5; width:99vw; margin:0; padding:0; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:center; align-content:center;}
.overlay_header h1{margin:5px;}
.overlay_header p{margin:5px;}

.overlay_header article{flex:1 1 20%; margin:5px; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-content:center;}
.header_title{flex:1 1 40% !important; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-content:flex-start !important;}
.overlay_close{display:flex; position:absolute; margin:0; padding:0; top:10px; right:10px; cursor:pointer;}

.header_symbol{width:80px; margin:5px;}
.header_banner img{max-width:100%; margin:0;}

.overlay_main{grid-area:AS / A1 / DE / D5; min-height:70vh; margin:0; padding:10px; gap:10px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; overflow:hidden;}
.overlay_main h1{flex:1 1 98%; margin:20px 5px 10px 5px;}

.main_story_module{flex:1 1 60%; height:80vh; margin:0; padding:10px; align-self:stretch; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}
.main_story_module::-webkit-scrollbar{display:none;}
.main_story_footer{height:66vh;}
.main_story_image_half{flex:1 1 40%; height:100%; margin:10px; overflow-x:hidden;}
.main_story_image_half::-webkit-scrollbar{display:none;}
.main_story_image_half img{width:100%; height:auto; border:solid 1px var(--primary_color);}
.main_story_image_half p{text-align:center; margin:5px; padding:0;}

/* edited 4 lines Nichole 11/28/23 */
.main_story_image_full, .main_story_image_long{flex:1 1 90%; height:100%; margin:10px; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
.main_story_image_full::-webkit-scrollbar, .main_story_image_long::-webkit-scrollbar{display:none;}
.main_story_image_full img{width:100%; height:auto;}
.main_story_image_long img{width:50%; height:auto;}

.main_story_copy_half{flex:1 1 50%; height:100%; overflow-x:hidden; overflow-y:scroll; margin:10px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; text-align:left;}
.main_story_copy_half::-webkit-scrollbar{display:none;}
.main_story_copy_half h2{flex:1 1 98%; margin-bottom:10px;}
.main_story_copy_half p{flex:1 1 96%;}
.main_story_copy_half div{flex:1 1 100%; margin-bottom:10px;}
.main_story_copy_full{flex:1 1 90%; margin:10px; height:100%; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; text-align:left;}
.main_story_copy_full div{flex:1 1 100%; margin-bottom:10px;}
.main_story_copy_full::-webkit-scrollbar{display:none;}
.main_story_copy_full h2{flex:1 1 96%;}
.main_story_copy_full p{flex:1 1 96%;}
.main_story_copy_fit{flex:1 1 90%; margin:10px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; text-align:left;}

.overlay_aside{flex:0 1 440px; max-height:80vh; overflow-x:hidden; margin:0; padding:10px; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start; align-self:center; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}
.overlay_aside::-webkit-scrollbar{display:none;}

.aside_footer{max-height:66vh;}
.overlay_aside h1{flex:1 1 98%; margin:20px 5px 10px 5px; text-align:center;}
.overlay_aside h2{flex:1 1 98%; margin:20px 5px 5px 5px; text-align:center;}
.overlay_aside p{flex:1 1 98%; margin:5px; text-align:center;}
.overlay_aside a{flex:1 1 98%; margin:5px 5px 5px 10px; text-align:center;}
.overlay_aside a:link, .overlay_aside a:visited{text-decoration:none;}
.overlay_aside a:active, .overlay_aside a:visited:active{color:var(--secondary_color);}
.overlay_aside a:hover{font-weight:bold; color:var(--secondary_color); transition: ease-in-out .3s;}
.overlay_aside img{width:420px; height:200px; margin:5px 0 5px 0; border-radius:10px;}

.overlay_mini{flex:0 1 460px; max-height:70vh; overflow-x:hidden; align-self:center; padding:10px; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 1px white; border-radius:20px;}
.overlay_mini::-webkit-scrollbar{display:none;}
.overlay_mini h1{flex:1 1 98%; margin:10px 5px 5px 5px; text-align:center;}
.overlay_mini h2{flex:1 1 98%; margin:10px 5px 5px 5px; text-align:center;}
.overlay_mini p{flex:1 1 98%; margin:5px; text-align:center;}
.overlay_mini a{flex:1 1 98%; margin:5px 5px 5px 10px; text-align:center;}
.overlay_mini img{width:440px; height:220px; margin:5px 0 5px 0; border-radius:10px;}

.overlay_popup{box-shadow: 0 0 140px 140px var(--alert);}

.calendar{flex:1 1 100%; height:75vh; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; margin:10px; overflow:hidden;}
.calendar iframe{height:100%;}

.overlay_footer{grid-area:DS / D1 / DE / D5; margin:0; padding:0; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
.overlay_footer p{margin:3px; padding:0;}
.overlay_footer article{flex:1 1 25%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; text-align:center;}

.search_container{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; padding:20px; border:2px solid white; border-radius:20px; background:var(--glass_background);}

.overlay_search_results{width:50%; height:90%; display:flex; flex-flow:row wrap; justify-content:center; align-content:flex-start; align-items:flex-start; overflow-x:hidden; overflow-y:scroll;}
.overlay_search_results::-webkit-scrollbar{display:none;}
.overlay_search_results article{flex:1 1 100%; margin:5px; border:solid 1px white; border-radius:5px; background:var(--glass_blur); cursor:pointer; transition:.1s; color:var(--primary_color);}
.overlay_search_results article:hover{border:solid 1px var(--primary_color); background-color:var(--highlight_color); box-shadow:0 0 5px 1px var(--primary_color);}
.overlay_search_results article div{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; margin:5px;}
.overlay_search_results article p{margin:5px;}
.overlay_search_results article h2{margin:5px;}
.overlay_search_results a{width:30%; margin:5px; padding:5px; color:var(--primary_color); border-radius:10px; text-decoration:none; font-weight:800; font-size:18px;}
.overlay_search_results a:hover{color:var(--secondary_color);}
.search_link{flex:1 1 100%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; margin:5px; padding:5px; border:solid 1px white; border-radius:5px; background:var(--glass_blur); color:var(--primary_color); cursor:pointer; transition:.1s;}
.search_link img{width:30px !important; margin:5px;}
.search_link:hover{border:solid 1px var(--primary_color); background-color:var(--highlight_color); box-shadow:0 0 5px 1px var(--primary_color); color:var(--primary_color) !important;}

/* FIELD TYPE USER (asides) ====================*/

.field_size_wide label{flex:0 1 98%;}
.field_size_wide  input[type=text], .field_size_wide input[type=password]{flex:1 1 40%;}
.field_size_wide label b{flex:1 1 98%;}

.field_type_user label{margin:5px 5px 0 5px; display:flex; flex-flow:row wrap; justify-content:space-between; align-items:stretch; align-content:flex-start;}
.field_type_user label b{margin:3px 0 0 18px; font-size:.6em; text-transform:uppercase; font-weight:500; letter-spacing:1px; color:var(--primary_color);}
.field_type_user input[type=text], .field_type_user input[type=password], .field_type_user input[type=email]{margin:5px; padding:12px; background:var(--glass_blur_bright); border:solid 1px var(--primary_color); color:var(--primary_color); border-radius:5px; text-align:center;}
.field_type_user input[type=text]::placeholder, .field_type_user input[type=password]::placeholder, .field_type_user input[type=email]::placeholder{color:var(--incomplete_grey); opacity:1; text-align:center; outline:none;}
.field_type_user input[type=text]:hover, .field_type_user input[type=password]:hover, .field_type_user input[type=email]:hover{border:solid 1px var(--secondary_color);}
.field_type_user input[type=text]:focus, .field_type_user input[type=password]:focus, .field_type_user input[type=email]:focus{outline:none; box-shadow:0 0 0 1px var(--go_highlight);}
.field_type_user input[type=text]:active, .field_type_user input[type=password]:active, .field_type_user input[type=email]:active{outline:none; box-shadow:0 0 0 1px var(--go_highlight);}

.field_type_user input[type=file]{margin:5px; padding:0; border:none; border-radius:5px;}
.field_type_user input::file-selector-button{margin:5px; padding:10px 20px; background:var(--highlight_color); color:var(--primary_color); border:none; border-radius:5px; cursor:pointer; transition:.5s;}
.field_type_user input::file-selector-button:hover{background:var(--primary_color); color:var(--button_text);}

.field_type_user input[type=submit]{flex:0 1 180px; margin:5px; padding:10px 20px; color:var(--button_text); background:var(--secondary_color); border:none; border-radius:5px; transition:.5s;}
.field_type_user input[type=submit]:hover{background:var(--go_highlight);}

.field_type_user_file{flex:0 1 180px !important;}

.field_type_user fieldset{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; margin:10px 5px; padding:5px; border:solid 1px var(--primary_color); border-radius:10px;}
.field_type_user legend{font-size:.7em; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--primary_color);}
.field_type_user fieldset label{flex:0 1 auto;}

/* ADMIN MODE ========================================*/

.admin_overlay_aside{flex:0 1 400px; max-height:30vw; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; text-align:left;}
.admin_overlay_aside h2{flex:1 1 90%; margin-top:20px; align-self:center; text-align:center !important;}
.admin_overlay_aside h1{flex:1 1 90%; margin-top:20px; align-self:center; text-align:center !important;}
.admin_overlay_aside p{flex:1 1 90%;}
.admin_overlay_aside a{flex:1 1 90%; margin-top:10px;}
.admin_overlay_aside::-webkit-scrollbar{display:none;}

.admin_list{display:flex; flex-flow:column wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; height:max-content;}
.admin_list label{margin:0 5px 5px 20px;}
.admin_checkmark{height:25px; width:25px;}

.admin_indicator{display:block; position:absolute; bottom:10px; right:10px; padding:8px; font-family:'Montserrat', sans-serif; font-weight:900; border-radius:5px;}
.admin_off{background:var(--admin_primary); color:var(--primary_color);}
.admin_off span:before{content:'ADMIN OFF';}
.admin_on{background:var(--admin_secondary); color:var(--button_text);}
.admin_on span:before{content:'ADMIN ON';}

.admin_news_controls_left{position:fixed; top:10px; left:10px; width:33%; margin:5px; padding:0; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start}
.admin_news_controls_left label{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
.admin_news_controls_left p{font-size:.7em; margin:3px; padding:0;}

.admin_news_controls_right{position:fixed; top:10px; right:60px; width:30%; margin:5px; padding:5px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content: center; background:var(--admin_primary_fade); border:solid 1px var(--admin_secondary); border-radius:20px;}
.admin_news_controls_right label{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}

.admin_mode_container{grid-area:HS / H1 / DE / D5; display:flex; flex-flow:row wrap; justify-content:space-around; align-content:space-around; text-align:center; background:rgba(255, 255, 255, .4); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 3px var(--admin_secondary); border-radius:20px;}
.admin_mode_banner{position:absolute; top:0; height:35px; width:100%; padding:0; background:linear-gradient(45deg, rgba(184, 134, 11, .4), rgba(218, 165, 32, .8), rgba(184, 134, 11, .4)); border-radius:20px 20px 0 0;  color:white;}
.admin_mode_banner h1{padding:5px; text-transform: uppercase;}

.admin_mode_flag{display:block; width:160px; position:fixed; bottom:-5px; right:-5px; pointer-events:none;}
.admin_mode_on{display:block; width:160px; position:fixed; bottom:-5px; right:-5px; cursor:pointer; transition:ease-in-out .3s;}
.admin_mode_exit{display:block; width:160px; position:fixed; bottom:-5px; right:-5px;  cursor:pointer; opacity:0; transition:ease-in-out .3s;}
.admin_mode_flag:hover .admin_mode_exit{opacity:1; transition:ease-in-out .3s;}

.admin_mode_off{display:block; width:160px; position:fixed; bottom:-5px; right:-5px;  cursor:pointer; transition:ease-in-out .3s;}
.admin_mode_enter{display:block; width:160px; position:fixed; bottom:-5px; right:-5px;  cursor:pointer; opacity:0; transition:ease-in-out .3s;}
.admin_mode_flag:hover .admin_mode_enter{opacity:1; transition:ease-in-out .3s;}

.admin_edit{display:flex; position:absolute;}
.edit_outside{top:-15px; right:-15px;}
.edit_inside{top:5px; right:5px;}
.admin_edit span{display:flex; position:absolute; top:0; right:0; margin:0; color:var(--button_text); background:var(--admin_primary); border-radius:20px; padding:3px; -webkit-touch-callout:none; -webkit-user-select:none; cursor:pointer; transition:.5s;}
.admin_edit span:hover{color:var(--primary_color);}

.admin_edit_special{position:absolute; top:5px; right:5px; height:30px; width:140px; display:flex; flex-flow:row nowrap; justify-content:flex-end; align-items:center;}
.admin_edit_special p{margin:0; padding:0;}
.admin_edit_special span{margin-left:5px; color:var(--button_text); background:var(--admin_primary); border-radius:20px; padding:3px; -webkit-touch-callout:none; -webkit-user-select:none; cursor:pointer; transition:.5s;}
.admin_edit_special span:hover{color:var(--primary_color);}

.admin_remove{flex:1 1 90%; height:32px; margin:0; padding:0; display:flex; flex-flow:row nowrap; justify-content:flex-end; align-content:center;}
.admin_remove span{margin:0; padding:3px; color:var(--button_text); background:var(--admin_primary); border-radius:20px; cursor:pointer;}

/* updated 1 line - Nichole 2024-06-19 */
.admin_edit_inline{width:max-content; padding:0; color:var(--button_text) !important; cursor:pointer; align-self:center;}
.admin_edit_inline b{padding:3px; margin:0 3px; border:1px solid var(--admin_primary); background:var(--admin_primary); border-radius:20px; -webkit-touch-callout:none; -webkit-user-select:none; font-family:'Material Icons', sans-serif; font-weight:normal; font-size:24px;}
.admin_edit_inline b:hover{color:var(--primary_color);}

.admin_edit_table{display:inline-block; position:absolute; top:-6px; right:0; width:36px; height:36px; margin: 0 3px 0 3px; padding:0; z-index:999; color:var(--button_text) !important; cursor:pointer; align-self:center;}
.admin_edit_table b{padding:3px; margin:0 3px; border:1px solid var(--admin_primary); background:var(--admin_primary); border-radius:20px; -webkit-touch-callout:none; -webkit-user-select:none;}
.admin_edit_table b:hover{color:var(--primary_color);}

.admin_search_button{width:max-content; padding:0; color:var(--button_text) !important; cursor:pointer;}
.admin_search_button span{padding:3px; margin:0 3px; border:1px solid var(--admin_primary); background:var(--admin_primary); border-radius:20px; -webkit-touch-callout:none; -webkit-user-select:none;}
.admin_search_button span:hover{color:var(--primary_color);}

.admin_input input{width:100%; margin:5px; border:solid 2px var(--admin_secondary);}
.admin_input textarea{width:100%; height:300px; margin:5px;}

.admin_new_doc{flex:1 1 30%; margin:5px; padding:10px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; overflow:hidden; height:60px; border:solid 1px var(--admin_secondary); border-radius:20px; background:var(--admin_secondary_fade); color:var(--button_text); cursor:pointer;}
.admin_new_album{display:flex;}
.admin_new_album div{width:240px; height:200px; border-radius:5px; border:solid 1px var(--admin_secondary); background:var(--admin_secondary_fade); color:var(--button_text); display:flex; flex-flow:column wrap; justify-content:center; align-items:center; align-content:center; cursor:pointer;}
.admin_new_album div:hover{animation:moduleGlowLight .5s forwards ease-in-out;}

.admin_new_card{display:flex; flex:0 0 250px; width:250px; height:250px; margin:10px;}
.admin_new_card div:first-of-type{width:210px; height:210px; padding:10px; display:flex; flex-flow:column nowrap; justify-content:center; align-items:center; align-content:center; border:solid 10px var(--admin_secondary); background:var(--admin_secondary_fade); color:var(--button_text); border-radius:20px; cursor:pointer;}
.admin_new_card div:first-of-type:hover{animation:moduleGlowLight .5s forwards ease-in-out;}

.admin_testimonial_card{display:flex; height:140px; background:var(--admin_secondary_fade); border:solid 1px var(--admin_secondary); color:var(--button_text);}
.admin_testimonial_card:hover{background:var(--admin_primary_fade) !important; border:solid 1px var(--admin_secondary) !important;}

.admin_manager{background:var(--admin_secondary) !important; border:solid 1px var(--admin_secondary) !important;}
.admin_manager:hover{background:var(--admin_primary) !important; color:var(--button_text) !important;}

.admin_filters_container{display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start; text-align:center;}
.admin_filters_container h2{flex:1 1 98%; margin-top:10px;}
.admin_filters_container p{flex:1 1 98%; margin:5px;}

.admin_switch{position:relative; display:flex; width:60px; height:34px; margin:10px;}
.admin_switch input{opacity:0; width:0; height:0;}
.round_slider{position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background:var(--incomplete_grey); -webkit-transition:.4s; transition:.4s; border-radius:34px;}
.round_slider:before{position:absolute; content:""; height:26px; width:26px; left:4px; bottom:4px; background:white; -webkit-transition:.4s; transition:.4s; border-radius:50%;}
.admin_switch input:checked + .round_slider{background:var(--admin_primary);}
.admin_switch input:focus + .round_slider{box-shadow:0 0 1px var(--admin_primary);}
.admin_switch input:checked + .round_slider:before{transform:translateX(26px); -ms-transform:translateX(26px);}

/* added 5 lines Nichole 11/20/23 */
.admin_range_switch{display:flex; flex-flow:row wrap;}
.admin_range_switch input[type="range"]{height:34px; width:60px; -webkit-appearance:none; background:transparent; overflow:hidden; border-radius:34px; transition:.4s ease-in-out;}
.admin_range_switch input[type="range"]::-webkit-slider-runnable-track{height:34px; width:60px; -webkit-appearance:none; background:var(--incomplete_grey); -webkit-transition:.4s; transition:.4s; border-radius:34px; box-shadow:inset 0 0 0 3px var(--incomplete_grey);}
.admin_range_switch input[type="range"]::-webkit-slider-thumb{height:34px; width:34px; -webkit-appearance:none; background:white; border-radius:50%; box-shadow:-77px 0 0 60px var(--admin_primary), inset 0 0 0 3px var(--admin_primary);}

.admin_filters{flex:1 1 98%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:stretch; font-size:.8em;}
.admin_filters input[type=checkbox]{position:absolute; opacity:0;}
.admin_filters label{margin:3px; padding:6px; position:relative; display:flex; flex-flow:row nowrap; align-items:center; -webkit-touch-callout:none; -webkit-user-select:none; background:var(--glass_blur); border:solid 1px var(--slate_grey); border-radius:5px; color:var(--slate_grey); cursor:pointer;}
.admin_filters label::before{content:"\271A"; margin-right:6px; transition:transform .3s ease-in-out;}
.admin_filters input[type=checkbox]:checked + label::before{content:"\2714"; transform:rotate(-360deg); transition:transform .3s ease-in-out;}
.admin_filters input[type=checkbox]:checked + label{background:var(--secondary_color); color:var(--button_text); border:solid 1px var(--primary_color); transition:all .2s;}
.admin_filters input[type=checkbox]:focus + label{border:solid 1px var(--secondary_color);}
.admin_filters label:hover{background:var(--highlight_color); color:var(--primary_color);}

/*updated 1 line Nichole 2/23/24 - TODO: change background color to rgb from rgba*/
.admin_table{width:100%; height:100%; overflow-x:hidden; overflow-y:scroll;}
.admin_table table{border-collapse:collapse; width:100%;}
.admin_table thead{position:sticky; top: 0; background:var(--primary_color); color:white; z-index:10000;}
.admin_table tr:nth-child(even){background:var(--admin_primary_fade_light);}
.admin_table h1{flex:1 1 90%; margin-bottom:10px; text-align:center;}
.admin_table th{padding:5px 10px; font-size:.8em; font-weight:700;}
.admin_table th,td{text-align:center; margin-left:auto; margin-right:auto; max-width:300px;}
.admin_table td{padding:0 3px 0 3px; white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;}
.admin_table td p{text-align:center; margin:3px auto 3px auto; padding:0;}
.admin_table td label{text-align:center; margin-left:auto; margin-right:auto; justify-content:center !important; align-items:center !important; align-content:center !important;}

.admin_table h3{text-align:center;}
.admin_table p{text-align:center;}
.admin_table b{text-align:center;}

.column_max_width{max-width:30px; padding:3px;}
.column_text_max_width{max-width:14% !important;}

.activation_controls{display:flex; font-size:.7em; letter-spacing:1px; font-weight:700;}
.activation_controls input[type=checkbox]{opacity:0; width:0; margin:0; padding:0;}
.activation_controls input[type=radio]{opacity:0; width:0; margin:0; padding:0;}
.activation_controls label{width:26px; height:26px; margin:3px 0 3px 0; padding:3px; position:relative; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-self:center; border-radius:50%; -webkit-touch-callout:none; -webkit-user-select:none; background:var(--incomplete_grey); color:var(--button_text); cursor:pointer;}
.activation_controls label::before{content:'OFF'; transition:transform .3s ease-in-out;}
.activation_controls input[type=checkbox]:checked + label::before{content:'ON'; transform:rotate(-360deg); transition:transform .3s ease-in-out;}
.activation_controls input[type=checkbox]:checked + label{background:var(--admin_primary); color:var(--button_text);}
.activation_controls input[type=radio]:checked + label::before{content:'ON'; transform:rotate(-360deg); transition:transform .3s ease-in-out;}
.activation_controls input[type=radio]:checked + label{background:var(--admin_primary); color:var(--button_text);}

/* FIELD TYPE ADMIN ====================*/

.field_width_mini{width:200px;}
.field_width_small{width:300px;}
.field_width_medium{width:440px;}
/* How to solve problem with long select options affecting width: */
.field_width_medium select{max-width:430px !important;}
.field_width_large{width:500px !important;}
.field_width_flex{width:100%;}

.field_margin_right{margin-right:50px !important;}

.field_type_admin{display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
.field_type_admin h1{text-align:center;}
.field_type_admin h2{text-align:center;}
.field_type_admin h3{text-align:center;}
.field_type_admin p{margin:0; text-align:center;}

.field_type_admin fieldset{flex:1 1 98%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; margin:10px 5px; padding:5px; border:solid 1px var(--admin_primary); border-radius:10px;}
.field_type_admin legend{font-size:.7em; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--admin_dark);}
.field_type_admin fieldset label{flex:0 1 auto;}

.field_type_admin input[type=text], .field_type_admin input[type=email]{flex:1 1 100%; margin:3px 5px 5px 5px; padding:8px; background:var(--glass_blur_bright); border-top:solid 1px transparent; border-left:solid 1px transparent; border-right:solid 1px transparent; border-bottom:solid 1px var(--admin_secondary); color:var(--primary_color);}
.field_type_admin input[type=text]:hover, .field_type_admin input[type=email]:hover{border:solid 1px var(--admin_primary);}
.field_type_admin input[type=text]:focus, .field_type_admin input[type=email]:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_admin input[type=text]:active, .field_type_admin input[type=email]:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}

.field_type_admin input[type=date], .field_type_admin input[type=datetime-local]{flex:1 1 100%; margin:5px; padding:10px; background:var(--glass_blur_bright); border-top:solid 1px transparent; border-left:solid 1px transparent; border-right:solid 1px transparent; border-bottom:solid 1px var(--admin_secondary); color:var(--primary_color);}
.field_type_admin input[type=date]:hover, .field_type_admin input[type=datetime-local]:hover{border:solid 1px var(--admin_primary);}
input::-webkit-calendar-picker-indicator{cursor:pointer;}
.field_type_admin input[type=date]:active, .field_type_admin input[type=datetime-local]:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_admin input[type=date]:focus, .field_type_admin input[type=datetime-local]:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}

.field_type_admin label{flex:0 1 100%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; align-content:flex-start; text-align:left;}
.field_type_admin label b{flex:1 1 98%; margin:10px 0 0 10px; font-size:.7em; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--admin_dark);}

.field_type_admin textarea{flex:1 1 100%; height:100px; margin:5px; padding:5px; background:var(--glass_blur); border:solid 1px var(--admin_secondary); color:var(--primary_color); text-align:left;}

.field_type_admin input[type=tel], .field_type_admin input[type=number]{flex:1 1 44%; margin:3px 5px 5px 5px; padding:5px; background:var(--glass_blur_bright); border-top:solid 1px transparent; border-left:solid 1px transparent; border-right:solid 1px transparent; border-bottom:solid 1px var(--admin_secondary); color:var(--primary_color); text-align:center;}
.field_type_admin input[type=tel]:hover, .field_type_admin input[type=number]:hover{border:solid 1px var(--admin_primary);}
.field_type_admin input[type=tel]:focus, .field_type_admin input[type=number]:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_admin input[type=tel]:focus, .field_type_admin input[type=number]:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}

/* Issue with long options making the select box too wide. Had to reduce font from .9 to .8. Is there a way to fix this? */
.field_type_admin select{flex:0 1 100%; margin:5px; padding:8px; font-size:.8em; letter-spacing:1px;  background:var(--glass_blur_bright); border-top:solid 1px transparent; border-left:solid 1px transparent; border-right:solid 1px transparent; border-bottom:solid 1px var(--admin_secondary); color:var(--primary_color); cursor:pointer;}
.field_type_admin select option{padding:5px; font-weight:normal; cursor:pointer;}
.field_type_admin select optgroup option{font-weight:normal; cursor:pointer;}
.field_type_admin select option:hover{background:var(--highlight_color);}
.field_type_admin select:hover{border:solid 1px var(--admin_primary);}
.field_type_admin select:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_admin select:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_admin select[name*='MONTH']{flex:1 1 44%;}

.field_type_admin select[multiple]{font-size:.8em; height:300px;}

.field_type_admin input[type=file]{margin:0 5px 5px 5px;}
.field_type_admin input::file-selector-button{margin:5px; padding:5px 10px; background:var(--admin_primary_fade); color:var(--admin_dark); border:solid 0 transparent; border-radius:5px; text-transform:uppercase; font-size:.8em; letter-spacing:1px; font-weight:900; cursor:pointer;}
.field_type_admin input::file-selector-button:hover{background:var(--admin_secondary); color:var(--button_text);}

.field_type_admin button{flex:1 1 100%;}

.admin_thumbnail{width:100%; display:flex; flex-flow:row nowrap; justify-content:left; align-items:flex-start;}
.admin_thumbnail img{width:200px; height:auto;}

.field_type_text{flex:1 1 100%;}
.field_type_text section:first-of-type{flex:1 1 100%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; align-content:flex-start; text-align:left;}
.field_type_text section:first-of-type b{flex:1 1 98%; margin:10px 0 0 10px; font-size:.7em; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--admin_dark);}
.field_type_text section:last-of-type{min-height:20em; margin:5px; padding:5px; background:var(--glass_blur); border:solid 1px var(--admin_secondary); color:var(--primary_color); text-align:left;}
.field_type_text section:last-of-type:hover{border:solid 1px var(--admin_primary);}
.field_type_text section:last-of-type:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.field_type_text section:last-of-type:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}

.search_table{flex:1 1 500px !important; margin-bottom:5px; display:flex; flex-flow:row wrap; justify-content:center !important; align-items:center !important; align-content:center !important;}
.search_table input{flex:0 1 400px !important;}
.search_table input[type=text]{margin:3px 5px 5px 5px; padding:8px; background:var(--glass_blur_bright); border:solid 1px var(--admin_secondary); color:var(--primary_color); border-radius:30px;}
.search_table input[type=text]:hover{border:solid 1px var(--admin_primary);}
.search_table input[type=text]:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.search_table input[type=text]:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}

.required_fail{border-bottom:solid 1px crimson; color:rgba(255, 0, 0, .2);}

/* SPECIAL BUTTONS ====================*/

.delete_container{grid-area:HS / H1 / DE / D5; overflow:hidden; background:var(--stained_glass); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 3px var(--alert); border-radius:20px; height:100%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; transition:ease-in-out .5s;}
.delete_container article{width:400px; height:340px; margin:0; padding:30px; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:stretch; background:var(--glass_blur_bright); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border:solid 2px var(--button_text); border-radius:20px; transition:ease-in-out .5s;}
.delete_container article div{flex:1 1 90%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:stretch;}
.delete_container article img{width:100px; height:100px;}
.delete_container article h2{margin:3px; font-size:1.4em;}
.delete_container article p{margin:3px; padding:0;}
.delete_container button{flex:1 1 40%; margin:5px;}

.cancel_button{padding:19px; font-weight:normal; text-transform:uppercase; text-align:center; font-size:.8em; letter-spacing:2px; background:var(--glass_background); color:var(--slate_grey); border:solid 1px var(--slate_grey); border-radius:5px; cursor:pointer; transition:.5s;}
.cancel_button:hover{background:white;}

.delete_button{padding:20px; text-transform:uppercase; font-size:.8em; letter-spacing:2px; color:var(--button_text); background:var(--alert) !important; border:solid 1px var(--alert) !important; border-radius:5px; cursor:pointer; transition:.5s;}
.delete_button:hover{background:var(--alert_secondary) !important; color:var(--button_text) !important; font-weight:normal !important;}

.save_button{padding:20px; font-weight:normal; text-transform:uppercase; text-align:center; font-size:.8em; letter-spacing:2px; background:var(--primary_color); color:var(--button_text); border-radius:5px; border:none; outline:none; cursor:pointer; transition:ease-in-out all .5s;}
.save_button:hover{background:var(--secondary_color);}

.before_save::after{content:"save"; animation:ease-in-out rotateText .5s; transition:.3s;}
.after_save{background-color:var(--go_highlight);}
.after_save::after{content:"saved \2714"; animation:ease-in-out rotateText .5s; transition:.3s;}
.fail_save{background-color:var(--alert);}
.fail_save::after{content:"Could Not Save \26A0"; animation:ease-in-out rotateText .5s; transition:.3s;}

/* NEW 5 lines added Nichole 8/7/23 */
.before_generate::after{content:"generate"; animation:ease-in-out rotateText .5s; transition:.3s;}
.after_generate{background-color:var(--go_highlight);}
.after_generate::after{content:"results acquired \2714"; animation:ease-in-out rotateText .5s; transition:.3s;}
.fail_generate{background-color:var(--alert);}
.fail_generate::after{content:"error \26A0"; animation:ease-in-out rotateText .5s; transition:.3s;}

.button_half{flex:1 1 38%; margin:10px 5px;}
.button_stretch{flex:1 1 98%;}
.button_regular{width:300px; margin:5px;}

.download_button{flex:0 1 180px !important; margin:5px !important; padding:12px 20px !important; text-decoration:none; font-weight:400; text-align:center; border:none; border-radius:5px; color:var(--primary_color); background:var(--highlight_color); transition:.3s; cursor:pointer;}
.download_button:link, .download_button:visited{text-decoration:none; color:var(--primary_color) !important; }
.download_button:hover, .download_button:active{text-decoration:none; color:var(--button_text) !important; background:var(--primary_color);}

/* Pick Random Winner Group - PROMOTIONS */
.random_winner{margin:30px; display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;}
.random_winner fieldset{min-width:840px; margin:10px; padding:10px; display:flex; flex-flow:row wrap; justify-content:space-evenly; align-content:center; align-items:center; border:solid 1px var(--admin_primary); border-radius:10px;}
.random_winner legend{font-size:.7em; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--admin_dark);}
.random_winner div{width:280px; color:var(--primary_color); font-size:1.2em;}
.random_winner textarea{width:260px; height:40px; margin:5px; padding:5px; background:var(--glass_blur); border:solid 1px var(--admin_secondary); color:var(--primary_color); text-align:left;}
.random_winner label{width:min-content; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:stretch; align-content:flex-start; text-align:left;}
.random_winner label b{flex:0 1 80px; font-size:10px; text-transform:uppercase; font-weight:500; letter-spacing:2px; color:var(--admin_dark);}
.random_winner select{flex:0 1 60px; margin:5px; padding:8px; font-size:.8em; letter-spacing:1px;  background:var(--glass_blur_bright); border-top:solid 1px transparent; border-left:solid 1px transparent; border-right:solid 1px transparent; border-bottom:solid 1px var(--admin_secondary); color:var(--primary_color); cursor:pointer;}
.random_winner select:hover{border:solid 1px var(--admin_primary);}
.random_winner select:focus{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.random_winner select:active{outline:none; box-shadow:0 0 0 1px var(--admin_primary);}
.random_winner select option{padding:5px; font-weight:normal; cursor:pointer;}

.random_winner_button{flex:0 1 160px; margin:5px; padding:12px 20px !important; text-decoration:none; font-size:14px; font-weight:400; text-align:center; border:none; border-radius:5px; color:var(--button_text); background:var(--secondary_color); transition:.3s; cursor:pointer;}
.random_winner_button:link, .random_winner_button:visited{text-decoration:none; color:var(--button_text) !important;}
.random_winner_button:hover, .random_winner_button:active{text-decoration:none; background:var(--go_highlight); color:var(--button_text) !important;}

/* Submit Button on PROMOTION and Jobs Page */
.action_button{flex:0 1 210px !important; margin:5px !important; padding:12px 20px !important; text-decoration:none; font-weight:400; text-align:center; border:none; border-radius:5px; color:var(--button_text); background:var(--secondary_color); transition:.3s; cursor:pointer;}
.action_button:link, .action_button:visited{text-decoration:none; color:var(--button_text) !important;}
.action_button:hover, .action_button:active{text-decoration:none; background:var(--go_highlight); color:var(--button_text) !important;}
/* Note the order of states for links (above) */

.before_submit::after{content:"Submit"; animation:ease-in-out rotateText .5s; transition:.3s;}
.after_submit{background-color:teal;}
.after_submit::after{content:"Success! \2714"; animation:ease-in-out rotateText .5s; transition:.3s;}

.before_approve::after{content:"Approve"; animation:ease-in-out rotateText .5s; transition:.3s;}
.after_approve{background-color:teal;}
.after_approve::after{content:"Approved! \2714"; animation:ease-in-out rotateText .5s; transition:.3s;}

/* UNIVERSAL ========================================*/

.no_show{display:none;}
/* updated Nichole 11/13/23 */
.wordwrap {
    white-space: pre-wrap;      /* CSS3 */
    white-space: -moz-pre-wrap; /* Firefox */
    white-space: -o-pre-wrap;   /* Opera 7 */
    word-wrap: break-word;      /* IE */
}

/* KEVIN ADD STYLES HERE ========================================*/

/* Style the button that is used to open and close the collapsible content */
.collapsibleStats {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    max-height: 20px;
    padding: 2px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.collapsibleStats:hover {
    background-color: #ccc;
}

/* Style the collapsible content. Note: hidden by default */
.contentStats {
    padding: 0 18px;
    display: none;
    overflow: hidden;
    background-color: #f1f1f1;
}

/* ANIMATIONS ========================================*/

.overlay_fade_in{animation:ease-in-out fadeIn .5s}
.overlay_fade_out{animation:ease-in-out fadeOut .5s}

.hover_glow:hover{animation:moduleGlow .5s forwards ease-in-out;}

@keyframes loadEffect{
    0%{transform:scale(.5);}
    100%{transform:scale(1);}
}

@keyframes fadeIn{
    from{opacity:0; display:none;}
    to{opacity:1; display:flex;}
}

@keyframes fadeOut{
    from{opacity:1; display:flex;}
    to{opacity:0; display:none;}
}

@keyframes opacityFadeIn{
    from{opacity:0;}
    to{opacity:1;}
}

@keyframes opacityFadeOut{
    from{opacity:1;}
    to{opacity:0;}
}

@keyframes fadeInBlur {
    from{filter:opacity(0) blur(30px);}
    to{filter:opacity(1) blur(8px);}
}

@keyframes flareLink{
    from{color:var(--primary_color);}
    to{color:var(--button_text); text-shadow:0 0 4px var(--primary_color);}
}

@keyframes alertPulse {
    0%{box-shadow:0 0 0 0 rgba(194, 0, 82, 0.8);}
    100%{box-shadow:0 0 0 20px rgba(194, 0, 82, 0);}
}

@keyframes fadeList {
    from{display:none; opacity:0;}
    to{display:block; opacity:1;}
}

@keyframes jiggle {
    0%{transform:translate(0, 0) rotate(0deg);}
    25%{transform:translate(5px, 5px) rotate(5deg);}
    50%{transform:translate(0, 0) rotate(0deg);}
    75%{transform:translate(-5px, 5px) rotate(-5deg);}
    100%{transform:translate(0, 0) rotate(0deg);}
}

@keyframes colorChange {
    from{color:white;}
    to{color:orangered;}
}

@keyframes flareUp{
    from{color:var(--primary_color);}
    to{color:var(--highlight_color); text-shadow:0 0 4px var(--primary_color);}
}

@keyframes moduleGlow{
    from{box-shadow:none;}
    to{box-shadow:0 0 10px 5px var(--primary_color);}
}

@keyframes moduleGlowLight{
    from{box-shadow:none;}
    to{box-shadow:0 0 8px 4px var(--secondary_color);}
}

@keyframes growGlow{
    0%{text-shadow:none; font-size:1.5em;}
    50%{text-shadow:0 0 15px magenta; color:darkmagenta; font-size:2.5em;}
    100%{text-shadow:none; font-size:1.5em;}
}

@keyframes rotateText{
   from{transform:rotate(0deg); opacity:0;}
    to{transform:rotate(360deg); opacity:1;}
}

@keyframes expandCollapse{
    from{opacity:0;}
    to{opacity:1;}
}

@keyframes growReveal {
    0%{width:0; top:50px; right:50px;}
    80%{width:100px; top:-20px; right:-20px;}
    100%{width:75px; top:-5px; right:-5px;}
}

/* EXTRA LARGE RESOLUTION MONITORS ========================================*/

@media only screen and (min-width:1940px) and (max-width:7680px) {

    body{font-size:18px;}

    h1{font-size:1.8em;}
    h2{font-size:1.2em;}
    p{font-size:1.1em;}
    i{font-size:0.8em;}
    a{font-size:1.1em;}

    .login_container p{font-size:16px;}

    .highlights_module{padding:10px;}

    .glass_container a, .glass_container article{font-size:17px;}

    .side_menu ul{font-size:0.9em; padding:0 0 0 10px;}
    .side_menu li{padding:.2em;}

    .contact_table{font-size:0.9em;}
    .task_instructions a{font-size:0.9em;}

    .gallery{font-size:0.9em;}

    .testimonial_card_group{font-size:0.8em;}

}

/* TABLET ========================================*/

@media only screen and (min-width:768px) and (max-width:1280px) {

    body{display:grid; width:1fr; height:100vh; overflow:hidden; padding:0; margin:0;

        grid-template:
        [HS] "H1 H2 H3 H4 H5" min-content [HE]
        [AS] "A1 A2 A3 A4 A5" 1fr [AE]
        [BS] "B1 B2 B3 B4 B5" 1fr [BE]
        [CS] "C1 C2 C3 C4 C5" 1fr [CE]
        [DS] "D1 D2 D3 D4 D5" 50px [DE]
      / min-content 500px 1fr 1fr 200px;

    }

    h1{font-size:1.2em;}
    h2{font-size:1.1em;}
    p{font-size:1em;}
    i{font-size:.9em;}
    a{font-size:1em;}

    .menu p{height:40px; display:flex; justify-content:flex-start; align-items:center; flex-flow:row nowrap; margin:0; padding:12px 10px 12px 22px; font-size:1.2em; border-radius:0 10px 10px 0; cursor:pointer; transition:.5s;}
    .menu p b{flex:1 1 auto; overflow:hidden; white-space: break-spaces; margin-left:10px; font-size:.9em;}

    .notification_numbers{top:12px; left:12px; padding:1px 6px; font-size:.6em; border-radius:50%;}

    .hub_header{flex-flow:row nowrap; justify-content:space-between; align-items:center; align-content:center; margin:0; padding:10px 5px 5px 5px; border-radius:30px 0 0 0;}
    .header_greeting{flex:1 1 100%; margin:0 5px 0 10px;}
    .header_greeting section:first-of-type{flex:1 1 98%;}
    .hub_search input[type=text]{flex:1 1 80%; width:140px; border:none; background:none; color:var(--primary_color);}
    .logo img{width:100px;}
    .header_alert b{display:none;}

    .header_greeting a:link, .header_greeting a:focus, .header_greeting a:visited{color:var(--primary_color);}
    .header_greeting a:active, .header_greeting a:visited:active{color:var(--secondary_color);}

    .hub_footer{border-radius:0 0 0 30px;}

    .hub_main_module{margin:5px;}
    .hub_main_bottom{overflow-x:hidden; overflow-y:scroll; margin:0; padding:5px; background:linear-gradient(180deg, var(--glass_blur), var(--glass_background)); border-radius:0;}
    .main_rows_stretch{gap:0;}

    .hub_newsfeed{width:calc(100% - 10px);}
    .hub_newsfeed iframe{width:420px; margin:auto;}

    .hub_highlights{gap:10px; margin:0; padding:10px; display:flex; flex-flow:column nowrap; justify-content:space-between; align-items:stretch; font-size:13px;}
    .highlights_module{flex:0 1 31%; max-height: none; margin:5px 10px 5px 0; padding:0; align-content:flex-start; border-radius:20px; overflow-x:hidden; overflow-y:scroll;}
    .highlights_module::-webkit-scrollbar{display:none;}

    .highlights_module article{height:95%; overflow:hidden;}
    .highlights_module article div:first-of-type{flex:1 1 96%; height:20%; margin:10px; padding:0; display:flex; flex-flow:row nowrap; justify-content:center; align-items:center; align-content:center;}
    .highlights_content{flex:1 1 96%; height:60%; padding:5px; display:flex; flex-flow:column nowrap; justify-content: center; align-items:center; align-content:space-around;}
    .highlights_content h2{flex:none;}
    .highlights_module b{font-size:1.5em;}
    .highlights_module img{height:70px; margin:5px; padding:5px;}
    /*.highlights_content_extra_margin{margin-top:30px !important;}*/

    /* mod to 1 line - Nichole 6-4-2024 */
    .featured_item{height:min-content;}
    .featured_item img{height:100px;}
    .featured_extra_module{flex:0 1 38%; max-height: none; margin:5px 10px 5px 0; padding:0; align-content:flex-start; border-radius:20px; overflow-x:hidden; overflow-y:scroll;}
    .featured_extra_module article{height:auto;}
    .featured_extra_module::-webkit-scrollbar{display:none;}
    .featured_extra_module b{font-size:1.5em;}
    .featured_extra_module img{height:70px; margin:5px; padding:5px;}
    .featured_extra_document{min-width:40%; height:60px !important;}

    /* added 6 lines - Nichole 6-4-2024 */
    .clear_container{margin:3px; padding:3px; flex:1 1 90%; height:80%; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
    .clear_container img{height:30px; margin:3px;}
    .clear_container article{overflow:hidden; flex:1 1 30%; height:60px; margin:3px; padding:3px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px; text-decoration:none; cursor:pointer;}
    .clear_container a div:last-of-type, .clear_container article div:last-of-type{flex:1 1 60%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:space-around;}
    .clear_container h2{font-size:14px;}
    .clear_container p{margin:0 3px; padding:0; font-size:12px;}

    .news_highlight_a{flex:1 1 40%; height:32%;}
    .news_highlight_b{flex:1 1 40%; height:32%;}
    .news_highlight_c{flex:1 1 40%; height:32%;}

    .filters{font-size:.6em;}
    .filters label{margin:2px; padding:3px 4px;}

    .expand_button{padding-right:10px;}
    .expand_button b:active, .expand_button b:focus, .expand_button b:hover{background-color:var(--primary_color); border:1px solid var(--primary_color);}
    .side_news_recent article div:last-of-type{display:none;}

    .go_to_buttons{margin:2px 2px 6px 2px; justify-content:center; font-size:.7em;}
    .go_to_buttons a{margin:2px; padding:3px 6px; border-radius:5px;}
    .go_to_buttons span{font-size:18px; margin-right:3px;}

    .glass_container{flex:1 1 90%; margin:5px 0 5px 0; padding:3px; border-radius:15px; font-size:.7em;}
    .glass_container img{width:22px; padding:3px;}
    .glass_container_full{height:98%;}
    /*.glass_container_aside{height:74%;}*/
    .glass_container_aside{height:90%;}
    .glass_container p{font-size:12px;}
    /* added 1 line Nichole 3/31/2024, mod 1 line Nichole 6/4/2024 */

    .glass_container a, .glass_container article{flex:0 1 29%; height:80px; margin:3px; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; font-size:12px !important; border-radius:15px;}
    .glass_container a div:first-of-type, .glass_container article div:first-of-type{flex:0 1 30px; height:90%;}
    .glass_container a div:last-of-type, .glass_container article div:last-of-type{flex:1 1 70%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center;}

    .personnel_cards article{flex:0 0 200px; width:200px; height:200px; text-align:center; transition:transform .8s; transform-style:preserve-3d; margin:10px; box-shadow:8px 8px 10px 0 rgba(0,0,0,0.2); border-radius:20px;}
    .cards_contact{width:185px; margin:10px 10px 10px 20px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}

    .benefits_form{gap:0;}
    .benefits_module{flex:1 1 90%; overflow:hidden; margin:5px; padding:0; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px;}
    .module_information{flex:1 1 98%; height:100%; display:flex; flex-flow:row nowrap; justify-content:space-around; align-items:center; align-content:center;}
    .module_admin_edit{display:none;}
    .task_number img{width:60px;}

    .stained_glass_module{flex:1 1 90%; height:30%; margin:5px; padding:5px 10px 5px 10px; overflow-x:hidden; overflow-y:scroll; background:var(--stained_glass); color:var(--button_text); backdrop-filter: blur(8px); border:solid 2px var(--stained_glass); border-radius:20px 20px 5px 5px;}
    .stained_glass_module_b{margin-left:5px; margin-right:5px;}

    .contact_table{display:none;}
    .contact_list{display:flex; flex-flow:column nowrap; justify-content:flex-start; align-items:center; align-content:center; text-align:center;}
    .contact_list h1{margin:5px; padding:0;}
    .contact_list h2{margin-top:10px;}
    .contact_list p{margin:0; padding:0;}
    .contact_list p{margin:0; padding:0;}
    .contact_list a{color:var(--link_color); text-decoration:none;}

    .gallery_thumbnails{padding-bottom:5px;}
    .gallery_thumbnails img{width:218px; height:180px;}
    .gallery p{margin:0; padding:3px;}
    .testimonial_card_container{width:300px; padding:5px;}
    .testimonial_card_group{width:200px;}
    .testimonial_card_group article{height:min-content; margin:15px 10px; padding:5px; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; text-align:center; border-radius:20px;}
    .testimonial_card_group img{margin:3px;}
    .testimonial_profile_pic{margin:3px;}
    .testimonial_clipped img{opacity:0;}

    .social_media_icons img{height:32px; padding:8px 10px 8px 10px;}

    /* edited 6 lines Nichole 11/28/23 */
    .main_story_module{height:auto; max-height:64vh; overflow-x:hidden; overflow-y:scroll;}

    .main_story_image_full, .main_story_image_long{overflow:visible;}
    .main_story_image_full img, .main_story_image_long img{width:100%;}

    .overlay_container{overflow-y:visible; overflow-x:hidden;}
    .overlay_container::-webkit-scrollbar{display:none;}
    .aside_footer{max-height:18vh;}


    .admin_indicator{display:none;}
    .admin_mode_flag{display:none;}
    .admin_edit{display:none;}
    .admin_edit_inline{display:none !important;}
    .admin_edit_delete{display:none;}
    .admin_edit_special{display:none;}
    .admin_new_card{display:none;}
    .admin_new_doc{display:none !important;}
    .admin_new_album{display:none;}
    .admin_testimonial_card{display:none;}
    .add_user{display:none;}

}

/* MOBILE ========================================*/

@media only screen and (min-width:100px) and (max-width:767px) {
    /* 641px for tablets? Or 768? Enlarge text for bigger screens as well? */

    :root{
        --menu_max_width:360px;
        --menu_min_width:1px;
    }

    body{display:grid; width:1fr; height:100vh; overflow-x:hidden; overflow-y:scroll; padding:0; margin:0;

        grid-template:
        [HS] "H1 H2 H3 H4" min-content [HE]
        [AS] "A1 A2 A3 A4" 140px [AE]
        [BS] "B1 B2 B3 B4" 1fr [BE]
        [CS] "C1 C2 C3 C4" 140px [CE]
        [DS] "D1 D2 D3 D4" 80px [DE]
      / min-content 1fr 1fr 1fr;

    }

    body::-webkit-scrollbar{display:none;}

    h1{font-size:1em;}
    h2{font-size:.9em;}
    p{font-size:12px;}
    i{font-size:.7em;}
    a{font-size:.8em;}

    .scroll::-webkit-scrollbar{width:20px;}
    .scroll::-webkit-scrollbar-track{background-color:transparent;}
    .scroll::-webkit-scrollbar-thumb{background:var(--primary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}
    .scroll::-webkit-scrollbar-thumb:hover{background:var(--secondary_color); border:6px solid transparent; border-radius:20px; background-clip:content-box;}

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

    /* MOBILE LOGIN ========================================*/

    .login_start{width:80%; height:max-content;}

    .login_container h1{flex:0 1 340px; margin-top:10px; font-size:2em;}
    .login_container p{flex:0 1 340px; margin:10px; font-size: 1em;}
    .login_container label{flex:0 1 340px;}
    .login_container label input{flex:0 1 340px;}
    .login_container label b{flex:0 1 340px;}
    .login_container a{font-size:.8em; padding:10px;}
    .login_container div{flex:0 1 340px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
    .login_container i{font-size: 1em;}

    .login_button{flex:0 0 268px; margin:20px 5px 10px 5px; padding:12px 20px; font-weight:500;}

    .login_end{grid-area:HS / H2 / DE / D4; border-radius:0; border:none;}

    /* MOBILE MAIN MENU ========================================*/

    .hub_menu{grid-area:HS / H1 / DE / D1; overflow:hidden; display:flex; flex-flow:row wrap; justify-content:flex-start; align-content:flex-start; margin:0; padding:0;}
    .hub_menu div{width:0; margin:0; padding:60px 0 0 0;}
    .menu p{display:flex; justify-content:center; align-items:center; flex-flow:row wrap; text-align:center; margin:0; padding:12px 10px 12px 22px; font-size:1.1em; cursor:pointer;}
    .menu p:hover{font-weight:700; background:var(--highlight_color); color:var(--primary_color); border-radius:0 10px 10px 0;}
    .menu p b{flex:1 1 auto; overflow:hidden; white-space:nowrap; margin-left:10px;}

    .hamburger:after{display:block; position:absolute; top:0; left:10px; content:'\2630'; font-size:30px; margin:5px; padding:5px; color:var(--button_text); cursor:pointer; }

    .notification_numbers{top:5px; left:12px; padding:1px 5px; font-size:.6em; border-radius:50%;}

    /* MOBILE HEADER ========================================*/

    .hub_header{flex-flow:row wrap; justify-content:space-around; align-items:flex-start; align-content:space-between; padding:10px; background:var(--primary_color); border-radius:0; color:white; white-space:nowrap;}
    .header_full{grid-area:HS / H2 / HE / H4;}
    .header_aside{grid-area:HS / H2 / HE / H4;}

    .header_greeting{flex:1 1 80%; padding:0; margin:0; text-align:center; display:flex; flex-flow:row wrap; justify-content: center; align-items:baseline; align-content:center; white-space:normal;}
    .header_greeting section:first-of-type{flex:1 1 90%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
    .header_greeting section:last-of-type{display:none;}
    .header_greeting h1{margin:5px;}
    .header_greeting p{display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; margin:0; padding:0;}

    .header_alert{flex:1 1 80%; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center;}
    .header_alert p{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; margin:0; padding:10px;}

    .hub_search{display:none;}
    .hub_search_mobile{display:flex; flex:1 1 50%; margin:5px 5px 5px 50px;}
    .hub_search_mobile label{display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; padding-left:10px; border:solid 1px white; border-radius:20px;}
    .hub_search_mobile input[type=text]{flex:1 1 80%; width:150px; border:none; background:none; color:white;}
    .hub_search_mobile input[type=text]:focus{outline:none;}
    .hub_search_mobile input::placeholder{color:white;}
    .hub_search_mobile span{cursor:pointer; padding:3px;}
    .hub_search_mobile img{flex:1 1 20px; cursor:pointer; width:20px;}

    .search_dropdown{position:absolute; top:48px; left:72px; z-index:99999; width:160px; margin:0; padding:5px; background:var(--stained_glass_dark); color:var(--button_text);}
    .search_dropdown dd{margin:0; padding:5px; font-size:13px; font-weight:400; color:var(--button_text);}

    .logo{display:none;}
    .logo_mobile img{width:70px; padding:5px;}
    .logo_mobile{display:flex; margin-top:5px;}

    /* MOBILE NOTIFICATIONS ========================================*/

    .alert{margin:0 20px 0 10px; border-radius:50%; cursor:pointer; width:24px; height:24px; font-size:24px;}

    .promotion{display:flex; flex:1 1 10%; padding:3px 5px 8px 3px; font-size:48px;}

    /* MOBILE MAIN BODY ========================================*/

    .hub_main{overflow:hidden; margin:0; padding:0 5px 5px 5px; background:var(--glass_background);}

    .hub_main_bottom{overflow-x:hidden; overflow-y:scroll; margin:0; padding:5px; background:var(--glass_background); border-radius:0;}
    .hub_main_scroll{overflow-x:hidden; margin:0; padding:5px; border-top:solid 1px var(--primary_color); border-bottom:solid 1px var(--primary_color);}
    .hub_main_special{overflow:hidden; margin:0; padding:0; border-top:solid 1px var(--primary_color); border-bottom:solid 1px var(--primary_color);}

    .main_home{grid-area:BS / B2 / CE / C4;}
    .main_full{grid-area:AS / A2 / DE / D5;}
    .main_full_aside{grid-area:AS / A2 / BE / B4;}
    .main_aside{grid-area:AS / A2 / BE / B4;}
    .main_mid{grid-area:AS / A2 / CE / C5;}

    /* MOBILE MAIN MODULES ========================================*/

    .hub_main_module{flex:1 1 99%; overflow:hidden; margin:0 5px 0 5px; padding:0;}
    .hub_newsfeed iframe{width:308px !important;}

    .news_module{margin:3px;}
    .news_module div{bottom:5px; left:5px; margin:5px;}
    .news_module h1{font-size:.8em;}
    .news_module h1 input{font-size:.8em;}
    .news_module p{display:none;}
    .news_highlight_a{flex:1 1 30%; height:48%;}
    .news_highlight_b{flex:1 1 30%; height:48%;}
    .news_highlight_c{flex:1 1 30%; height:48%;}

    /* Headlines */
    .personnel_cards h1{flex:1 1 98%; margin:5px; padding:10px; background:var(--glass_background); border-radius:10px;}
    .personnel_cards h3{flex:1 1 98%; margin:5px 10px; padding:10px; background:rgba(255, 255, 255, .1); border-radius:10px; font-family:'Montserrat', sans-serif; font-weight:900;}

    .personnel_cards h2{padding:10px;}
    .personnel_cards article{flex:0 0 140px; width:140px; height:140px; text-align:center; transition:transform .8s; transform-style:preserve-3d; margin:10px; box-shadow:8px 8px 10px 0 rgba(0,0,0,0.2); border-radius:20px;}
    .personnel_cards article div{position:absolute; width:100%; height:100%; backface-visibility:hidden; border-radius:20px;}
    .personnel_cards article div p{width:95%; margin:3px; padding:10px; text-align:left;}
    .profile_image{width:calc(100% - 20px); margin:8px; border-radius:12px;}
    .personnel_cards article div:first-of-type{background-color:ghostwhite; box-shadow:inset -2px -2px 6px 2px lightgrey;}

    /* BEHIND CARD - turned off */
    .personnel_cards article div:last-of-type{display:none;}
    .text_on_image{display:none;}

    /* BEHIND CARD - FLIP ANIMATION - back of card */
    /*.personnel_cards article:hover{transform:rotateY(180deg);}*/
    /*.personnel_cards article div:last-of-type{background-color:var(--secondary_color); color:white; transform:rotateY(180deg);}*/

    .cards_contact{width:130px; margin:10px 10px 10px 20px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
    .cards_contact p{flex:1 1 90%; margin:0; padding:2px; font-size:.7em;}
    .cards_contact i{flex:1 1 90%; margin:0; padding:2px;}
    .cards_contact h2{flex:1 1 90%; padding:5px 2px 2px 2px;}
    .cards_contact a{flex:1 1 90%; padding:2px; font-weight:700; color:var(--primary_color); text-decoration:none; transition:.5s; font-size:.7em; word-break:break-all;}
    .cards_contact b{flex:1 1 90%; margin:0; padding:2px; font-size:.7em;}

    .milestone_symbol{position:absolute; top:-5px; right:-5px; z-index:2000; animation:growReveal ease-in-out 1.2s; width:50px;}
    .status_border_default{border:2px solid var(--highlight_color);}

    @keyframes growReveal {
        0%{width:0; top:10px; right:10px;}
        80%{width:80px; top:-8px; right:-8px;}
        100%{width:50px; top:-5px; right:-5px;}
    }

    .back_to_top{width:50px; height:50px; bottom:60px; right:5px;}
    .back_to_top span{font-size:36px;}
    .back_to_top:hover{animation:flareUp .2s forwards ease-in-out;}

    /* NEW MARKETING PAGE - added 5 lines Nichole 8/16/23 */
    .featured_item{height:98%; margin:5px; overflow:hidden; display:flex; flex-flow:row wrap; justify-content: center; align-items:flex-start; align-content:flex-start;}
    .featured_item img{height:180px; width:auto; margin:3px;}
    .featured_item h1{flex:1 1 98%; margin:3px;}
    .featured_item h2{flex:1 1 98%; margin:3px; font-size:14px;}
    .featured_item p{flex:1 1 98%; margin:3px; font-size:12px;}
    .featured_item a{height:auto;}
    .featured_item div{height:37%;}
    .featured_item img{height:60px;}
    .featured_extra_module{flex:0 1 31%; max-height:32%; margin:5px 10px; padding:0; align-content:flex-start; border-radius:20px; overflow-x:hidden; overflow-y:scroll;}
    .featured_extra_module article{height:auto;}
    .featured_extra_module::-webkit-scrollbar{display:none;}
    .featured_extra_module b{font-size:1.5em;}
    /*.featured_extra_module h2{display:none;}*/
    .featured_extra_module img{height:70px; margin:5px; padding:5px;}
    .featured_extra_document{min-width:40%; height:60px !important;}

    /* added Nichole 10/11/23 */
    .clear_container{margin:3px; padding:3px; flex:1 1 90%; height:80%; overflow-x:hidden; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
    .clear_container img{display:none;}
    .clear_container article{overflow:hidden; flex:1 1 30%; height:60px; margin:3px; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px; text-decoration:none; cursor:pointer;}
    .clear_container a:hover, .clear_container article:hover{animation:moduleGlowLight .5s forwards ease-in-out;}
    .clear_container a div:first-of-type, .clear_container article div:first-of-type{display:none;}
    .clear_container a div:last-of-type, .clear_container article div:last-of-type{flex:1 1 70%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:space-around;}
    .clear_container h2{font-size:14px;}
    .clear_container p{margin:0 5px; padding:0; font-size:12px;}
    .clear_container span{margin:5px;}

    /* DOCUMENTS */
    .glass_container{flex:1 1 90%; margin:5px 0 5px 0; padding:3px; border-radius:15px; font-size:.7em;}
    .glass_container img{width:22px; padding:3px;}
    .glass_container_full{height:98%;}
    .glass_container_aside{height:65%;}

    .glass_container a, .glass_container article{flex:0 1 44%; height:45px; margin:3px; padding:5px; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center; font-size:11px !important; border-radius:15px;}
    .glass_container a div:first-of-type, .glass_container article div:first-of-type{flex:0 1 30px; height:90%;}
    .glass_container a div:last-of-type, .glass_container article div:last-of-type{flex:1 1 70%; height:80%; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:center; align-content:center;}
    .glass_container span{margin:0;}

    .priority i{margin:0 3px 0 0; padding:2px 4px 2px 4px; font-size:.7em; color:white; background:var(--alert); border-radius:50%; text-transform:uppercase;}

    .gallery article{flex:1 1 15%; margin:5px;}
    .gallery_thumbnails{padding-bottom:5px;}
    .gallery_thumbnails img{width:150px; height:100px;}
    .gallery p{margin:0; padding:3px;}

    .testimonial_card_container{width:150px; padding:5px;}
    .testimonial_card_group{width:120px;}
    .testimonial_card_group article{height:min-content; margin:10px 10px; padding:5px; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; text-align:center; border:solid 1px white; border-radius:20px;}
    .testimonial_card_group img{margin:3px;}
    .testimonial_profile_pic{margin:3px;}

    .testimonial_card_blank{display:none;}
    .testimonial_card{border:solid 1px white;}
    .card_selected{box-shadow:3px 3px 10px var(--primary_color);}

    .testimonial_content{width:280px; height:90%; margin:5px; padding:0; display:flex; flex-flow:column nowrap; justify-content:center; align-items:flex-start; align-content:center; font-size:1.2em; z-index:3;}
    .testimonial_content h2{margin:0; padding-top:10px; font-size:1em;}
    .testimonial_content p{margin:0; padding:0; font-size:12px;}
    .testimonial_content p i{font-size:10px;}
    .testimonial_content span{font-size:36px;}

    .testimonial_clipped img{opacity:0;}

    .benefits_module{flex:1 1 90%; overflow:hidden; padding:0; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center; border-radius:20px;}
    .module_information{flex:1 1 98%; height:100%; display:flex; flex-flow:row nowrap; justify-content:space-around; align-items:center; align-content:center;}
    .module_admin_edit{display:none;}

    .task_number img{width:60px;}

    .task_instructions a{margin:3px 3px; padding:3px 5px; background-color:var(--highlight_color); border:solid 1px var(--primary_color); border-radius:10px;text-decoration:none; color:var(--primary_color); font-size:.7em; transition:.3s;}

    .contact_table{display:none;}

    .contact_list{display:flex; flex-flow:column wrap; justify-content:center; align-items:center; align-content:center; text-align:center;}
    .contact_list h1{margin:5px; padding:0;}
    .contact_list h2{margin-top:10px;}
    .contact_list p{margin:0; padding:0;}
    .contact_list p{margin:0; padding:0;}
    .contact_list a{color:var(--link_color); text-decoration:none;}

    /* MOBILE FILTERS ========================================*/

    /* updated 6 lines 3/31/24 */
    .filters{justify-content:center; align-items:flex-start; font-size:.8em; margin:5px;}
    .filters label{margin:2px; padding:2px; flex:1 1 25%; height:24px; line-height:.9; text-align:center; justify-content:center; align-items:center; border-radius:5px;}
    .filters label::before{position:absolute; left:3px; top:6px; margin-right:6px;}

    .go_to_buttons{margin:0 -6px 3px 0; justify-content:center; font-size:.9em; line-height:.9;}
    .go_to_buttons a{margin:2px; padding:3px; flex:1 1 25%; height:28px; text-align:center; justify-content:center; align-items:center; border-radius:5px;}
    .go_to_buttons span{display:none; font-size:18px; margin-right:3px;}

    .filters_open{padding:15px; border-bottom:solid 1px var(--highlight_color); animation:expandCollapse .5s forwards;}
    .filters_closed{max-height:0; opacity:0; display:none;}

    .expand_button{padding-right:10px;}
    .expand_button b:active, .expand_button b:focus, .expand_button b:hover{background-color:var(--primary_color); border:1px solid var(--primary_color);}

    /* MOBILE RIGHT ASIDE (BOTTOM) ========================================*/

    .side_menu{grid-area:CS / C2/ DE / D4; overflow-x:hidden; margin:0; padding:10px;}
    .side_menu h2{font-size:1em;}
    .side_menu ul{font-size:.9em;}

    .hub_highlights{grid-area:AS / A2 / AE / A4; overflow:hidden; margin:0; padding:5px; display:flex; flex-flow:row nowrap; justify-content: space-around; align-items:stretch;}
    .highlights_module{flex:1 1 26%; max-height: none; overflow:hidden; margin:5px; padding:5px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center;}
    .highlights_module article{justify-content:center;}
    .highlights_module article div:first-of-type{flex:0 1 82px; height:70px; padding:0 10px 0 10px; flex-flow:row wrap;}
    .highlights_module article div:nth-of-type(2){display:none;}
    .highlights_module img{width:80px;}
    .mobile_highlight{display:flex; flex:1 1 45%; height:20%;}

    .side_news_recent{grid-area:CS / C2/ DE / D4;}
    .side_news_recent header{padding:10px;}
    .side_news_recent article{width:100%; margin:0; padding:5px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start;}
    .side_news_recent div:first-of-type{flex:1 1 90%; padding:5px 10px 5px 10px;}
    .side_news_recent article div:last-of-type{display:none;}

    .side_links_recent{grid-area:CS / C2/ DE / D4;}
    .side_links_recent header{width:93%; padding:10px;}
    .side_links_recent article{width:98%; margin:0; padding:5px; display:flex;}
    .side_links_recent a{flex:1 1 86%; padding:5px 15px 5px 15px; text-decoration:none; color:var(--highlight_color);}
    /*.side_links_recent div{display:none;}*/

    /* MOBILE FOOTER ========================================*/

    .footer_full{grid-area:DS / D2 / DE / D4;}
    .footer_aside{display:none;}

    .hub_footer img{height:24px; padding:3px 5px;}
    /* updated 1 line Nichole 3/30/2024 */
    .hub_footer{ border-radius:0 0 0 0; align-items:flex-start;}

    /* MOBILE OVERLAYS ========================================*/

    .overlay_container{grid-area:HS / H1 / DE / D4; height:99vh; overflow-y:visible; overflow-x:hidden;}
    .overlay_container::-webkit-scrollbar{display:none;}

    .overlay_header{grid-area:HS / H1 / HE / H4; width:80vw;}
    .overlay_header h1{margin:5px;}
    .overlay_header p{margin:5px;}

    .header_symbol{width:70px; margin:5px;}
    .header_banner img{max-width:100%; margin:0;}

    .overlay_header article{flex:1 1 20%; margin:5px; display:flex; flex-flow:row nowrap; justify-content:flex-start; align-items:center; align-content:center;}
    .overlay_close{top:5px; right:5px; cursor:pointer;}

    .overlay_main{grid-area:AS / A1 / CE / C4; min-height:80vh; margin:0; padding:5px; gap:5px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:flex-start; overflow:hidden;}

    .main_story_module{flex:1 1 90%; height:58vh; padding:5px; align-self:stretch; display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:flex-start; align-content:flex-start; overflow-x:hidden; overflow-y:scroll;}
    .main_story_image_half{flex:1 1 90%; height:auto; margin:10px; overflow:visible;}
    .main_story_image_half img{width:98%; height:auto; border:solid 1px var(--primary_color);}
    .main_story_image_half p{text-align:center; margin:5px; padding:0;}
    /* edited 2 lines Nichole 11/28/23 */
    .main_story_image_full, .main_story_image_long{overflow:visible;}
    .main_story_image_full img, .main_story_image_long img{width:100%;}
    .main_story_copy_half{flex:1 1 90%; margin:5px; overflow:visible;}
    .main_story_copy_full{flex:1 1 90%; margin:5px; overflow:visible;}
    .main_story_copy_fit{flex:1 1 90%; margin:5px; overflow:visible
    ;}

    .overlay_aside{flex:1 1 90%; max-height:20vh; padding:10px; align-self:center; display:flex; flex-flow:row wrap; justify-content:center; align-items:flex-start; align-content:flex-start;}
    .overlay_aside::-webkit-scrollbar{display:none;}
    .overlay_aside h1{flex:1 1 98%; margin:5px 3px 5px 3px; text-align:center;}
    .overlay_aside h2{flex:1 1 98%; margin:5px 3px 3px 3px; text-align:center;}
    .overlay_aside p{flex:1 1 98%; margin:3px; text-align:center;}
    .overlay_aside a{flex:1 1 98%; margin:3px 3px 3px 10px; text-align:center;}
    .overlay_aside img{width:420px; height:200px; margin:5px 0 5px 0; border-radius:10px;}

    .overlay_mini{flex:1 1 90%;}
    .overlay_mini img{width:100%; height:auto; margin:5px 0 5px 0;}

    .calendar{flex:1 1 98%; height:75vh; margin:10px; display:flex; flex-flow:row wrap; justify-content:center; align-items:center; align-content:center; overflow:hidden;}
    .calendar iframe{height:100%;}

    .overlay_footer{grid-area:DS / D1 / DE / D4; height:min-content;}
    .overlay_footer p{margin:0; padding:0; font-size:.7em;}

    .overlay_search_results{display:flex; flex-flow:column wrap; justify-content:center; align-content:flex-start; width:100%; height:auto; margin-top:50px;}
    .overlay_search_results article{width:97%;}
    .overlay_search_results article div{display:flex; flex-flow:row wrap; justify-content:flex-start; align-items:baseline; align-content:flex-start; margin:3px;}
    .overlay_search_results article p{margin:3px;}
    .overlay_search_results article h2{margin:3px;}

    /* MOBILE ANIMATIONS ========================================*/

    @keyframes growGlow{
        0%{text-shadow:none; font-size:1.2em;}
        50%{text-shadow:0 0 15px magenta; color:darkmagenta; font-size:1.5em;}
        100%{text-shadow:none; font-size:1.2em;}
    }

    /* MOBILE ADMIN MODE (TURN OFF) ========================================*/

    .admin_indicator{display:none;}
    .admin_mode_flag{display:none;}
    .admin_edit{display:none;}
    .admin_edit_inline{display:none !important;}
    .admin_edit_delete{display:none;}
    .admin_edit_special{display:none;}
    .admin_new_card{display:none;}
    .admin_new_doc{display:none !important;}
    .admin_new_album{display:none;}
    .admin_testimonial_card{display:none; !important;}
    .add_user{display:none;}

}/* tablet and mobile screen */