@charset "utf-8";
/* CSS Document */

body{
	background:url(images/bg.gif) top repeat-x;
	font-family: 'Poppins', sans-serif;

}
#wrap{
	width:100%;
	max-width:1809px;
	height:auto;
	margin:0 auto;
	padding:0;
}
#title{
	width:100%;
	padding:25px 0 0 0;
	height:100px;
}
.fb{
	float:right;
	padding:0;
}
#header{
	background:url(images/the-woods-at-summerford.jpg) center no-repeat;
	width:100%;
	padding: 15px 0;
	height:479px;
}
#header-timbers{
	background:url(images/the-timbers-at-summerford.jpg) center no-repeat;
	width:100%;
	padding: 15px 0;
	height:479px;
}
#menu{
	width:80%;
	height:40px;
	padding:30px 10%;
	font-family: 'Herr Von Muellerhoff', cursive;
	text-align:center;
	font-size:36px;
}

#main3{
	width:100;
	padding:0 3% 0 0;
	float:left;
}

#col1 {
	width: 30%;
  float: left;
  background-color: #EBEBEB;
  padding: 10px;
  margin: 0 10px;
}
#col2 {
	width: 30%;
	float: left;
	background-color: #F7F7F7;
  padding: 10px;
  margin: 0 10px;
}
#col3 {
	width: 30%;
	float: left;
}




ul {
  	list-style-type: none;
  	margin: 0;
  	padding: 0;
}

li {
	width:20%;
  	float: left;
  	padding:0 2%;
}

#content{
	width:90%;
	padding: 20px 5%;
	float:left;
}
#main{
	width:66%;
	padding:0 3% 0 0;
	float:left;
}
#right{
	width:28%;
	padding:0 0 0 3%;
	float:left;
	text-align:center;
}
#footer{
	background:#e7bf8b;
	border:1px solid #000;
	width:90%;
	padding:25px 0;
	height:25px;
	float:left;
	text-align:center;
	margin:0 5% 25px 5%;
}
#bottom{
	width:90%;
	padding:0;
	height:45px;
	float:left;
	margin:0 5% 15px 5%;
}

img{border:0;}
hr{color:#e7bf8b;}

/* FONT STYLE */
h1{
	font-size: 24px;
}
h2{
	font-size: 20px;
}
#title h1{
	font-family: 'Herr Von Muellerhoff', cursive;
	font-size: 54px;
	margin:0;
	padding:0;
}

/* LINK STYLE */
a{
	text-decoration:none;
	color:#925d28;
}
#title h1 a{
	color:#000;
}
#menu li a{
	font-weight:bold;
	color:#000;
	padding:0 2%;
	margin:0;
}
#footer a{
	font-weight:bold;
	color:#000;
	padding:0 1%;
}
#bottom a{
	color:#000;
}
.copyright{
	float:left;
}
.web{
	float:right;
}


@media only screen and (max-width: 775px) {
    /* For tablets: */
	
body{
	background:none;
	padding:0;
	margin:0;
}
#title{
	background:#e7bf8b;
	border-bottom:1px solid #000;
	width:96%;
	padding:2%;
	height:70px;
}
#header{
	background:url(images/the-woods-at-summerford.jpg) center no-repeat;
	width:90%;
	padding: 5%;
	height:250px;
}
#header-timbers{
	background:url(images/the-timbers-at-summerford.jpg) center no-repeat;
	width:90%;
	padding: 5%;
	height:250px;
}
#menu{
	width:96%;
	height:32px;
	padding:2% 2%;
	background:#e7bf8b;
	border-bottom:1px solid #000;
	border-top:1px solid #000;
	font-size:32px;
}
li {
	width:25%;
  	float: left;
  	padding:0;
}
#content{
	width:100%;
	padding: 10px 0;
	float:none;
}
#main{
	width:90%;
	padding: 0 5%;
	float:none;
}
#right{
	width:90%;
	padding: 0 5%;
	float:none;
}
#footer{
	width:84%;
	padding:15px 5%;
	height:25px;
	float:none;
	margin:0 2% 15px 2%;
}
#bottom{
	width:96%;
	padding:0 2%;
	height:45px;
	font-size:10px;
	float:none;
	margin:0 0 5px 0;
}


#title h1{
	font-family: 'Herr Von Muellerhoff', cursive;
	font-size: 50px;
	margin:0;
	padding:0;
}
}

@media screen and (max-width: 550px) {
	/* For smartphone: */
#title{
	background:#fff;
	border-bottom:none;
	width:96%;
	padding:2%;
	height:auto;
	text-align:center;
}
.fb{
	float:none;
	padding:0 0 10px 0;
}	
#menu{
	width:90%;
	height:auto;
	padding:2% 5%;
	border:none;
	font-family:'poppins'
	
}
li {
	background:#e7bf8b;
	width:98%;
  	float: none;
  	padding:1%;
}
#menu a{
	font-size:18px;
	font-weight:bold;
	color:#000;
	padding:0 1%;
}

#col1 {
	width: 95%;
  float: left;
  background-color: #EBEBEB;
  padding: 10px;
  margin: 0 10px;
}
#col2 {
	width: 95%;
	float: left;
	background-color: #F7F7F7;
  padding: 10px;
  margin: 15px 10px;
}
#col3 {
	width: 95%;
	float: left;
	 padding: 10px;
  margin: 0 10px;
}






}
	
@media screen and (max-width: 350px) {
	/* For smartphone: */
	
#title{
	background:#fff;
	border-bottom:none;
	width:96%;
	padding:2%;
	height:auto;
	text-align:center;
}
.fb{
	float:none;
	padding:0 0 10px 0;
}
#header{
	background:url(images/woods-at-summerford-sm.jpg) center no-repeat;
	width:100%;
	padding: 0;
	height:137px;
}
#header-timbers{
	background:url(images/timbers-at-summerford.jpg) center no-repeat;
	width:100%;
	padding: 0;
	height:137px;
}

#main{
	text-align:center;
}
#footer{
	background:none;
	border:none;
	width:84%;
	padding:15px 5%;
	height:25px;
	float:none;
	margin:0 2% 15px 2%;
}
#bottom{
	width:96%;
	padding:0 2%;
	height:45px;
	font-size:10px;
	float:none;
	margin:0 0 5px 0;
}
h1{
	padding:0;
	margin:0;
}
h2{
	padding:0;
	margin:0;
}
#menu a{
	font-size:16px;
}
#footer a{
	font-size:14px;
	padding:0 1%;
}

.copyright{
	float:none;
	text-align:center;
}
.web{
	float:none;
	text-align:center;
}

}