@charset "utf-8";
/* CSS Document */
/* -------------- Reset Rules --------------- */

body, h1, h2 ,h3, h4, h5, h6, ul, dl, dd, form, fieldset, legend{
	margin:0;
	padding:0;
}
/* -------------- Common Rules --------------- */

div p, dl{/* Set font.size for all paragraphs and dl elements */
	margin:0;
	padding:0.5em 1em;
	font-size:0.6em;
}
dt{
	font-weight:bold;
}
dd{
	margin-left:0.5em;
}
h2{/* Set font.size for h2 elements */
	font-size:1.0em;
	padding:3px 0;
}
/* Set style and colors for links */
a{
	text-decoration:none;
}
a:link, a:visited{
	color:#CCC;
}
a:hover, a:focus, a:active{
	color:#FFF;
	text-decoration:underline;
}
.clear-left{
	clear:left;
}

/* -------------- Page XHTML versus CSS --------------- */
body{
	background:#333 url(../images/backgroundBody.jpg);
	color:#FFF;
	font:1em Verdana, Geneva, sans-serif;
	text-align:center; /* fix IEWin<=6 */
}

#outerWrapper{
	width:800px;
	background:#000;
	margin-left:auto;
	margin-right:auto;
	text-align:left; /* fix IEWin<=6 */
	padding:20px 0;
}
/* -------------- Header --------------- */
#header{
	width:760px;
	overflow:hidden;/* to expand the box */
	margin-left:20px;/* to center the box into #outerWrapper*/
	position:relative;
}
/*  Site name */
#siteName{
	width:758px;
	height:75px;
	border:1px solid #fff;
	position:relative;
}
#siteName span{
	width:100%;
	height:100%;
	position:absolute;
	background: url(../images/logo.jpg) left top no-repeat;
}
/*\*/* html #siteName{width /*\*/:760px;}/**/ /*to correct IE5Win box Model*/

/*  Horizontal Menu */
#horizontalMenu{
	width:760px;
	text-align:right;
	margin-right:20px;
	padding:1em 0;
	font-size:0.7em;
	font-weight:bold;
}
.horizontalMenu{
}
.horizontalMenu li{
	display:inline;
	border-left:1px solid #FFF;
}
.horizontalMenu li.firstVoice{
	border-left:none;
}
.horizontalMenu a{
	padding:0 1em;
	height:0;/*to fix IE5.0 */
}
/*  Great Image and box best affair */
#greatImage{
	width:760px;
	height:250px;
	background: url(../images/backgroundGreatPhoto.jpg) left top no-repeat;
	position:relative;
	float:left;/* to expand the box */
	margin-bottom:5px;
}
#boxBestAffair{
	float:left;
	width:228px;
	height:248px;
	border:1px solid #fff;
	background:url(../images/backgroundboxBestAffair.jpg) left top repeat-x;
}
.textDescription{
	width:228px;
	position:relative;
	float:left;
}
.moreInfo{
	position:absolute;
	left:108px;
	top:6px;
	width:115px;
}

#boxBestAffair h2{
	text-align:center;
}
.moreInfo p{
	padding:0;/* reset padding moreInfo */
}
.moreInfo a{
	display:block;
	background:url(../images/arrow.gif) left 50% no-repeat;
	padding:3px 0 3px 15px;/* space for arrow background */
}
.moreInfo a:link, .moreInfo a:visited{
	background:url(../images/arrow.gif) left 50% no-repeat;
}
.moreInfo a:hover, .moreInfo a:focus, .moreInfo a:active{
	background:url(../images/arrow_on.gif) left 50% no-repeat;
}
/*\*/ * html #boxBestAffair{width /*\*/:230px;}/**/ /* to fix IE5xWin box Model*/
/*\*/ * html #boxBestAffair{height /*\*/:250px;}/**/ /* to fix IE5xWin box Model*/

/* -------------- Shopping --------------- */
#shopping{
	width:760px;
	height:30px;
	margin-left:20px;
	background: url(../images/shoppinCart.jpg) right top no-repeat;
	text-align:right;
}
#shopping p{
	margin-right:5px;
}

