@charset "UTF-8";
@font-face {
	font-family: "UL-Educons";
	src: url("../fonts/UL-Educons.eot?u5e7y7");
	src: url("../fonts/UL-Educons.eot?u5e7y7#iefix") format("embedded-opentype"), url("../fonts/UL-Educons.ttf?u5e7y7") format("truetype"), url("../fonts/UL-Educons.woff?u5e7y7") format("woff"), url("../fonts/UL-Educons.svg?u5e7y7#UL-Educons") format("svg");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Helvetica 95 Black';
	font-style: normal;
	font-weight: normal;
	src: local('Helvetica 95 Black'), url('../fonts/HelveticaNeue-Black.woff') format('woff');
}

@font-face {
	font-family: 'Helvetica 85 Heavy';
	font-style: normal;
	font-weight: normal;
	src: local('Helvetica 85 Heavy'), url('../fonts/HelveticaNeue-Heavy.woff') format('woff');
}

@font-face {
	font-family: 'Helvetica Medium';
	font-style: normal;
	font-weight: normal;
	src: local('Helvetica Neue Medium'), url('../fonts/HelveticaNeueMedium.woff') format('woff');
}

@font-face {
	font-family: 'Helvetica 55 Roman';
	font-style: normal;
	font-weight: normal;
	src: local('Helvetica 55 Roman'), url('../fonts/HelveticaNeue-Roman.woff') format('woff');
}

@font-face {
	font-family: 'playfair_displayregular';
	src: url('../fonts/playfairdisplay-regular-webfont.woff2') format('woff2'), url('../fonts/playfairdisplay-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'playfair_display_scregular';
	src: url('../fonts/playfairdisplaysc-regular-webfont.woff2') format('woff2'), url('../fonts/playfairdisplaysc-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

/*
        
        GLOBAL BODY
        
      */

p,
h1,
h2,
h3,
h4,
h5,
h6 {
	-webkit-font-smoothing: antialiased;
	line-height: 1.4em;
	letter-spacing: .0125em;
}

.parallax-window {
	min-height: 400px;
	background: transparent;
}

#page-what-is-safety {
	background-color: #2d2d3a;
}

#page-what-is-safety #floating-header {
	/*         top: calc(100vh - 90px); */
}

#hero-bg {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

#header-secondary {
	position: fixed;
}

.fullwidth {
	width: 100%;
}

.float-left {
	float: left;
	width: auto;
}

.float-right {
	float: right;
	width: auto;
}


/*
        
        CLASSES
        
      */

.overlap {
  position: relative;
  z-index: 3;
}

.underlap {
  position: relative;
  z-index: 2;
}

.underlap-2 {
  position: relative;
  z-index: 1;
}

.grid-container.flex {
  align-items: center;
}

/* scroll trigger */

.scroll-trigger {
	/*         position: relative; */
	position: absolute;
	bottom: -50px;
	width: 100%;
	margin-top: 40px;
	padding: 20px 0 0 0;
	text-align: center;
	z-index: 5;
}

#section-0 .scroll-trigger {
	width: 100%;
	position: absolute;
	bottom: -40px;
}

.scroll-trigger a {
	display: block;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.6em;
	font-weight: 500;
	letter-spacing: 0.1em;
}

.scroll-trigger a svg {
	display: block;
	margin: 10px auto -30px auto;
	width: auto;
	height: 120px;
	fill: #fff;
}


/* extra padding */

.pad-top {
	padding-top: 100px;
}

.pad-bottom {
	padding-bottom: 100px;
}


/*
        
        SECTIONS
        
      */


/* hero */

.bg-splash {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.bgscene {
	z-index: 0;
}

.bgman {
	z-index: 1000;
}

.bgclouds1 {
	z-index: 1500;
}

.bgclouds2 {
	z-index: 500;
}

#what-is-hero .section-header .share-me {
	width: calc(14.2857142857%);
	position: absolute;
	right: calc(7.1428571429% + 0px);
}

#what-is-hero {
	background-color: transparent;
	height: 100vh;
	padding: 0;
	overflow: visible;
}

#what-is-hero .section-container {
	padding: 25vh 0;
	text-align: center;
	height: 100%;
}

#what-is-hero .section-container img {
	width: 100%;
	height: auto;
}

#what-is-hero .section-header .section-text {
	width: 100%;
	float: left;
	margin-left: 0px;
}

#what-is-hero h1 {
	font-family: 'Helvetica 85 Heavy', sans-serif;
	font-size: 300px;
	letter-spacing: -.01em;
	font-weight: normal;
	color: #e8e9f1;
	background: rgb(232, 233, 241);
	background: repeating-linear-gradient(to top, rgba(162, 177, 179, 0.79) 0%, rgba(255, 252, 252, 1) 66.39%, rgba(255, 255, 255, 1) 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	z-index: 500;
	position: absolute;
	left: 0;
	right: 0;
	top: 30%;
}

#what-is-hero h4 {
	font-family: 'playfair_displayregular', serif;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: .15em;
	color: #00aaa5;
	z-index: 2000;
	position: absolute;
	left: 0;
	right: 0;
	top: 27%;
}

#what-is-hero .scroll-trigger {
	position: absolute;
	bottom: 0;
	width: 100%;
}

#what-is-hero .scroll-trigger a {
	color: #fff;
}

#what-is-hero .scroll-trigger a svg {
	fill: #b30026;
}


/* layout */

main .page-section {
	padding: 0;
	background-color: #fff;
}

