@charset "UTF-8";
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css");
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@300;500;600;700;800;900&family=Source+Sans+3:wght@200;300;400;600;700&display=swap');
/* CSS Document */
/* 2026 UGST Diversity and Includion Retreat */
/* Main Content */

body{
    padding: 0%;
    margin: 0%;
    /* overflow?? 
        overflow-y: scroll; */
    overflow-x: scroll;
}

/* Holds all the main content below the header */
#wrapper{

}

#header {
    position: fixed;
    top: 0px;
    right: 0px;
    left: 0px;
    height: 50px;
    background-color: #AD7231;
}

/* Text */
/* Calling Source Sans: font-family: "Source Sans 3", sans-serif; */
/* Calling Roboto Slab: font-family: "Roboto Slab 4", serif; */
/* Section Headers */

p {
  font-family: "Source Sans 3", sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #282A2A;
  overflow: auto;
}

caption {
  text-align: center;
} /* not sure why it's not working */

h1 {}

h2 {
    font-size: 3.75em;
    color: #ad7231;
    font-family: "Roboto Slab", serif;
    font-weight: 700;
    text-align: center;
    overflow: hidden;
    padding-top: .5em;
    padding-bottom: .1em;
    line-height: 1;
}

h3 {
    color: #AD7231;
    font-size: 2.15em; 
    font-family: "Roboto Slab", serif;
    overflow: hidden;
    text-align: center;
}

/* Schedule text */ 
.schedule-title {
    text-decoration-thickness: 2px;
    text-align: center;
    padding-top: .5em;
    padding-bottom: .5em;
}

.name {
  font-weight: 500;
}
.job-title {
  font-weight: 400;
}

mark{
    background-color: #FAB108;
    color: #000000;
    font-weight: 600;
}

i {
    padding-right: .5em;
    color: #E6E6E6;
}

/* Links and buttons */

a:link {
    color: #AD7231;
    text-decoration: underline;
}

/* a:hover{
    text-decoration: underline dotted 2px;
} */

/* Buttons */
.button-custom {
    border: none;
    padding: 1em;
    background-color: #AD7231;
    color: #fff !important; /* Note: white on #AD7231 is NOT AA for normal text, but this is a large button so often OK */
    font-family: "Roboto Slab", serif;
    font-size: 18px;
    text-align: center;
    text-decoration: none !important;
    display: inline-block; /* helps spacing/hover/focus behave like a button */
}

/* FIX: this used to be .button-custom a:hover, which wouldn't trigger in your markup */
.button-custom:hover{
    background-color: #E6E6E6 !important;
    color: #AD7231 !important;
}

/* Add visible keyboard focus */
.button-custom:focus,
.button-custom:focus-visible{
    outline: 3px solid #000;
    outline-offset: 3px;
}

/* Images 
img {
    align-items: center;
} */

/* Parallax Sections */

#bgimg-1 {
    background-image: url("../images/retreat2026.png");
    background-size: cover;
    background-position: top center;
    background-color: #e6e6e6;
    /* opacity: 80%; */
}

.bgimg-2 {
    background-color: #9ECBDB;
    /* opacity: 80%; */
}

#bgimg-3 {
    background-color: #AD7231;
}

.speaker-title {
    color: #E6E6E6 !important;
}

.parallax-text {
    font-family: "Roboto Slab", serif;
    font-weight: 400;
    color: #fff;
    position: relative;
    padding: .25em;
    text-align: center; /* Center for media queries */
}

#bgimg-2 .parallax-text {
    font-size: .8em;
    text-align: left !important;
}

#bio-text {
    font-family: "Roboto Slab", serif;
    font-weight: 300;
    font-size: 1em;
    color: #000000;
    position: relative;
    padding: 5%;
}

#speaker-img-caption {
    font-family: "Roboto Slab", serif;
    font-weight: 400;
    background-color: rgba(250,177,8,0.33);
    color: #4B3115;
    padding: 3%;
    margin-top: 3%;
    border-left: solid .25em #AD7231;
}

/* Navbar Styles */

/* Sidebar positioning and styling */
#topMenu {
    padding: 2em 0 2em 1em;
    top: 0px;
    right: 0px;
    left: 0px;

    /* ACCESSIBILITY: navbar background is #AD7231 (per your note) */
    background-color: #AD7231;

    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    box-shadow: 0px 2px 5px 2px #7f7f7f;
}

#topMenu-title {
    background-color: white;
    color: #875826;
    font-size: 1.75em;
    font-family: "Roboto Slab", serif;
    font-weight: 700;
}

#topMenu-info{
    color: #E6E6E6;
    font-family: "Source Sans 3", sans-serif;
    font-size: .5em;
    font-weight: 300;
}

/* ACCESSIBLE NAV LINK COLORS ON #AD7231:
   White (#fff) fails (3.38:1). Use very dark text instead. */
#topMenu .nav-link {
    color: #2B1A0A; /* AA compliant on #AD7231 */
    font-family: "Roboto Slab", sans-serif;
    font-size: 1em;
    text-decoration: none;
    transition: text-decoration .2s linear;
    font-weight: 600;
}

/* Hover: underline + keep contrast */
#topMenu .nav-link:hover {
    text-decoration: underline solid #2B1A0A 0.2em !important;
    color: #2B1A0A;
}

