/*! modern-normalize v3.0.1 | MIT License | https://github.com/sindresorhus/modern-normalize */
*,::after,::before{-webkit-box-sizing:border-box;box-sizing:border-box}html{font-family:system-ui,'Segoe UI',Roboto,Helvetica,Arial,sans-serif,'Apple Color Emoji','Segoe UI Emoji';line-height:1.15;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{margin:0}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Consolas,'Liberation Mono',Menlo,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-color:currentcolor}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}legend{padding:0}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}


/** 
 *
 *  1- FONTS & VARIABLES
 *  2- BODY ROOT STYLE & PAGE STRUCTURE
 *    2.1- LAYOUT UTILITY CLASSES
 *    2.2- AJUSTMENTS & EXCEPTIONS
 *  3- TYPOGRAPHY & TEXT STYLES 
 *    3.1- TYPOGRAPHY SCALE
 *  4- PAGE ELEMENT STYLES
 *    4.1-
 *    4.2-
 *  
 *  4- HEADER / MENU / FOOTER / MENU
 *  5- HOME PAGE
 *  6- PAGE CONTENT STYLES
 *  7- FOOTER
 *  8- IMAGES / GALLERIES / MEDIA
 *  9- ANIMATIONS / EFFECTS / TRANSITIONS
 *  10- COLORS / PATTERNS / STYLES
 *    10.1- BACKGROUND PATTERNS 
 *  11- MEDIA QUERIES
 *     
**/


/** [EX:JASGP]
 *
 *  1- ROOT STYLES AND FONTS LOAD-IN
 *  2- SETTINGS & CLASSES - PAGE STRUCTURE
 *  3- SETTINGS & CLASSES - DISPLAY & TYPOGRAPHY
 *    3.1- TYPOGRAPHY SCALE
 *  4- HEADER / MENU / FOOTER / MENU
 *  5- HOME PAGE
 *  6- PAGE CONTENT STYLES
 *  7- FOOTER
 *  8- IMAGES / GALLERIES / MEDIA
 *  9- ANIMATIONS / EFFECTS / TRANSITIONS
 *  10- COLORS / PATTERNS / STYLES
 *    10.1- BACKGROUND PATTERNS 
 *  11- MEDIA QUERIES
 *     
**/

/** [EX:SP]
 *
 *  1- SETTINGS & CLASSES - PAGE STRUCTURE
 *  2- SETTINGS & CLASSES - DISPLAY & TYPOGRAPHY
 *    2.1- TYPOGRAPHY SCALE 
 *  3- HEADER / MENU / FOOTER / MENU
 *  4- HOME PAGE
 *    4.1- GRANTS LANDING PAGE
 *  5- PAGE CONTENT STYLES
 *    5.1- EVENT ARCHIVE CONTENT STYLES
 *    5.2- NEWS ARCHIVE CONTENT STYLES  
 *    5.3- EVENT DATE DISPLAY STYLES
 *    5.4- SIDEBAR
 *    5.5- 
 *    5.6- CONTACT FORM   
 *  6- IMAGES / GALLERIES / MEDIA
 *  7- FOOTER
 *    7.1- MAILCHIMP SIGNUP
 *  8- DEV CSS - TESTING & ADJUSTMENTS
 *     
**/



/*  ============================================================================
    1- FONTS & VARIABLES
    ========================================================================= */

/* FALLBACK FONT ADJUSTMENTS */

@font-face {
  font-family: 'Georgia Fallback';
  src: local(Georgia);
  size-adjust: 95%;
  ascent-override: 89%;
  descent-override: 42%;
  /* line-gap-override: 55%; */
}

/* CUSTOM FONTS LOAD-IN */

