@font-face {
    font-family: 'arno-pro-light';
    src: url('/includes/fonts/arnopro/ArnoPro-LightDisplay.otf');
}
@font-face {
    font-family: 'acumin-variable-concept';
    src: url('/includes/fonts/acumin-variable-concept/AcuminVariableConcept.ttf') format('truetype');
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

* {
vertical-align: baseline;
font-weight: inherit;
font-family: inherit;
font-style: inherit;
font-size: 100%;
border: 0 none;
outline: 0;
padding: 0;
margin: 0;
}

html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}


html, body {
  position:relative;
  overflow-x:hidden;
}

body {
	overflow-x: hidden;
	height: 100%;
	overflow-x:hidden;
	/*overflow-y: hidden;*/

}

body.normal {
	overflow-y: scroll;
	font-family: 'Montserrat', sans-serif;
}

h1{
	/*font-size: 100 rem;*/
}

.opener{
	height: 100vh;
	display: flex;
  background-color: black;
}

.opener-title{
	width: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
}

.opener-title h1{
	font-family: 'Times New Roman';
	font-size: 6rem;
	text-align: center;
  font-weight: 800;
  color: white;

}

.opener-title h2{
	font-family: 'acumin-variable-concept';
	font-style: italic;
	font-size: 1.5rem;
  width: 50%;
	color: white;
  margin-top: 20px;
  line-height: 150%;
  letter-spacing: .05rem;
}


.opener-photo {
	width: 50%;
	overflow: hidden;
	border-radius: 0 !important;
}


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



a:visited {
	color: purple;
	text-decoration: underline;
}

.published a:link {
	text-decoration: none;
}
.published a:visited {
	color: #6F81A3;
	text-decoration: none;
}

a.fda-link, a.fda-link:visited {
	color: white;
}

a:hover {
	opacity: .5;
}

.mask {
	width: 100%;
	height: 100%;
	background-color: black;
    opacity: .95;
    z-index: 9999;
	position: fixed;
	left: 0;
	top: 0;

}
.loader {
	font-size: 1.5rem;
	color: #0067cc;
	position: absolute;
    top: 35vh;
    left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	/*animation: pulse infinite ease-in-out 1s;
	-webkit-animation: pulse infinite ease-in-out 1s;*/
}

.load_p {
	    color: #0067cc;
    text-align: center;
    margin-top: 20px;
	 font-weight: bold;
	 font-family: 'proxiima-nova', sans-serif;
	 text-shadow: none;
	width: 100%;
}

.fa-spinner {
	font-size: 2rem;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.loader2 {
	color: #6F81A3;
	z-index: 999;
}

.loader2 .fa-spinner {
	font-size: 3rem;
}

.social-wrapper {
	position: relative;
	display: block;
	 margin-top: 20px;
	text-align: center;
}

.menu-container, .menu-container2 {
	z-index: 9999;
}

/*navbar {
    width: 100%;
	height: 50px;
     display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    padding: 0 10px;
    position: fixed;
	top: 0px;
    z-index: 3000;

}

navbar leftalign, navbar rightalign {
    width: auto;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
}
@media only screen and (max-width: 1000px) {
	navbar leftalign {
		justify-content: flex-start;
	}
}
navbar rightalign {
	margin-right: 10px;
	
}*/
navbar {
    width: 100%;
	height: 50px;
    padding: 0 10px;
    position: fixed;
	top: 0px;
    z-index: 3000;
	 display: flex;
	flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
    box-shadow:1px 0px 5px gray;
	padding:10px;
	background-color:white;
}


navbar leftalign, navbar rightalign {
    width: auto;
    height: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-content: center;
    align-items: center;
	font-size: .9rem;
	font-weight: bold;
}

@media only screen and (max-width: 1000px) {
	navbar leftalign {
		justify-content: flex-start;
	}
}
navbar rightalign {
	margin-right: 30px;
	
}

@media only screen and (max-width: 1000px) {
	navbar rightalign {
		margin-right: 10px;
	}
}

.textbranding {
	font-family: 'Montserrat', sans-serif;
	font-weight: bold;
	padding-left: 10px;
	color: #1fb25a;
	text-transform: uppercase;
}

@media only screen and (max-width: 500px) {
	.textbranding {
		font-size: .8rem;
		
	}
}

/*navbar div:hover {
	color: #6F81A3;
	font-weight: bold;
}*/

.active {
	/*background-color: #6F81A3;
	color: white;*/
	color: #6F81A3;
	font-weight: bold;

}

.published {
	cursor: pointer;
}

.fa-caret-down {
	padding-left: 10px;
}

navbar div:last-child {
	border-right: 0 none;
}

.part {
	color: #6F81A3; /* #c2c387;*/
	font-family: 'arno-pro-light';
	text-align: center;
	font-size: 3.5rem;
}

@media only screen and (max-width: 1000px) {
	.part {
		font-size: 2.5rem;
	}
}

.part2 {
	color: #6F81A3; /* #c2c387;*/
	font-family: 'arno-pro-light';
	text-align: center;
	font-size: 2rem;
	margin-top: 20px;
}

@media only screen and (max-width: 1000px) {
	.part2 {
		font-size: 1.5rem;
	}
}
.subpart {
	font-size: 3rem;
}

a.social_link {
 font-size: .8rem;
 color: black;
 opacity: .5;
}

a.social_link:hover {
	opacity: .7;
}

.fa-twitter {
	margin-left: 15px;
}

wa-icon {
     font-size: 1.2rem;
}

.spinner {
	font-size: 2rem;
	width: 100%;
	text-align: center;
}

.screen {
	position: relative;
	height: 100vh;
	width: 100%;
	/*background-color: white;*/
	overflow:hidden;
}


@media only screen and (max-width: 500px) {
  .screen {
    padding-bottom: 0;
  }
}

@media screen and (max-width: 1100px) {
	#ieyoub-screen1 {

	}

}

