/* CSS Document */
html {
  -moz-osx-font-smoothing: grayscale;
  -ms-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  -webkit-scrollbar-width: thin;
  -moz-scrollbar-width: thin;
  -ms-scrollbar-width: thin;
  scrollbar-width: thin;
  -webkit-scrollbar-color: var(--color-primary) var(--color-neutral-8);
  -moz-scrollbar-color: var(--color-primary) var(--color-neutral-8);
  -ms-scrollbar-color: var(--color-primary) var(--color-neutral-8);
  scrollbar-color: var(--color-primary) var(--color-neutral-8);
    background-color: white;
}
body {
  font-family: var(--font-family-regular);
  word-wrap: break-word !important;
  font-weight: var(--font-weight-regular);
  overflow: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  margin: 0;
  padding: 0;
background-color: hsla(var(--color-neutral-1), var(--opacity-1));
}
*::selection {
  background: hsla(var(--color-red-base), var(--opacity-1));
  color: white;
}
*::-moz-selection {
  background: hsla(var(--color-red-base), var(--opacity-1));
  color: white;
}

/*---SCROLLER---*/
.scroll-down {
  /*position: relative;
  /*top: 0;
  right: 0;
  bottom: 0;
  left: 0;*/
    display: flex;
    justify-content: center;
  /*margin: auto;
  width :34px;
  height: 50px;*/
}
.mouse {
  width: 6px;
  padding: 5px 10px;
  height: 32px;
  border: 2px solid hsla(var(--color-neutral-7), var(--opacity-1));
  border-radius: 25px;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller {
  width: 6px;
  height:6px;
  border-radius: 50%;
  background-color: hsla(var(--color-neutral-7), var(--opacity-1));
  animation-name: scroll;
  animation-duration: 1.5s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}
.mouse-white {
  width: 6px;
  padding: 5px 10px;
  height: 32px;
  border: 2px solid hsla(var(--color-neutral-0), var(--opacity-05));
  border-radius: 25px;
  opacity: 0.75;
  box-sizing: content-box;
}
.scroller-white {
  width: 6px;
  height:6px;
  border-radius: 50%;
  background-color: hsla(var(--color-neutral-0), var(--opacity-05));
  animation-name: scroll;
  animation-duration: 1.5s;
  animation-timing-function: cubic-bezier(.15,.41,.69,.94);
  animation-iteration-count: infinite;
}
@keyframes scroll {
  0% { opacity: 0; }
  20% { transform: translateY(5); opacity: 1; }
 80% { transform: translateY(20px); opacity: 1;}
  100% { transform: translateY(23px); opacity: 0;}
}
/*---END SCROLLER---*/

a {
  text-decoration: none;
  -webkit-text-decoration-skip: objects;
}
abbr[title] {
  border-bottom: 0;
  text-decoration: underline;
}
:focus {
  outline: 0;
}
input, textarea, select, button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-family: inherit;
  margin: 0;
}
[type="checkbox"], [type="radio"] {
  border: 0;
  padding: 0;
}
[type="checkbox"]:not(.checkbox) {
  -webkit-appearance: checkbox;
  -moz-appearance: checkbox;
  appearance: checkbox;
}
[type="radio"]:not(.radio-button) {
  -webkit-appearance: radio;
  -moz-appearance: radio;
  appearance: radio;
}
.fancybox-slide--iframe .fancybox-content {
    height: 80% !important;
    width: 80% !important;
}
h1 {
    font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-semibold);
    font-size: var(--font-size-h1);
    line-height: var(--font-lineheight-1);
	text-transform: var(--text-uppercase);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
	text-align: center;
}
h1.display {
    font-size: var(--font-size-display);
}

h2 {
    font-family: var(--font-family-narrow);
    font-size: var(--font-size-h2);
    font-weight: var(--font-weight-semibold);
    line-height: var(--font-lineheight-1);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
    text-transform: var(--text-uppercase);
}

h3 {
    font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-bold);
    font-size: var(--font-size-h3);
    line-height: var(--font-lineheight-1);
    text-transform: var(--text-uppercase);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}

h4 {
    font-family: var(--font-family-regular);
    font-size: var(--font-size-h4);
    font-weight: var(--font-weight-bold);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}

h5 {
    font-size: var(--font-size-h5);
    font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-bold);
    line-height: var(--font-lineheight-1);
	color: hsla(var(--color-neutral-7), var(--opacity-1));
}

h6 {
    font-size: var(--font-size-h6);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-bold);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
    /*text-transform: var(--text-capitalize);*/
}
p {
    font-size: var(--font-size-base);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}
p a.txtLink {
	text-decoration: none;
	font-weight: var(--font-weight-bold);
	border-bottom: thin dotted hsla(var(--color-neutral-7), var(--opacity-1));
	color: hsla(var(--color-neutral-7), var(--opacity-1));
}
ul.p {
    font-size: var(--font-size-base);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}
ul.p--no-bullets {
    font-size: var(--font-size-base);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
    list-style-type: none;
}
p.text--leadin {
    font-size: var(--font-size-h6);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}

.note {
    font-size: var(--font-size-s);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
    text-align: left;
    
}
.reference {
    font-size: var(--font-size-xxs);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-0);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
    text-transform: uppercase;
}

h2::after, h1.display-element::after { 
  background-color: hsla(var(--color-red-base), var(--opacity-1));
  content: "";
  display: block;
  height: 2px;
  position: relative;
  width: 80px;
    top: 5px;
    left: 0;
    margin: 0 auto;
}
h2.callout::after { 
  background-color: hsla(var(--color-neutral-0), var(--opacity-1));
  content: "";
  display: block;
  height: 1px;
  position: relative;
  width: 80px;
    top: 5px;
    left: 0;
    margin: 0 auto;
}
h3::after { 
  background-color: hsla(var(--color-red-base), var(--opacity-1));
  content: "";
  display: block;
  height: 2px;
  position: relative;
  width: 20px;
    top: 5px;
    left: 0;
    margin: 0 auto;
}

main {
  margin: 0;
  padding: 0;
  min-height: calc(100vh - 75px);
}

div.title-container {
  grid-column: span 12;
  justify-content: center;
  align-items: center;
    margin: 0 auto;
    padding: 0vh 10vw 0;
	text-align: center;
}
div.subtitle-container {
  grid-column: span 12;
  justify-content: center;
  align-items: center;
    margin: 0 auto;
    padding: 1vh 10vw 0;
	text-align: center;
    order: 10;
}
footer {
  height: 75px;
  background-color: hsla(var(--color-red-base), var(--opacity-1));
}
footer p {
    font-size: var(--font-size-xs);
    color: hsla(var(--color-neutral-0), var(--opacity-1));
}
div.footer-container {
    display: flex;
  justify-content:space-between;
    max-width: 60em;
    margin: 0 auto;
    padding: 1.1em;
}