@font-face {
  font-family: 'Adelphe Trouble Floreal';
  src: url('../assets/fonts/Adelphe-Trouble-FlorealItalic.woff2') format('woff2');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Adelphe Trouble Floreal';
  src: url('../assets/fonts/Adelphe-Trouble-FlorealRegular.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adelphe Trouble Floreal';
  src: url('../assets/fonts/Adelphe-Trouble-FlorealSemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Adelphe Trouble Floreal';
  src: url('../assets/fonts/Adelphe-Trouble-FlorealSemiBoldItalic.woff2') format('woff2');
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}


/* VARIABLES */

:root {
/* TOP-LAYER END-OF-PAGE-MASK */
  --top-layer-mask-svg: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1199 216" preserveAspectRatio="none"><path fill="black" d="M0,215.56h1199.54v-29.1c-34.87-5.47-94.92-14.84-129.7-16.45-31.13-2.2-65.72-7.73-95.03-13.65-20.42-4.96-38.63-11.65-62.53-15.52-44.26-7.15-91.7-9.74-137.07-15.65-34.25-5.04-63.56-9.64-94.43-20.91-46.75-11.45-48.35-13.02-57.2-14.3-37.74-11.5-96.52-8.93-108.17-9.88-70.8,3.06-135.02-12.76-201.96-24.77-51.83-9.3-36.13-9.88-88.78-19.31-65.71-11.77-73.01,2.72-182.58-29.41C28.85,3.91,6.68,1.53,0,0v215.56Z"/></svg>');

  --tagline-spiral-svg: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 790.98 703.17"><path fill="white" d="M742.48,119.57c-34.92-41.01-71.34-102.35-125.09-111.9-126.96-29.49-304.78,27.45-367.08,147.24-20.63,51.05-7.65,120.87,3.63,176.38,14.63,81.95,75.17,117.82,154.47,107.64,103.23-8.48,120.05-35.99,163.15-120.85,16.66-12.77,46.3-26.24,47.73-49.98-3.11-22.32-26.07-58.48-53.63-54.23-66.22,15.24-64.06,55.44-31.01,110.26-10.84,36.24-24.36,68.38-61.58,79.75-40.38,9.56-101.46,21.28-140.14,2.86-60.8-31.77-63.69-130.84-68.28-191.43,1.51-150.31,253.8-231.9,371.63-171.81,17.64,9.67,30.63,21.93,51.44,48.14,94.14,110.2,105.68,283,24.43,402.98-98.24,138.44-318.62,219.44-481.69,165.12-120.41-73.74-9.58-73.97-167.1-182.43C-11.19,347.03,18.3,105.37,177.52,49.12c77.66-29.62,40.38-63.05-26.85-13.03C41.89,82.13,5.04,204.97.27,314.74c-1.19,64.51,1.01,76.71,19.59,130.76,10.86,34.22,18.4,43.65,7.12,69.32-18.83,42.83,29.63,90.5,60.7,112.58,29.82,13.62,63.3-.46,93.49,29.43,143.17,101.04,340.77,18.17,483.32-70.72,133.29-112.38,164.55-317.52,78-466.54Z" /></svg>');

/* DEFINED COLORS */
  --primary-dk-green: #6b7d4f;
}



/*  ============================================================================
    2- BODY ROOT STYLE & PAGE STRUCTURE
    ========================================================================= */

body {
  font-family: 'Adelphe Trouble Floreal', 'Georgia Fallback', Georgia, serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.25;
  color: #f0f1f3;
  /* background-color: #282828; */
  /* background-color: #6f804c; */
  /* background-color: var(--primary-dk-green); */
  overflow-y: scroll;
}
body.info-page {
  color: #282828;
  background-color: #f0f1f3;
  border-color: #f0f1f3;
}


#top-layer-container,
#second-layer-container,
#third-layer-container {
  padding: 1em;
}    
#second-layer-container {
  padding-top: 6vh;
}
#third-layer-container {
  margin-top: -1px;
}

#top-layer-container {
	background: -o-linear-gradient(top, #6f804c, #f08559 12.5%, #e1a77f 50%, #907fb3);
	background: -webkit-gradient(linear, left top, left bottom, from(#6f804c), color-stop(12.5%, #f08559), color-stop(50%, #e1a77f), to(#907fb3));
	background: linear-gradient(top, #6f804c, #f08559 12.5%, #e1a77f 50%, #907fb3);
}

#second-layer-container,
#third-layer-container {
  background-color: var(--primary-dk-green);
}


.end-page-mask {
  position: relative;
  top: 1em;
  left: -1em;
  /* width: 100%; */
  width: calc(100% + 2em);
  /* Controls the height of the mask */
  height: calc(100vw / 10);
  /* Match revealed layer background color */
  background-color: var(--primary-dk-green);
  /* Prevent sub-pixel rendering gaps */
  margin-bottom: -1px;
  /* Apply mask using standard and vendor-prefixed properties */
  -webkit-mask-image: var(--top-layer-mask-svg);
  mask-image: var(--top-layer-mask-svg);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

#title-panel {
  /* height: calc((100vw - 3em) / 4); */
  height: calc((100vw - 0em) / 4);
}
#contact-panel {
  margin-top: calc(6em - 3vw);
}





/*  2.1- LAYOUT UTILITY CLASSES
============================================================================= */  

.flex-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}
.flex-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.flex-1-1 {
  /* width: 100%; */
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
}
.flex-1-2 {
  /* width: 50%; */
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
}
.flex-1-3 {
  /* width: 33.33%; */
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.33%;
          flex: 0 0 33.33%;
}
.flex-2-3 {
  /* width: 66.67%; */
  -webkit-box-flex: 0;
      -ms-flex: 0 0 66.67%;
          flex: 0 0 66.67%;
}