@media screen and (max-width: 800px) {
	#ieyoub-screen1 {
		height: 100vh;
	}

}

#screen-last {
	/*margin-top: 700vh;*/
	display: inline-block;
	z-index:999;

}

@media screen and (max-width: 1000px) {
	#screen-last {
		padding-top: 20px;
		margin-top: 0;
	}
}

.pg-banner-wrapper {
	position: fixed;
	width: 100%;
	top: 0;
	background-color: #3f3b8e ; /* #025373;*/
	height: 40px;
	z-index:999;
}

#pg-banner {
	display: block;
	margin-left: auto;
	margin-right: auto;
	z-index: 3;
	position: fixed;
	top: 0;
	left: 50%;
	z-index: 9;
	-webkit-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
         transform: translateX(-50%);
}

.description {
	position: absolute;
    top: 28%;
    left: 50%;
	-ms-transform: translateX(-50%) !important;
        transform: translateX(-50%) !important;
		-webkit-transform: translateX(-50%) !important;
    background-color: rgba(0,0,0,.5);
    font-size: 1.5rem;
    font-family: 'Martel', serif;
    color: #f4f0e5;
    width: 40%;
    padding: 20px;
	opacity: 0;
	text-align: center;
}

@media only screen and (max-width: 1400px) {
	.description {
		top: 32%;
		font-size: 1.1rem;
	}
}

@media only screen and (max-width: 1280px) {
	.description {
		top: 25%;
		text-align: center;
		font-size: 1.1rem;
	}
}

@media only screen and (max-width: 1025px) {
	.description {
		top: 25%;
		text-align: center;
		font-size: 1.1rem;
	}
}

@media only screen and (max-width: 1000px) {
	.description {
		top: 25%;
		text-align: center;
		width: 100%;
		/*left: 0;*/
	}
}


@media screen and (max-width: 768px)
       {
  .description {
		top: 50%;
	}
}

@media only screen and (max-width: 700px) {
	.description {


	}
}

@media only screen and (max-width: 500px) {
	.description {
		top: 30%;

	}
}

@media screen and (max-width: 420px) {
  .description {
		top: 50%;
	}
}

@media only screen and (max-width: 415px) {
	.description {
		top: 48%;

	}
}



@media only screen and (max-width: 400px) {
	.description {
		/*top: 30%;*/

	}
}

.pg-post-gazette {
	font-size: 2rem;
    padding-right: 10px;
	color: #1fb25a;
	/*position: fixed;
	background-color: transparent;
	top: 20px;
	left: 50%;
	-webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);
	left: 20px;
	z-index: 99;*/
}

.pg-post-gazette::before {
	margin-top: 5px;
	margin-right: 0;
}

.pg-post-gazette:hover {
	opacity: .4;
}

.logo {
	width: 60px;
	height: auto;
   position: absolute;
   top: 20px;
	left: 50%;
	-webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
          transform: translateX(-50%);

}

.byline {
	font-size: 1rem;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: .05rem;
	font-weight: 600;
	font-family: 'Montserrat';
	color: rgba(0,0,0,.9);
	text-align: center;

}

@media only screen and (max-width: 1000px) {
	.byline {
		margin-bottom: 0px;
	}
}

@media only screen and (max-width:500px) {
	.byline {
		font-size: .9rem;
	}
}

span.desktop{
	display: inline;
}

.bold {
  font-weight: 700;
}

.pub-date {
  font-size: 16px;
	font-family: 'Montserrat';
  font-weight: 400;
	margin-top: 0px;
	text-transform: uppercase;
		letter-spacing: .08rem;
	text-align: center;
	margin-top: 20px;
}

@media only screen and (max-width: 550px) {
	.pub-date {
		
	}
}

.story-container {
	width: 90%;
	margin-left: 10%;
}

@media only screen and (max-width: 1000px) {
	.padding-top-0 {
		padding-top: 0px !important;

	}
}

p {
	font-family: 'Montserrat', sans-serif;
	margin-bottom: 15px;
	font-size: 1.1rem;
	color: black;
	line-height: 150%;
  font-weight: 500;
  overflow-wrap: break-word;
}

@media only screen and (max-width: 500px) {
	p {
		font-size: 1rem;
		line-height: 130%;
	}
}

.smaller {
	font-size: .9rem;
}


.container-float-right {
	width: 50%;
	padding: 20px;
	float: right;
}

.container-float-right img {
	width: 100%;
}

@media only screen and (max-width: 500px) {
	.container-float-right {
		float: none;
		width: 100%;
	}
}


.dropcap {
	float: left;
    font-size: 80px;
    line-height: 60px;
    margin-top: 5px;
    padding-right: 8px;
    padding-bottom: 0px;
    /*color: rgba(0,0,0,.5); c2c387*/
	color: #000000; /*#6F81A3; #c2c387;*/
    font-weight: bold;
}

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px;
	margin: 0px;


}

