html, body {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
}
.intro {
	height: 100%;
	width: 100%;
	margin: auto;
	background: url(../landimage/memorials_remembrance_day2.png);
	display: table;
	top: 0;
	background-size: cover;
}
. intro .inner {
	display: table-cell;
	vertical-align: middle;
	width: 100%;
	max-width: none;
}
.content {
	max-width:1000px;
	margin: 0 auto;
	text-align: center;
	padding-bottom: 28;
}
.content h1{
	font-family: sans-serif;
	color: #000;
	text-shadow: 0px 0px 300px #000;
	font-size: 500%;

}
.btn {
	border-radius: 19px;
	font-family: sans-serif;
	background-color: #fff;
	color: #036A81;
	font-size: 235%;
	padding: 40px 20px 120px 20px;
	border: solid #036A81 3px;
	text-transform: uppercase;
	text-decoration: none;
}
.btn:hover {
	color: #000;
	border: solid #ddffff 3px;
	background-color: #036A81;
}

p {
	font-size: 160%;
	line-height: 210%;
	text-align: justify;
	margin: 3%;
	font-family: sans-serif;
}

/* MEDIA QUERIES */
@media screen and (max-width: 900px){
	.content {
		padding-bottom: 30%;
	}
	
	.content h1 {
		font-size: 450%;
	}
	.btn {
		font-size: 130%;
		padding: 9px 17px;
	}
	p {
		font-size: 100%;
		line-height: 160%;
		
	}
}	



@media screen and (max-width: 768px){
	.content {
		padding-bottom: 40%;
	}
	.content h1 {
		font-size: 300%;
	}
	.btn {
		font-size: 110%;
		padding: 7px 15px;
	}
	p {
		font-size: 120%;
		line-height: 100%;
		
	}
}	

@media screen and (max-width: 480px){
	.content {
		padding-bottom: 50%;
	}
	
	.content h1 {
		font-size: 250%;
	}
	.btn {
		font-size: 100%;
		padding: 6px 14px;
	}
	p {
		font-size: 100%;
		line-height: 160%;
		
	}
}	













/*@import 

#header {
  height: 100vh;
  background-image: url(landimage/seftonatwar1.png);
  background-size: cover;
  background-position: center;
  margin-bottom: 50px;

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
#p {
  width: 600px;
  margin: 0 auto 20px;
}*/