main .section-container.reversed {
	background-color: #000;
	color: #fff;
}

#section-0 .section-content {
	/*       main .section-content { */
	position: relative;
	padding: 50vh 0;
	z-index: 5;
}

#section-intro .section-content,
#section-outro .section-content {
	padding: 10vh 0;
}


/* Section images */

#section-intro {
	background: url("../img/what-is-safety/bg-intro.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-1-1 {
	background: url("../img/what-is-safety/bg-1-firesafety.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-2-1 {
	background: url("../img/what-is-safety/bg-2-environmental.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-3-1 {
	background: url("../img/what-is-safety/bg-3-roadsafety.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-4-1 {
	background: url("../img/what-is-safety/bg-4-watersafety.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-5-1 {
	background: url("../img/what-is-safety/bg-5-resilience.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-6-1 {
	background: url("../img/what-is-safety/bg-6-humanhealth.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-7-1 {
	background: url("../img/what-is-safety/bg-7-batterysafety.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-8-1 {
	background: url("../img/what-is-safety/bg-8-cybersecurity.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

#section-outro {
	background: url("../img/what-is-safety/bg-outro.jpg") center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}

a.outro-btn {
	border-radius: 10px 10px 10px 10px;
	-moz-border-radius: 10px 10px 10px 10px;
	-webkit-border-radius: 10px 10px 10px 10px;
	border: 3px solid #f3002e;
	display: inline-block;
	padding: 0 10px;
	color: #f3002e;
}


/* SCROLL PROGRESS */

#progress {
	position: absolute;
	bottom: 0px;
	right: 0px;
	width: 200px;
	transform: none;
	background-color: transparent;
	color: #fff;
	font-size: 1.2em;
	z-index: 2000;
}

#progress ul {
	padding: 0;
}

#progress li {}

#progress li a {
	display: block;
	color: #fff;
	text-align: right;
	transform-origin: 100% 50%;
	transition: 0.25s;
}

#progress li .text {
	width: auto;
	padding: 5px 10px;
	color: #b4f2ff;
	font-size: .9em;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	transform: scale(0.92);
	transform-origin: 100% 100%;
	transition: 0.5s;
	opacity: 0.25;
}

#progress li .text:hover {
	color: #b30026;
	opacity: 1;
}

#progress li .well {
	display: block;
	position: relative;
	float: right;
	margin: 6px 0 0 0;
	height: 3px;
	background: rgba(180, 242, 255, 0.8);
	transition: 0.5s;
}

#progress li .bar {
	content: '';
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	opacity: 0;
	background-color: #64849a;
	transition: opacity 0.25s;
}

#progress li.active a {
	color: #fff;
	text-align: left;
	transition: 0.5s;
}

#progress li.active .text {
	transform: scale(1);
	opacity: 1;
	color: #fff;
}

#progress li.active .well {
	background-color: #b30026;
}

#progress li.active .bar {
	opacity: 1;
}


/* CALLOUT */

main .section-callout {
	position: relative;
	z-index: 5;
}

main .section-callout .callout-content {
	align-items: flex-end;
	padding: 40px 0;
	background-color: rgba(255, 255, 255, 0.6);
}


/* STATS */

main .section-stats {
	position: relative;
	z-index: 5;
}

.section-stats .stat {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 20px;
	background-color: #fff;
	box-shadow: 0 30px 50px rgba(1, 40, 138, 0.25);
	font-family: 'playfair_displayregular', serif;
	text-align: center;
	color: #01288a;
}

.section-stats .stat h5 {
	width: 25%;
	margin: 0;
	font-family: 'playfair_displayregular', serif;
}

.section-stats .stat h6 {
	font-size: 0.9em;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: #5281b7;
}

.section-stats .stat p {
	margin: 10px 0;
}

.section-stats .stat-parameter {
	width: 35%;
}

.section-stats .stat-detail {
	width: 35%;
}

.section-stats .stat-expand {
	width: 5%;
	font-size: 2em;
	color: #9ea5ba;
}


/* content */

.section-intro h4 {
	font-size: 6em;
	font-family: 'playfair_displayregular', serif;
}

.section-number {
	padding-top: 60px;
	text-align: center;
}

.section-number h4 {
	font-size: 8em;
	font-family: 'playfair_displayregular', serif;
	/*         font-style: italic; */
}

.section-heading {
	text-align: center;
}

.section-heading h2 {
	font-family: 'playfair_displayregular', serif;
}

.section-title h2 {
	font-family: 'Helvetica 85 Heavy', serif;
	font-size: 12em;
	padding: 20vh 0;
}

.helv {
	font-family: 'Helvetica 85 Heavy', sans-serif;
}

.helvmed {
	font-family: 'Helvetica Medium', sans-serif;
}

.bold {
	font-family: 'Helvetica 85 Heavy', sans-serif;
}

.absolute {
	position: absolute!important;
}

.absolute.bottom {
	bottom: 0px;
}

.left {
	text-align: left;
}

.right {
	text-align: right;
}

.right {
	text-align: center;
}


/* INTRO COLORS */

.red {
	color: #c50041;
}

.white {
	color: #fff;
}

.taupe {
	color: #b3afae;
}

.skin {
	color: #dcbdb3;
}

.tv {
	color: #decbb0;
}

.peach {
	color: #fdd2c7;
}

.purple {
	color: #a75c8f;
}


/* THEME COLORS */

.fire-red {
	color: #ff6363;
}