.position-relative,
.relative-block {
  position: relative;
}

.h-block {
  /* padding-bottom: 10%; */
}

.flex-content-wrap {
  padding: 1.5em;
  /* padding: 0 1.5em; */
}

.flex-content-wrap.body-text-wrap {
  /* padding-right: 2em; */
}


section[id*="panel"]:not(#title-panel):not(#friends-collaborators-panel):not(#tagline-panel) {
  padding-bottom: 10%;
  /* padding-bottom: 10vh; */
  padding-bottom: 15vh;
}

section[id*="panel"] {
  position: relative;
  z-index: 1;
}





/*  2.2- ADJUSTMENTS & EXCEPTIONS
============================================================================= */ 

#intro-panel .flex-content-wrap {
  margin-top: 0;
}

.panel-text.flex-content-wrap {
  margin-top: -3.175em;
  padding-top: 0;
}







.return-link-container {
  margin-top: 1.0625em;
}
.return-link img {
  position: relative;
  top: -1px;
  max-width: 10em;
  vertical-align: bottom;
}



span.medium {
  font-size: 1.5em;
  line-height: 1.1;
}
span.large {
  font-size: 3.5em;
  line-height: 1;
}
.no-underline {
  text-decoration: none;
}
.all-caps {
  text-transform: uppercase;
}



/* PROJECT LOGOS */

.large-logo-stacked {
  max-width: 18em;
}


/* SPONSOR LOGOS */

ul.sponsor-logo-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-padding-start: 0;
    padding-inline-start: 0;  
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  /* max-width: 40em; */
  margin: 3em 0;
  list-style: none;
}
.sponsor-logo-list li {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(33% - 2em);
          flex: 0 0 calc(33% - 2em);
  /* margin-right: 2em; */
  margin: 0 2em 2em 0;
}
.sponsor-logo-list li .sponsor-logo {
  max-width: 100%;
}

/* INDIVIDUAL LOGO ADJUSTMENTS */


.sponsor-logo-list li.sponsor-logo-nkcdc { -webkit-box-flex: 0; -ms-flex: 0 0 20%; flex: 0 0 20%; margin-right: 1em; }
.sponsor-logo-list li.sponsor-logo-artphilly { -webkit-box-flex: 0; -ms-flex: 0 0 24%; flex: 0 0 24%; margin-right: 2.25em; }
.sponsor-logo-list li.sponsor-logo-acadnatsci { -webkit-box-flex: 0; -ms-flex: 0 0 39%; flex: 0 0 39% }
.sponsor-logo-list li.sponsor-logo-muralarts { -webkit-box-flex: 0; -ms-flex: 0 0 31%; flex: 0 0 31%; margin-right: 3em; }
.sponsor-logo-list li.sponsor-logo-rair { -webkit-box-flex: 0; -ms-flex: 0 0 13%; flex: 0 0 13% }

.sponsor-logo-wpf {
  max-width: 100%;
  margin: 2em 0 5em;
}





/* DEMO STYLES */

#title-panel h1 {
  margin: 0;
  font-size: inherit;
}
#title-panel h1 img {
  width: 100%;
  max-width: none;
  max-height: calc(100vh - 6em);
}
#title-panel .flex-content-wrap {
  padding-right: .75em;
}

a {
  color: inherit;
}

.flex-content-wrap p,
.flex-content-wrap ul {
  max-width: 34em;
}

h1, h2, h3, h4, h5 {
  font-weight: 600;
}


.plaintext-email > span {
  display: none;
}
.style-italic {
  font-style: italic;
}


/* ADJUSTMENTS AND EXCEPTIONS */

ul.sponsor-logo-list {
  max-width: 40em;
}
.landing-page h2 {
  /* font-size: 3vw; */
}