/*------------CREDITS ------------------------------------------------------*/
.mycredits
{
	width:100%;
	text-align:center;
	padding:5% 10px;
	z-index:98;
	font-family: 'Montserrat' !important;
	background-color: #f1f3ef;

}

	.credits-wrapper
	{
	width: 30%;
    display: block;
    margin: 0 auto;
	}

  @media only screen and (max-width: 1280px) {
    .credits-wrapper {
      width: 100%;
      margin: 0;
    }
  }

	.creditsWrapper p {
		text-align: left;
		color: black;
		font-family: 'proxima-nova';
	}

	.mycredits h2
	{
	margin-top: 30px !important;
	margin-bottom: 20px !important;
	font-weight: 700;
	font-size: 2rem;
	color: black;
	text-shadow: none;

	}

	.mycredits h3
	{
		margin-top: 30px !important;
		font-weight: 700;
		font-size: 1.1rem;
		/*color: #6C6D3A;*/
		color: black;
		 margin-bottom: 5px;
    padding: 0 !important;
	}

	.mycredits .creditBox
	{
	display:inline-block;
	text-align:left;
	width:32%;
	margin-right:1.5%;
	vertical-align:top;
	}


		.mycredits .creditBox:last-child
		{
		margin-right:0;
		}

	.creditLine {
		 font-size: 120%;
		 margin-top: 40px; padding-bottom: 40px;
	}

		@media only screen and (max-width: 1024px) {
			.mycredits .creditBox
			{
			display:inline-block;
			text-align:left;
			width:100%;
			margin-right:0;
			vertical-align:top;
			padding-top:20px;
			}
			.mycredits h2:first-child
				{


				}


		}

		.mycredits .creditImage
		{
		/*border-radius:150px;*/
		border:2px solid #ddd;
		width:120px;
		height: 120px;
		margin-right:3%;
		background:no-repeat top center;
		background-size:cover;
		float:left;
		}

		.mycredits .creditBio
		{
		float:left;
		width:60%;
		line-height:1.4em;
		font-size:120%;
		}
			.mycredits .creditBio h3
			{
				margin-top: 0px;
				font-size: 120%;
				font-weight: bold;
				color:black;
			}

			.mycredits p {
				   font-size: 1rem;
				    font-weight: 400;
				    color: black;
					text-align: center;
					margin-bottom: 5px
			}

	.credits-row {
		width: 100%;
		height: auto;
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-content: center;
		align-items: baseline;
		justify-content: center;
		padding: 0 10px;
		margin-bottom: 30px;
		background-color: transparent;
	}

	img.headshot {

		box-shadow: 5px 5px 10px #888;


	}

	@media only screen and (max-width: 1000px) {
		img.headshot {
			width: 100%;
		}
	}



	.credits-text {
		float: left;

		text-align: left;
	}

	@media only screen and (max-width: 1000px) {
		.credits-text {
			float: none;
			text-align: center;
			margin-bottom: 20px;
		}
	}

	.credits-link, .credits-link:visited {
		text-decoration: none !important;
	}


/* AD STYLES----------------------------------------*/

.ad-wrapper {
	width: 100%; height: auto; position: relative; z-index:9; display:inline-block;background-color: white;
	z-index: 98;
}

.leader-ad {
    width: 728px;
    height: auto;
    display: block;
    margin: 10px auto 0 auto;
		padding-bottom: 10px;
		position:relative;
		z-index:99;
}

.box-ad {
	display: none;

}

.ad-preview {
    text-align: center;
    font-family: Helvetica, Verdana, sans-serif;
    font-size: 11px;
    margin-bottom: 0;
    text-transform: uppercase;
}

	@media only screen and (max-width: 1000px) {

		.leader-ad {
				display: none;
		}

		.box-ad {
				width: 300px;
				height: auto;
				display: block;
				margin: 5px auto 0 auto;
				padding-bottom: 10px;
		}
	}


.height-auto {
	height: auto;

}

.pullquote-container {
	width: 100%;
    padding: 30px;
    padding: 20px;
   /* border-top: 1px solid #2e6d7f; */
	margin-top: 20px;
	margin-bottom: 20px;
}

@media only screen and (max-width: 1024px) {
  .pullquote-container {
    margin-right: -100px;
  }
}

@media only screen and (max-width: 1000px) {
  .pullquote-container {
    margin-right: 0px;
    width: 100%;
  }
}

  .pullquote-head {
    font-family: 'acta-display', serif;
    font-weight: 600;
    font-size: 35px;
    color: #6F81A3;
    margin-bottom: 20px;
	text-align: center;
  }

  .pullquote-credit {
	  font-size: .7rem;
	  text-align: center;
	  margin-top: -5px;
	  font-family: 'proxima-nova';
	  margin-bottom: 10px;
  }

  .pullquote-name {
    font-family: 'proxima-nova';
    font-size: 16px;
    font-weight: 200;
    color: black;
   text-align: center;
  }

   .pullquote-face {
    width: 20%;
	    display: block;
    margin: 0px auto 20px auto;

  }

  @media only screen and (max-width: 1000px) {
	  .pullquote-face {
		  width: 80%;
	  }
  }

  .pullquote-face img {
	  box-shadow: 5px 5px 10px #888;
  }

  video {
    width: 100%;
  }


.video {
  position: relative;
  width: 98vw;
  height: 100vh;
  margin-left: 1%;
  /*object-fit: cover;*/
}

.equal-vid-size {
  width: 100%;
  aspect-ratio: 16 / 9; /* swap in your actual ratio if different */
  object-fit: fit;
  display: block;
}

  .spacer {
    width: 100%;
    height: 40px;
  }

  @media only screen and (max-width: 500px) {
    .spacer {
      height: 20px;
    }
  }

.spacer10 {
	 width: 100%;
    height: 10px;
}

.caption {
  padding-top: 5px;
  font-family: 'Montserrat';
  font-size: 1rem;
  line-height: 150%;
  color: gray;
  text-align: center;

}

  @media only screen and (max-width: 1000px) {
    .caption {
      margin-bottom: 20px;
	  margin-left: 20px;
	  margin-right: 20px;
    }
  }
  
  @media only screen and (max-width: 500px) {
    .caption {
     line-height: 130%;
	 margin-left: 0px;
	  margin-right: 0px;
    }
  }

