/* CSS Document */
a:link, a:visited, a:active{ color:0000ee; text-decoration:none}
a:hover{ color:000}
body{ background-image:url(../images/bg.jpg); background-repeat:repeat-x;font-family:"Microsoft JhengHei", arial, helvetica;}
#sitecontainer{ margin: 20px auto 40px auto; background-color:#FFF; width: 948px;  background-image:url(../images/top.jpg); background-position:top; background-repeat:no-repeat;padding:0px 20px 20px 20px;  position:relative}

#shadow{height: auto;margin-left: auto;margin-right: auto; width:1045px;background-position:955px 5px;background-repeat:no-repeat;background-image: url(../images/sdow.jpg)}
/* ---------- toplogo ---------- */
#toplogo{ height:125px}
#toplogo .shop{ background-image:url(../images/shop_gifts.gif); background-repeat:no-repeat; background-position:top left; position:relative; width:126px; height:125px; top:-4px; left:-24px; float:left}
#toplogo #wclogo{ background-image:url(../images/logo.jpg); background-repeat:no-repeat; background-position:top left; position:relative; width:271px; height:46px; display:block; float:left; top:45px; left:-60px; display:block}
#toplogo #tshirt{ background-image:url(../images/icon_shop_tshirt.gif);background-repeat:no-repeat; background-position:top left; float:right; margin-bottom:35px;*margin-bottom:10px; width:50px; height:64px;  display:block}
#toplogo #gifts{ background-image:url(../images/icon_shop_gifts.gif);background-repeat:no-repeat; background-position:top left; float:right; margin-bottom:35px;*margin-bottom:10px; width:50px; height:64px;  display:block}
#toplogo #pins{ background-image:url(../images/icon_shop_pins.gif);background-repeat:no-repeat; background-position:top left; width:50px; height:64px;margin-bottom:35px;*margin-bottom:10px; float:right;  display:block}
#toplogo #online{ background-image:url(../images/icon_shop_online.gif);background-repeat:no-repeat; background-position:top left; width:50px; height:64px; margin-bottom:35px;*margin-bottom:10px; float:right;  display:block}
#toplogo .marks{float:right; top:-6px; position:relative; *width:250px;}
/* ---------- topmenu ---------- */
#topmenu{ height:52px; background-image:url(../images/menu_bg.jpg); background-repeat:repeat-x;}
#topmenu .left{ background-image:url(../images/menu_l.jpg); background-repeat:no-repeat; float:left; width:25px; height:52px}
#topmenu .right{background-image:url(../images/menu_r.jpg); background-repeat:no-repeat; float:right; width:10px; height:52px; background-position:right}
#topmenu ul{ display:block; list-style:none; float:left; width:650px}
#topmenu ul li{ float:left; _width:92px}
#topmenu ul li a{ font-family: Arial,"Microsoft JhengHei"; font-size:14px;_font-size:13px; color:#FFF; text-decoration:none; text-align:center; display:block; height:48px; line-height:48px; font-weight:bold;padding:0px 0px 0px 15px; cursor:pointer}
.appears-english{   font-size: 50%;  }
#topmenu ul li a:hover,#topmenu ul li a.selected{  color: #fff; background-position: left 8px;background-image: url(../images/menu_hover_left.jpg); background-repeat: no-repeat;}
#topmenu ul li a span{display:block;padding:0px; height:50px; padding:0px 15px 0px 0px; }
#topmenu ul li a:hover span, #topmenu ul li a.selected span{color: #FFF;background-image: url(../images/menu_hover_right.jpg);background-repeat: no-repeat;    background-position: right 8px; }
/* - topmenu - search */
fieldset.search {border: none;width: 240px; float:left; margin:12px 0px 0px 22px; *margin:12px 0px 0px 12px;}
.search input, .search button {border: none;float: left;}
.search input.box {color: #000;font-size: 14px;font-family:"Microsoft JhengHei"; 
width: 180px;*width: 170px;height: 23px;*height: 17px;background: #616161 url(../images/search_bg.jpg) no-repeat left top; padding-left:25px; *padding-top:6px;float: left}
.search input.box:focus {background: #616161 url(../images/search_bg.jpg) no-repeat left -25px;outline: none;}
.search button.btn {width: 27px;height: 25px;cursor: pointer;text-indent: -9999px;background: #fbc900 url(../images/search_bg.jpg) no-repeat top right;	float: left}
.search button.btn:hover {background: #fbc900 url(../images/search_bg.jpg) no-repeat bottom right;	}
/* ---------- slidearea ---------- */
#slidearea{ width:948px; margin-top:3px}
#slidearea, #slidearea #slideimage, #slidearea #slidetext{ float:left}
#slidearea #slideimage{ margin:0px 10px 0px 1px; width:683px; border:1px solid #CCC;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px; }
#slidearea #slideimage img{ display:block; border:1px solid #CCC;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px }
#slidearea #slidetext{border:1px solid #CCC;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px; _behavior: url(PIE.htc); width:245px; float:left;  height:295px;font-family:"Microsoft JhengHei";}
#slidearea #slidetext h2{ background-color:#bde81a; display:block;-webkit-border-top-left-radius: 5px; text-align:center; color:#FFFFFF; font-size:14px; font-weight:bold;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
_behavior: url(PIE.htc); 
line-height:25px;}
#slidearea #slidetext div{ width:220px; height:260px; overflow:hidden; display:block; margin:5px auto 5px auto}
#slidearea #slidetext div ul{ height:250px}
#slidearea #slidetext p{font-family:"Microsoft JhengHei"; color:#2a830a; font-size:15px;  line-height:22px}
#slidearea #slidetext a{text-decoration:none;}
#slidearea #slidetext a:hover p{text-decoration:none; color:#2a830a}

#leftslideimage{ width:216px; height:216px; margin:0px 0px 5px 4px}
#leftslideimage img{width:216px; height:216px }
/* ---------- main ---------- */
#main{width:948px; margin-top:3px;float:left; }
/* ---------- left ---------- */
#main #left{ float:left;  width:225px}
#main #left #pcard{ display:block; margin:10px 0px 10px 10px}
#main #left .menutitle{ background-image:url(../images/menu_title.jpg); background-repeat:no-repeat; width:225px; height:40px}
#main #left .menutitle h1{font-family:"Microsoft JhengHei"; font-weight:bold; line-height:38px; color:#FFF; display:block; text-align:center; letter-spacing:5px}
#main #left #leftmenu{ background-color:#f4fcdc; border:solid 8px #d0eda7; width:200px;margin-left:4px;_margin-left:2px; margin-bottom:5px;float:left;-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px }
#main #left #leftmenu ul{ width:170px; margin:0px 0px 15px 15px; _margin:0px 0px 15px 7px}
#main #left #leftmenu ul, #main #left #leftmenu ul li,#main #left #leftmenu ul li a{ display:block; float:left }
#main #left #leftmenu ul li, #main #left #leftmenu ul li a { width:160px;font-family:"Microsoft JhengHei"; font-size:14px }
#main #left #leftmenu ul li{	border-bottom:solid 1px #FFF;}
#main #left #leftmenu ul li a{font-family:"Microsoft JhengHei"; text-decoration:none; color:#2a830a; font-weight:bold; line-height:34px; background-image:url(../images/arrow.gif); background-repeat:no-repeat; background-position:155px;padding-left:10px; cursor:pointer; margin:2px 0px}
#main #left #leftmenu ul li a:hover{ background-image:url(../images/arrow_on.gif); background-repeat:no-repeat;color:#1f5f08; font-weight:bold; line-height:34px; background-color:#FFFFFF; cursor:pointer;-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(PIE.htc)}
#main #left #leftmenu ul li a#active{background-image:url(../images/arrow_on.gif); background-repeat:no-repeat;color:#1f5f08; font-weight:bold; line-height:34px; background-color:#FFFFFF; cursor:pointer;-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
behavior: url(PIE.htc) }
#main #left a#icon{ background-image:url(../images/icon_gildan.gif); width:215px; height:48px; display:block; cursor:pointer;margin:0px 0px 5px 4px;}
#main #left a#icon:hover{ background-image:url(../images/icon_gildan_on.gif)}
#main #left #openhour{width:186px; background-color:#0a831c;padding:15px; margin:0px 0px 5px 4px;  color:#FFF;font-family:"Microsoft JhengHei";-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px; _behavior: url(PIE.htc)}
#main #left #openhour h2{ color:#90fd02; font-weight:bold; font-size:19px; letter-spacing:-1px; display:block; margin-bottom:5px}
#main #left #openhour h2.phone{ font-weight: bolder; font-size:20px;color:#90fd02; font-family:"Arial Black", Gadget, sans-serif;letter-spacing:0px;}
#main #left #openhour p{ font-size:13px; line-height:16px}
a.button{ text-align:center; display:block;color:#555555;font-weight:bold;height:26px;line-height:25px;margin:15px 0px 10px 0px;text-decoration:none; background-image:url(../images/bu_mail.png)}
a.button:hover{ background-image:url(../images/bu_mail.png); background-position:bottom; color:#009}

/* ---------- products ---------- */
#products{ width:715px; float:left; margin:4px 0px 0px 6px;
_margin:4px 0px 0px 0px}
#products h3{ display:block; background-color:#bde81a; height:32px; font-family:"Microsoft JhengHei"; font-weight:bold; color:#FFFFFF; line-height:32px; padding-left:30px}
#products .productcontainer{ float:left; margin:5px 5px 10px 5px; width:167px; font-family:"Microsoft JhengHei";}
#products .productcontainer h4{ display:block; background-color:#e6f5cf; text-align:center; font-size:12px; line-height:22px; font-weight:bold;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px ;_behavior: url(PIE.htc)}


#products .productcontainer .name{ font-size:13px; line-height:24px; color:#000; font-weight:bold; text-align:center}
/* ---------- content ---------- */
#content{ width:675px; float:left; margin:4px 0px 0px 6px;
_margin:4px 0px 0px 0px; padding:0 20px}
#content h1{ font-size:16px; color:#999; line-height:20px; display:block;  margin-top:20px}
#content h2{ font-size:20px; display:block; margin-bottom:5px; color:#339900; font-weight:bold; float:left; width:600px;}

#content p{line-height:24px}
#content .roundbg{position:relative;
display:block;
float:left;
border: 1px solid #cbf9b5;
margin:5px 0px 5px 0px;
padding: 20px 20px 20px 40px;
width: 620px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
background: #f3fdec;
behavior: url(PIE.htc);}
#content .roundbg.gray{background: #eee; border:none }
#content .roundbg .square{	line-height:26px; list-style-type:square; color:#333}
#content .roundbg .decimal{
	line-height:26px;
	list-style-type: decimal; color:#333
}
.s40{display:block; height:30px; float:left; width:100%}
strong{ font-weight:bold; text-decoration: none}