section.nav {
  background-color: hsla(var(--color-neutral-0), var(--opacity-1));
  position: sticky;
  top: 0;
  vertical-align: bottom;
  height: 70px;
  box-shadow: 0.4px 0px 4px var(--lt-shadow);
  z-index: 100;
}
.nav-container {
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, [] 1fr);
  max-width: 64em;
}
.nav-logo {
  grid-column: 1 / -11;
  z-index: 11;
  grid-row: 1;
  display: flex;
  align-items: center;
    justify-content: center;
}
.nav-logo img {
  width: 80px;
}
nav {
  grid-column: 3 / -1;
  height: 70px;
  padding: auto;
  z-index: 13;
  margin: 0 auto;
  grid-row: 1;
  display: flex;
  align-items: center;
   
}
/*.nav-ask {
  grid-column: 10 / -1;
  z-index: 12;
  display: flex;
  justify-content: center;
  align-items: center;
  grid-row: 1;
}*/
.ask-btn {
    display: inline-block;
    margin-left: calc(1vw + 1vw);
}
.ask-btn-content {
    color: hsla(var(--color-neutral-0), var(--opacity-1)) !important;
} 

/*/--Text Variations--/*/

.text-uppercase {
    text-transform: var(--text-uppercase);
}


/*/--Colors--/*/

.color-neutral-0 {
color: hsla(var(--color-neutral-0), var(--opacity-1));
}

/*/--Sections--/*/

section:nth-child(3) {
  /*margin: 2em auto;*/
}
section:nth-child(even) {
  background-color: hsla(var(--color-neutral-3), var(--opacity-05));;
}
section.callout {
  background-color: hsla(var(--color-red-base), var(--opacity-1));;
}
.main-video-container {
  display: flex;
  justify-content:center;
  align-items:flex-end;
  width: 100%;
  min-height: calc(100vh - 70px);
}
.main-video-txt-container {
    margin: calc(1vw + 5%) calc(2vw + 10%);
}
.main-video-overlay {
	text-transform: none;
	color: hsla(var(--color-neutral-0), var(--opacity-1));
	padding: calc(1vh + 1%) 0 calc(1vh + 2%);
	margin: auto;
	text-align: center;
}
h1.display-neutral, h1.display-element {
color: hsla(var(--color-neutral-7), var(--opacity-1));
    font-size: var(--font-size-display);
}
h1.display {
    font-size: calc(var(--font-size-h1) + 1.5vw);
    text-transform: none;
	color: hsla(var(--color-neutral-0), var(--opacity-1));
	padding: calc(1vh + 1%) 0 calc(1vh + 1%);
	margin: auto;
	text-align: center;
}
h3.subdisplay {
    font-size: calc(var(--font-size-h3) + 0.15vw);
    text-transform: none;
	color: hsla(var(--color-neutral-0), var(--opacity-1));
	padding: calc(1vh - 5%) 0 calc(1vh - 5%);
	margin: auto;
	text-align: center;
    
    font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
    text-transform: none;  
}
h3.subdisplay::after {
  content: none;
}
span.bold-red {
    font-weight: var(--font-weight-bold);
    color: hsla(var(--color-red-base), var(--opacity-1));
}
.bold, span.bold {
    font-weight: var(--font-weight-bold);
}