/* FRIENDS LIST */

ul.friends-list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-bottom: 0;
  margin-left: 20%;
  /* padding-left: 15%; */
  padding-left: 0;
  list-style: none;
}
.friends-list li {
  /* position: relative; */
  max-width: -webkit-fit-content;
  max-width: -moz-fit-content;
  max-width: fit-content;
  /* margin-bottom: 1.3125em; */
  margin-bottom: 1.5em;
}
.friends-list h3 {
  margin: 0;
  font-size: 1.3125em;
}
.friends-list p {
  margin-top: 0;
  margin-bottom: 0;
}
.friends-list li:nth-child(1) { margin-left: 15%; }
.friends-list li:nth-child(2) { margin-left: 32%; margin-bottom: 1.125em; }
.friends-list li:nth-child(3) { margin-left: -4%; }
.friends-list li:nth-child(4) { margin-left: 8%; }
.friends-list li:nth-child(5) { margin-left: -14%; }
.friends-list li:nth-child(6) { margin-left: 25%; }





/* TAGLINE PANEL */

#tagline-panel {
  height: 80vh;
  margin-bottom: 2em;
  padding-left: 3vw;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
#tagline-panel .panel-text {
  padding-left: 1.0em;
  font-size: 2.5em;
  line-height: 1.15;
}

#tagline-panel p {
  margin: 0;
  /* font-size: 2.5em; */
  /* line-height: 1.15; */
}
#tagline-panel img {
  position: absolute;
  left: 5.4375em;
  bottom: 0;
  width: 4.5em;
  /* z-index: -1; */
  opacity: .6875;
}



#top-layer-bg-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('../assets/img/bg-spiral-composite-1-DRAFT-2.svg');
  background-repeat: repeat-y;
  background-position: -42vw -5vw;
  background-size: 210%;
  background-position: -25vw -15vw;
  background-size: 162%;
  mix-blend-mode: overlay;
  opacity: .1;
}

/* .top-layer-bg-image img {
  position: absolute;
  mix-blend-mode: overlay;
  opacity: .10;
}

.top-layer-bg-image img:nth-child(1) {
  top: -6vw;
  left: -10%;
}  */







/*  ============================================================================
    2- SETTINGS & CLASSES - DISPLAY & TYPOGRAPHY
    ========================================================================= */

p, ul, h1, h2, h3 {
  margin-top: 0;
}    

.screen-wrap a {
  position: relative;
  line-height: 0;
  /* text-underline-offset: 0.1em; */
  text-underline-offset: 0.15em;
  text-decoration-thickness: .05em;
}

/* .screen-wrap a::after {
  position: absolute;
  left: -0.375em;
  right: -0.375em;
  top: -0.275em;
  bottom: -0.2125em;
  content: "";
  display: inline-block;
  padding: 0.275em 0.375em 0.2125em;
  border-radius: 0.25em;
  background: #0055ff;
  color: #282828;
} */
.screen-wrap a:hover,
.screen-wrap a:hover::after {
  /* background: #f0f1f3; */
  /* color: #282828; */
  text-decoration: none;
}

/* section[id*="panel"] h2 */
.panel-title h2 {
  margin-bottom: 0;
  font-size: 2.25em;
  line-height: 1.15;
}
#contact-panel .panel-title h2 {
  margin-bottom: calc(1.5rem + 0.5em);
}










/*  ============================================================================
    11- MEDIA QUERIES
    ========================================================================= */


/* ABOVE 1780PX WIDTH *********************************************************/
@media handheld, only screen and (min-width: 1780px) {
  
  body {
    /* font-size: 38px; */
    font-size: 35px;
  }

}



/* ABOVE 1640PX WIDTH *********************************************************/
@media handheld, only screen and (min-width: 1640px) {
  
  body {
    /* font-size: 34px; */
    font-size: 31px;
  }

}



/* BELOW 1500PX WIDTH (approx 1280px content width) ***************************/
@media handheld, only screen and (max-width: 1499px) {
  
  body {
    font-size: 27px;
  }
  .flex-content-wrap {
    padding: 3vw;
    /* padding: 0 3vw; */
  }
  span.large {
    font-size: 6vw;  
  }
  span.medium {
    font-size: 2.75vw;
  }

  #title-panel .flex-content-wrap {
    padding-right: 3vw;
  }
  #contact-panel .panel-title h2 {
    margin-bottom: calc(3vw + 0.5em);
  }
  #tagline-panel {
    margin-bottom: 3em;
  }
  #tagline-panel .panel-text {
    padding-left: 2.25vw;
  }
  #tagline-panel img {
    left: calc(5.4375em - 3vw);
    bottom: calc(0em - 3vw);
  }

}



