/*
blue: #00FFFB
red: FF005B 
*/
body {
	/*background-color: #101316;*/
	background: #1e252d url("static/image/overlay.png");
	color: #12161b;
	font-family: 'Roboto', sans-serif;
	font-size: 1.75vh;
	margin: 0;
	padding: 0;
}

.bullet-image {
	color: #36ada7;
	margin-right: 0.5em;
	vertical-align: middle;
}

#container {
	width: 100%;
}

.content-sub img {
	max-width: 100%;
	margin: 2rem 0 0 0;
}

#footer {
	height: 12vh;
	background-color: #000000a3;
	border-top: 1px solid #144341;
}

html {
	margin:0;
	padding:0;
}

h1 {
	color: #3e4242;
	font-family: 'Rubik', sans-serif;
	font-size: 3rem;
	padding: 0 0 0 1.5vh;
	margin: 0.5em 0 0.6em 0;
}

h3 {
	font-family: 'Rubik', sans-serif;
	font-size: 1.5rem;
	margin: 0.5em 0 0 0;
}

h4 {
	display: inline;
	font-family: 'Rubik', sans-serif;
	font-size: 2.5vh;
	text-transform: uppercase;
	margin: .5vh 0 0 .25vw;
	position: absolute;
	letter-spacing: .2vh;
}

h5 {
	color: #bb2359;
	margin: -1em 0 1em 0;
	padding: 0 0 0 1.5vh;
	font-size: 2rem;
}


#impact-area {
	height: 20rem;
	background-color: #000000a3;
	box-shadow: #0000008c 5px 5px 5px;
	/* margin: 0 5% 0 5%; */
	margin: 0;
	padding: 1em;
	color: #FFF;
	display: flex;
	flex-direction: column;
	align-items: center;
	flex-wrap: wrap;
	width: auto;
}

#impact-area ul {
	list-style-type: none;
}

#impact-area li {
	line-height: 3rem;
	font-size: 1.3rem;
	vertical-align: middle;
	white-space: nowrap;
}

.impact-left {
	margin-left: 4%;
}
  
.impact-right {
	margin-right: 4%;
}

#navbar {
	/*background-color: #031615c7;*/
	background-color: #000000e3;
	border-bottom: 1px solid #144341;
	box-shadow: #00000085 0 0.5em 0.5em;
	color: #FFF;
	margin: 0;
	padding: 0;
	position: fixed;
	top: 0;
	/*visibility: hidden;*/
	width: 100%;
	height: 5vh;
	z-index: 10;
}

.navbar-logo {
	margin: .5vh 0 0 0;
}

.navbar-logo img {
	height: 2.8vh;
	margin: 0.5vh 0 0 1vw;
	vertical-align: middle;
}

p {
	color: #222;
	font-size: 1.5rem;
	padding: 1.5vh;
	line-height: 2rem;
	margin: 0;
	font-family: "Source Sans Pro", Helvetica, sans-serif;
}








/*
#impact-area li:before{
	content: 'arrow_right';
	font-family: 'Material Symbols Outlined';
}
*/





.clear {
	clear: both;
}

.content {
	/*background-color: #FFF;*/
	margin: 0 auto;
	width: 100%;
}

.content-box {
	background-color: #f2f4f7;
	/* background: #f2f4f7 url("static/image/overlay.png") 0 50%; */
	border-radius: 1rem;
	width: 100%;
	box-shadow: #00000030 0.5em 0.5em 0.5em;
	margin: 2em 0 2em 0;
}

.content-box ul {
	list-style-type: none;
	list-style-position: outside;
	padding: 0 0 0 6em;
	font-size: 1.5rem;
}

.content-box li {
	line-height: 2.5rem;
	margin: 2.5rem 0 0 0;
}

.content-bullet-image {
	color: #d3004b;
	margin-right: 0.5em;
	margin-left: -1.75em;
	vertical-align: middle;
}

.content-sub {
	overflow: hidden;
	padding: 2vh 1.5vw 2vh 1.5vw;
}

.content-left {
	float: left;
	padding: 0;
	overflow: hidden;
	width: 50%;
}

.content-right {
	float: left;
	padding: 0;
	overflow: hidden;
	width: 50%;
}

.copy {
	background-color: #FFF;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
	/*border-radius: 1vh 1vh 1vh 1vh;*/
	margin: 0 5% 0 5%;
	padding: 5vh 5vw 5vh 5vw;
}

