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

	/*
	yrar 2009
    Web Design by Dayinflying Group.
	http://www.dayinflying.net
	*/
	

body {
	margin:0;
	padding:0;
	background:#fff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	line-height:170%;
	color:#aaa;
	letter-spacing:0.1em;
}

body#faq {
	background:#fff url(../images/faq_bg.gif) center bottom no-repeat;
}

a {
	outline: none; /* for Firefox */
	hlbr:expression(this.onFocus=this.blur()); /* for IE */
	text-decoration:none;
}

a:hover {

}

img {
	border:0;
	vertical-align:middle;
	margin:0;
	padding:0;
}

p {
	margin:0;
	padding:0;
}

input, select, textarea {
	vertical-align:middle;
}

input[type="radio"]{
vertical-align:-1px;
vertical-align:middle\9;
}


.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
	height:0;
}

.clearfix {
	display: inline-block;
}

_ html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}



/* container
--------------------------------------------------------- */

#container {
	width:910px;
	margin:0 auto;
}


/* top
--------------------------------------------------------- */

#top {
	width:910px;
	height:70px;
	letter-spacing:0;
	margin:70px 0 0;
	font-family:"Lucida Sans Demibold Roman", "Trebuchet MS", Helvetica, Arial, sans-serif;
}


/* menu
--------------------------------------------------------- */


.menu {
	float:left;
}

#menu {
	height:30px;
	margin-top:28px;
	text-transform:uppercase;
}

#footer_menu {
	height:32px;
	margin-top:0px;
	text-transform:capitalize;
}

.menu ul {
	list-style:none;
	margin:0;
	padding:0;
	display:block;
	height:32px;
}

.menu ul li {
	display:block;
	margin:0;
	padding:0;
	float:left;
	font-weight:bold;
	font-family:"Lucida Sans Demibold Roman", "Trebuchet MS", Helvetica, Arial, sans-serif;
}

#menu ul li {
	height:28px;
}

#footer_menu ul li {
	height:32px;
	margin-right:4px;
}

.menu ul li a {
	display:block;
	margin:0;
	padding:0;
	color:#81888E;
	float:left;
}

#menu ul li a {
	height:28px;
	line-height:16px;
	padding:0 10px;
	font-size:15px;
}


.menu ul li a span {
	letter-spacing:1px;
	font-weight:normal;
	font-size:12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}

#menu ul li a span {
	display:block;
}

#footer_menu ul li a span {
	padding-left:5px;
}


#footer_menu ul li a {
	height:20px;
	line-height:20px;
	margin:7px 0;
	padding:0 8px;
	font-size:13px;
	border:1px solid #81888E;
}

.menu ul li a:hover {
	color:#C4A779;
}

.menu ul li a.active {
	color:#44301B;
}

#footer_menu ul li a:hover {
	border:1px solid #C4A779;
}

#footer_menu ul li a.active {
	border:1px solid #44301B;
}


/* logo
--------------------------------------------------------- */


#logo {
	width:253px;
	height:70px;
	float:right;
	margin:0 10px 0 0;
	padding:0;
}

#logo_a {
	width:253px;
	height:70px;
	display:block;
	background:url(../images/logo.gif) left top no-repeat;
}

#logo_a:hover {
	width:253px;
	height:70px;
	display:block;
	background:url(../images/logo.gif) left -70px no-repeat;
}

#logo_a span {
	display:none;
}


/* main
--------------------------------------------------------- */


#main {
	width:910px;
}

#main h2 {
	display:none;
}

#content {
}

.en {
	font-size:13px;
	letter-spacing:0;
}

.zh {
	font-size:12px;
}



/* about_concept
--------------------------------------------------------- */


.about_concept_main {
	background:#000 url(../images/about_concept.jpg) left top no-repeat;
	height:366px;
	position:relative;
}



.about_concept {
	width:340px;
	position:absolute;
	right:20px;
	top:22px;
	margin:0;
	padding:0;
}

.about_concept .en {
	color:#FFF;
	margin-bottom:12px;
	line-height:160%;
}

.about_concept .zh {
	color:#C4A779;
	line-height:160%;
}


/* about_quality
--------------------------------------------------------- */


