body {
	font-family:		Verdana, Arial, sans-serif;
	font-size:			1.3em;
}

#main_wrapper {
	width:				90%;
	margin:				auto;
}

header {
	width:				100%;
}

address {
	font-style:			normal;
	width:				100%;
}

#address, #phone, #hours {
	display:			inline-block;
	width:				33%;
	min-width:			150px;
	vertical-align:		top;
}

#phone {
	text-align:			center;
}

#hours {
	text-align:			right;
}

nav {
	font-family:		"Times New Roman", Arial, serif;
	font-size:			1.5em;
	display:			inline-block;
	width:				100%;
	margin:				auto;
	text-align:			center;
}

nav ul {
	margin:				0px;
	padding:			5px 0px 5px 5px;
}

nav ul li {
	display:			inline-block;
	background-color:	#84bc52;
	color:				#000000;
	width:				25%;
	min-width:			150px;
	border:				3px solid #5a8832;
	text-align:			center;
}

nav li a, nav li a:hover, nav li a:visited{
	color:				#000000;
	width:				100%;
	font-variant:		small-caps;
	text-decoration:	none;
}

section {
	display:			inline-block;
	width:				100%;
}

footer {
	width:				100%;
	min-width:			400px;
	margin:				auto;
	background-color:	#84bc52;
	border:				3px solid #5a8832;
	color:				#000000;
	font-size:			0.85em;
}

footer address {
	width:				95%;
	margin:				auto;
	padding:			5px 0px 10px 5px;
}

#copyright {
	display:			inline-block;
	width:				100%;
	min-width:			400px;
	color:				#000000;
	font-size:			0.7em;
	text-align:			center;
}

#copyright a, #copyright a:hover, #copyright a:visited {
	color:				blue;
}

form {
	display:			inline-block;
	width:				40%;
	min-width:			350px;
}

fieldset {
	border:				1px solid #5a8832;
	border-radius:		10px;
}

legend {
	font-style:			italic;
	font-family:		"Times New Roman", Arial, serif;
	font-size:			1.5em;
}

label {
	display:			inline-block;
	width:				30%;
	min-width:			50px;
	margin-top:			10px;
}

textarea {
	display:			inline-block;
	border:				2px outset #5a8832;
	vertical-align:		top;
	margin-top:			10px;
	width:				60%;
	min-width:			250px;
	height:				150px;
}

input[type="text"], input[type="email"] {
	display:			inline-block;
	width:				60%;
	min-width:			250px;
	border:				none;
	border-bottom:		1px solid red;
	margin-top:			10px;
}

input[type="submit"] {
	font-size:			1.2em;
	color:				#000000;
	background-color:	#84bc52;
	border:				1px outset #5a8832;
	border-radius:		10px;
	margin-top:			10px;
	margin-left:		79%;
}

input[type="submit"]:hover {
	border:				1px inset #5a8832;
	box-shadow:			4px 4px 20px #5a8832 inset;
	-webkit-box-shadow:	4px 4px 20px #5a8832 inset;
	
}

#map {
	display:			inline-block;
	width:				55%;
	height:				350px;
	vertical-align:		top;
	margin:				20px 0px 20px 0px;
}

#map iframe {
	display:			inline-block;
	width:				100%;
	height:				350px;
}


h1 {
	font-family:		"Times New Roman", Arial, serif;
	font-size:			1.7em;
	font-variant:		small-caps;
	border:				2px dotted #5a8832;
	color:				#000000;
	background-color:	#84bc52;
	text-align:			center;
	margin:				auto;
	padding:			20px 0px 20px 0px;
	width:				100%;
	border-radius:		15px 20px;
}

#service {
	display:			inline-block;
	width:				20%;
	/*margin-left:		70%;*/
	margin-top:			50px;
	margin-bottom:		20px;
	border-top:			none;
	border:				1px solid #5a8832;
	color:				#000000;
	background-color:	#84bc52;
	list-style-type:	none;
	padding:			0px;
}

#service li {
	display:			inline-block;
	width:				100%;
	font-family:		"Times New Roman", Arial, serif;
	font-size:			1.4em;
	padding:			15px 0px 15px 0px;
	text-align:			center;
}

#produit {
	font-family:		"Times New Roman", Arial, serif;
	font-size:			1.6em;
	display:			inline-block;
	width:				100%;
}