/*/--Articles--/*/
article {
  margin: 0 auto;
  padding: 0;
  max-width: 64em;
  display: grid;
  grid-template-columns: repeat(12, [] 1fr);
  grid-row-gap: 0;
  grid-column-gap: 10px;
}
article.shop-container {
  margin: 0 auto;
  padding: 0;
    padding-bottom: 2rem;
  max-width: 64em;
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
}
article.schools-logo-container {
  margin: 0 auto;
  padding: 0;
    padding-bottom: 4rem;
  max-width: 64em;
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
}
article.resource-container {
  margin: 0 auto;
  padding: 0;
  max-width: 64em;
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
}
article.downloads-container {
  margin: 0 auto;
  padding: 0;
  max-width: 64em;
    display: flex;
    justify-content: center; 
    flex-wrap: wrap;
}
.shop-card-container {
    max-width:14.5rem;
    margin: 1em 0.5rem;
	background-color: hsla(var(--color-neutral-0), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.logo-container {
    max-width:20rem;
    margin: 1em 0.5rem;
	background-color: transparent;
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.ask-card-container {
    min-width:25rem;
    max-width:25rem;
    min-height: 25rem;
    margin: 1em 0.5rem;
    padding-bottom: 2em;
	background-color: hsla(var(--color-neutral-0), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.video-card-container {
    max-width:14.5rem;
    min-height: 25rem;
    margin: 1em 0.5rem;
	background-color: hsla(var(--color-neutral-0), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.video-card-callout-container {
    max-width:14.5rem;
    min-height: 25rem;
    margin: 1em 0.5rem;
	background-color: hsla(var(--color-red-base), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.video-text-container {
    min-width: 14.5rem;
}
.ask-text-container {
    min-width: 25rem;
    min-width: 100%;
}
.downloads-card-container {
    max-width:14.5rem;
    margin: 1em 0.5rem;
	background-color: hsla(var(--color-neutral-0), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
   display: flex;
  flex-direction: column;
  justify-content: space-between;
    
}
.shop-card {
    margin: 0 1em;
    /*min-height: calc(20vh + 10vw);*/
    
    }
}
.shop-card-data, .downloads-card-data {
}
.shop-card-data, .shop-text-container h6, .shop-text-container p {
	text-align: left;
	margin: 0.5em;
}
.video-card-data, .video-text-container h6, .video-text-container p {
	text-align: left;
	margin: 0.5em;
}
.ask-card-data, .ask-text-container h6 {
	text-align: left;
    margin: 0 1rem;
    padding-top: 0.5rem
}
.ask-card-data, .ask-text-container p {
	text-align: left;
	margin: 0.5em 1em;
}

.video-card-callout-container, .video-card-callout-container h6, .video-card-callout-container p {
    color: hsla(var(--color-neutral-0), var(--opacity-1));
}
.downloads-card-data h6 {
    font-size: var(--font-size-base);
	text-align: center;
	margin: 0.5em;
}
.video-text-container p, .shop-text-container p, .downloads-card-data p {
    font-size: var(--font-size-s);
}
.downloads-card-data, .downloads-text-container h6, .downloads-text-container p {
	text-align: center;
	margin: 0.5em;
}

.shop-card-btn {
    margin: 0.5em auto 1em;
}

article.container {
    padding: 5vh 0;
}
article.schools-container {
    padding: 5vh 0 1vh;
}
article.container-top {
    padding: 5vh 0 0;
}
article.container-middle {
    padding: 0 0 3vh;
}
article.container-center {
    padding: 0 0 0;
}
article.container-bottom {
    padding: 0 0 5vh;
}
article.chart-head-container {
    padding: 5vh 0 0;
}
.article-callout-container {
  background-color: hsla(var(--color-neutral-3), var(--opacity-1));
   grid-column: 2 / 12; 
  justify-content: center;
  align-items: center;
    margin: 0 auto;
    padding: 2vh 10vw;
	text-align: center;
}
section.cont-callout-container {
  background-color: hsla(var(--color-neutral-4), var(--opacity-1));
  justify-content: center;
  align-items: center;
    margin: 0 auto;
    padding: 2vh 10vw;
	text-align: center;
}

/*/--Container Height--/*/
.media-container-height--050 {
   min-height: calc(100vw / 8);
    max-height: 300px;
}
.media-container-height--150 {
   min-height: calc(100vw / 6); 
    max-height: 250px;
}


.media-container-height--200 {
    min-height: 200px;
    height: calc(80vw / 10);
}
.media-container-height--250 {
    min-height: calc(80vw / 6);
}
.video-container-height--250 {
    min-height: calc(80vw / 7);
    height: 14vh;
}
.ask-container-height--250 {
    min-height: 230px;
    height: calc(80vw / 7);
}

.media-container-height--300 {
   --ratio: 768 / 960;
  --container-width: 300px;
    min-height: calc(var(--container-width) * var(--ratio));
}

.media-container-height--350 {
   --ratio: 768 / 960;
  --container-width: 350px;
    min-height: calc(var(--container-width) * var(--ratio));
}

.media-container-height--450 {
   --ratio: 768 / 960;
  --container-width: 450px;
    min-height: calc(var(--container-width) * var(--ratio));
}
.media-container-height--500 {
   --ratio: 768 / 960;
  --container-width: 500px;
    min-height: calc(var(--container-width) * var(--ratio));
}

/*/--Text Containers--/*/
.text-container--2-7 {
   grid-column: 2 / 7; 
}
.text-container--2-9 {
   grid-column: 2 / 9;
    margin-right: 2rem;
}
.text-container--3-11 {
   grid-column: 3 / 11; 
}
.text-container--7-11 {
   grid-column: 7 / 11; 
}
.text-container--4-11 {
	grid-column: 4 / 11;
}
.text-container--5-11 {
	grid-column: 5 / 11;
}
.text-container--5-12 {
	grid-column: 5 / 12;
	margin-left: 2rem;
}

.text-vertical-align {
    display: flex;
    justify-content: center;
	align-items: center;
}
.text-vertical-align-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
	align-items:flex-start;
}
.text-vertical-align-col p {
    margin-bottom: 0;
}

/*/--Video Containers--/*/
.media-container--2-4 {
	grid-column: 2 / 4;
}
.media-container--2-5 {
	grid-column: 2 / 5;
	min-height: 250px;
}
.media-container--2-7 {
  grid-column: 2 / 7;
}

.media-container--3-5 {
	grid-column: 3 / 5;
}
.media-container--3-6 {
	grid-column: 3 / 6;
}
.media-container--3-11 {
	grid-column: 3 / 11;
}
.media-container--2-12 {
	grid-column: 2 / -2;
}
.media-container--all {
	grid-column: span all;
}
.media-container--7-12 {
  grid-column: 7 / 12;
}
.media-container--9-12 {
  grid-column: 9 / 12;
}

/*/--Media Container backgrounds--/*/
.media-container-background {
	/*background-color: hsla(var(--color-neutral-3), var(--opacity-1));*/
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
	height: 100%;
}
.card-container--3 .card-media .resource-container-background {
	background-color: hsla(var(--color-neutral-2), var(--opacity-05));
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    overflow-x:hidden;
}
.shop-card-image-background {
	background-color: hsla(var(--color-neutral-2), var(--opacity-05));
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    overflow-x:hidden;
}
.video-card-image-background {
	/*background-color: hsla(var(--color-neutral-2), var(--opacity-05));
    background-image: url("../images/WYH-H-V-why_1776.jpg");*/
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    /*max-width:14.5rem;*/
    max-height: 20vh;
    overflow:hidden;
  background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.ask-card-image-background {
	background-color: hsla(var(--color-red-base), var(--opacity-1));
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    /*max-width:14.5rem;*/
    overflow:hidden;
  background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% !important;
}
.download-card-image-background {
	/*background-color: hsla(var(--color-neutral-2), var(--opacity-05));
    background-image: url("../images/WYH-H-V-why_1776.jpg");*/
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    /*max-width:14.5rem;*/
    max-height: 20vh;
    overflow:hidden;
  background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.downloads-card-image-background {
	background-color: hsla(var(--color-neutral-2), var(--opacity-05));
	display: flex;
	justify-content: center;
	align-items: center;
    width: 100%;
    overflow-x:hidden;
}
.shop-button-container, .downloads-button-container, .video-button-container {
    /*display: flex;
    justify-content: center;*/
    text-align: center;
    margin: 1em auto;
}
.download-button-container {
    display: flex;
    justify-content: center;
    margin: 0.5em auto;
}

.session-card-container {
    margin: auto;
    width: 70vw;
    height: 70vh;
}

/*/-- HOME PAGE VIDEO BACKGROUNDS --/*/
.media-image-container--home {
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url("../images/WYH-H-V-1_3552.jpg");
}
.media-image-container--why {
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url("../images/WYH-W-V-1_3552.jpg");
}
.media-image-container--learn {
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url("../images/WYH-L-V-1_3552.webp");
}
.media-image-container--teach {
    background: linear-gradient(rgba(0, 0, 0, .3), rgba(0, 0, 0, .3)), url("../images/WYH-T-V-1_3552.jpg");
}
.media-image-container--welcome {
    background-image: url("../images/WYH-H-V-1_3552.jpg");
}
.media-image-container--whyPNE {
    background-image: url("../images/WYH-H-V-why_1776.jpg");
}
.media-image-container--learnPNE {
    background-image: url("../images/WYH-H-V-learn_1776.jpg");
}
.media-image-container--learnPNE-2 {
    background-image: url("../images/WYH-H-V-2-learn_1776.jpg");
}
.media-image-container--teachPNE {
    background-image: url("../images/WYH-H-V-teach_1776.jpg");
}
.media-image-container--teachPNE-2 {
    background-image: url("../images/WYH-H-V-2-teach_1776.jpg");
}
.media-image-container--teachPNE-3 {
    background-image: url("../images/WYH-H-V-3-teach_1776.jpg");
}
.media-image-container--sessions-1 {
    background-image: url("../images/WYH-V-1-sessions_1776.jpg");
}
.media-image-container--sessions-2 {
    background-image: url("../images/WYH-V-2-sessions_1776.jpg");
}
.media-image-container--sessions-3 {
    background-image: url("../images/WYH-V-3-sessions_1776.jpg");
}
.media-image-container--sessions-4 {
    background-image: url("../images/WYH-V-4-sessions_1776.jpg");
}
.media-image-container--sessions-5 {
    background-image: url("../images/WYH-V-5-sessions_1776.jpg");
}
.media-image-container--sessions-6 {
    background-image: url("../images/WYH-V-6-sessions_1776.jpg");
}
.media-image-container--sessions-7 {
    background-image: url("../images/WYH-V-7-sessions_1776.jpg");
}
.media-image-container--sessions-8 {
    background-image: url("../images/WYH-V-8-sessions_1776.jpg");
}
.media-image-container--sessions-9 {
    background-image: url("../images/WYH-V-9-sessions_1776.jpg");
}
.media-image-container--sessions-10 {
    background-image: url("../images/WYH-V-10-sessions_1776.jpg");
}
.media-image-container--sessions-11 {
    background-image: url("../images/WYH-V-11-sessions_1776.jpg");
}
.media-image-container--sessions-12 {
    background-image: url("../images/WYH-V-12-sessions_1776.jpg");
}
.media-image-container--moments-1 {
    background-image: url("../images/WYH-V-1-moments_1776.jpg");
}
.media-image-container--moments-2 {
    background-image: url("../images/WYH-V-2-moments_1776.jpg");
}
.media-image-container--moments-3 {
    background-image: url("../images/WYH-V-3-moments_1776.jpg");
}
.media-image-container--homework-1 {
    background-image: url("../images/WYH-V-1-homework_1776.jpg");
}
.media-image-container--homework-2 {
    background-image: url("../images/WYH-V-2-homework_1776.jpg");
}
.media-image-container--homework-3 {
    background-image: url("../images/WYH-V-3-homework_1776.jpg");
}
.media-image-container--shop-1 {
    background-image: url("../images/WYH-H-V-1-shop_1776.jpg");
}
.media-image-container--shop-2 {
    background-image: url("../images/WYH-H-V-2-shop_1776.jpg");
}
.media-image-container--shop-3 {
    background-image: url("../images/WYH-H-V-3-shop_1776.jpg");
}
.media-image-container--shop-4 {
    background-image: url("../images/WYH-H-V-4-shop_1776.jpg");
}

.media-image-container--ask-1 {
    background-image: url("../images/WYH-ASK-1_1776.png");
}
.media-image-container--ask-2 {
    background-image: url("../images/WYH-ASK-2_1776.png");
}
.media-image-container--ask-3 {
    background-image: url("../images/WYH-ASK-3_1776.png");
}
.media-image-container--ask-4 {
    background-image: url("../images/WYH-ASK-4_1776.png");
}
.media-image-container--ask-5 {
    background-image: url("../images/WYH-ASK-5_1776.png");
}
.media-image-container--ask-6 {
    background-image: url("../images/WYH-ASK-6_1776.png");
}
.media-image-container--ask-7 {
    background-image: url("../images/WYH-ASK-7_1776.png");
}
.media-image-container--ask-8 {
    background-image: url("../images/WYH-ASK-8_1776.png");
}
.media-image-container--ask-9 {
    background-image: url("../images/WYH-ASK-9_1776.png");
}
.media-image-container--ask-10 {
    background-image: url("../images/WYH-ASK-10_1776.png");
}
.media-image-container--ask-11 {
    background-image: url("../images/WYH-ASK-11_1776.png");
}
.media-image-container--ask-12 {
    background-image: url("../images/WYH-ASK-12_1776.png");
}
.media-image-container--ask-13 {
    background-image: url("../images/WYH-ASK-13_1776.png");
}
.media-image-container--ask-14 {
    background-image: url("../images/WYH-ASK-14_1776.png");
}
.media-image-container--ask-15 {
    background-image: url("../images/WYH-ASK-15_1776.png");
}
.media-image-container--ask-16 {
    background-image: url("../images/WYH-ASK-16_1776.png");
}
.media-image-container--ask-17 {
    background-image: url("../images/WYH-ASK-17_1776.png");
}
.media-image-container--ask-18 {
    background-image: url("../images/WYH-ASK-18_1776.png");
}
.media-image-container--ask-19 {
    background-image: url("../images/WYH-ASK-19_1776.png");
}
.media-image-container--ask-20 {
    background-image: url("../images/WYH-ASK-20_1776.png");
}
.media-image-container--ask-1 {
  background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.media-image-container--home,
.media-image-container--why,
.media-image-container--teach,
.media-image-container--learn,
.media-image-container--whyPNE,
.media-image-container--learnPNE,
.media-image-container--learnPNE-2,
.media-image-container--teachPNE,
.media-image-container--teachPNE-2,
.media-image-container--teachPNE-3,
.media-image-container--sessions-1,
.media-image-container--sessions-2,
.media-image-container--sessions-3,
.media-image-container--sessions-4,
.media-image-container--sessions-5,
.media-image-container--sessions-6,
.media-image-container--sessions-7,
.media-image-container--sessions-8,
.media-image-container--sessions-9,
.media-image-container--sessions-10,
.media-image-container--sessions-11,
.media-image-container--sessions-12,
.media-image-container--moments-1,
.media-image-container--moments-2,
.media-image-container--moments-3,
.media-image-container--homework-1,
.media-image-container--homework-2,
.media-image-container--homework-3,
.media-image-container--shop-1,
.media-image-container--shop-2,
.media-image-container--shop-3,
.media-image-container--shop-4 {
  background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.media-image-container--home {
    background-size: 200vh;
}

/* Flipcard container */
.flipcard-overlay {
    display: none;
}

.flipcard-container {
  position: absolute;
  width: 70vw;
  height: 70vh;
  perspective: 500rem;
    display: flex;
  align-items: center;
  justify-content: center;
    margin: auto;
    overflow: hidden;
}

.flipcard-1,
.flipcard-2,
.flipcard-3,
.flipcard-4,
.flipcard-5,
.flipcard-6,
.flipcard-7,
.flipcard-8,
.flipcard-9,
.flipcard-10,
.flipcard-11,
.flipcard-12 {
  position: absolute;
  width: 100%;
  height: 100%;
  /*box-shadow: 0 0 15px rgba(0,0,0,0.1);*/
  transition: transform 1s;
  transform-style: preserve-3d;

}

.flipcard-1.is-flipped-1,
.flipcard-2.is-flipped-2,
.flipcard-3.is-flipped-3,
.flipcard-4.is-flipped-4,
.flipcard-5.is-flipped-5,
.flipcard-6.is-flipped-6,
.flipcard-7.is-flipped-7,
.flipcard-8.is-flipped-8,
.flipcard-9.is-flipped-9,
.flipcard-10.is-flipped-10,
.flipcard-11.is-flipped-11,
.flipcard-12.is-flipped-12 {
  transform: rotateY(180deg);
}

.card-face {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
    display: flex;
  align-items: center;
  justify-content: center;
    margin: auto;
}

.card-face--front {
  position: absolute;
  height: 100%;
  width: 100%;
  background: transparent;
  backface-visibility: hidden;
}

.card-face--back {
  position: absolute;
  height: 100%;
  width: 100%;
  backface-visibility: hidden;
background: transparent;
  transform: rotateY( 180deg );
}


/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  /*border-bottom: 1px dotted hsla(var(--color-neutral-11), var(--opacity-1));*/ 
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 200px;
  background-color: hsla(var(--color-neutral-8), var(--opacity-1));
  color: hsla(var(--color-neutral-0), var(--opacity-1));
  text-align: left;
  padding: 3px 12px 6px 6px;
  border-radius: 6px;
  bottom: 100%;
  left: 50%;
  margin-left: -107.5px; /* Use half of the width (120/2 = 60), to center the tooltip */
   position: absolute;
  z-index: 9999;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}
.tooltip-overlay {
    display: none;
    width: 50%;
    min-width: 300px;
    max-width: 500px;
}
.tooltiptext ul, .tooltip-overlay ul {
    margin-left: -2em;
    font-size: var(--font-size-xxs);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-regular);
    line-height: var(--font-lineheight-2);
}
.tooltip-overlay h6 {
    margin: 0;
    line-height: var(--font-lineheight-1);
}

/*/--Card Containers--/*/
.card-container--4 {
  background-color: hsla(var(--color-neutral-0), var(--opacity-1));
  grid-column: span 4;
  display: flex;
  align-items: center;
  justify-content: center;
}
.card-container--4 div {
  text-align: center;
  padding: 0;
width: 100%;
}
.card-container--3 {
  grid-column: span 3;
  display: flex;
  align-items: center;
  justify-content: center;
    margin-bottom: 2em;
	background-color: hsla(var(--color-neutral-0), var(--opacity-1));
	box-shadow: 0px 0px 1px hsla(var(--color-neutral-10), var(--opacity-01));
    overflow: hidden;
}
.card-container--3 div {
  padding: 0;
}

.image-container {
  background-color: hsla(var(--color-neutral-3), var(--opacity-1));
  display: flex;
  justify-content: center;
  align-items: center;
  height: 20vw;
  max-height: 200px;
    margin: 2em auto 2em;
}

/*/--Chart Containers--/*/

.card-media {
   margin: 0;
    overflow: hidden;
}
.card-data {
   margin: 0 1.25em 1.25em;
   min-height: 33vh; 
}
.card-data-2 {
   margin: 0 1.25em 1.25em;
}
.card-data-dl {
    margin: 0 1.25em 1.25em;
}
.card-text-container {
    margin: 0;
    display: flex;
    justify-content: center;
}
.shop-content-container {
    margin: 0;
}
.card-text-container p {
	text-align: left;
	margin: 16px 8px 24px -8px;
    font-size: var(--font-size-base);
    font-family: var(--font-family-narrow);
    font-weight: var(--font-weight-bold);
    line-height: var(--font-lineheight-2);
    color: hsla(var(--color-neutral-7), var(--opacity-1));
}

.card-img {
    width: 40vw;
    max-width: 40vh;
}
.uni-img {
    width: 11vw;
    max-width: 12vh;
}
.logo-img {
	filter: brightness(0) saturate(100%) invert(22%) sepia(86%) saturate(7380%) hue-rotate(231deg) brightness(99%) contrast(104%);
	-webkit-filter: brightness(0) saturate(100%) invert(22%) sepia(86%) saturate(7380%) hue-rotate(231deg) brightness(99%) contrast(104%);
	max-width: 260px;
}
.res-img {
    width: 40vw;
    max-width: 100vw;  
}
.graphic-img {
    width: 10vh;
}
.book-img {
    width: 20vh;
}
.session-card-img {
    width: 100vw;
    height: auto;
}




main > section:nth-child(2) {
  z-index: 0;
}
#menu {
  text-transform: var(--text-uppercase);
  font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
color: hsla(var(--color-neutral-0), var(--opacity-1));
    padding: 0;
    margin: 0;
}
#menu ul {
    list-style: none;
display: flex;
  flex-direction: column;
  text-align: center;
}

body.why li.why::after,
body.learn li.learn::after,
body.teach li.teach::after,
body.findpt li.findpt::after,
body.resources li.resources::after,
body.shop li.shop::after { 
    content: "";
background-color: hsla(var(--color-red-base), var(--opacity-1));
    /*height: 2px;
  width: 33.333%;
    position: absolute;
    top: 19px;
    left: 33.333%;*/
    height: 2px;
    display: block;
    width: 20px;
    margin: 0 auto;
}

#menu li { 
  position: relative;
    display: inline-block;
  padding: 0 1em;
}

#menu a {
  color: hsla(var(--color-neutral-7), var(--opacity-1));
}

#menu a::after { 
  content: "";
  position: relative;
  top: 2px;
  display: block;
  height: 2px;
    margin: 0 auto;
    width: 0;
}

#menu a:hover::after { 
    content: "";
  position: relative;
  top: 2px;
    background-color: hsla(var(--color-red-base), var(--opacity-1));
    height: 2px;
    width: 20px;
    left: auto;
}

#menu a.none:hover::after { 
    content: "";
    position: relative;
  top: 2px;
    background-color: transparent;
    height: 2px;
    width: 20px;
    left: auto;
}
/* ----MENU EDIT----- */
#menu .teach { 
	margin-right: 4em;
}
#menu .findpt a,
#menu .resources a,
#menu .shop a { 
	font-size: var(--font-size-xs);
	font-weight: var(--font-weight-semibold);
}
/* ----MENU EDIT END----- */

@-moz-document url-prefix() {
  #menu a:hover::after {
  content: "";
  position: relative;
  top: 4px;
    background-color: hsla(var(--color-red-base), var(--opacity-1));
    height: 2px;
    width: 20px;
    left: auto;
    }
}
div.ask-btn a::after, div.ask-btn a:hover::after {
    content: none !important;
}

