/* CSS Document */

body {
	font-size: 1.5em;
	line-height: 1.4em;
	background:url(hg_top.png);
	background-size: cover;
	background-repeat: repeat-x;
	background-position: top;
	text-align: center;
	padding: 10px;
}

img.logo {
	margin: 0 auto;
	width: 100%;
	max-width:900px;
}

#main {
	font-family: Verdana, Geneva, sans-serif;
	
	margin: 0 auto;
	margin-top: 15px;
	text-align: left;
	max-width:600px;
	width: auto;
	border: 0px solid #6C3;
	background-color: white;
	box-sizing: border-box;
	border-radius: 30px;
	padding: 20px;
}

#main a {
	text-decoration: none;
	color: #a2c614;
}
#main a:hover {
	text-decoration: underline;
	color: #000;
}

#main img.icon {
	float: left;
	margin-right: 7px;
	height: 30px;
}

#main h1 {
  font-size: 200%
}
#main h2 {
  font-size: 150%;
}
#main p {
  font-size: 100%
}

#main img.np {
	float: left;
	margin-right: 20px;
	width: 155px;
}
#main img.np2 {
	width: 100%;
	max-width:350px;
	display: none;
}

#footer {
	height: auto;
	/* background:url(hg_bottom.png);
	background-size: cover;
	background-repeat: repeat-x;
	background-position: top; */
}

#footer img {
	margin: 0 auto;
	width: 100%;
	max-width:400px;
}

div.cleaner { clear: both; }


@media (max-width: 1000px) {
	
	#main {
		max-width:800px;	
		padding: 40px;
		margin-top: 40px;
	}
	#main p {
		font-size: 130%;
		line-height: 1.4em;
	}
	#main img.np {
		width: 210px;
	}
	#footer img {
		max-width:600px;
	}
	#main img.icon {
		float: left;
		margin-right: 10px;
		height: 40px;
	}	
}
@media (max-width: 820px) {
	
	#main p {
		font-size: 125%;
		line-height: 1.4em;
	}	
}

@media (max-width: 800px) {
	
	#main {
		max-width:800px;	
		padding: 40px;
		margin-top: 40px;
		text-align: center;
	}
		
	#main p {
		font-size: 140%;
		line-height: 1.4em;
	}
	p.first {
		margin-top: 0;
	}
	#main img.np2 {
		display: block;
		margin: 0 auto;
	}
	#main img.np {
		display: none;
	}
	#footer img {
		max-width:600px;
	}
	#main img.icon {
		display: none;
	}
	
}