/* BELOW 1300PX WIDTH *********************************************************/
@media handheld, only screen and (max-width: 1299px) {
  
  body {
    font-size: 23px;
  }

}



/* BELOW 1100PX WIDTH *********************************************************/
@media handheld, only screen and (max-width: 1099px) {
  
  body {
    /* font-size: 20px; */
    font-size: 21px;
  }
  
  #tagline-panel img {
    /* left: calc(5.4375em - 6vw); */
    bottom: calc(0em - 4vw);
  }

}



/* BELOW 900PX WIDTH **********************************************************/
@media handheld, only screen and (max-width: 899px) {
  
  body {
    font-size: 20px;
  }
  .flex-1-2 {
    /* width: 100%; */
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
  }
  
  /* .flex-content-wrap p,
  .flex-content-wrap ul, */
  p,ul {
    max-width: 38em;
  }

  .end-page-mask {
    height: calc(100vw / 7.5);
  }
  #top-layer-bg-image {
    background-position: -38vw -20vw;
    background-size: 192%;
  }

  #title-panel {
    height: auto;
    padding-bottom: 4vh;
  }
  #title-panel .flex-content-wrap {
    margin-top: 1em;
    padding: 5vw;
  }
  #title-panel h1 img {
    max-width: 24em;
  }
  section[id*="panel"]:not(#title-panel):not(#friends-collaborators-panel):not(#tagline-panel) {
    padding-bottom: 10vh;
  }
  .panel-text.flex-content-wrap {
    margin-top: 0;
  }
  #friends-collaborators-panel {
    padding-bottom: 4vh;
  }
  #friends-collaborators-panel h2 {
    margin-bottom: 1em;
  }
  #second-layer-container {
    padding-top: 10vh;
  }
  #second-layer-container .large-logo-stacked {
    /* max-width: 68%; */
    max-width: 16em;
    margin-bottom: 1em;
  }
  #tagline-panel img {
    left: calc(5.4375em - 6vw);
    bottom: calc(0em - 6vw);
  }  

}



/* BELOW 700PX WIDTH **********************************************************/
@media handheld, only screen and (max-width: 699px) {
  
  body {
    font-size: 19px;
  }

  .panel-title h2 {
    margin-bottom: 0.5em;
    font-size: 2.0em;
  }
  #contact-panel .panel-title h2 {
    /* margin-bottom: calc(3vw + 0.5em); */
  }
  
  #second-layer-container .large-logo-stacked {
    max-width: 56%;
  }
  
  ul.sponsor-logo-list {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    max-width: 25em;
    margin-top: 3.5em;
  }
  ul.sponsor-logo-list li {
    /* margin-bottom: 2.5em; */
    margin-bottom: 7vw;
  }
  .sponsor-logo-list li.sponsor-logo-nkcdc { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .sponsor-logo-list li.sponsor-logo-artphilly { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .sponsor-logo-list li.sponsor-logo-acadnatsci { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -ms-flex-preferred-size: 54%; flex-basis: 54% }
  .sponsor-logo-list li.sponsor-logo-muralarts { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; }
  .sponsor-logo-list li.sponsor-logo-rair { -ms-flex-preferred-size: 18%; flex-basis: 18%; }

  .sponsor-logo-list li.sponsor-logo-acadnatsci img {
    max-width: 88%;
  }

  #tagline-panel .panel-text {
    font-size: 2.0em;
  }

}



/* BELOW 400PX WIDTH **********************************************************/
@media handheld, only screen and (max-width: 399px) {
  
  #top-layer-container {
    padding: 0.75em;
  }
  .end-page-mask {
    width: 100vw;
  }

  .panel-title h2 {
    font-size: 1.875em;
  }

  ul.friends-list {
    margin-left: 12.5%;
  }

  #second-layer-container .large-logo-stacked {
    max-width: 64%;
  }

  #tagline-panel .panel-text {
    padding-left: 1.5vw;
    font-size: 1.75em;
  }
  #tagline-panel img {
    left: calc(5.4375em - 9vw);
    bottom: calc(0em - 11vw);
  }  

}