.environment-blue {
	color: #5b9cff;
}

.road-peach {
	color: #fb9682;
}

.water-aqua {
	color: #00cdbc;
}

.resilient-rain {
	color: #00add8;
}

.human-flesh {
	color: #ff7757;
}

.battery-lime {
	color: #bcc131;
}

.cyber-pink {
	color: #ba2b52;
}


/* BLEND MODES */

.blended.screen {
	mix-blend-mode: screen;
}

.blended.multiply {
	mix-blend-mode: multiply;
}

.blended.dodge {
	mix-blend-mode: color-dodge;
}


/* UL's role link */

.ul-role {
	position: absolute;
	padding: 20px 0;
	bottom: 15%;
	z-index: 1000;
}

.ul-role:before {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	width: 0;
	height: 0;
	border: 50px solid transparent;
	transform: translateY(-50%);
	z-index: 1;
}

.ul-role a {
	position: relative;
	text-transform: uppercase;
	font-size: 1.5em;
	font-weight: 500;
	letter-spacing: 0.1em;
	z-index: 2;
}

.ul-role .icon {
	font-size: 1.6em;
	vertical-align: middle;
}

.ul-role.ul-role-left {
	text-align: right;
}

.ul-role.ul-role-left:before {
	left: 0;
	border-left-color: #e0001a;
}

.ul-role.ul-role-left .icon {
	margin: 0 20px 0 0;
}

.ul-role.ul-role-right:before {
	right: 0;
	border-right-color: #e0001a;
}

.ul-role.ul-role-right .icon {
	margin: 0 0 0 20px;
}


/* images */

.image {
	position: absolute;
	float: none;
	z-index: 10;
}

.image img.fullwidth {
	width: 100%;
}

.image.underlap {
	z-index: 4;
}

.image.align-top {
	top: 0%;
}

.image.align-bottom {
	top: 100%;
}

.image.align-middle {
	top: 50%;
}

.image.align-right {
	right: 0;
}


/*
        
        INDIVIDUAL SECTION STYLING
        
      */

#section-0 {
	background: #272732;
	background: -moz-linear-gradient(top, rgba(39,39,50,0) 0, rgba(39,39,50,1) 200px);
  background: -webkit-linear-gradient(top, rgba(39,39,50,0) 0, rgba(39,39,50,1) 200px);
  background: linear-gradient(to bottom, rgba(39,39,50,0) 0, rgba(39,39,50,1) 200px);
	/*
        background: -moz-linear-gradient(top, rgba(46,55,61,0) 2%, rgba(46,55,61,0.5) 8%, rgba(46,55,61,1) 13%, rgba(46,55,61,1) 100%);
        background: -webkit-linear-gradient(top, rgba(46,55,61,0) 2%,rgba(46,55,61,0.5) 8%,rgba(46,55,61,1) 13%,rgba(46,55,61,1) 100%);
        background: linear-gradient(to bottom, rgba(46,55,61,0) 2%,rgba(46,55,61,0.5) 8%,rgba(46,55,61,1) 13%,rgba(46,55,61,1) 100%);
*/
	padding-top: 200px;
}

.fullsize-only {
  display: block;
}

.mobile-only {
  display: none;
}

#section-0-1.section-container {
/* 	min-height: 450vh; */
	background: transparent;
}

#section-0-1 .section-content {
  padding-bottom: 10vh;
}

#section-0-1 .subsection {
  padding: 20vh 0;
}

#section-0-1-1 {
  clear: both;
}

#soak-up {
	z-index: 100;
}

#section-0-2.section-container {
	background: transparent;
}

#section-0-2 h2 {
	padding-top: 100px;
}

#section-0-2 .section-content {
  padding: 0;
}

#section-0-2-2 {
  padding-bottom: 20vh;
}

#section-0-3.section-container {
  position: relative;
  padding-bottom: 50vh;
	background: transparent;
	z-index: 1;
}

#section-0-3 h4 {
	font-family: 'Helvetica Neue Medium' sans-serif;
	line-height: 1.5em;
}

#section-0-3 .section-content {
  padding: 0;
}

#img-0-3-1 img {
  transform: translateY(-10%);
}

#img-0-3-2 img {
  transform: translateY(75%);
}

#section-0-4 {
  position: relative;
  z-index: 2;
}

#section-0-4 .section-content {
  padding: 25vh 0;
	background: url("../img/what-is-safety/bg-kidsplay.jpg") center center no-repeat;
	background-size: cover;
}