/* Visited: keep same color so contrast stays safe */
#topMenu .nav-link:visited {
    color: #2B1A0A;
}

/* Keyboard focus: very visible */
#topMenu .nav-link:focus,
#topMenu .nav-link:focus-visible {
    outline: 3px solid #000;
    outline-offset: 3px;
    text-decoration: underline;
    text-underline-offset: 0.25em;
}

/* Scrollspy active state: not color-only */
#topMenu .nav-link.active {
    font-weight: 800;
    text-decoration: underline;
    text-underline-offset: 0.25em;
}

.nav-button{
    background-color: #fff;
}

/* Schedule */
.schedule-span {
  width: 5em; /* update media query */
}

.border-start {
  border-color: rgba(250,177,8,0.33) !important;
}

/* Agenda headers under h3 in text */
.activity {
    overflow: hidden;
}

.h4 {
    color: #AD7231;
    font-family: "Roboto Slab", serif;
    font-weight: 400;
    overflow: hidden;  
}

hr {
    border:none;
    height: .2em;
    width: 60%;
    margin: auto;
    background-color: #AD7231;
}

/* Accordion */

/*remove that blue glow from active accordion item */
.accordion-button{
    font-size: 24px;
}

.accordion-button:not(.collapsed) {
  background-color: #AD7231; /* Replace with your desired color */
  color: #fff;              /* Optional: Change text color for contrast */
}

.accordion-body {
    font-family: "Source Sans 3", sans-serif;
    font-size: 18px;
}

/* Survey */
#survey-button{
    background-color: #AD7231;
    padding: .5em;
    color: #E6E6E6;
    font-family: "Roboto Slab", sans-serif;
    font-size: 1em;
    text-transform: uppercase;
}

#survey-button:hover{
    background-color: #AD7231;
    color: #E6E6E6; 
}

/* About the Task Force */
li {
    font-size: 18px;
    font-family: "Source Sans 3", sans-serif
}

/* Footer */
footer {
    background-color: #875826;
    padding-top: .5em;
}

.contact-info{
    padding: 0 0.5em;
    color: #E6E6E6 !important;
    font-size: 15px;
}

.bi-envelope-open-fill {
    text-decoration: none;
    color: inherit;
}

a.contact-links{
    color: #E6E6E6 !important;
    transition: text-decoration .2s linear;
}

.contact-links:hover{
    text-decoration: underline solid white 0.2em !important;
    color: #E6E6E6;
}

/* Custom @media queries: anything smaller than 992px */
@media screen and (max-width: 992px){
    /* General Style */
    h2 {
        font-size: 2.5em;
    }
    
    h3 {
        font-size: 1.5em;
    }

    /* About the Speaker */
    #bio-text{
        font-size: 15px;
    }
    
    #speaker-img-caption {
        font-size: 18px;
    }
    
    /* Accordion */
    .accordion-body {
        font-family: "Source Sans 3", sans-serif;
        font-size: 18px;
    }
    
    /* Footer */
    p footer {
        font-size: 13px;
    }
    
    /* Accordion */
    .accordion-button {
        font-size: .9em;
    }
}

/* Custom @media queries: anything smaller than 768 */
@media screen and (max-width: 768px){
    /* General style */
    h2 {
        font-size: 2.25em;
    }
    
    h3 {
        font-size: 1.25em;
    }
    
    mark {
        font-size: 12px;
    }

    /* Schedule */
    iframe{
        width: auto;
        height: 158;
    }
    
    /* Speaker */
    #bio-text {
        font-size: 13px;
        padding: 3%;
    }
    
    #speaker-img-caption {
        display: none;
    }  
    
    /* Footer */
    footer .img-fluid {
        display: none;
    }
    
    #taskForceThankYou {
        font-size: 15px;
    }
    
    li {
        font-size: 15px;
    }
}

/* Custom @media queries: anything smaller than 576px */
@media screen and (max-width: 576px){
    /* General Styles */
    h2 {
        font-size: 1.8em;
    }
    
    h3 {
        font-size: 1.2em;
    }
    
    p {
        font-size: 13px;
        line-height: 1.5;
    }

    .h3 {
        font-size: 1em;
    }
    
    .h4 {
        font-size: 1em;
    }

    /* Navbar */
    #topMenu{
        padding: .75em 0 .75em .2em;
    }
    
    #topMenu-title {
        font-size: .75em;
        padding-bottom: .25em;
    }
    
    a.nav-link {
        font-size: .5em;
        margin: 2px;
        padding: .75em .4em;
    }

    /* Parallax */
    .parallax-text {
        font-size: 10px;
    }
    
    /* 1st Parallax: About Poverty */
    #bgimg-1 {
        background-position: center !important;
    }
    
    /* This Year */
    span.section-title {
        font-size: 3em;
        line-height: 1.1;
    }
    
    /* Schedule */
    iframe {
        width: 200px;
        height: 113px;
    }
   
    /* Survey */
    #survey-button{
        font-size: .55rem;
    }
    
    /* About the Task Force */
    .card-body {
       font-size: 9px; 
        text-align: center;
    }
    
    /* Footer */
    #contact-info {
        font-size: .36em;
    }
}