.first-caption {
	font-size: .9rem;
	text-align: right;
	border-top: 0 none;
	padding-top: 10px;
	line-height: 100%;
	margin-right: 10px;
}

@media only screen and (max-width: 1000px) {
	.first-caption {
		color: gray;
    line-height: 150%;
	}
}

b, strong {
	font-weight: 800;
}

.enlarge {
	cursor: pointer;
}

.popup {
	width: 100%;
	height: 100%;
	padding: 30px;
	background-color: rgba(0,0,0,.9);
	position: fixed;
	top: 0px;
	left: 0;
	display: none;
	z-index: 9999;
}

@media only screen and (max-width: 1000px) {
	.popup {
		top: 0;
	}
}

.popup .img-container {
	position: absolute;
	top: 60px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
}

@media only screen and (max-width: 500px) {
	.popup .img-container {
		top: 20px;
	}
}

.popup img {
	width: 90vw;
	/*height: 80vh;*/
	/*position: absolute;
	top: 60px;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	*/
	/*margin: 60px auto 0 auto;*/
	display: block;
}

@media only screen and (max-width: 1000px) {
	.popup img {
		width: 99%;
		height: auto;
		top: 80px;
	}

}

@media only screen and (max-width: 500px) {
	.popup img {
		width: 90vw;
		height: auto;
		top: 80px;
		max-height: 85vh;
	}

}

.popup img.vertical {
	height: 85vh;
	width: auto;
}

.popup .cutline {
	color: white;
}
.popup .caption {
	    color: white;
    /*position: absolute;
    bottom: 30px;*/
	text-align: center;
    width: 100%;
    border-top: 0 none;
}

.popup .close {
	position: absolute;
	top: 60px;
	right: 40px;
	font-size: 2rem;
	color: gray;
	cursor: pointer;
	z-index: 999;
}
.popup .close:hover {
	opacity: .7;
}

@media only screen and (max-width: 1000px) {
	.popup .close {
		top: 30px;
	}
}

@media only screen and (max-width: 500px) {
	.popup .close {
		top: 20px;
		right: 20px;
	}
}

.make-larger {
	cursor: pointer;
	opacity: .1;
}

.social-stick {
	width: 40px;
	position: fixed;
	top: 50px;
	right: 5px;
	height: 120px;
	z-index: 9999;
}

@media only screen and (max-width: 1000px) {
	.social-stick {
		top: 40%;
	}
}

p.ital {
	font-style: italic;
}

.center {
	display: block;
	margin: 0 auto;
	text-align: center;
}

i {
	font-style: italic;
}

.hamburger {
  cursor: pointer;
  width: 10px;
  height: 10px;
 color: black;
 position: absolute;
    left: 15px;
    top: 10px;
	z-index: 9;
}

.fa-bars {
  cursor: pointer;
  padding-top: 3px;
}

.fa-bars:hover {
  opacity: .5;
}


img.full-width {
	width: 100%;
}

.fa-brands, .fab {
    font-weight: 400;
    font-size: 1.5rem;
}

.timeline {
	height: 80vh;
	float: left;
	overflow: scroll;
}

/*.massiveImage {
	height: 50vh;
	width: 370vw;
	background-position: center;
	background: url('../img/0725-RP-Timeline-V10.jpg') no-repeat;
	background-size: contain !important;
}*/

.massiveImage {
  height: 50vh;
  width: 450vw;
  background-size: contain !important;
  background-position: center;
  background: url('../graphics/RP-WEB-Timeline-0928-v3.png') no-repeat;
}

 @media only screen and (max-width: 1200px) {
	.massiveImage {
	  height: 50vh;
	  width: 650vw;
	  background-size: contain !important;
	  background-position: center;
	  background: url('../graphics/RP-Mobile-Timeline-New.png') no-repeat;
	}
 }

 @media only screen and (max-width: 1000px) {
	 .massiveImage {
		 height: 80vh;
		width: 1200vw;
		 background: url('../graphics/RP-Mobile-Timeline-New.png') no-repeat;
	 }
 }

.title-box {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
    top: 12%;
	display: inline-block;
	z-index: 9;
	width: 60%;
}

 @media only screen and (max-width: 1000px) {
	 .title-box {
		 width: 100%;
		 top: 15%;
	 }
 }

 .title-box-ieyoub {
	 width: 100%;
 }

  .title-box-botched {
	 top: 35%;
 }

 .title-box2 {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
    top: 25%;
	display: inline-block;
	z-index: 9;
	width: 60%;
}

 @media only screen and (max-width: 1000px) {
	 .title-box2 {
		 width: 100%;
		 top: 15%;
	 }
 }

.attribution {
	color: #ddd6d6;
    font-family: 'acumin-variable-concept';
    font-size: 1.5rem;
    font-weight: 400;
    z-index: 9;
    text-align: center;

}

@media only screen and (max-width: 1200px) {
	.attribution {
		font-size: 1.1rem;

	}
}

.attribution-fda {
	color: white;
	text-shadow: 3px 3px 10px rgba(0,0,0,.5);

}

@media only screen and (max-width: 700px) {
	.attribution-fda {
		width: 90%;
		margin-left: 5%;
		font-size: 1.5rem;
	}
}

hr {
	width: 165px;
	height: 1px;
	background-color: #ddd6d6;
	margin-top: 20px;
	margin-bottom: 30px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#btnBegin {
	position: absolute;
	top: 35%;
    left: 50%;
	background-color: transparent;
	font-family: 'acumin-variable-concept';
	color: #fff;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
    font-weight: 400;
    padding: 5px 20px 2px 20px;
    border-radius: 20px;
    box-shadow: 5px 5px 15px rgba(0,0,0,.8);
    font-size: .9rem;
	cursor: pointer;
	border: 2px solid #fff;
	opacity: 0;
	z-index: 9;
	background-color: gray;
}