#section-0-4 h1 {
	font-family: 'Helvetica Neue Medium' sans-serif;
	line-height: 1.5em;
	background: rgba(210, 224, 176, 1);
	background: -moz-linear-gradient(-45deg, rgba(210, 224, 176, 1) 0%, rgba(166, 128, 170, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(210, 224, 176, 1)), color-stop(100%, rgba(166, 128, 170, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(210, 224, 176, 1) 0%, rgba(166, 128, 170, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(210, 224, 176, 1) 0%, rgba(166, 128, 170, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(210, 224, 176, 1) 0%, rgba(166, 128, 170, 1) 100%);
	background: linear-gradient(135deg, rgba(210, 224, 176, 1) 0%, rgba(166, 128, 170, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2e0b0', endColorstr='#a680aa', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-0 .section-number,
#section-1 h2.red {
	color: #c50041;
}

#section-0 .safe {
	font-family: 'Helvetica 95 Black';
	font-size: 32em;
	letter-spacing: -.075em;
	display: block;
	line-height: -.85em;
	margin: 0;
	text-transform: uppercase;
	background: url("../img/what-is-safety/safe_bg.jpg") center center;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

#section-0 .this-has {
	font-family: 'Helvetica 95 Black';
	font-size: 20em;
	letter-spacing: -0.075em;
	display: block;
	line-height: 0.85em;
	margin: 0;
	text-transform: uppercase;
}

#section-0 .this-has span {
  display: block;
	background: url("../img/what-is-safety/thishaschanged_bg.jpg") center center;
	background-attachment: fixed;
	background-size: cover;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

#section-0 .changed {
	font-family: 'Helvetica 95 Black';
	font-size: 20em;
	letter-spacing: -0.075em;
	display: block;
	line-height: 0.85em;
	margin: 0;
	text-transform: uppercase;
	background: url("../img/what-is-safety/thishaschanged_bg.jpg") center center;
	background-attachment: fixed;
	background-size: cover;
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
}

#section-0 .scroll-trigger a {
	color: #fea8b0;
}

#section-0 .scroll-trigger a svg {
	fill: #fea8b0;
}

#section-intro .scroll-trigger a {
	color: #a75c8f;
}

#section-intro .scroll-trigger a svg {
	fill: #a75c8f;
}

#section-1 .scroll-trigger a {
	color: #18408c;
}

#section-1 .scroll-trigger a svg {
	fill: #18408c;
}

#section-2 .scroll-trigger a {
	color: #844d43;
}

#section-2 .scroll-trigger a svg {
	fill: #844d43;
}

#section-3 .scroll-trigger a {
	color: #18408c;
}

#section-3 .scroll-trigger a svg {
	fill: #18408c;
}

#section-4 .scroll-trigger a {
	color: #18408c;
}

#section-4 .scroll-trigger a svg {
	fill: #18408c;
}

#section-5 .scroll-trigger a {
	color: #b64848;
}

#section-5 .scroll-trigger a svg {
	fill: #b64848;
}

#section-6 .scroll-trigger a {
	color: #18408c;
}

#section-6 .scroll-trigger a svg {
	fill: #18408c;
}

#section-7 .scroll-trigger a {
	color: #18408c;
}

#section-7 .scroll-trigger a svg {
	fill: #18408c;
}

#section-8 .scroll-trigger a {
	color: #18408c;
}

#section-8 .scroll-trigger a svg {
	fill: #18408c;
}

#section-intro h2,
#section-outro h2 {
	font-family: 'playfair_displayregular';
	padding: 200px 0;
}

#section-1-1.section-container {
	height: 100%;
}

#section-1-2.section-container {
	height: 300vh;
	background: rgba(203, 192, 189, 1);
	background: -moz-linear-gradient(top, rgba(203, 192, 189, 1) 0%, rgba(241, 234, 232, 1) 25%, rgba(241, 234, 232, 1) 48%, rgba(241, 234, 232, 1) 76%, rgba(203, 192, 189, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(203, 192, 189, 1)), color-stop(25%, rgba(241, 234, 232, 1)), color-stop(48%, rgba(241, 234, 232, 1)), color-stop(76%, rgba(241, 234, 232, 1)), color-stop(100%, rgba(203, 192, 189, 1)));
	background: -webkit-linear-gradient(top, rgba(203, 192, 189, 1) 0%, rgba(241, 234, 232, 1) 25%, rgba(241, 234, 232, 1) 48%, rgba(241, 234, 232, 1) 76%, rgba(203, 192, 189, 1) 100%);
	background: -o-linear-gradient(top, rgba(203, 192, 189, 1) 0%, rgba(241, 234, 232, 1) 25%, rgba(241, 234, 232, 1) 48%, rgba(241, 234, 232, 1) 76%, rgba(203, 192, 189, 1) 100%);
	background: -ms-linear-gradient(top, rgba(203, 192, 189, 1) 0%, rgba(241, 234, 232, 1) 25%, rgba(241, 234, 232, 1) 48%, rgba(241, 234, 232, 1) 76%, rgba(203, 192, 189, 1) 100%);
}

#section-2-2.section-container {
	height: 300vh;
	background: rgba(223, 236, 250, 1);
	background: -moz-linear-gradient(top, rgba(223, 236, 250, 1) 0%, rgba(223, 236, 250, 1) 25%, rgba(223, 236, 250, 1) 48%, rgba(235, 219, 218, 1) 76%, rgba(235, 203, 201, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(223, 236, 250, 1)), color-stop(25%, rgba(223, 236, 250, 1)), color-stop(48%, rgba(223, 236, 250, 1)), color-stop(76%, rgba(235, 219, 218, 1)), color-stop(100%, rgba(235, 203, 201, 1)));
	background: -webkit-linear-gradient(top, rgba(223, 236, 250, 1) 0%, rgba(223, 236, 250, 1) 25%, rgba(223, 236, 250, 1) 48%, rgba(235, 219, 218, 1) 76%, rgba(235, 203, 201, 1) 100%);
	background: -o-linear-gradient(top, rgba(223, 236, 250, 1) 0%, rgba(223, 236, 250, 1) 25%, rgba(223, 236, 250, 1) 48%, rgba(235, 219, 218, 1) 76%, rgba(235, 203, 201, 1) 100%);
	background: -ms-linear-gradient(top, rgba(223, 236, 250, 1) 0%, rgba(223, 236, 250, 1) 25%, rgba(223, 236, 250, 1) 48%, rgba(235, 219, 218, 1) 76%, rgba(235, 203, 201, 1) 100%);
}