#produit ul {
	margin:				60px;
	padding:			15px;
}

#produit ul li {
	display:			inline-block;
	background-color:	#84bc52;
	color:				lime;
	margin-bottom:		15px;
	width:				20%;
	min-width:			150px;
	height:				20%;
	min-height:			100px;
	border:				3px solid #5a8832;
	text-align:			center;
	vertical-align:		bottom;
}

#produit li a, #produit li a:hover, #produit li a:visited{
	color:				lime;
	width:				100%;
	font-variant:		small-caps;
	text-decoration:	none;
}

img {
	border:				none;
}

.shop {
	display:			inline-block;
	width:				45%;
	vertical-align:		bottom;
	margin-left:		20%;
}

.shop img {
	width:				60%;
	height:				250px;
}

.imgcentered {
	display:			block;
	margin-left:		auto;
	margin-right:		auto;
}

.centered {
	display:			block;
	margin-left:		auto;
	margin-right:		auto;
	text-align:			center;
	background-color:	#84bc52;
	color:				#000000;
	border:				3px dotted #5a8832;
	border-radius:		15px 20px;
}

.hidden {
	color:				#000000;
}

/*
:required {

}

:invalid {
	background-color:	red;
}
*/
@media screen and (max-width: 1600px) {
	input[type="submit"] {
		margin-left:		75%;
	}
}

@media screen and (max-width: 1280px) {
	nav ul li {
		width:				15%;
	}
}

@media screen and (max-width: 1024px) {
	/*
	nav {
		font-size:			1.2em;
	}
	*/
	nav {
		font-size:			3em;
	}
	
	nav ul li {
		margin:				2px 0px 2px 0px;
		width:				100%;
		/*height:				30px;*/
	}
	/*
	#address, #phone, #hours {
		width:				30%;
	}
	*/	
	#address, #phone, #hours {
		margin:				0px 0px 10px 0px;
		width:				100%;
		font-size:			1em;
		text-align:			center;
	}
	
	#service {
		width:				30%;
	}
	
	input[type="submit"] {
		margin-left:		45%;
	}
	
	.shop {
		width:				40%;
	}
}

@media screen and (max-width: 800px) {
	/*
	nav {
		font-size:			1.2em;
	}
	
	nav ul li {
		width:				15%;
		min-width:			100px;
	}
	*/
	
	input[type="submit"] {
		margin-left:		50%;
	}
}

@media screen and (max-width: 480px) {
	/*
	nav {
		font-size:			1.5em;
	}
	
	nav ul li {
		margin:				2px 0px 2px 0px;
		width:				100%;
		height:				30px;
	}
	*/
	#map {
		display:			none;
	}
	/*
	#address, #phone, #hours {
		margin:				0px 0px 10px 0px;
		width:				100%;
		font-size:			1em;
		text-align:			center;
	}
	*/
}

/* css for smartphone and other devices */
@media all and (max-device-width: 800px) {
	/*
	nav {
		font-size:			2em;
	}
	
	nav ul li {
		width:				15%;
		min-width:			100px;
	}
	*/
	input[type="submit"] {
		margin-left:		50%;
	}
	
	#map {
		display:			none;
	}
}

@media all and (max-device-width: 480px) {
	section {
		background-color:	#ffffff; /* Fix for default Android browser */
		width:				100%;
	}
	
	aside {
		background-color:	#ffffff;
	}
	
	p {
		background-color:	#ffffff; /* Fix for default Android browser */
		font-size:			3em;
	}
	/*
	nav {
		font-size:			5em;
	}
	
	nav ul li {
		margin:				2px 0px 2px 0px;
		width:				100%;
	}
	*/
	form {
		width:				90%;
	}
	
	label, input[type="text"], input[type="email"], textarea {
		font-size:			3em;
		margin-bottom:		15px;
	}
	
	input[type="text"], input[type="email"] {
		border:				none;
		border-bottom:		2px solid red;
	}
	
	textarea {
		height:				145px;
	}
	
	input[type="submit"] {
		margin-left:		82%;
	}
	
	#map {
		display:			none;
	}
	
	#address, #phone, #hours {
		margin:				0px 0px 10px 0px;
		width:				100%;
		font-size:			1.5em;
		text-align:			center;
	}
}