#menuToggle input {
  display: none;
}
/*.main-video-container {
  /*background-color: hsla(var(--color-neutral-3), var(--opacity-1));
  display: flex;
  grid-column: span 12;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 45vw;
}
/*.main-video-txt-container {
    margin: calc(1vw + 5%) calc(2vw + 20%);
}
.main-video-overlay {
	text-transform: none;
	color: hsla(var(--color-neutral-0), var(--opacity-1));
	/*padding: calc(1vh + 10%) 0 calc(1vh + 10%);
	margin: auto 0;
    display: flex;
    
	text-align: center;
}*/

/*-----------TEST------------*/

/*-----------END TEST------------*/

.prev-stat,
.next-stat,
.prev-stat-2,
.next-stat-2,
.prev-test,
.next-test,
.prev-video,
.next-video,
.prev-video-2,
.next-video-2,
.prev-video-3,
.next-video-3,
.prev-video-4,
.next-video-4,
.prev-book,
.next-book,
.prev-book-2,
.next-book-2,
.prev-photo,
.next-photo,
.prev-page,
.next-page,
.prev-poster,
.next-poster {
background-color: hsla(var(--color-neutral-0), var(--opacity-05));
  width: 44px;
  height: 44px;
  border-radius: 22px;   
}

.ico-48 {
  position: relative;
  width: 48px;
  height: 48px;
margin: 0 auto;
  filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(255%) contrast(100%);  
}
.ico-48-ASK {
  position: relative;
  width: 48px;
  height: 48px;
left: 130px;
    bottom: 43px;
margin: 0 auto;
  filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(255%) contrast(100%);  
}