#btnBegin:hover {
	background-color: black;

}

.fa-volume-xmark, .fa-volume-high {
	font-size: .9rem;
	color: #fff;
}



 @media only screen and (max-width: 1400px) {
	#screen1 {
		height: 95vh;
		/*background: url('../img/top-image.jpg') top center no-repeat;
		background-size: cover;*/
	}

	#screen1 #vid1 {
		position: absolute;
		height: 100%;
		width: auto;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
		overflow: hidden;
	}
 }



.header {
	font-family: 'acumin-variable-concept';
    font-size: 4.5rem;
    font-weight: 700;
    color: white;
    letter-spacing: -.3rem;
    text-transform: uppercase;
    text-align: center;
	margin-bottom: 20px;
}

 @media only screen and (max-width: 1300px) {
	 .header {
		 font-size: 3.8rem;
		 letter-spacing: 0;
	 }
 }

  @media only screen and (max-width: 1000px) {
	 .header {
		 font-size: 3rem;

	 }
 }

 .small-letter-spacing {
	letter-spacing: -.2rem;
 }

 .kicker {
	font-family: 'acumin-variable-concept';
    font-size: 2rem;
    font-weight: 800;
    color: white;
   text-align: center;
	margin-bottom: 0px;
	text-transform: uppercase;
 }

 @media only screen and (max-width: 600px) {
	 .kicker {
		 font-size: 1.5rem;
	 }
 }

 .kicker-fda {
	 letter-spacing: .4rem;
	 font-family: 'acumin-variable-concept';
    font-size: 2rem;
    font-weight: 500;
    color: white;
   text-align: center;
	margin-bottom: 0px;
	text-transform: uppercase;
 }

.subheader {
	font-family: 'arno-pro-light', serif;
	font-size: 3.5rem;
	color: white;
	font-weight: 200;
	text-align: center;
	margin-top: -10px;
}

 @media only screen and (max-width: 1300px) {
	 .subheader {
		 font-size: 2rem;
		 margin-top: 0;
	 }
 }

video {
	width: 100%;
	height: auto;
}

.seating-wrapper, .foam-wrapper {
	position: relative;
	width: 100%;
	display: inline-block;
	background-color: white;
	margin: 30px 0;
}

@media only screen and (max-width: 1000px) {
	.seating-wrapper, .foam-wrapper {
		width: 80%;
		margin-left: 10%;
	}
}

.foam-wrapper {
	overflow: hidden;
}

.seating  {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	opacity: 0;
}

.fa-caret-left {
	position: absolute;
	top: 50%;
	left: -60px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	font-size: 6rem;
	color: #6F81A3;
	cursor: pointer;
	opacity: .2;
	z-index: 2;
}

.fa-caret-right {
	position: absolute;
	top: 50%;
	right: -60px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	font-size: 6rem;
	color: #6F81A3;
	cursor: pointer;
	z-index: 2;
}

@media only screen and (max-width: 1000px) {
	.fa-caret-left {
		left: 0;
		font-size: 4.5rem;
	}
	.fa-caret-right {
		right: 0;
		font-size: 4.5rem;
	}
}

.foam {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	opacity: 0;
}

.seating1, .foam1 {
	position: relative;
	width: 100%;
}

#seating1, #foam0 {
	opacity: 1;
}

@media only screen and (max-width: 1000px) {
	.seating1-mobile, #foam1-mobile {
		opacity: 1;
		position: relative;
	}
}



h4 {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 10px;
	font-family: 'proxima-nova';
}

.red {
  color: red;
}

.story-subhead {
	font-family: 'acumin-variable-concept';
	font-size: 3.5rem;
	color: white;
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	text-transform: uppercase;
	font-weight: 800;
	text-shadow: 5px 5px 8px rgba(0,0,0,.8);
	text-align: center;
}

@media only screen and (max-width: 1000px) {
	.story-subhead {
		font-size: 2.2rem;
	}
}

#apnea1, #apnea2 {
	width: 100%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

#outbreak-combo {
	width: 100%;

}

img.subsection {
	width: 100%;
	height: auto;
}

.thumb {
	width: 250px;
	height: auto;
}


.margin-left-110 {
	margin-left: 110px;
}

video.subsection {
	width: 100% !important;
	height: auto !important;
	max-height: 200% !important;
}

@media only screen and (max-width: 1000px) {
	.screen.screen-subsection {
		height: 100vh;
	}
	video.subsection {
		height: 100% !important;
		width: auto !important;
		max-height: none !important;
		position: absolute;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
	}
}

@media only screen and (max-width: 1000px) {
	.screen-subsection-ieyoub {
		height: auto;
	}
}

ul li {
  margin-left: 20px;
  font-family: 'proxima-nova', sans-serif;

}


h2.h2-did {
	font-size: 1.3rem;
    text-align: center;
    font-family: 'proxima-nova';
    margin-bottom: 10px;

}

h2.h2-did-bottom {
	font-size: 1.8rem;
    text-align: center;
    font-family: 'proxima-nova';
    margin-bottom: 10px;
    margin-top: 40px;
	color:white;
}

.margin-top-neg5 {
	margin-top: -5px;
}

.grayline {
	margin-top: 0px;
    margin-bottom: 30px;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 3vw;
    height: 1px;
    background-color: white;
}

.fa-arrow-pointer {
	margin-left:90%;
}

.section-width-100 {
	width: 100%;
	margin-left: 0;
}

.width-100 {
	width: 100%;
}

.width-90 {
	width: 90%;
	display: block;
	margin: 0 auto;
	clear: both;
}

.width-70 {
	width: 70%;
	margin-left: 15%;
}

