@charset "utf-8";
/* CSS Document */
/*main tag*/
body {font: 12px Arial, Helvetica, sans-serif; color:#444; margin:0; padding:20px 0; background: #222 url(../images/body_bg.gif) repeat;}
a img{border:0;}
a {color:#660; text-decoration:underline;}
a:hover {color:#c30; text-decoration:none;}
ul {list-style:none;}
form{padding:0; margin:0;}
p b{color:#222; font-size:1.2em; text-transform:uppercase;}

/*layout*/
#wrapper {width:940px; margin:0 auto; background:#fff; padding: 20px 10px 0; background: #fff url(../images/wrapper_bg.jpg) no-repeat top;}

#header {padding:0; margin:0;}

#footer {background: #ddd url(../images/foot_bg.gif) repeat; padding:10px; margin-top:10px; color:#aaa; clear:both;}

.content, .contentL, .contentR{overflow:hidden;  _zoom:1; margin:10px 5px 0;}
	.left {width:200px; overflow:hidden; _height:1%; margin:0 10px 0 0; float:left;}
	.right {width:200px; overflow:hidden; _height:1%; margin:0 0 0 10px; float:right;}
	
.mainarea{width:500px; overflow:hidden; _height:1%;}
	.contentL .mainarea, .contentR .mainarea{width:710px; overflow:hidden; _height:1%;}
	
/*general*/
a.more{float:right;}
.headerline{margin:10px 0 10px 10px;}

*html .png{
    azimuth: expression(
        this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
        this.src = "./images/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
        this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
        this.runtimeStyle.backgroundImage = "none")),this.pngSet=true);
}

h4{border-bottom:1px solid #ccc; background:url(../images/recommendation_bg.gif) no-repeat left center; display:block; height:25px; line-height:25px; width:100%; font-size:1em; color:#fff; padding-left:5px; margin:0;}

/*navigation*/
#navigation {overflow:visible; margin:10px 0 5px;}

#page_navigation{font: 10px Verdana, Arial, Helvetica, sans-serif; color:#9c0; letter-spacing:0.3em; text-transform:uppercase; padding:5px; border-bottom:1px solid #ccc;}
	#page_navigation a{color:#360; text-decoration:none; letter-spacing:normal; font-weight:bold;}
	#page_navigation a:hover{color:#111;}
	#page_navigation span{color:#333; letter-spacing:normal}
	
/*home splash*/
#slogan{margin:10px 0;}

#splash{width:680px;  padding:0; border:5px solid #111;}
/*
	#splash #info{background:#222; font-family:"Trebuchet MS"; color:#fff; padding:10px 0;}
		#splash #info h2{font-size:2.4em; text-transform:uppercase; margin:0; line-height:40px;}
			#splash #info h2 a{text-decoration:none; padding:0;}
			#splash #info h2 span.price{color:#cf3; margin-left:20px; font-weight:normal;}
			#splash #info h2 p{color:#fff; font-size:0.65em; margin:0;}
			#splash #info h2 span.cent{font-size:0.7em; vertical-align:text-top; color:#cf3; font-weight:normal;}
	#splash a{color:#cc0; font-weight:bold; padding:0 5px; text-transform:uppercase; }
	#splash a:hover{color:#fff;}
*/	
/*footer*/
#footer a{color:#690; padding:0 10px; text-decoration:none; font-size:10px; text-transform:uppercase;}
#footer a:hover{color:#333;}
#footer #copyright{float:right; color:#888; font-size:11px;}

/*right menu*/
#right_menu{margin:0; padding:0; list-style:none; overflow:hidden; _height:1%;}
	#right_menu li{padding:0; margin:0 0 4px;}
		#right_menu li a{padding:0; width:200px;}
		
/*Contact*/
#contact {line-height:2em;}
	#contact p{margin:1em;}
	#contact p span{margin-left:40px;}
	
/*policy & Service & about*/
#policy, #service, #about {line-height:1.75em;}
	#policy p, #service p, #about p{margin:1.2em; text-align:justify;}
	
/*product list*/
.products_list{padding:10px; margin:0; list-style:none; overflow:hidden; line-height:1em; clear:both;}
.products_list li{ float:left; width:305px; padding: 10px 20px; background:url(../images/dot_line_hor.gif) repeat-x center bottom;}
	.products_list li img.thumb{width: auto; height: auto; max-width: 70px; max-height: 70px; width: expression(this.width > 70 && this.width > this.height ? 70 : true); height: expression(this.height > 70 ? 70 : true); padding:2px; border:1px solid #ccc; margin-right:10px; float:left; }
	.products_list li h3{font-size:1em; margin:5px 0; text-transform:uppercase; line-height:1.2em;}
	.products_list li p.price{text-align:left;}
	.products_list li span.was{text-decoration:line-through; color:#999; margin:0 5px;}


/*product info*/
#detail{padding:0; margin:10px 0 30px; overflow:hidden; _height:1%;}
	#detail h2{background:#360 url(../images/detail_h2_bg.gif) repeat-x center top; display:block; padding:10px; margin:0 0 10px; color:#fff; font-size:24px;}
		#detail h2 span{display:block; font-size:11px; font-weight:normal; margin-top:5px;}
		
	#detail #description{float:left; padding: 0; overflow:auto; padding-left:10px; text-align:justify; line-height:1.7em;}
		#detail #description p{margin:7px 0;}
		#detail #description h3{font-size:1.2em; color:#660; margin: 20px 0 10px; text-transform:uppercase;}
		#detail #description p.price{font-size:1.5em; font-weight:bold; color:#c30; margin:0;}
		#detail #description span.was{font-size:11px; text-decoration:line-through; color:#999; margin:0 5px;}
		
	#detail #image{border-right:1px solid #ccc; padding-right:5px; float:left;}
		#detail #image img#main{/* max-height: 250px; width: expression(this.width > 460 && this.width > this.height ? 250 : true); height: expression(this.height > 250 ? 250 : true);*/}
		
	#detail .different_angle{list-style:none; padding:0; margin:5px 0; clear:both;}
		#detail .different_angle li{margin:0 5px; float:left;}
			#detail .different_angle li img{width: auto; height: auto; max-width: 70px; max-height: 70px; width: expression(this.width > 70 && this.width > this.height ? 70 : true); height: expression(this.height > 70 ? 70 : true); padding:3px; border:1px solid #ccc;}
	
	#detail a.order{font-weight:bold; text-transform:uppercase; background:url(../images/icon_order.gif) no-repeat left center; padding-left:15px;}
	#detail span.enlarge{text-transform:uppercase; font-weight:bold; background:url(../images/icon_enlarge.gif) no-repeat left center; padding-left:15px;}

/*right recommendation*/
.products_right{padding:0; margin:0; list-style:none; overflow:hidden; line-height:1em; border:1px solid #ddd;}
.products_right li{width:188px; padding: 10px 5px; background:url(../images/dot_line_hor.gif) repeat-x center top;}
	.products_right li img.thumb{width: auto; height: auto; max-width: 60px; max-height: 60px; width: expression(this.width > 60 && this.width > this.height ? 60 : true); height: expression(this.height > 60 ? 60 : true); padding:2px; border:1px solid #ccc; margin-right:10px; float:left; }
	.products_right li h3{font-size:1em; margin:5px 0; text-transform:uppercase; line-height:1.2em;}
	.products_right li p.price{text-align:right;}
	.products_right li span.was{text-decoration:line-through; color:#999; margin:0 5px;}

/*Multi-page*/
.table_paging{margin:5px 0; border:1px solid #ccc; padding:5px 10px; background:#e1e7dd; font: 10px Verdana, Arial, Helvetica, sans-serif; color:#777; clear:both;}
	.table_paging a, .table_paging strong{color:#111; text-decoration:underline; font-weight:bold; margin:0 10px;}