.about_quality_main {
	background:#fff url(../images/about_quality.jpg) left top no-repeat;
	height:366px;
	position:relative;
}



.about_quality {
	width:500px;
	position:absolute;
	left:30px;
	top:30px;
}

.about_quality .en {
	color:#795933;
	margin-bottom:16px;
}

.about_quality .zh {
	color:#795933;
}


/* about_certification
--------------------------------------------------------- */


.about_certification_main {
	background:#44301b;
	height:366px;
	position:relative;
}



.about_certification {
	width:480px;
	position:absolute;
	left:56px;
	top:52px;
}

.about_certification .en {
	color:#fff;
	margin-bottom:12px;
	line-height:160%;
	font-size:13px;
}

.about_certification .en span {
	font-size:12px;
	font-weight:normal;
	margin:0;
	padding:0;
	line-height:100%;
}

.about_certification .zh {
	color:#C4A779;
}

.image_thumb {
	width:440px;
	height:160px;
	position:absolute;
	left:56px;
	top:190px;
}

.image_thumb ul {
	margin: 0; padding: 0;
	list-style: none;
	display:block;
	width:100%;
	height:100%;
}

.image_thumb ul li{
	display:block;
	margin: 10px 8px 0 0; 
	padding: 0;
	width: 76px;
	height:140px;
	float: left;
	overflow:hidden;
}

.image_thumb ul li a, .image_thumb ul li a:hover {
	background:transparent;
	position:relative;
	display:block;
	width:76px;
	height:140px;
	z-index:22px;
}

.image_thumb ul li.hover {
	cursor:pointer;
	cursor:hand;
}
.image_thumb ul li.active {
	cursor: default;
}

.image_thumb img { 
	margin: 0; 
	padding:0;
	position:absolute;
	width:72px;
	height:140px;
	top:0;
	left:0;
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	opacity: 0.5;
}

.image_thumb ul li.active img {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	opacity: 1;
}

.image_thumb img.hover { 
}

.image_thumb ul li.active img.hover { 
}

.main_image {
	width:200px;
	height:286px;
	position:absolute;
	top:40px;
	right:70px;
}

.main_image_img {
	width:200px;
	height:286px;
}

.main_image .main_image_img img {
	width:200px;
	height:286px;
	margin:0;
	padding:0;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	opacity: 0;

}

/* product
--------------------------------------------------------- */

.product_main {
	background:url(../images/product.gif) left top no-repeat;
	height:366px;
	position:relative;
}

@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

.ui-tabs-nav, .ui-tabs-panel {
    font-size: 12px;
}
.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 16px 0 0;
	width:152px;
	float:left;
}
.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}
.ui-tabs-nav li {
	display:block;
    margin: 0 10px 0 10px;
	border-bottom:1px dotted #81888e;
	font-family:"Myriad Pro", Arial, Helvetica, sans-serif;
}
.ui-tabs-nav a, .ui-tabs-nav a span {
}
.ui-tabs-nav a {
    display: block;
    padding: 0;
	margin:0;
    color: #81888E;
    font-weight: bold;
    text-align: left;
    text-decoration: none;
}

.ui-tabs-nav a:hover {
	color:#C4A779;
}

.ui-tabs-nav .ui-tabs-selected a {
    color: #44301B;
}

.ui-tabs-nav a span {
	padding:5px 5px;
	display:block;
	line-height:120%;
}
*>.ui-tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}
.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}
.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-deselectable a:hover, .ui-tabs-nav .ui-tabs-deselectable a:focus, .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}
.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}

#product_main_list {
	width:755px;
	height:364px;
	background:#44301b url(../images/ajax-loader.gif) center center no-repeat;
	float:right;
	margin:1px;
    padding: 0;
	overflow:hidden;
}

.ui-tabs-panel {
	width:755px;
	height:364px;
	margin:0;
    padding: 0;
	overflow:hidden;
}

.ui-tabs-panel img {
	display:block;
	margin:0;
	padding:0;
	overflow:hidden;
}

.ui-tabs-panel a {
	padding:0;
	margin:0;
}

.ui-tabs-loading {
	display:none;
}

.ui-tabs-loading em {
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */

}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */

}