.impact-box {
	height: 100%;
	width: 30%;
	padding: 0 0 0 3vh;
	overflow: hidden;
	/*text-align: center;*/
}

.impact-box-border {
	border-right: 1px solid #144341;
}

.logo {
	color: #FFF;
	/*font-family: 'Courier New', monospace;*/
}

.title {
  margin: 0 0 0 5%;
}

.video-content {
	/* max-width: 1280px; */
	/*width: 100%;*/
	height: 100vh;
	min-width: 100vw;
	/*position: absolute;*/
}

.video-scroll-arrow {
	opacity: .75;
}

.video-scroll-arrow:hover {
	opacity: 1;
	cursor: pointer;
}

.video-scroll-arrow img {
	height: 8vh;
	width: 8vh;
	position: absolute;
	bottom: 10vh;
}

.video-splash {
	background-color: #000;
	border-bottom: 1px solid #144341;
	margin: 0;
	/*position: absolute;*/
	top: 0;
	height: 100vh;
	overflow: hidden;
	min-width: 100%;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.video-splash-content {
	direction: rtl;
	color: #FFF;
	position: absolute;
	right: 5vw;
	top: 50vh;
	width: 100%;
}

.video-splash-title {
	/*font-family: 'Rubik', sans-serif;*/
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 7vw;
	font-weight: 900;
	letter-spacing: .5vh;
	text-transform: uppercase;
}

.video-splash-text {
	color: #a1beb5;
	font-family: 'PT Serif', serif;
	font-size: 2vw;
}

.footer-content {
	color: #a8afb7;
	font-size: .75em;
	margin: 0 5% 0 5%;
	padding: 2em 0 0 0;
	float: left;
}

.footer-content img {
	height: 2.2vh;
}

.footer-content strong {
	color: #FFF;
	font-family: 'Rubik', sans-serif;
	text-transform: uppercase;
	font-size: 2em;
}

.footer-right {
	float: right;
	font-size: 1.2rem;
	margin: 0 5% 0 5%;
	padding: 1em 0 0 0;
}

.footer-right a {
	color: #049292;
}

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

	h3 {
		font-size: 1rem;
	}

	h5 {
		font-size: 1.5rem;
	}

	p {
		font-size: 1.25rem;
	}

	.content-right {
		visibility: hidden;
		overflow: hidden;
		height: 0;
		width: 0;
	}

	.content-left {
		padding: 0;
		overflow: hidden;
		width: 100%;
	}

	.content-box ul {
		font-size: 1.25rem;
	}

	.content-box li {
		font-size: 1.5rem;
		line-height: 1.7rem;
		margin: 2rem 0 0 0;
	}

	.content-sub {
		padding: 1vh 6.5vw 2vh 1vw;
	}

	.impact-box {
		padding: 0;
	}

	#impact-area {
		height: 14rem;
	}

	#impact-area ul {
		padding: 0;
	}

	#impact-area li {
		line-height: 2rem;
		font-size: .8rem;
	}

}

@media only screen and (max-width: 880px) {
	/*.content-right {
		visibility: hidden;
		overflow: hidden;
		height: 0;
		width: 0;
	}

	.content-left {
		padding: 0;
		overflow: hidden;
		width: 100%;
	}
	*/

	.content-box ul {
		padding: 0 0 0 1em;
		font-size: 1.2rem;
		line-height: 1.6rem;
	}

	.content-box li {
		font-size: 1.2rem;
		
	}

	.content-sub {
		padding: 2vh 1.4vw 2vh 12vw;
	}

	h1 {
		font-size: 2rem
	}

	h3 {
		font-size: 1.2rem;
	}

	h5 {
		font-size: 1.3rem;
	}

	p {
		font-size: 1.2rem;
	}

	#impact-area {
		height: auto;
		float: none;
		position: relative;
		align-items: normal;
		overflow: hidden;
	}

	#impact-area ul {
		margin-left: 5vw;
	}

	#impact-area li {
		line-height: 2rem;
		font-size: 1rem;
	}

	.impact-box {
		padding: 0;
		width: 100%;
		border-right: none;
		border-bottom: 1px solid #144341;
	}

	.impact-left {
		margin: 0;
		padding: 0;
		border-right: none;
	}

	.copy {
		margin: 0;
	}

}