#section-3-2.section-container {
	height: 300vh;
	background: rgba(242, 218, 217, 1);
	background: -moz-linear-gradient(top, rgba(242, 218, 217, 1) 0%, rgba(242, 218, 217, 1) 72%, rgba(147, 173, 200, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(242, 218, 217, 1)), color-stop(72%, rgba(242, 218, 217, 1)), color-stop(100%, rgba(147, 173, 200, 1)));
	background: -webkit-linear-gradient(top, rgba(242, 218, 217, 1) 0%, rgba(242, 218, 217, 1) 72%, rgba(147, 173, 200, 1) 100%);
	background: -o-linear-gradient(top, rgba(242, 218, 217, 1) 0%, rgba(242, 218, 217, 1) 72%, rgba(147, 173, 200, 1) 100%);
	background: -ms-linear-gradient(top, rgba(242, 218, 217, 1) 0%, rgba(242, 218, 217, 1) 72%, rgba(147, 173, 200, 1) 100%);
	background: linear-gradient(to bottom, rgba(242, 218, 217, 1) 0%, rgba(242, 218, 217, 1) 72%, rgba(147, 173, 200, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2dad9', endColorstr='#93adc8', GradientType=0);
}

#section-4-2.section-container {
	height: 300vh;
	background: rgba(204, 240, 251, 1);
	background: -moz-linear-gradient(top, rgba(204, 240, 251, 1) 0%, rgba(204, 240, 251, 1) 68%, rgba(216, 185, 197, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(204, 240, 251, 1)), color-stop(68%, rgba(204, 240, 251, 1)), color-stop(100%, rgba(216, 185, 197, 1)));
	background: -webkit-linear-gradient(top, rgba(204, 240, 251, 1) 0%, rgba(204, 240, 251, 1) 68%, rgba(216, 185, 197, 1) 100%);
	background: -o-linear-gradient(top, rgba(204, 240, 251, 1) 0%, rgba(204, 240, 251, 1) 68%, rgba(216, 185, 197, 1) 100%);
	background: -ms-linear-gradient(top, rgba(204, 240, 251, 1) 0%, rgba(204, 240, 251, 1) 68%, rgba(216, 185, 197, 1) 100%);
	background: linear-gradient(to bottom, rgba(204, 240, 251, 1) 0%, rgba(204, 240, 251, 1) 68%, rgba(216, 185, 197, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccf0fb', endColorstr='#d8b9c5', GradientType=0);
}

#section-5-2.section-container {
	height: 340vh;
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(164, 178, 200, 1)), color-stop(25%, rgba(164, 178, 200, 1)), color-stop(40%, rgba(84, 107, 152, 1)), color-stop(80%, rgba(216, 220, 225, 1)), color-stop(100%, rgba(216, 220, 225, 1)));
	background: -webkit-linear-gradient(top, rgba(164, 178, 200, 1) 0%, rgba(164, 178, 200, 1) 25%, rgba(84, 107, 152, 1) 40%, rgba(216, 220, 225, 1) 80%, rgba(216, 220, 225, 1) 100%);
	background: -o-linear-gradient(top, rgba(164, 178, 200, 1) 0%, rgba(164, 178, 200, 1) 25%, rgba(84, 107, 152, 1) 40%, rgba(216, 220, 225, 1) 80%, rgba(216, 220, 225, 1) 100%);
	background: -ms-linear-gradient(top, rgba(164, 178, 200, 1) 0%, rgba(164, 178, 200, 1) 25%, rgba(84, 107, 152, 1) 40%, rgba(216, 220, 225, 1) 80%, rgba(216, 220, 225, 1) 100%);
	background: linear-gradient(to bottom, rgba(164, 178, 200, 1) 0%, rgba(164, 178, 200, 1) 25%, rgba(84, 107, 152, 1) 40%, rgba(216, 220, 225, 1) 80%, rgba(216, 220, 225, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a4b2c8', endColorstr='#d8dce1', GradientType=0);
}

#section-6-2.section-container {
	height: 300vh;
	background: rgba(178, 185, 196, 1);
	background: -moz-linear-gradient(top, rgba(178, 185, 196, 1) 0%, rgba(245, 197, 199, 1) 25%, rgba(245, 197, 199, 1) 48%, rgba(230, 226, 252, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(178, 185, 196, 1)), color-stop(25%, rgba(245, 197, 199, 1)), color-stop(48%, rgba(245, 197, 199, 1)), color-stop(100%, rgba(230, 226, 252, 1)));
	background: -webkit-linear-gradient(top, rgba(178, 185, 196, 1) 0%, rgba(245, 197, 199, 1) 25%, rgba(245, 197, 199, 1) 48%, rgba(230, 226, 252, 1) 100%);
	background: -o-linear-gradient(top, rgba(178, 185, 196, 1) 0%, rgba(245, 197, 199, 1) 25%, rgba(245, 197, 199, 1) 48%, rgba(230, 226, 252, 1) 100%);
	background: -ms-linear-gradient(top, rgba(178, 185, 196, 1) 0%, rgba(245, 197, 199, 1) 25%, rgba(245, 197, 199, 1) 48%, rgba(230, 226, 252, 1) 100%);
	background: linear-gradient(to bottom, rgba(178, 185, 196, 1) 0%, rgba(245, 197, 199, 1) 25%, rgba(245, 197, 199, 1) 48%, rgba(230, 226, 252, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b2b9c4', endColorstr='#e6e2fc', GradientType=0);
}

#section-7-2.section-container {
	height: 300vh;
	background: rgba(241, 232, 209, 1);
	background: -moz-linear-gradient(top, rgba(241, 232, 209, 1) 0%, rgba(199, 187, 211, 1) 30%, rgba(183, 169, 198, 1) 41%, rgba(240, 246, 254, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(241, 232, 209, 1)), color-stop(30%, rgba(199, 187, 211, 1)), color-stop(41%, rgba(183, 169, 198, 1)), color-stop(100%, rgba(240, 246, 254, 1)));
	background: -webkit-linear-gradient(top, rgba(241, 232, 209, 1) 0%, rgba(199, 187, 211, 1) 30%, rgba(183, 169, 198, 1) 41%, rgba(240, 246, 254, 1) 100%);
	background: -o-linear-gradient(top, rgba(241, 232, 209, 1) 0%, rgba(199, 187, 211, 1) 30%, rgba(183, 169, 198, 1) 41%, rgba(240, 246, 254, 1) 100%);
	background: -ms-linear-gradient(top, rgba(241, 232, 209, 1) 0%, rgba(199, 187, 211, 1) 30%, rgba(183, 169, 198, 1) 41%, rgba(240, 246, 254, 1) 100%);
	background: linear-gradient(to bottom, rgba(241, 232, 209, 1) 0%, rgba(199, 187, 211, 1) 30%, rgba(183, 169, 198, 1) 41%, rgba(240, 246, 254, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e8d1', endColorstr='#f0f6fe', GradientType=0);
}

#section-8-2.section-container {
	height: 300vh;
	background: rgba(254, 239, 226, 1);
	background: -moz-linear-gradient(top, rgba(254, 239, 226, 1) 0%, rgba(191, 231, 236, 1) 30%, rgba(211, 232, 235, 1) 41%, rgba(255, 255, 255, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(254, 239, 226, 1)), color-stop(30%, rgba(191, 231, 236, 1)), color-stop(41%, rgba(211, 232, 235, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
	background: -webkit-linear-gradient(top, rgba(254, 239, 226, 1) 0%, rgba(191, 231, 236, 1) 30%, rgba(211, 232, 235, 1) 41%, rgba(255, 255, 255, 1) 100%);
	background: -o-linear-gradient(top, rgba(254, 239, 226, 1) 0%, rgba(191, 231, 236, 1) 30%, rgba(211, 232, 235, 1) 41%, rgba(255, 255, 255, 1) 100%);
	background: -ms-linear-gradient(top, rgba(254, 239, 226, 1) 0%, rgba(191, 231, 236, 1) 30%, rgba(211, 232, 235, 1) 41%, rgba(255, 255, 255, 1) 100%);
	background: linear-gradient(to bottom, rgba(254, 239, 226, 1) 0%, rgba(191, 231, 236, 1) 30%, rgba(211, 232, 235, 1) 41%, rgba(255, 255, 255, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feefe2', endColorstr='#ffffff', GradientType=0);
}

#section-1-2 h2,
#section-2-2 h2,
#section-3-2 h2,
#section-4-2 h2,
#section-5-2 h2,
#section-6-2 h2,
#section-7-2 h2,
#section-8-2 h2 {
	font-family: 'Helvetica 85 Heavy', serif;
	font-size: 4.5em;
	line-height: 1.2em;
	padding: 20vh 0;
}

#section-1-2 h2 {
	background: rgba(180, 120, 67, 1);
	background: -moz-linear-gradient(-45deg, rgba(180, 120, 67, 1) 0%, rgba(99, 87, 81, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(180, 120, 67, 1)), color-stop(100%, rgba(99, 87, 81, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(180, 120, 67, 1) 0%, rgba(99, 87, 81, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(180, 120, 67, 1) 0%, rgba(99, 87, 81, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(180, 120, 67, 1) 0%, rgba(99, 87, 81, 1) 100%);
	background: linear-gradient(135deg, rgba(180, 120, 67, 1) 0%, rgba(99, 87, 81, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b47843', endColorstr='#635751', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-2-2 h2 {
	background: rgba(84, 142, 230, 1);
	background: -moz-linear-gradient(-45deg, rgba(84, 142, 230, 1) 0%, rgba(88, 50, 102, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(84, 142, 230, 1)), color-stop(100%, rgba(88, 50, 102, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(84, 142, 230, 1) 0%, rgba(88, 50, 102, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(84, 142, 230, 1) 0%, rgba(88, 50, 102, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(84, 142, 230, 1) 0%, rgba(88, 50, 102, 1) 100%);
	background: linear-gradient(135deg, rgba(84, 142, 230, 1) 0%, rgba(88, 50, 102, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#548ee6', endColorstr='#583266', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-3-2 h2 {
	background: rgba(132, 77, 66, 1);
	background: -moz-linear-gradient(top, rgba(132, 77, 66, 1) 0%, rgba(134, 134, 198, 1) 73%, rgba(134, 134, 198, 1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(132, 77, 66, 1)), color-stop(73%, rgba(134, 134, 198, 1)), color-stop(100%, rgba(134, 134, 198, 1)));
	background: -webkit-linear-gradient(top, rgba(132, 77, 66, 1) 0%, rgba(134, 134, 198, 1) 73%, rgba(134, 134, 198, 1) 100%);
	background: -o-linear-gradient(top, rgba(132, 77, 66, 1) 0%, rgba(134, 134, 198, 1) 73%, rgba(134, 134, 198, 1) 100%);
	background: -ms-linear-gradient(top, rgba(132, 77, 66, 1) 0%, rgba(134, 134, 198, 1) 73%, rgba(134, 134, 198, 1) 100%);
	background: linear-gradient(to bottom, rgba(132, 77, 66, 1) 0%, rgba(134, 134, 198, 1) 73%, rgba(134, 134, 198, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#844d42', endColorstr='#8686c6', GradientType=0);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-4-2 h2 {
	background: rgba(177, 205, 39, 1);
	background: -moz-linear-gradient(-45deg, rgba(177, 205, 39, 1) 0%, rgba(147, 180, 57, 1) 19%, rgba(47, 96, 117, 1) 82%, rgba(47, 96, 117, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(177, 205, 39, 1)), color-stop(19%, rgba(147, 180, 57, 1)), color-stop(82%, rgba(47, 96, 117, 1)), color-stop(100%, rgba(47, 96, 117, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(177, 205, 39, 1) 0%, rgba(147, 180, 57, 1) 19%, rgba(47, 96, 117, 1) 82%, rgba(47, 96, 117, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(177, 205, 39, 1) 0%, rgba(147, 180, 57, 1) 19%, rgba(47, 96, 117, 1) 82%, rgba(47, 96, 117, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(177, 205, 39, 1) 0%, rgba(147, 180, 57, 1) 19%, rgba(47, 96, 117, 1) 82%, rgba(47, 96, 117, 1) 100%);
	background: linear-gradient(135deg, rgba(177, 205, 39, 1) 0%, rgba(147, 180, 57, 1) 19%, rgba(47, 96, 117, 1) 82%, rgba(47, 96, 117, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b1cd27', endColorstr='#2f6075', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-5-2 h2 {
	background: rgba(4, 120, 159, 1);
	background: -moz-linear-gradient(-45deg, rgba(4, 120, 159, 1) 0%, rgba(11, 105, 147, 1) 19%, rgba(33, 54, 106, 1) 82%, rgba(33, 54, 106, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(4, 120, 159, 1)), color-stop(19%, rgba(11, 105, 147, 1)), color-stop(82%, rgba(33, 54, 106, 1)), color-stop(100%, rgba(33, 54, 106, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(4, 120, 159, 1) 0%, rgba(11, 105, 147, 1) 19%, rgba(33, 54, 106, 1) 82%, rgba(33, 54, 106, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(4, 120, 159, 1) 0%, rgba(11, 105, 147, 1) 19%, rgba(33, 54, 106, 1) 82%, rgba(33, 54, 106, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(4, 120, 159, 1) 0%, rgba(11, 105, 147, 1) 19%, rgba(33, 54, 106, 1) 82%, rgba(33, 54, 106, 1) 100%);
	background: linear-gradient(135deg, rgba(4, 120, 159, 1) 0%, rgba(11, 105, 147, 1) 19%, rgba(33, 54, 106, 1) 82%, rgba(33, 54, 106, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#04789f', endColorstr='#21366a', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-6-2 h2 {
	background: rgba(209, 123, 96, 1);
	background: -moz-linear-gradient(-45deg, rgba(209, 123, 96, 1) 0%, rgba(209, 123, 96, 1) 31%, rgba(71, 40, 169, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(209, 123, 96, 1)), color-stop(31%, rgba(209, 123, 96, 1)), color-stop(100%, rgba(71, 40, 169, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(209, 123, 96, 1) 0%, rgba(209, 123, 96, 1) 31%, rgba(71, 40, 169, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(209, 123, 96, 1) 0%, rgba(209, 123, 96, 1) 31%, rgba(71, 40, 169, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(209, 123, 96, 1) 0%, rgba(209, 123, 96, 1) 31%, rgba(71, 40, 169, 1) 100%);
	background: linear-gradient(135deg, rgba(209, 123, 96, 1) 0%, rgba(209, 123, 96, 1) 31%, rgba(71, 40, 169, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d17b60', endColorstr='#4728a9', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-7-2 h2 {
	background: rgba(241, 231, 103, 1);
	background: -moz-linear-gradient(-45deg, rgba(241, 231, 103, 1) 0%, rgba(22, 52, 91, 1) 75%, rgba(22, 52, 91, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(241, 231, 103, 1)), color-stop(75%, rgba(22, 52, 91, 1)), color-stop(100%, rgba(22, 52, 91, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(241, 231, 103, 1) 0%, rgba(22, 52, 91, 1) 75%, rgba(22, 52, 91, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(241, 231, 103, 1) 0%, rgba(22, 52, 91, 1) 75%, rgba(22, 52, 91, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(241, 231, 103, 1) 0%, rgba(22, 52, 91, 1) 75%, rgba(22, 52, 91, 1) 100%);
	background: linear-gradient(135deg, rgba(241, 231, 103, 1) 0%, rgba(22, 52, 91, 1) 75%, rgba(22, 52, 91, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#16345b', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#section-8-2 h2 {
	background: rgba(201, 107, 124, 1);
	background: -moz-linear-gradient(-45deg, rgba(201, 107, 124, 1) 0%, rgba(201, 107, 124, 1) 11%, rgba(247, 138, 79, 1) 93%, rgba(247, 138, 79, 1) 100%);
	background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(201, 107, 124, 1)), color-stop(11%, rgba(201, 107, 124, 1)), color-stop(93%, rgba(247, 138, 79, 1)), color-stop(100%, rgba(247, 138, 79, 1)));
	background: -webkit-linear-gradient(-45deg, rgba(201, 107, 124, 1) 0%, rgba(201, 107, 124, 1) 11%, rgba(247, 138, 79, 1) 93%, rgba(247, 138, 79, 1) 100%);
	background: -o-linear-gradient(-45deg, rgba(201, 107, 124, 1) 0%, rgba(201, 107, 124, 1) 11%, rgba(247, 138, 79, 1) 93%, rgba(247, 138, 79, 1) 100%);
	background: -ms-linear-gradient(-45deg, rgba(201, 107, 124, 1) 0%, rgba(201, 107, 124, 1) 11%, rgba(247, 138, 79, 1) 93%, rgba(247, 138, 79, 1) 100%);
	background: linear-gradient(135deg, rgba(201, 107, 124, 1) 0%, rgba(201, 107, 124, 1) 11%, rgba(247, 138, 79, 1) 93%, rgba(247, 138, 79, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c96b7c', endColorstr='#f78a4f', GradientType=1);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.infographic {
	-webkit-box-shadow: 0px 10px 45px 0px rgba(0, 0, 0, 0.33);
	-moz-box-shadow: 0px 10px 45px 0px rgba(0, 0, 0, 0.33);
	box-shadow: 0px 10px 45px 0px rgba(0, 0, 0, 0.33);
	color: #fff;
	background: url("../img/what-is-safety/bg-infographic-safety.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-2 .infographic {
	color: #dde8f8;
	background: url("../img/what-is-safety/bg-infographic-environmental.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-3 .infographic {
	color: #f5e3db;
	background: url("../img/what-is-safety/bg-infographic-roadsafety.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-4 .infographic {
	color: #4dfff7;
	background: url("../img/what-is-safety/bg-infographic-watersafety.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-5 .infographic {
	color: #85deff;
	background: url("../img/what-is-safety/bg-infographic-resilience.jpg") center center;
	background-size: cover;
	position: relative;
	z-index: 20;
}

#section-6 .infographic {
	color: #dbb5ba;
	background: url("../img/what-is-safety/bg-infographic-humanhealth.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-7 .infographic {
	color: #d7dbb5;
	background: url("../img/what-is-safety/bg-infographic-batterysafety.jpg") center center;
	background-size: cover;
	position: relative;
}

#section-8 .infographic {
	color: #4dfff7;
	background: url("../img/what-is-safety/bg-infographic-cybersecurity.jpg") center center;
	background-size: cover;
	position: relative;
}

.infographic .stat-parameter {
	font-family: 'Helvetica Medium', sans-serif;
	font-size: 1em;
	text-transform: uppercase;
	letter-spacing: .125em;
	margin: 30px 0 0;
	opacity: .75;
}

.infographic .stat-text {
	font-family: 'playfair_displayregular', serif;
	font-size: 3em;
	margin: 20px 0 0;
}

.infographic .stat-data {
	font-family: 'Helvetica 85 Heavy', sans-serif;
	font-size: 13em;
	line-height: .8em;
	margin: 20px 0;
	position: relative;
	width: 100%;
}

.infographic .stat-source {
	font-family: 'Helvetica Medium', sans-serif;
	font-size: 1.3em;
	letter-spacing: .05em;
	margin: 30px 0;
	opacity: .75;
	float: right;
}

.solution {
	padding: 20vh 0;
}

.solution h5 {
	font-family: 'Helvetica 55 Roman', serif;
	color: #321d1e;
	font-size: 2.25em;
	line-height: 1.5em;
	position: relative;
	top: 40vh;
}

.solution h5 span.bold {
	font-family: 'Helvetica Medium', serif;
}

#section-4 .infographic .stat-data {
	color: #d6fb39;
}

#section-4 .solution h5 {
	color: #412e4a;
}

#section-5 .solution h5 {
	top: 30vh;
	color: #fff;
}

#section-6 .solution h5 {
	color: #530003;
}


/* VIDEO THIS HAS CHANGED */


/* Default to hide the video on all devices */

#video {
	display: none
}


/* Default to display the image on all devices */

#videosubstitute {
	display: block;
	width: auto;
	height: 100%;
}

#fullScreenDiv {
	width: 100%;
	min-height: 100%;
	overflow: hidden;
	/* Set the height to match that of the viewport. */
	height: 100vh;
	padding: 0!important;
	margin: 0!important;
	background-color: transparent;
	position: static;
}

#videoDiv {
	overflow: hidden;
	height: 800px;
}

#video {
	width: 100vw;
	height: auto;
	/*     object-fit: cover; */
	left: 0px;
	top: 0px;
	z-index: 1;
}

@media (min-aspect-ratio: 16/9) {
	#video {
		height: 150%;
		top: -100%;
	}
	#videosubstitute {
		display: block;
		width: 100%;
		height: auto;
	}
}

@media (max-aspect-ratio: 16/9) {
	#video {
		width: 150%;
		left: -100%;
	}
	#videosubstitute {
		display: block;
		width: auto;
		height: 100%;
	}
}


/*if there is 992  pixels or more, then display the video but hide the image*/

@media only screen and (min-width: 992px) {
	#video {
		display: block;
	}
	#videosubstitute {
		display: none
	}
}


/* The container for our text and stuff */

#messageBox {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}