@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');
	
html, body {
    max-width: 100%;
    overflow-x: hidden;
}
	body{margin: 0 0 0 0;background:white;font-family: 'Roboto', sans-serif;}
	#logo{height:80px;margin-top:5px;}
	#header{  background-color: white;
		  position: fixed;
		  top: 0;
		  width: 100%;text-align:Center;
		  display: block;
		  transition: top 0.3s;z-index:99;
		border-bottom:2px solid black;z-index:3
		}
	
	#IconFilter{position:fixed;top:10px; left:10px;z-index:99;border:1px solid black;border-radius:5px;background:#194e34;padding:20px;
		-z-index:3
	}
	#iconMenu2{height:20px;}
	#IconFilter2{position:fixed;top:10px; left:10px;z-index:99;border:1px solid black;border-radius:5px;background:#194e34;padding:20px;
		-z-index:3;display:none;
	}

	#DeskTopContent{display:none;}
	#MobileContent{display:block;width:100%;height:100vh;margin-top:0px;}
	#iconMenu{height:20px;}
	.video{width:100%;height:100%;position:absolute;z-index:1}
	
	#section1{display:block;width:100%;background:#194e34;min-height:400px;color:white;text-align:center;padding-top:10px;}
	#section3{display:block;width:100%;background:#194e34;min-height:220px;color:white;text-align:center;padding-top:10px;}
	#section2{display:block;width:100%;background:#3fc683;min-height:400px;color:#194e34;margin-top:-15px;text-align:center;padding-top:10px;}
	#section5{display:block;width:100%;background:#3fc683;min-height:400px;color:#194e34;margin-top:-15px;text-align:center;padding-top:10px;}
	#section4{display:block;width:100%;background:#194e34;min-height:400px;color:white;text-align:center;padding-top:10px;}
	#section4 p {padding:10px;}
	
#section5 p {padding:10px;}
	#section1 p {padding:10px;}

	input.text, input[type="email"],input[type="text"], input[type="button"], input[type="submit"]{-webkit-appearance:none; border-radius:0px;padding:10px;display:block;margin:5px;width:90%;margin-left:auto;margin-right:auto}


.sidenav {
  height: 100%;
  width:100%;
  width: 0;
  position: fixed;
  z-index: 4;
  top:85px;
  left: 0;text-align:Center;
  background-color: #194e34;
  overflow-x: hidden;
  transition: 0.2s;
  padding-top: 60px;
	z-index:10001;
}

.sidenav a {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 12pt;
  color: #818181;
  display: block;
  transition: 0.3s;
}

.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 36px;
  margin-left: 50px;
}

@media screen and (max-height: 450px) {
  .sidenav {padding-top: 16pt;}
  .sidenav a {font-size: 18px;}
}


#videoDiv2 {width:100%; max-width:500px; margin:auto; display:block; position: relative;} /* This has been changed */
#video2{width:100%; height:auto; }
#videoMessage2 { position: absolute; top:10px; left: 0;
display: flex;
flex-direction: column; 
justify-content: center;
align-items: center; 
width: 100%; 
height: 100%;}



.item-1, 
.item-2, 
.item-3 {
	position: absolute;
	display: block;
	bottom: 1%; text-shadow: 2px 2px 2px #000;
	width: 93%;height:95px;
  	font-size: 18pt;
	animation-duration: 20s;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	color:White;
	background-color: rgba(0,0,0,0.5);text-align:center;padding:20px;
}

.item-1{
	animation-name: anim-1;
}

.item-2{
	animation-name: anim-2;
}

.item-3{
	animation-name: anim-3;
}

@keyframes anim-1 {
	0%, 8.3% { left: -100%; opacity: 0; }
  8.3%,25% { left: 0%; opacity: 1; }
  33.33%, 100% { left: 100%; opacity: 0; }
}

@keyframes anim-2 {
	0%, 33.33% { left: -100%; opacity: 0; }
  41.63%, 58.29% { left: 0%; opacity: 1; }
  66.66%, 100% { left: 100%; opacity: 0; }
}

@keyframes anim-3 {
	0%, 66.66% { left: -100%; opacity: 0; }
  74.96%, 91.62% { left: 0%; opacity: 1; }
  100% { left: 100%; opacity: 0; }
}