.ico-12 {
position: relative;
    top: 2px;
  width: 12px;
  height: 12px;
margin: auto;
  /*filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(255%) contrast(100%);*/ 
}
.ico-24 {
position: relative;
  width: 24px;
  height: 24px;
margin: auto;
  /*filter: invert(0%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(255%) contrast(100%);*/ 
}
.ico-prev {
    left: 20%;
    top: 22.5%;
}
.ico-next {
    left: 23.5%;
    top: 22.5%;
}
.ico-mag:before {
content: url('../images/ico-mag-outline-48-2x.png');
  color: hsla(var(--color-neutral-3), var(--opacity-1));
    padding: 0;
    margin-top: -4.5em;
    margin-left: -3.5em;
    transform: scale(.25);
    -moz-transform: scale(.25);
    display: inline-block;
    position: relative;
    top: 40px;
    left: 25px;
}
.form-container {
  background-color: transparent;
  grid-column: span 12;
  display: flex;
  align-items: center;
  justify-content: center;
	padding-bottom: 4em;
}



.accordion-container {
  background-color: transparent;
  grid-column: span 12;
  display: flex;
  align-items: center;
  justify-content: center;
	padding-bottom: 4em;
}
.footer-container {}
.footer-container div {
  grid-column: 2;
}
.btn a, .shop-btn a {
  font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-s);
  line-height: var(--font-lineheight-1);
  border-style: solid;
  border-width: 10px 2.5vw;
  border-radius: 0px;
  color: white;
  display: inline-block;
  text-align: center;
  box-sizing: border-box;
  text-decoration: none;
  background-color: hsla(var(--color-red-base), var(--opacity-1));
  border-color: hsla(var(--color-red-base), var(--opacity-1));
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}