.width-60 {
	width: 56vw;
	display: block;
	margin: 0 auto;
	clear: both;
}


@media only screen and (max-width: 800px) {
	.width-70, .width-60, .width-90 {
		width: 100%;
		margin-left: 0;
	}
}

.faded {
	opacity: .05;
}

@media only screen and (max-width: 800px) {
  .faded {
    opacity: 1;
  }
}

.width-80 {
	width: 80%;
	margin-left: 10%;
}

.width-600 {
	width: 600px;
	display: block;
	margin: 0px auto;
}

.story-text {
	display: block;
	width: 50%;
	max-width: 700px;
    margin-left: auto;
	margin-right: auto;
    padding-bottom: 20px;


}

@media only screen and (max-width: 1000px) {
	.story-text {
		width: 90%;
	}
}

.vid-wrapper{
	width: 100%;
}

.vid-wrapper h2 {
	font-size: 1.8rem;
    text-align: center;
    font-family: 'Roboto';

    font-weight: 700;
    color: black;
}

.vid-wrapper p {
	color: gray;
    font-style: italic;
    /*text-align: center;*/
}

.wrapper-80 {
	width: 80%;
	margin-left: 10%;
	margin-bottom: 20px;
}

 @media only screen and (max-width: 1000px) {
	 .wrapper-80 {
		 width: 90%;
		 margin-left: 5%;
	 }
 }

.wrapper-80 img {
	width: 100%;
}

.wrapper-80 h2 {
	font-size: 1.8rem;
    text-align: center;
    font-family: 'proxima-nova';

    font-weight: 700;
    color: black;
}

.wrapper-80 p {
	color: gray;
    font-style: italic;
    /*text-align: center;*/
}

.wrapper-80 p.h4 {
	font-style: normal;
	margin-bottom: 10px;
}

.wrapper-60 {
	width: 60%;
	margin-left: 20%;
	margin-bottom: 20px;
	position: relative;
}

@media only screen and (max-width: 1000px) {
	.wrapper-60 {
		width: 100%;
		margin-left: 0;
	}
}

.wrapper-60 img {
	width: 100%;
}

.blue {
	color: #2e6d7f;
}

.width-50 {
	width: 50%;
    margin: 0px auto 20px auto;
    display: block;
}

.width-40 {
	width: 40%;
    margin-left: 30% !important;
    display: block;
}

@media only screen and (max-width: 1000px) {
	.width-50, .width-40 {
		width: 100%;
		margin-left: 0 !important;
	}
}

.border-gray {
	border: 1px solid lightgray;
}

.wrapper-float-right {
	float: right;
	padding: 20px;
	width: 100%;
	margin-right: -50%;
}

	.wrapper-float-right img {
		width: 100%;
	}

@media only screen and (max-width: 1000px) {
	.wrapper-float-right {
		float: none;
	}
}

.dropdownL {
  position: fixed;
   top: 50px;
   left: 0px;
 /* transform: translateX(-50%) !important;
 -webkit-transform: translateX(-50%) !important;
 -moz-transform: translateX(-50%) !important;
 -ms-transform: translateX(-50%) !important;
 -o-transform: translateX(-50%) !important;*/
  list-style-type: none !important;
  z-index:999;
  margin-left: 0;
  height: auto;
   /* width: 200px;*/
display: none;
}

@media only screen and (max-width: 1100px) {
	.dropdownL {
		/*top: 60px;*/
	}
}

.dropdownLmobile {
  position: absolute;
   top: 39px;
   left: 2.5vw;
  list-style-type: none !important;
  z-index:10;
  margin-left: 0;
  height: auto;
  width: 90%;
  display: none;
  background-color: white;
}

  .dropdownL li, .dropdownLmobile li   {
    padding: 5px 10px 5px 10px;
    color: #6F81A3;
    cursor: pointer;
    font-family: 'Monserrat', sans-serif;
	background-color: white;
  }

  .dropdownLmobile li {
	  color: black;
  }

   .dropdownLmobile li.indent10  {
	   padding-left: 30px;
	   color: #6F81A3;
   }

  .dropdownL li:last-child {
    border-bottom: none 0;
  }
  .dropdownL li:hover {
    opacity: .9;
  }

  .dropdownL li a:link, .dropdownL li a:visited, .dropdownLmobile li a:link, .dropdownLmobile li a:visited {
    cursor: pointer;
    padding-left: 0;
    font-weight: 400;
	text-decoration: none !important;
	/*padding: 0 40px 10px 40px !important;*/

  }

  .dropdownL li a:hover {
	text-decoration: none;
	opacity: .5;
  }

blockquote {
	margin-left: 20px;
}

.margin-bottom-0 {
	margin-bottom: 0;
}


.dateline {
	font-family: 'Monserrat';
    font-size: 1rem;
    letter-spacing: .04rem;
    text-transform: uppercase;
    color: gray;
	font-weight: 700;
    margin-bottom: 20px;
}



.fa-user {
	font-size: 100px;
	color: lightgray;
	display: block !important;
    text-align: center;
}

.cd-handle {

    background: #6F81A3 url(../img/cd-arrows.svg) no-repeat center center;
	border: 1px solid gray;
	margin-left: 0;
	width: 40px;
	height: 40px;
	margin-top: 0;
   transform: translate(-50%, -50%) !important;
	-webkit-transform: translate(-50%, -50%) !important;
	-moz-transform: translate(-50%, -50%) !important;
	-ms-transform: translate(-50%, -50%) !important;
	-o-transform: translate(-50%, -50%) !important;
}

.fixed-top {
	position: fixed;
	width: 100%;
	top: 0;
}

/*--------------------------------------------------------*/
.mobile {
	display:none;
}

