/*  MAKE LAYOUT RESPONSIVE at 480px FOR IPHONE LANDSCAPE ============================================ */


#wrapper {
	width: 300px;
	margin: 0px auto;
	padding: 0px;
	}
	
#header {
	width: 300px;
	height: 92px;
	margin: 0px;
	padding: 0px;
	background-image: url('../images/320/bg_header.png');
	}
	
#content {
	width: 300px;
	margin: 0px;
	padding: 1px 3px;
	background-image:url('../images/320/bg_content.png');
	background-repeat: repeat-y;
	}
	.homeinfo {
		width: 100%;
		height: auto;
		margin: 0px;
		padding: 1px 0px;
		background-image: none;
		background-repeat: no-repeat
		}
	img.homepics {
		float: none;
		}

		
#footer {
	width: 300px;
	height: 25px;
	margin: 0px;
	padding: 1px 0px;
	background-image: url('../images/320/bg_footer.png');
	}


/* NAVIGATION */
/* ==========*/	
.navigation {
	width: 300px;
	height: auto;
	margin: 0px auto;
	padding: 0px;
	background-image:url('../images/320/bg_content.png');
	}
	ul.navmenu {  
	    width: 296px;
	    height: auto;
		color: #ffffff;
		margin: 0px;
	    padding: 0px 2px 0px 2px;
		text-align: center;
		}
	ul.navmenu > li { 
	    float: none;
	    width: 296px; 
	    height: 30px;
	    right: 0px;
	    margin: 0px;
	    padding: 0px;
	    position: relative; 
	    line-height: 30px;
		}
	ul.navmenu li { list-style: none; }
	ul.navmenu li a {
		font-family: "Times New Roman", Times, serif;
		font-style: italic;
		font-variant: normal;
		font-weight: normal;
		font-size: 1.1em;
		color: #262626;
		padding: 2px 0px;
		margin: 0px;
		letter-spacing: normal;
		text-decoration: none;
	    line-height: 30px;
		}
	ul.navmenu a:hover { color: #ffffff; }

	ul.navmenu li.home { background-image: none; background-color: #f3d3cb; width: 100%; }
	ul.navmenu li.home:hover { background-image: none; background-color: #e29989; line-height: 30px; }
	ul.navmenu li.home_active {width: 296px; background-image: none; background-color: #e29989; line-height: 30px; }
	
	ul.navmenu li.products { background-image: none; background-color: #e1c5fe; width: 100%; }
	ul.navmenu li.products:hover { background-image: none; background-color: #c8a5ec; line-height: 30px  }
	ul.navmenu li.products_active {width: 296px; background-image: none; background-color: #c8a5ec; line-height: 30px }

	ul.navmenu li.gallery { background-image: none; background-color: #9ec7fd; width: 100%; }
	ul.navmenu li.gallery:hover { background-image: none; background-color: #8bbdfd; line-height: 30px  }
	ul.navmenu li.gallery_active {width: 296px; background-image: none; background-color: #8bbdfd; line-height: 30px }

	ul.navmenu li.specials { background-image: none; background-color: #b8e5a8; width: 100%; }
	ul.navmenu li.specials:hover { background-image: none; background-color: #96d081; line-height: 30px  }
	ul.navmenu li.specials_active {width: 296px; background-image: none; background-color: #96d081; line-height: 30px }

	ul.navmenu li.contact { background-image: none; background-color: #f9e8b9; width: 100%; }
	ul.navmenu li.contact:hover { background-image: none; background-color: #f4da91; line-height: 30px  }
	ul.navmenu li.contact_active {width: 296px; background-image: none; background-color: #f4da91; line-height: 30px }
	
/* PARAGRAPHS */
/* ========== */
.homeinfo p {
	font: normal 0.8em century gothic;
	margin: 0px 20px 20px 20px;
	line-height: 22px;
	}
p.readmore {
	font: italic bold 1.1em times new roman;
	text-align: right;
	margin-top: 0px;
	}
p.quick {
	font: italic bold 1.1em times new roman;
	margin: 0px;
	text-align: center;
	}
p.footer {
	font: normal 0.7em century gothic;
	color: #262626;
	margin: 25px 5px 0px 5px;
	padding: 0px;
	text-align: center;
	line-height: 20px
	}
	
/*  GRID OF EIGHT TURNS INTO A GRID OF FOUR */

.span_8_of_8 {
	width: 100%; 
	margin-left: 0;
}

.span_7_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_6_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_5_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_4_of_8 {
	width: 100%;
	margin-left: 0;
}

.span_3_of_8 {
	width: 74.2%;
	margin: 1% 0 1% 3.2%;
}

.span_2_of_8 {
	width: 48.4%;
	margin: 1% 0 1% 3.2%; 
}

.span_1_of_8 {
	width: 22.6%;
	margin: 1% 0 1% 3.2%; 
}

.span_1_of_8:nth-child(4n+1) { 
	clear: both;
	margin-left: 0;
}
		
/*  Except in the Example and in the Sample */

#example .maincontent .span_8_of_8 {
	width: 100%; 
	margin-left: 0;
}
#example .maincontent .span_7_of_8 {
	width: 100%; 
	margin-left: 0;
}
#example .maincontent .span_6_of_8 {
	width: 100%;
	margin-left: 0; 
}
#example .maincontent .span_5_of_8 {
	width: 100%; 
	margin-left: 0;
}
#example .maincontent .span_4_of_8 {
	width: 100%; 
	margin-left: 0;
}
#example .maincontent .span_3_of_8 {
	width: 100%;
	margin-left: 0; 
}
#example .maincontent .span_2_of_8 {
	width: 100%; 
	margin-left: 0;
}
#example .maincontent .span_1_of_8 {
	width: 100%; 
	margin-left: 0;
}

#sample .maincontent .span_8_of_8 {
	width: 100%; 
	margin-left: 0;
}
#sample .maincontent .span_7_of_8 {
	width: 100%; 
	margin-left: 0;
}
#sample .maincontent .span_6_of_8 {
	width: 100%;
	margin-left: 0; 
}
#sample .maincontent .span_5_of_8 {
	width: 100%; 
	margin-left: 0;
}
#sample .maincontent .span_4_of_8 {
	width: 100%; 
	margin-left: 0;
}
#sample .maincontent .span_3_of_8 {
	width: 100%;
	margin-left: 0; 
}
#sample .maincontent .span_2_of_8 {
	width: 100%; 
	margin-left: 0;
}
#sample .maincontent .span_1_of_8 {
	width: 100%; 
	margin-left: 0;
}


img.service, img.service2 { float: none; margin: 0px 10px }