.shop-btn a {
    border-width: 10px 2.5vw;  
}
.btn a:hover, * [lang=x-btn] a:hover, .shop-btn a:hover, * [lang=x-btn] a:hover {
  background-color: hsla(var(--color-red-dk-2), var(--opacity-1)); !important;
  border-color: hsla(var(--color-red-dk-2), var(--opacity-1)); !important;
}
.btn a:active, * [lang=x-btn] a:active, .shop-btn a:active, * [lang=x-btn] a:active {
  background-color: hsla(var(--color-red-dk-3), var(--opacity-1)); !important;
  border-color: hsla(var(--color-red-dk-3), var(--opacity-1)); !important;
}
.callout-btn a {
  font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-s);
  line-height: var(--font-lineheight-1);
  border-style: solid;
  border-width: 1px;
    padding: 10px 2.5vw;
  border-radius: 0px;
  color: white;
  display: inline-block;
  text-align: center;
  box-sizing: border-box;
  text-decoration: none;
  background-color: transparent;
  border-color: hsla(var(--color-neutral-0), var(--opacity-1));
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}
.cont-btn a {
  font-family: var(--font-family-narrow);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-s);
  line-height: var(--font-lineheight-1);
  border-style: solid;
  border-width: 1px;
    padding: 10px 2.5vw;
  border-radius: 0px;
  color: hsla(var(--color-neutral-0), var(--opacity-1));
  display: inline-block;
  text-align: center;
  box-sizing: border-box;
  text-decoration: none;
  background-color: hsla(var(--color-neutral-8), var(--opacity-1));
  border-color: hsla(var(--color-neutral-8), var(--opacity-1));
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}

.cont-btn a:hover, * [lang=x-callout-btn] a:hover {
  background-color: hsla(var(--color-neutral-5), var(--opacity-1));
  border-color: hsla(var(--color-neutral-5), var(--opacity-1)); !important;
}
.cont-btn a:active, * [lang=x-callout-btn] a:active {
  background-color: hsla(var(--color-neutral-10), var(--opacity-1));
  border-color: hsla(var(--color-neutral-10), var(--opacity-1)); !important;
}
.callout-btn a:hover, * [lang=x-callout-btn] a:hover {
  background-color: hsla(var(--color-red-dk-2), var(--opacity-1)); !important;
  border-color: hsla(var(--color-neutral-0), var(--opacity-1)); !important;
}
.callout-btn a:active, * [lang=x-callout-btn] a:active {
  background-color: hsla(var(--color-red-dk-3), var(--opacity-1)); !important;
  border-color: hsla(var(--color-neutral-0), var(--opacity-1)); !important;
}
.btn, .shop-btn, .callout-btn {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.slider .book-slider .book-card .book-card-container, .slider .book-slider-2 .book-card-2 .book-card-container {
    min-height: 42vh;
    display: flex;
    flex-direction: column;
}

.slider-info {
}
div.book-slider-text-container {
}
div.slider-btn-container {
    margin-top: auto;
    align-self: center;
    padding-bottom: 1.25em;
}
div.card-btn-container {
    margin-top: auto;
    align-self:center;
    padding-bottom: 0.5em;
}
/* Form */



/* vertical margins */
.margin-top, .margin-top--md {
    margin-top: var(--space-md);
}
.margin-vert--sm {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-sm);
}

.margin-top--sm {
    margin-top: var(--space-sm);
}


.margin-top--lg {
    margin-top: var(--space-lg);
}

.margin-top--xl {
    margin-top: var(--space-xl);
}

.margin-top--xxl {
    margin-top: var(--space-xxl);
}
.margin-top--xxxl {
    margin-top: var(--space-xxxl);
}

.margin-bottom, .margin-bottom--md {
    margin-bottom: var(--space-md);
}
.margin-bottom--xxxs {
    margin-bottom: var(--space-xxxs);
}
.margin-bottom--xxs {
    margin-bottom: var(--space-xxs);
}
.margin-bottom--sm {
    margin-bottom: var(--space-sm);
}

