﻿body {
	background-image: url('../images/fotolia_36837876rotated.jpg');
	background-repeat: no-repeat;
}
#container {
	max-width:1440px;
	width: 100%;
	height:auto;
}
#main {
	margin-left: 350px;
	margin-top: 45px;
}
h1 {
	font-size: 3.3em;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-right: 90px;
}
#main p {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.1em;
	line-height: 1.8;
	margin-right: 90px;
}
#main li {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.1em;
	line-height: 1.8;
	margin-right: 90px;
	list-style-position: inside;
	list-style-type: disc;
}
nav {
	margin-top: 30px;
	width: 100%;
}
nav ul {
	list-style-type: none;
	padding: 0px;
	line-height: 2.6;
	color: #262626;
	width:98%;
	max-width:1410px;
	margin-left:auto;
	margin-right:auto;

}
nav li {
	border: 2px solid #333333;
	border-radius: 8px;
	font-size: 1.2em;
	font-weight: 800;
	float: left;
	margin-left: 4%;
	width: 14.5%;
	text-align: center;
	background-color: #8AA47B;
}
nav a, nav a:link, nav a:visited {
	color: #FFFFFF;
	display: block;
	text-decoration: none;
	border: 2px solid #333333;
	border-radius: 8px;

}
nav a:hover, nav a:active {
	color: #000000;
	display: block;
	text-decoration: none;
	background-color: #D6BF4F;
	border: 2px solid #333333;
	border-radius: 8px;
}
h2 {
	font-size: 2.2em;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-right: 90px;
	margin-bottom: 10px;
}
.mobile{
}
.extra {
	border: 4px solid #333333;
	border-radius: 8px;
}
.tel a, .tel a:link, .tel a:visited {
	color: #000000;
	text-decoration: underline;
}
.tel a:hover, .tel a:active {
	color: #D7C66C;
	text-decoration: underline;
}
@media (max-width: 768px) {
  #container {
  	display: grid;
    grid-template-areas:
      "logo"
       "header"
      "content"
      "nav"
      "footer";
    grid-template-columns: 1fr;
    grid-template-rows:
		auto/* Logo */
      auto /* Header */
      auto /* Nav */
      auto /* Content */
      auto; /* Footer */
  width:100%;
  max-width:768px;
  }
.mobile{
	display:none;
}

/*  @media screen and (max-width:640px) {
#container {
	background-position: -80px;
	width: 100%;
	background-image: url('../images/f_36837876rotated_Mob.jpg');
}
#main {
	margin-left: 120px;
	margin-top: 25px;
}
h1 {
	font-size: 1.3em;
	text-align: center;
	margin-right: 25px;
}
#main p {
	line-height: 2;
	margin-right: 25px;
	text-align: justify;
}
#main li {
	margin-right: 25px;
	padding-top: 5px;
}
nav {
	margin-top: 70px;
	width: 100%;
}
nav ul {
}
nav li {
	margin-left: 20px;
	width: 155px;
	text-align: center;
	background-color: #8AA47B;
	padding-bottom: 5px;
	margin-bottom: 5px;
}
h2 {
	font-size: 2.2em;
	font-weight: 700;
	font-style: normal;
	text-align: center;
	margin-right: 90px;
	margin-bottom: 10px;
}
.tel a, .tel a:link, .tel a:visited {
	color: #000000;
	text-decoration: underline;
}
.tel a:hover, .tel a:active {
	color: #D7C66C;
	text-decoration: underline;
}
*/
}