#columnWrapper{
	width:758px;
	overflow:hidden;
	margin-left:20px;
	margin-right:20px;
	border:1px solid #fff;
	background:url(../images/backgroundColumnWrapper.jpg) left top repeat-y;
}
/*\*/ * html #columnWrapper{width /*\*/:760px;}/**/ /* to fix IE5xWin box Model*/

/* -------------- firstColumn --------------- */

#firstColumn{
	width:230px;
	margin-right:1px;
	float:left;
	background:#b70001 url(../images/backgroundColumnLeft.jpg) left top no-repeat;
}
#firstColumn h2{/* customize firstColumn h2 */
	font-size:0.7em;
	width:218px;
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #FFF;
	text-indent:32px;
	background: url(../images/bar.gif) left center no-repeat;
}
/*\*/ * html #firstColumn h2{width /*\*/:220px;}/**/ /* to fix IE5xWin box Model*/

/* form */
#formContainer{
	width:220px;
	font-size:0.6em;
	margin-left:5px;
	margin-bottom:5px;
}
fieldset{
	border:1px solid #FFF;
	padding:6px;
}
legend{
	color:#FFF;
	padding:0.5em 0.2em;
}
/* Vertical Menu */
#verticalMenu{
	width:218px;
	margin:2px 2px 5px 5px;
	border:1px solid #FFF;
	font-size:0.6em;
	padding-bottom:5px;
}
/*\*/ * html #verticalMenu{width /*\*/:220px;}/**/ /* to correct IE5Win box Model */
.verticalMenu{
	list-style:none;
}
.verticalMenu li{
}
.verticalMenu a{
	display:block;
	padding:0.5em 0.5em 0.5em 16px;
	background:url(../images/arrow.gif) left center no-repeat;
	border-bottom:1px solid #FFF;
}
.verticalMenu a:link, .verticalMenu a:visited{
	background:url(../images/arrow.gif) left center no-repeat;
}
.verticalMenu a:hover, .verticalMenu a:focus, .verticalMenu a:active{
	background:url(../images/arrow_on.gif) left center no-repeat;
}
/*\*/ * html .verticalMenu li{display:inline;}/**/ /* to correct bug IE<=6Win*/
/*\*/ * html .verticalMenu a{height:0; }/**/ /* to correct bug IE<=6Win*/

/* Reviews */
#boxReviews{
	width:218px;
	margin-left:5px;
	margin-bottom:5px;
	border:1px solid #FFF;
}
.review{
	width:218px;
	float:left;
}
.review img{
	float:left;
	border:1px solid #FFF;
	margin:0.5em 3px 0 3px;
}

/* -------------- second Column --------------- */

#secondColumn{
	width:527px;
	float:left;
	background:#370f0f;
}
#secondColumn h2{ /* customize secondColumn h2 */
	margin:0.5em;
}
/* product */
.product{
	width:487px;
	margin:0 0 20px 15px;
	border:1px solid #fff;
	overflow:hidden;
	padding:5px;
}
/*\*/ * html .product{width /*\*/:499px;}/**/ /* to correct IE5Win box Model */

.floatImage{
	float:left;
	border:1px solid #fff;
	margin-right:10px;
}

/* -------------- footer --------------- */

#footer{
	height:75px;
	width:758px;
	border:1px solid #FFF;
	margin-left:20px;
  	margin-top:5px;
	background:url(../images/backgroundFooter.jpg) left top no-repeat;
	position:relative;
}
/*\*/ * html #footer{width /*\*/:760px;}/**/ /* to fix IE5xWin box Model*/
#footerMenu{
	position:absolute;
	width:758px;
	text-align:center;
	font-size:0.6em;
	top:25px;
}
.footerMenu{}
.footerMenu li{
	display:inline;
	border-left:1px solid #FFF;
}
.footerMenu li.firstVoice{
	border-left:none;
}

.footerMenu a{
	padding:0 1em;
	height:0;/* for IE5.0 that doesn't support padding for in-line element */
}