.desktop {
  display: block;
}

@media only screen and (max-width: 1100px) {
	.mobile {
		display: block;
	}
	.desktop {
		display: none !important;
	}
}

.section-top-img {
	width: 100%;
}

@media only screen and (max-width: 1000px) {
	#competitive-edge {
		height: 100vh !important;
		background: url(../img/respironics-web.jpg) top center;

	}

	#screenElvis {
		height: 100vh !important;
		background: url(../img/Philipstoren_53895338.jpg) top center;
		background-size: cover;
	}

	#screenCovid {
		height: 100vh !important;

	}

}

hr.dot {
	color: silver;
	height: 10px;
	width: 10px;
	border-radius: 50%;
	display: block;
	margin: 0px auto;

}

.square {
	width: 10px;
	height: 10px;
	background-color: #6F81A3;
	margin-left: auto;
	margin-right: auto;
	display: block;
}

.gray {
	color: darkgray;

}

@media only screen and (max-width: 1000px) {
	.gray {
		 margin-bottom: 10px;
	}
}

.youtube {
  width: 100%;
  height: 38vh;
}

#faces1 {
	background-color: black;
	height: auto;
}

#fda1 {
	background-color: black;
}

.top-0 {
	top: 0;
}

.position-relative {
	position: relative;
}

.margin-bottom-10 {
	margin-bottom: 10px;
}

.lc {
	font-weight: 400;
    font-size: 1.5rem;
	max-width: 98%;
	font-family: 'acumin-variable-concept';
   color: white;
   text-align: center;
	margin-bottom: 0px;

}

.header-faces {
	font-size: 6rem;
	margin-bottom: -20px;
}

@media only screen and (max-width: 850px) {
	.header-faces {
		font-size: 5rem;
		margin-bottom: 0px;
	}
}

@media only screen and (max-width: 550px) {
	.header-faces {
		font-size: 3rem;
		margin-bottom: 0px;
	}
}

@media only screen and (max-width: 420px) {
	.header-faces {
		font-size: 2.5rem;
		margin-bottom: 0px;
	}
}

.header-fda {
	font-size: 6rem;
	margin-bottom: -20px;
	line-height: 100%;
}

@media only screen and (max-width: 850px) {
	.header-fda {
		font-size: 5rem;
		margin-bottom: 0px;

	}
}

@media only screen and (max-width: 550px) {
	.header-fda {
		font-size: 3.5rem;
		margin-bottom: 0px;

	}
}

.margin-top-20 {
	margin-top: 20px;
}

.text-topper {
	opacity: 0;
}

.margin-bottom-neg15 {
	margin-bottom: -15px;
}

.margin-bottom-neg10 {
	margin-bottom: -10px;
}


.float-right {
	float: right;
	margin: 20px 0 20px 20px;
}

.float-right img {
	width: 100%;
}

@media only screen and (max-width: 1000px) {
	.float-right {
		float: none;
		margin: 20px auto;
		width: 100%;
	}
}

p.h3 {
	font-size: 130%;
	font-weight: bold;
	margin-bottom: 10px;
	font-family: 'proxima-nova';
	color: black;
	font-style: normal;
}

.white {
	color: white !important;
}

.padding-top-0 {
	padding-top: 0;
}

.story-subhead-ieyoub {
	top: 40px;
}

@media only screen and (max-width: 1000px) {
	.story-subhead-ieyoub {
		top: 10px;
		font-size: 1.7rem;
		left: 0;
		width: 100%;
		transform: none;
		-webkit-transform: none;
	}
}

.text-shadow {
	text-shadow: 5px 5px 8px rgba(0,0,0,.8);
}

 @media only screen and (max-width: 1000px) {
	.mobile-screen1-vid1 {
		position: absolute;
		height: 100%;
		width: auto;
		top: 0;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-moz-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		-o-transform: translateX(-50%);
		overflow: hidden;
	}
 }

 .ieyoub-top-spacer {
	 height: 52vh;
 }

  @media only screen and (max-width: 1100px) {
	.ieyoub-top-spacer {
		height: 35vh;
	}
  }

  @media only screen and (max-width: 600px) {
	.ieyoub-top-spacer {
		height: 30vh;
	}
  }

  @media only screen and (max-width: 1100px) {
    #horrified {
      height: auto;
    }
  }

.botched-blue {
	color: #4D688E;
}

.gray-bg {
	background-color: #F5F5F5;
}

.padding-20 {
	padding: 20px 20px 0 20px;
}

.color-gray {
	color: gray;
}

.span_1_of_4_one_fourth {
	width: 23.8%;
	position: relative;
	height: 150px;
    overflow: hidden;
}

@media only screen and (max-width: 1100px) {
	.span_1_of_4_one_fourth {
		height: auto;
		width: 100%;
	}

	.add-rule-beneath {
		border-bottom: 1px solid lightgray;
		padding-bottom: 20px;
	}

}



.impact-head {
	font-family: 'proxima-nova', sans-serif;
	font-size: 1rem;
	font-weight: normal;
	text-shadow: 3px 3px 10px rgba(0,0,0,.9);
	margin-left: 10px;
	margin-top: -2px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	width: 90%;
	margin-left: 5%;
	color: white;
	font-weight: bold;
	text-align: center;
}


.mask-small {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,.4);
}

.flex-container {
	display: flex;
	margin-top: 30px;
	align-items: flex-start;
	justify-content: flex-start;
}

 @media only screen and (max-width: 1100px) {
	.flex-container {
		margin-top: 20px;
	}
 }