/* product
--------------------------------------------------------- */

.product_list_main {
	border-bottom:1px #C4A779 solid;
}

.product_list {
	margin-bottom:50px;
	width:100%;
}

.product_list h3 {
	background:#3E2C18;
	height:30px;
	line-height:30px;
	display:block;
	margin:0;
	padding:0 10px;
	font-size:15px;
	color:#fff;
}

#product_list {
	text-align:center;
	margin:30px auto 0;
	width:890px;
}

#product_list td {
	padding-top: 5px;
	padding-bottom: 20px;
}

#product_list img {
	width:142px;
	height:142px;
	border:1px solid #C4A779;
	margin-bottom:5px;
}

#product_list a:hover img, #product_list a.hover img {
	width:142px;
	height:142px;
	border:1px solid #44301B;
	margin-bottom:5px;
}

#product_list p {
	line-height:120%;
	padding:0 3px;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	text-align:left;
	width:142px;
}

#product_list p.p_name, #product_list p.p_price {
	font-size:13px;
	font-weight:bold;
	color:#44301B;
	letter-spacing:0;
}

#product_list p.p_number, #product_list p.p_size {
	color:#81888E;
}

#product_list p.p_number {
	margin-top:3px;
}


/* personalization
--------------------------------------------------------- */


.personalization_main {
	background:url(../images/personalization.gif) left top no-repeat;
	height:366px;
	position:relative;
}



.personalization {
	width:558px;
	height:364px;
	position:absolute;
	right:1px;
	top:1px;
	margin:0;
	padding:0;
	background:#000 url(../images/personalization_bg.jpg) left top no-repeat;
}

.personalization ul {
	list-style:none;
	margin:0;
	padding:0;
}

.personalization ul li {
	display:block;
	float:left;
	width:186px;
	height:364px;
	margin:0;
	padding:0;
	overflow:hidden;
}

.personalization a {
	display:block;
	width:186px;
	height:364px;
	float:left;
	background-image:url(../images/personalization_a.jpg);
	background-repeat:no-repeat;
}

.personalization ul li a p {
	margin:0;
	padding:0;
	width:186px;
	height:364px;
	display:none;
	background-image:url(../images/personalization_a.jpg);
	cursor:pointer; cursor:hand;
}

.personalization a span {
	display:none;
}

.personalization a#per_01 {
	background-position: left top;
}

.personalization a#per_02 {
	background-position: left -364px;
}

.personalization a#per_03 {
	background-position: left -728px;
}

.personalization a#per_01 p {
	background-position: -186px top;
}

.personalization a#per_02 p {
	background-position: -186px -364px;
}

.personalization a#per_03 p {
	background-position: -186px -728px;
}

/* contact_form
--------------------------------------------------------- */


.contact_form_main {
	background:#C6A578 url(../images/contact_form.gif) left top no-repeat;
	height:366px;
	position:relative;
}



.contact_form_info {
	width:410px;
	position:absolute;
	left:28px;
	top:130px;
	margin:0;
	padding:0;
	line-height:160%;
	letter-spacing:0;
}

.contact_form_info .zh {
	color:#44301B;
	margin-bottom:8px;
}

.contact_form {
	width:421px;
	height:322px;
	position:absolute;
	right:23px;
	top:20px;
	background:#d1ba96;
	color:#fff;
}

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

#contactForm table {
	width:366px;
	margin:24px auto auto;
	font-family:"Lucida Sans", Arial, Helvetica, sans-serif;
}

#contactForm table td label {
	padding-left:5px;
	font-size:12px;
	letter-spacing:0;
}

.input_td {
	width:142px;
	height:22px;
}

input.input {
	width:130px;
	height:16px;
	border:0;
	background:#ede3d5;
	color:#76654b;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-left:5px;
	}

input.input:focus {
	background:#fff;
	}

textarea.textarea {
	width:310px;
	height:210px;
	border:0;
	background:#ede3d5;
	color:#76654b;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	margin-left:5px;
	}
	
textarea.textarea:focus {
	background:#fff;
	}
	
input#reset {
	width:40px;
	height:18px;
	background:url(../images/clear.gif) left top no-repeat;
	border:0;
	margin-right:10px;
	cursor:pointer; cursor:hand;
	font-size:0;
	text-align:right;
	color:#d1ba96;
}
	
