/* INITIALIZE ENVIRONMENT */
:root{
    --mainColor-FB100: #0E406A;  /* main color (freshwater blue) */
    --mainColor-FB40D: #061A2A;
    --secColor-WG40D:#494641;    /* secondary color (warm gray 2) */
    --secColor-WG100: #B6B0A2;
    --secColor-WG40L: #E2DFDA;
    --hColor-HO100: #D34727;     /* highlight colors (harvest orange) */
    --hColor-HO80D: #A9391F;
    --borderColor: #D3D0C7;      /* standard border color (warm gray 2) */


    --pgPad:30px;                             /* page area padding */
    --pgPad-reverse:calc(-1 * var(--pgPad));

    --gap:40px;                               /* standard gap for grids */
    --gap-reverse:calc(-0.5 * var(--gap));    /* note this is halved since gap is for two columns */

    --slideShow-pad:20px;                     /* used to position slideshow buttons */
    --slideShow-rPad:calc(-1 * var(--slideShow-pad));
}

*, *::before, *::after { box-sizing:border-box; }  /* added for predictable sizing */

body { background-color: #E2DFDA; font-family:"open-sans",sans-serif; font-style:normal; font-weight:400; line-height:1.4; margin:0; }
h1 { font-size:1.8rem; font-weight:700; line-height:normal; }
h2 { font-size:1.3rem; font-weight:700; line-height:normal; margin-top:2rem; }
li { margin-bottom:0.25rem; }
a { color:#0000FF; overflow-wrap:break-word; }
a:hover, a:focus { text-decoration:none; }
.highlightText { color:var(--hColor-HO80D); font-family:"futura-pt",sans-serif; font-size:1.2rem; font-weight:700; }
.double > li { margin-bottom:1rem; }
.double > li > ul { margin-top:6px; }
.clearAfter::after { clear:both; content:""; display:block; height:0; visibility:hidden; }


/* WEBSITE HEADER */
#pgWrapper { background-color: #FFFFFF; border:1px solid var(--borderColor); border-width:0 1px; margin:0 auto; max-width:1300px; min-height:100vh; padding:var(--pgPad); }
#pgWrapper > header { margin:var(--pgPad-reverse) var(--pgPad-reverse) 0; }
#pgWrapper > header > .wrapper { padding:var(--pgPad) 15px; }
#pgWrapper > header .logo img { max-width:370px; width:100%; }


/* MAIN WEBSITE NAVIGATION */
#mainNav { line-height:normal; margin:0 var(--pgPad-reverse); }
#mainNav > .wrapper { background-color:var(--mainColor-FB100); position:relative; }
#mainNav > .wrapper .nav-toggle { background:none; border:1px solid #FFFFFF; border-radius:4px; color: #FFFFFF; cursor:pointer; display:none; font-size:1.2rem; padding:10px 25px; }
#mainNav > .wrapper .nav-toggle:hover { background-color:var(--mainColor-FB40D) !important; color:#FFFFFF !important; }
#mainNav > .wrapper .nav-toggle svg { display:block; height:20px; margin:10px auto 0; width:30px; }
#mainNav > .wrapper .nav-toggle svg line { stroke:#FFFFFF; }
#mainNav > .wrapper > ul { display:grid; grid-auto-flow:column; justify-content:start; list-style:none; margin:0; padding:0 0 0 15px; }
#mainNav > .wrapper > ul > li { display:inline-block; margin:0; max-width:150px; }
#mainNav > .wrapper a { align-items:center; color: #FFFFFF; display:flex; font-size:1.1rem; height:100%; justify-content:center; padding:8px 15px; text-align:center; text-decoration:none; width:100%; }
#mainNav > .wrapper a:hover { background-color:var(--mainColor-FB40D) !important; color: #FFFFFF !important; }
@media (max-width: 700px) {
    #mainNav > .wrapper { padding:8px 10px; }
    #mainNav > .wrapper .nav-toggle { display:block; }
    #mainNav > .wrapper > ul { display:none; }

    #mainNav.open > .wrapper .nav-toggle { background-color:var(--secColor-WG40L); border-bottom:none; border-radius:4px 4px 0 0; color:#000000; }
    #mainNav.open > .wrapper .nav-toggle svg line { stroke:#000000; }
    #mainNav.open > .wrapper .nav-toggle:hover svg line { stroke:#FFFFFF; }
    #mainNav.open > .wrapper > ul { background-color:var(--secColor-WG40L); display:grid; grid-auto-flow:row; grid-template-columns:1fr; padding:0; }
    #mainNav.open > .wrapper > ul > li { border-top:1px solid #FFFFFF; max-width:none; }
    #mainNav.open > .wrapper a { color:#000000; justify-content:left; text-align:left; }
}


/* MAIN WEBSITE CONTENT */
main { min-height:210px; }


/* WEBSITE FOOTER */
footer { border-top:1px solid var(--borderColor); line-height:normal; margin-top:6rem; padding-top:2rem; text-align:center; }
footer ul.logos { display:grid; gap:20px; grid-template-columns:1fr 1fr; list-style:none; margin:0 auto; max-width:820px; padding:0; place-items:center; }
footer ul.logos li { display:inline-block; margin:0; max-width:400px; width:100%; }
footer ul.logos a { display:block; }
footer ul.logos li.ugptiLogo a { background-color:#004712; }
footer ul.logos img { height:100%; width:100%; object-fit:contain; }
footer ul.logos svg { fill:#FFFFFF; vertical-align:middle; }
footer ul.logos svg .ndsuLogo { fill:#FFC82E; }
@media (max-width:600px) {
    footer ul.logos { grid-template-columns:1fr; max-width:400px; }
}


/* STANDARD TWO-COLUMN LAYOUT */
.layout_split { clear:both; display:grid; gap:0 var(--gap); grid-template-columns:1fr 1fr; margin-top:1rem; overflow:auto; }
.layout_split > div > :first-child { margin-top:10px; }
.layout_split > div.photo img { display:block; height:auto; object-fit:cover; width:100%; }
.layout_split.bleed { margin:0 var(--pgPad-reverse); padding:var(--pgPad); }  /* allows images (or backgrounds) to bleed into the margins */
.layout_split.bleed > div > :first-child { margin-top:0; }
.layout_split.bleed > div:nth-child(1).photo { margin-top:var(--pgPad-reverse); margin-left:var(--pgPad-reverse); }
.layout_split.bleed > div:nth-child(2).photo { margin-top:var(--pgPad-reverse); margin-right:var(--pgPad-reverse); }
.layout_split.bleed.sideOnly > div:nth-child(1).photo,  /* remove bleed from top margin */
.layout_split.bleed.sideOnly > div:nth-child(2).photo { margin-top:0; }
.layout_split.bleed.full { padding-bottom:0; }  /* for full bleed */
.layout_split.bleed.full > div:nth-child(1).photo { margin-right:var(--gap-reverse); }
.layout_split.bleed.full > div:nth-child(2).photo { margin-left:var(--gap-reverse); }
@media (max-width:700px) {
    .layout_split { grid-template-columns:1fr; }
    .layout_split > div             > :first-child { margin-top:2rem; }
    .layout_split > div:first-child > :first-child { margin-top:1rem; }
    .layout_split.bleed { margin:1rem 0; padding:0; }
    .layout_split.bleed > div > :first-child { margin-top:1rem; }
    .layout_split.bleed > div.photo { margin:0 !important; }
}

/* CUSTOMIZE LAYOUT -- PHOTO SLIDESHOWS */
.layout_split > div.photo .slideShow { border-bottom:5px solid var(--hColor-HO100); margin-bottom:var(--slideShow-pad); position:relative; }
.layout_split > div.photo .slideShow img:not(:first-of-type) { display:none; }
.layout_split > div.photo .slideShow .buttons { bottom:var(--slideShow-rPad); right:10px; position:absolute; }
.layout_split > div.photo .slideShow .buttons svg { cursor:pointer; display:none; max-width:60px; width:100%; }
.layout_split > div.photo .slideShow .buttons svg .button .background { fill:var(--mainColor-FB100); }
.layout_split > div.photo .slideShow .buttons svg .button .border { fill:var(--hColor-HO100); }
.layout_split > div.photo .slideShow .buttons svg .icon .background { fill:var(--secColor-WG40L); }
.layout_split > div.photo .slideShow .buttons svg .icon .border { fill:var(--mainColor-FB40D); }
.layout_split > div.photo .slideShow .buttons svg:hover .button .background { fill: #000000; }


/* */
.headingCard { border:1px solid var(--borderColor); border-radius:2px; min-height:200px; }
.headingCard h2 { background-color:var(--secColor-WG40D); color: #FFFFFF; margin:0; padding:4px 10px; }
.headingCard > div { padding:0 10px; }


/* ACTION BUTTON (e.g., registration button on the exhibitor/sponsor page) */
.actionButton { margin:1.5rem 0 2rem; }
.actionButton a { background-color:var(--secColor-WG40D); border:0; border-radius:25px; color:#FFFFFF; display:inline-block; font-size:1.1rem; padding:10px 20px; text-decoration:none; }
.actionButton a:hover { background-color:#000000; filter:drop-shadow(2px 2px 2px var(--secColor-WG100)); }