.left150 img {
	width: 100px;
	height: auto;
	max-width: none;
}

 @media only screen and (max-width: 1100px) {
	.impact-head {
		color: black;
		text-decoration: none;
		text-align: left;
		font-weight: normal;
		text-shadow: none;
		text-shadow: none;
		width: auto;
		margin-left: 10px;
		position: relative;
	}

	a:visited .impact-head {
		color: black;
		text-decoration: none;
	}
 }


.mobile-headline-impact {
	font-family: 'proxima-nova', sans-serif;
	margin-left: 10px;
}

 @media only screen and (max-width: 500px) {
	 .mobile-headline-impact {
		 margin-top: -3px;
	 }

 }

.margin-0 {
	margin: 0;
}

iframe {
	display: block;
	margin: 20px auto;
}

 @media only screen and (max-width: 500px) {
   iframe {
     width: 100%;
   }
 }

#Outbreak-simV2 {
	width: 90%;
}
 img {
	 border-radius: 0 !important;
 }
 
 .grid-container {
	display: grid;
	column-gap: 10px;
	height: fit-content;
}

.two-equal-cols {
	grid-template-columns: 1fr 1fr;
	padding-bottom: 10px;
}


@media only screen and (max-width:800px) {
	.two-equal-cols {
		grid-template-columns: 1fr;
		padding-bottom: 0;
	}
}

.nutgraf {
	width: 50%;
	text-align: center;
	margin-top: 20px;
	margin-bottom: 20px;
	font-family: 'Montserrat', sans-serif;
	font-size: 2rem;
	font-weight: 200;
	line-height: 150%;
	margin-left: 25%;
}

@media only screen and (max-width:500px) {
	.nutgraf {
		font-size: 1.5rem;
		line-height: 120%;
		        width: 100%;
        margin-left: 0;
	}
}

.did-box {
	background-color: #F5f5f5;
	/*border: 2px solid black;*/
	padding: 20px;
	margin-top: 30px;
	margin-left: 0px;
	margin-bottom: 20px;
	margin-right: 20px;
	border-left: 10px solid silver;
}

.margin-left-20 {
	margin-left: 20px;
}

@media only screen and (max-width: 500px) {
	.margin-left-20 {
		margin-left: 0;
	}
}

.did-box p {
	font-size: .9rem;
	color: #282828;
	font-size:.9rem;
	margin-bottom: 0px;
}

.header-holder {
	position: absolute;
  top: 20%;
  left: 8%;
  width: 370px;
}

@media only screen and (max-width:500px) {
	.header-holder {
		width: 340px;
	}
	
	.mobile-center-adjust {
		left: 50%;
		transform: translateX(-50%);
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	top: 40%;
	}
}

h1 {
	font-family: 'Roboto';
	font-size: 5rem;
	
  font-weight: 800;
  color: white;
  text-shadow: 5px 5px 8px rgba(0,0,0,.5);
  margin: 0;
  margin-bottom: 20px;
  line-height: 59%;
  text-transform: uppercase;
  margin-left: -5px;
  /*position: absolute;
  top: 35%;
  left: 20%;*/

}

h1.lost {
	color:#E34234; font-size:9.4rem; margin-left: -8px;
}

@media only screen and (max-width:500px) {
	h1.lost {
		font-size: 8rem;
	}
}

@media only screen and (max-width:400px) {
	h1 {
		font-size: 4rem;
	}
}

h2 {
	font-family: 'Roboto';
	font-size: 2rem;
	 text-shadow: 5px 5px 8px rgba(0,0,0,.5);
  font-weight: 400;
  color: white;
  padding-top: 10px;
  line-height: 110%;
}

h2.videoh2 {
	font-family: 'Roboto';
	font-weight: 700;
    font-size: 22px;
	margin-bottom: 10px;
	color: black;
	text-shadow: none ;
}

p.vidchatter {
	font-family: 'Roboto';
	font-weight: 400;
	font-size: 14px;
	line-height: 17px;
	margin-bottom: 20px;
}

.vidnote, .vidsource {
	font-family: 'Roboto';
	font-weight: 400;
	font-size: 13px;
	margin-bottom: 20px;
}

.vidcredit {
	font-family: 'Roboto';
	font-weight: 400;
	font-size: 11px;
	margin-bottom: 20px;
	color: #88888A;
}

.black {
	color: black !important;
}

.bars {
	color: black;
	cursor: pointer;
	
}

.bars:hover {
	opacity: .7;
}

.kerner {
	letter-spacing: -0.05em;
}

.slide-img {
		padding-left: 10px;
		padding-right: 10px;
		width: 98%;
		
	}

 .angle-left, .angle-right {
	font-size: 3rem;
    color: white; 
    position: absolute;
    top: 45%;
    cursor: pointer;
    z-index: 3;
	font-weight: 300;
 }
 
.angle-left {
	left: 0;
}

  .angle-right {
	 right: 0px;
	
 }
 
 
  @media only screen and (max-width: 1900px) {
	 .angle-left {
		 left: 0px;
	 }

	  .angle-right {
		 right: 20px;
		
	 } 
 }
 
 
 @media only screen and (max-width: 500px) {
	 .angle-left {
		 left: 0px;
		 font-size: 2rem;
	 }

	  .angle-right {
		 right: 0px;
		font-size: 2rem;
	 } 
	
 }

h3 {
	font-size: 2rem;
	font-weight: 800;
	text-align: center;
	font-family: 'Montserrat';
	padding: 30px 20px 20px 20px;
	text-transform: uppercase;
}

.cutline {
	color: gray;
	font-size: .9rem;
	text-align: right;
	width: 100%;
	font-family: 'Montserrat';
	margin-top: 3px;
}

.circle-xmark {
	font-size: 3rem;
}

.spacer-top {
	width: 100%;
	height: 8vh;
}

@media only screen and (max-width: 500px) {
	.spacer-top {
		height: 50px;
	}
}