.margin-bottom--lg {
    margin-bottom: var(--space-lg);
}

.margin-bottom--xl {
    margin-bottom: var(--space-xl);
}

.margin-bottom--xxl {
    margin-bottom: var(--space-xxl);
}
.margin-bottom--xxxl {
    margin-bottom: var(--space-xxxl);
}

.margin-bottom--xxxxl {
    margin-bottom: var(--space-xxxxl);
}
.margin-right--xxl {
    margin-right: var(--space-xxl);
}


.padding-bottom--xxxs {
    padding-bottom: var(--space-xxxs);
}
.padding-bottom--xs {
    padding-bottom: var(--space-xs);
}
.padding-bottom--sm {
    padding-bottom: var(--space-sm);
}
.padding-bottom--md {
    margin-bottom: var(--space-md);
}
.padding-bottom--lg {
    padding-bottom: var(--space-lg);
}
.padding-top--1em {
    padding-top: 1em;
}
.padding-top--2em {
    padding-top: 2em;
}
.padding-top--3em {
    padding-top: 3em;
}

@include breakpoint(md) {
    .margin-top, .margin-top--md {
        margin-top: var(--space-lg);
    }
    
    .margin-top--sm {
        margin-top: var(--space-md);
    }
    
    .margin-top--lg {
        margin-top: var(--space-xl);
    }
    
    .margin-top--xl {
        margin-top: var(--space-xxl);
    }
    
    .margin-top--xxl {
        margin-top: var(--space-xxxl);
    }

    .margin-bottom, .margin-bottom--md {
        margin-bottom: var(--space-lg);
    }
    
    .margin-bottom--sm {
        margin-bottom: var(--space-md);
    }
    
    .margin-bottom--lg {
        margin-bottom: var(--space-xl);
    }
    
    .margin-bottom--xl {
        margin-bottom: var(--space-xxl);
    }
    
    .margin-bottom--xxl {
        margin-bottom: var(--space-xxxl);
    }
}
/* ACCORDIAN */ 

.accordion {
	position: relative;
    margin: 0 auto;
    width: 88%;
	height: auto;
    background: hsla(var(--color-neutral-0), var(--opacity-1));
    border: none;
    box-shadow: 0px 0px 2px rgba(18,18,18,0.1);
    
}      

.accordion-answer {
  display: none;
  padding: 0px 16px 16px;
    margin: 0;
}
.accordion-item {
  margin-bottom: 0px;
    margin-top: 0px;
}
.accordion-question {
  position: relative;
  padding: 12px 12px 4px 16px;
  cursor: pointer;
margin: -2px 0 8px;
}
hr.accordion-separator {
    margin: 4px 0 0px;
    border-bottom-width: 0.01em;
    border-bottom-style: solid;
    border-bottom-color: hsla(var(--color-neutral-11), var(--opacity-03));
    height: 1px;
    border-top: none;
    border-left: none;
    border-right: none;
    
}

.accordion-question::before {
  content: "";
    background-image: url('../images/ico-arrow-dn-24-2x.png');
    background-size: cover;        
  padding: 12px;
  position: absolute;
  top: 40%;
  right: 20px;
  transform: rotate(0deg);
  transition: transform 0.2s linear;
}

.expanded.accordion-question::before {
  content: "";
  background-image: url('../images/ico-arrow-dn-24-2x.png');
    background-size: cover;        
  padding: 12px;
  position: absolute;
  top:40%;
  right: 20px;
  transform: rotate(180deg);
  transition: transform 0.2s linear;
}
h6.accordion {
    margin: 8px 0 8px 0;
	color: hsla(var(--color-neutral-11), var(--opacity-1));
    box-shadow: none;
    background-color: transparent;
    }
p.accordion {
    width: 90%;
    margin: 0 0 0.35em 0;
    line-height: var(--font-lineheight-2);
	color: hsla(var(--color-neutral-11), var(--opacity-1));
    box-shadow: none;
    }




@media screen and (max-width: 960px) {
.card-container--3 {
  grid-column: span 4;
    display: flex;
    justify-content: center;
    align-content: center;
}
.slider .book-slider .book-card .book-card-container, .slider .book-slider-2 .book-card-2 .book-card-container {
    min-height: 37vh;
    display: flex;
    flex-direction: column;
}
.video-container-height--250 {
    min-height: calc(80vw / 8);
    height: 15vw;
}    
}







@media screen and (max-width: 768px) {
   
.text-container--2-7, .text-container--2-9, .text-container--3-11, .text-container--5-12 {
   grid-column: 2 / -2;
    margin: 0;
    order: 2;
}
.order-0 {
        order: 0;
    }
.order-1 {
        order: 1;
    }
.order-2 {
        order: 2;
    }
.text-container--4-11 {
    grid-column: 4 / -2;
    margin: 0;
    padding: 0;
    order: 2;
}
.text-container--5-11 {
    grid-column: 5 / -2;
    margin: 0;
    padding: 0;
    order: 2;
}
.media-container--3-5 {
    grid-column: 3 / 5;
    margin: 0;
    order: 2;
}   
.media-container--3-5 img {
    width: 25vw;
}
.media-container--2-5, .media-container--3-11, .media-container--7-12, .media-container--9-12 {
	grid-column: 2 / -2;
    order: 0;
}
.media-container--2-12 {
	grid-column: 2 / -2;
}
.card-container--4 {
grid-column: 1 / -1;
    margin-bottom: 2em;
} 
/*.media-container-height--250 {

    --ratio: 768 / 960;
  --container-width: 250px;
    min-height: calc(var(--container-width) * var(--ratio));
}*/
.media-container-height--200 {
    min-height: 50vw;
}
.media-container-height--250 {
    min-height: 50vw;
}
.video-container-height--250 {
    min-height: calc(80vw / 4);
}
.media-container-height--500 {
    min-height: calc(100vw / 2);
} 
.card-container--3 {
  grid-column: span 6;
    display: flex;
    justify-content: center;
    align-content: center;
} 
.card-data {
   min-height: 28vh; 
}
.card-img, .uni-img {
    width: 100vw;
} 
.ask-card-container {
    min-width: calc(100vw - 15vw);
    }
.ask-container-height--250 {
    min-height: 360px;
    height: calc(80vw / 5);
}
.video-card-container {
    max-width: calc(100vw - 55vw);
    
    }
.video-card-callout-container {
    max-width: calc(100vw - 55vw);
    
    }
    
.shop-card-container {
    max-width: calc(100vw - 55vw);
    /*min-height: calc(20vh + 10vw);*/
    }
.logo-container {
	max-width: calc(100vw - 55vw);
    /*min-height: calc(20vh + 10vw);*/
    }
.downloads-card-container {
    max-width: calc(100vw - 55vw);
    /*min-height: calc(20vh + 10vw);*/
    }

.btn a {
  border-width: 10px 10vw !important;
    }
    
body.why li.why::after,
body.learn li.learn::after,
body.teach li.teach::after,
body.findpt li.findpt::after,
body.resources li.resources::after,
body.shop li.shop::after { 
    margin: 0;
}  
  .nav-container {
    display: grid;
    grid-template-columns: repeat(3, [] 1fr);
    z-index: 10;
  }
  .nav-logo {
    grid-column: 2;
    z-index: 11;
    grid-row: 1;
    justify-content: center;
  }
  .nav-ask {
    grid-column: 3;
    z-index: 12;
    display: flex;
    justify-content: flex-end;
    grid-row: 1;
    padding-right: 1em;
  }
.ask-btn {
    margin: 1em 0 0 0;
}
  nav {
    display: block;
    grid-column: 1;
    z-index: 13;
    grid-row: 1;
    margin: 0;
  }
  #menuToggle {
    display: block;
    position: relative;
    top: 22px;
    left: 0px;
    z-index: 1;
    -webkit-user-select: none;
    user-select: none;
  }
  #menuToggle a {
    /*text-decoration: none;
    color: var(--light-menu-text);
    transition: color 0.3s ease;*/
  }
  #menuToggle a:hover {
    /*color: var(--dark-menu-text);*/
  }