input#submit {
	width:40px;
	height:18px;
	background:url(../images/send.gif) left top no-repeat;
	border:0;
	cursor:pointer; cursor:hand;
	font-size:0;
	text-align:right;
	color:#d1ba96;
}



/* contact
--------------------------------------------------------- */


.contact_main {
	background:#A76420 url(../images/contact.jpg) left top no-repeat;
	height:366px;
	position:relative;
}



.contact {
	width:480px;
	position:absolute;
	left:74px;
	top:74px;
	margin:0;
	padding:0;
	line-height:150%;
}

.contact .en {
	color:#fff;
	margin-bottom:10px;
}

.contact .zh {
	color:#200F00;
	margin-bottom:16px;
}

.contact p {
	margin:0;
	padding:0;
}

a#contact_button {
	width:354px;
	height:70px;
	display:block;
	background:url(../images/contact_button.gif) left top no-repeat;
}

a#contact_button:hover {
	background:url(../images/contact_button.gif) left -70px no-repeat;
}

a#contact_button span {
	display:none;
}

/* faq
--------------------------------------------------------- */

#faq_left {
	width:351px;
	height:476px;
	background:url(../images/faq_left.gif) left top no-repeat;
	position:absolute;
	left:50%;
	top:182px;
	margin-left:-516px;
	z-index:2;
}


.faq_main {
	border-bottom:1px #C4A779 solid;
}

.faq {
	margin-top:30px;
	margin-bottom:170px;
	width:624px;
	clear:both;
	float:right;
	_display:inline;
	margin-right:30px;
	position:relative;
	z-index:10;
}

.faq table {
	width:644px;
}

.faq table tr {
	background:transparent;
}

.faq table tr.hover {
	background: url(../images/faq_hover.gif);
}



td.faq_q_head {
	width:224px;
	padding-bottom:20px;
	padding-top:15px;
	background:#fff;
}

td.faq_a_head {
	width:420px;
	padding-left:22px;
	padding-bottom:20px;
	padding-top:15px;
	background:#fff;
}

.q {
	border-bottom:1px solid #bbb;
	color:#81888E;
	width:224px;
	line-height:26px;
	font-weight:bold;
	font-family:"Lucida Sans Demibold Roman", "Trebuchet MS", Helvetica, Arial, sans-serif;
	font-size:15px;
	letter-spacing:0;
	margin:0;
	padding:0;
}

.a {
	border-bottom:1px solid #C4A779;
	color:#795933;
	width:398px;
	line-height:26px;
	font-weight:bold;
	font-family:"Lucida Sans Demibold Roman", "Trebuchet MS", Helvetica, Arial, sans-serif;
	font-size:15px;
	letter-spacing:0;
	margin:0;
	padding:0;
}

td.faq_n {
	line-height:18px;
	padding-bottom:25px;
	padding-top:10px;
	width:26px;
	text-align:right;
	
}

td.faq_q {
	line-height:18px;
	padding-bottom:25px;
	padding-top:10px;
	width:188px;
}

td.faq_a {
	line-height:18px;
	padding-left:22px;
	padding-bottom:25px;
	padding-top:10px;
	padding-right:10px;
}

td.faq_q .en {
	color:#81888E;
	letter-spacing:0;
	margin-bottom:6px;
	line-height:160%;
	font-size:13px;
}

td.faq_q .zh {
	color:#81888E;
	display:block;
	line-height:170%;
}

td.faq_a .en {
	color:#44301B;
	letter-spacing:0;
	margin-bottom:6px;
	line-height:160%;
	font-size:13px;
	padding-right:5px;
	padding-left:10px;
}

td.faq_a .zh {
	color:#44301B;
	display:block;
	line-height:170%;
	padding-right:5px;
	padding-left:10px;
}




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

#footer {
	width:910px;
	height:32px;
	line-height:32px;
}

#copyright {
	float:right;
	color:#81888E;
	font-size:11px;
	letter-spacing:0;
	font-family:"Century Gothic", "Trebuchet MS", Helvetica, Arial, sans-serif;
}