/*General Mosaic Styles*/
.mosaic-block {float:left;position:relative;overflow:hidden;width:165px;height:167px;background:#333 url(../images/progress.gif) no-repeat center center;border:1px solid #CCC;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px ; margin-top:5px}
.mosaic-block img{width:165px; height:167px; }
.details p, .details a{ font-family: Arial ; color:#FFF ; font-size:11px; text-decoration:none; line-height:15px; text-shadow:1px 1px 0 rgb(0,0,0)}
.details p{ padding:5px; text-align:center}
.mosaic-backdrop {display:none;position:absolute;top:0;height:100%;width:100%;background:#333;text-decoration:none}
.mosaic-overlay {display:none;z-index:5;position:absolute;width:100%;height:100%;background:#333;}


/* Page Numbers */
.pages {font-family:"Microsoft JhengHei", arial, helvetica;margin:5px;font-size: 14px; float:left; width:700px; padding-left:}
.pages a, .pages span {color:#003366;display: block;float: left;padding: 0.2em 0.5em;margin-right: 0.1em;border: 1px solid #fff;background: #fff;}
.pages span.current { border: 1px solid #7bb12e;font-weight: bold;background: #7bb12e;color: #fff;}
.pages a {border: 1px solid #b9e59a;text-decoration: none;}
.pages a:hover { border-color: #333;}
.pages a.nextprev {font-weight: bold;}
.pages span.nextprev {color: #666;}
.pages span.nextprev {border: 1px solid #ddd;color: #999;}
.pages .nextprev-next {float: right;}

/* ---------- clients ---------- */
#clients{  width: 948px; background-color:#EEEEEE; margin:0px auto 15px;padding:10px; height:65px;-moz-border-radius: 5px;
			-webkit-border-radius: 5px;border-radius: 5px ;
			behavior: url(PIE.htc)}
#clients h2{ display:block; float:left; width: 940px}

#clients #marquee{ margin: 5px; width:940px;overflow:hidden; float:left}
#clients		#marquee ul li {float:left; padding:0 3px;}
#clients		#marquee ul li img {display:block; border:solid 1px #CCCCCC}
#clients .clientlogo img{ display:block; width:150px; height:auto; float:left; margin:0px 5px}

/* ---------- footer ---------- */
#footer{ width:100%; background-color:#e6f5cf; text-align:center;font-family:"Microsoft JhengHei"; padding:20px 0px 40px 0px; font-size:12px; color:#333}
#footer .link{ display:block; margin-bottom:20px}
#footer a{ color:#666; font-size:11px; }
#footer a:hover{ color:#000}
#footer h1{ font-size:16px; display:block; margin-bottom:10px}
#footer p{ line-height:22px; font-size:11px}
/* ---------- print ---------- */
#print{ float:right; text-align:left }
#print span{ display:block; text-align:left }
#print a.button{ 
	display:block;
	color:#555555;
	font-weight:bold;
	height:43px;
	line-height:48px;_line-height:43px;
	text-decoration:none;
	width:143px;
	background-image:url(../images/bu_print.jpg);
	padding-left:50px
}
#print a.button:hover{ 	background-image:url(../images/bu_print.jpg); background-position:bottom; color:#009}
#google_translate_element{   float:right; *margin-top:-23px; margin-right:5px
}
#fb-root{ *padding-top:30px;}
/* just in case*/
/*#google_translate_element{   float:left; *margin-top:5px; margin-right:5px
}
#fb-root{ padding-top:0px}*/