#menu {
    position: absolute;
    width: 150%;
    margin: 20px 0 0 0;
    padding: 2em 0 0 2em;
    left: 0;
    height: calc(100vh - 100px);
    background-color: var(--light-nav);
    list-style-type: none;
    -webkit-font-smoothing: antialiased;
    /* to stop flickering of text in safari */
    transform-origin: 0% 0%;
    transform: translate(-100%, 0);
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
  }
    
#menu {
    text-transform: var(--text-uppercase);
  font-size: var(--font-size-s);
    font-weight: var(--font-weight-bold);
color: hsla(var(--color-neutral-7), var(--opacity-1));
    }
body.why li.why::after,
body.learn li.learn::after,
body.teach li.teach::after,
body.findPT li.findPT::after,
body.resources li.resources::after, 
body.shop li.shop::after { 
top: 30px;
    height: 2px;
  width: 20px;
    left: 1px;
}
#menu a:hover::after {
  left: 1px;
    top: 3px;
    height: 2px;
  margin-left: 0;
    width: 20px;
}
    
@-moz-document url-prefix() {
  #menu a:hover::after {
  left: 1px;
    top: 5px;
    height: 2px;
  margin-left: 0;
      width: 20px;
    }
}    
    
  #menuToggle input {
    /* Clickable area */
    display: block;
    width: 24px;
    height: 24px;
    position: absolute;
    top: -2px;
    left: 16px;
    cursor: pointer;
    opacity: 0;
    z-index: 2;
    -webkit-touch-callout: none;
  }
  /*
 * Just a quick hamburger
 */
  #menuToggle span {
    display: block;
    width: 24px;
    height: 3px;
    margin-bottom: 6px;
    position: relative;
    background: var(--light-menu-text);
    border-radius: 2px;
    z-index: 1;
    transform-origin: 1px 0px;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0), opacity 0.15s ease;
    margin-left: 1em;
  }
  #menuToggle span:first-child {
    transform-origin: 0% 0%;
  }
  #menuToggle span:nth-last-child(2) {
    transform-origin: 0% 100%;
  }
  /* 
 * Transform all the slices of hamburger
 * into a crossmark.
 */
  #menuToggle input:checked ~ span {
    opacity: 1;
    transform: rotate(45deg) translate(1px, 0px);
  }
  #menuToggle input:checked ~ span:nth-last-child(3) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
  }
  #menuToggle input:checked ~ span:nth-last-child(2) {
    transform: rotate(-45deg) translate(2px, -1px);
  }
  #menu li {
    padding: 10px 0;
    display: block;
  }
  #menu li:first-of-type {
    margin-left: 0;
    padding-left: 0;
  }
  /*
 * And let's slide it in from the left */
  #menuToggle input:checked ~ ul {
    transform: none;
  }
    
 .main-video-txt-container {
     padding-bottom: calc(2vh + 2vw);
     margin-left: calc(1vh + 1vw);;
     margin-right: calc(1vh + 1vw);;
}   
.book-img {
    width: 20vw;
}
}
@media screen and (max-width: 510px) {
    
.shop-card-container {
    max-width: calc(100vw - 2em);
    margin: 1em 0.5rem;	
}
.logo-container {
    max-width: calc(100vw - 2em);
    margin: 1em 0.5rem;	
}
.downloads-card-container {
    max-width: calc(100vw - 2em);
    margin: 1em 0.5rem;	
}
.ask-card-container {
    min-width: 0;
    margin: 1em 0.5rem;
}
.video-card-container {
    min-width: calc(100vw - 2em);
    margin: 1em 0.5rem;
}
.video-card-callout-container {
    min-width: calc(100vw - 2em);
    margin: 1em 0.5rem;
}
.video-container-height--250 {
    min-height: calc(80vw / 1.5);
}
.ask-container-height--250 {
    min-height: 230px;
    height: calc(80vw / 1.5);
}

.shop-card {
    max-width: 100%;
    }
.media-container--2-4 {
    grid-column: 2 / -2;
    margin: 0;
    text-align: center;    
    }
    p {
        text-align: left;
    }
    p.center {
        text-align: center;
    }

.text-container--4-11 {
    grid-column: 2 / -2;
    order: 3;
}

.book-img {
    width: 100vw;
}

.text-container--5-11 {
    grid-column: 2 / -2;
    margin: 0;
    padding: 0;
    order: 3;
}
.media-container--3-5 {
    grid-column: 2 / -2;
    margin: 0;
    order: 2;
    text-align: center;
} 
.media-container--3-5 img {
    width: 50vw;
}
}

@media screen and (max-width: 480px) {
.ask-card-container {
    max-width: 90vw;
    margin: 1em auto;
}    
.ask-container-height--250 {
    min-height: 230px;
    height: calc(80vw / 1.25);
}
.text-container--5-11 p {
    margin-bottom: 0;
}
.media-container--3-5 {
    grid-column: 2 / -2;
    margin: 0;
    order: 2;
    text-align: center;
} 
.ico-48-ASK {
left: 100px;
bottom: 38px;
}

.card-container--3 {
  grid-column: 2 / 12;
    display: flex;
    justify-content: center;
    align-content: center;
    }
}
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 896px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

.ask-container-height--250 {
    min-height: 230px !important;
    height: 80vh !important;
}
}