@charset "utf-8";
/* CSS Document */
@import "reset.css";
/******************************************* HTML */ 
html { overflow-y: scroll }
body { position: relative; text-align: center; min-width: 946px; font-family: Tahoma, Geneva, sans-serif; font-size: 62.5%;
	line-height: 1.2em; background: url(../../images/bg/bg_body.png) top left repeat }
	
/******************************************* Layout */ 
#wrapper { position: relative; text-align: left; width: 946px; margin: 0 auto; z-index: 0 }
#wrapper .b1 { height: 354px; width: 76px; background: url(../../images/bg/bg_balloons1.png) top left no-repeat; z-index: 1;
	position: absolute; top: 0; left: -38px }
#wrapper .b2 { height: 220px; width: 77px; background: url(../../images/bg/bg_balloons2.png) top left no-repeat; z-index: 1;
	position: absolute; bottom: 30px; left: -45px }
#wrapper .b3 { height: 289px; width: 71px; background: url(../../images/bg/bg_balloons3.png) top left no-repeat; z-index: -1;
	position: absolute; top: 160px; left: -55px }
#wrapper .b4 { height: 274px; width: 107px; background: url(../../images/bg/bg_balloons4.png) top left no-repeat; z-index: -1;
	position: absolute; top: 100px; right: -90px }
/******************************************* Header */ 
#header { position: relative; height: 115px }
#header .logo { width: 306px; height: 97px; position: absolute; top: 8px; left: 60px }

#header ul#nav { position: absolute; bottom: 12px; left: 625px }
#header ul#nav li { float: left; margin-right: 5px; color: white }
#header ul#nav li.last { margin: 0 }
#header ul#nav li a { text-decoration: none; color: #5dafc3; font-size: 12px; line-height: 1.2em; font-weight: bold; padding-right: 5px }
#header ul#nav li a:hover { text-decoration: underline }

#header #search { position: absolute; top: 50px; right: 10px; width: 310px }
#header #search p a { text-decoration: none; font-size: 1.6em; font-weight: bold; color: white }
#header #search p a:hover { text-decoration: underline }
#header #search input#kw { float: left; border: 0; height: 20px; width: 240px; margin-right: 10px; padding: 3px; font-size: 1.8em; line-height: 20px }
#header #search input { float: right; height: 27px }
#header #search ul#kw_search { display: none; position: absolute; top: 26px; left: 0; z-index: 10; background: white; width: 246px; 
	/*width: 463px; padding: 3px;*/ filter: alpha(opacity=80); -moz-opacity: .80; opacity: .80;}
#header #search ul#kw_search li { font-size: 1.2em; padding: 5px; cursor: pointer; border-bottom: 1px dashed #CCC }
#header #search ul#kw_search li.hover { background: #FF6 }

/******************************************* Content */ 
#content-wrap { position: relative }
#content-wrap .panel { width: 100% }
#content-wrap .panel > .top { width: 100%; height: 8px; background: url(../../images/bg/bg_content_top.png) top center no-repeat }
#content-wrap .panel > .mid { padding: 0 3px; position: relative; overflow: auto; 
	background: url(../../images/bg/bg_content_mid.png) top center repeat-y }
#content-wrap .panel > .btm { width: 100%; height: 8px; background: url(../../images/bg/bg_content_btm.png) top center no-repeat }

#content { overflow: auto; width: 700px; float: left; margin: 20px 0 20px 20px }
#content #intro, #content .intro { margin: 0 18px 8px 18px; font-size: 1.2em; line-height: 1.8em; text-align: justify; color: #444 }

#content .intro { padding-bottom: 10px; border-bottom: 1px dashed #CCC }
#content .intro h2 { margin: 5px 0; padding: 0 }
#content #intro a, #content .intro a { text-decoration: none; color: #0B77BF }

#content table { width: 100% }
#content table th,
#content table td { padding: 10px; color: #666 }
#content table td { border-left: 1px dashed #CCC; border-bottom: 1px dashed #CCC; text-align: center; height: 230px; width: 24%; 
	/*background: url(../../images/bg/bg_results_table.png) bottom left repeat-x*/ }
#content table td:first-child { border-left: none }
#content table td ul { position: relative; height: 100% }
#content table td ul li { text-align: left }
#content table td ul li h3 { font-size: 1.2em; color: #666; font-weight: normal; margin-bottom: 5px; line-height: 1.2em }
#content table td ul li strong { font-size: 1.3em; color: black; text-align: left }
#content table td ul li p { text-align: left; margin-top: 5px }
#content table td ul li p.now { text-align: center !important; position: absolute; left: 0; bottom: 38px; width: 100% }
#content table td ul li a img.buy { position: absolute; bottom: 0; left: -3px } /* -3px */
#content table td ul li a img.more { position: absolute; bottom: 0; right: -3px }

/******************************************* Sidebar */
#sidebar { position: relative; width: 180px; margin: 20px; margin-left: 0; float: right; background: #E1F1FE }
#content-wrap #sidebar .top { width: 100%; height: 3px; background: url(../../images/bg/bg_sidebar_top.png) top center no-repeat;
	position: absolute; top: 0; left: 0 }
#content-wrap #sidebar .btm { width: 100%; height: 3px; background: url(../../images/bg/bg_sidebar_btm.png) top center no-repeat;
	position: absolute; bottom: 0; left: 0 }
	
#sidebar .title { height: 20px; line-height: 20px; padding-left: 10px; background: url(../../images/bg/bg_sidebar_hdr.png) center center no-repeat; 
	font-size: 16px }
#sidebar ul { margin: 10px; margin-top: 0 }
#sidebar ul li { line-height: 1.6em }
#sidebar ul li a { text-decoration: none; color: #0B77BF }
#sidebar ul li a:hover { text-decoration: underline }

/******************************************* Footer */ 
#footer { height: 60px; width: 946px; margin: 0 auto; text-align: right }
#footer p { margin: 5px 0 }
#footer a { color: #5DAFC3 }

/******************************************* PAGES */ 
/******************************************* [Home] */ 
#home #featured { height: 220px; width: 100% }

/******************************************* [Article] */ 
#article #intro h1 { padding-left: 0; font-size: 18px }
#article #intro p { margin-bottom: 10px }

/******************************************* [Resources] */ 
#resources #intro h1 { font-size: 18px; line-height: 24px; font-family: Georgia, "Times New Roman", Times, serif;
	width: auto; height: auto; margin: 0; text-indent: 0; background: none; color: #EE3680 }
#resources #intro ul { margin: 10px 0 }
#resources #intro ul li { line-height: 1.6em }
#resources #intro ul li a { text-decoration: none; color: #0B77BF }
#resources #intro ul li a:hover { text-decoration: underline }

/******************************************* [Not Found] */ 
#notfound #intro h1 { font-size: 18px; line-height: 24px; font-family: Georgia, "Times New Roman", Times, serif;
	width: auto; height: auto; margin: 0; text-indent: 0; background: none; color: #EE3680 }
#notfound #intro h2 { color: #0B77BF; font-size: 14px; line-height: 20px; font-family: Georgia, "Times New Roman", Times, serif }

/******************************************* [Product Detail] */
#product #wrap { /*background: url(../../images/bg/bg_results_table.png) bottom left repeat-x;*/ overflow: auto; padding-top: 15px }
#product #col-a { width: 460px; float: right; height: 100% }
#product #col-a h1 { font-size: 2em; line-height: 1.2em; font-family: Georgia, "Times New Roman", Times, serif;
	width: auto; height: auto; margin: 0; text-indent: 0; background: none; color: #05A9DC }
#product #col-a h2 { color: #EE3680; font-size: 2.6em; line-height: 1.6em; font-family: Georgia, "Times New Roman", Times, serif }
#product #col-a p { font-size: 1.2em; margin-bottom: 5px; line-height: 1.8em; color: #444 }
#product #col-a p.find { text-align: center; padding: 15px 0 10px }
#product #col-a p.find a { text-decoration: none; padding: 8px; color: white; background: #EE3680; font-weight: bold; font-size: 1.2em; -moz-border-radius: 5px;
	-webkit-border-radius: 5px; border-radius: 5px; text-shadow: 1px 1px 1px #999 }
#product #col-a p.find a:hover { text-decoration: underline }
#product #col-a p.now { text-align: left; margin: 25px 0 }
#product #col-a p.now span { padding: 10px }
#product #col-a p.buy { text-align: center; margin-top: 10px }
#product #col-a a { text-decoration: none; color: #05A9DC }
#product #col-a a:hover { text-decoration: underline }

#product #col-b { width: 230px; margin-left: 10px; float: left; height: 100% }
#product #col-b img { border: 1px dashed #CCC; max-width: 200px }

/******************************************* Generic Styles */ 
/* Paging */
.sort { height: 15px; padding: 3px 10px; line-height: 13px; clear: both }
.sort .sortby { width: 60%; float: left; text-align: left }
.sort .sortby span { padding-right: 5px }
.sort .sortby span a { text-decoration: none }
.sort .paging { width: 40%; float: right; text-align: right}
.sort .paging a { color: #5DAFC3 }

/* Refine */
#refine li { font-weight: bold; color: #666666 }

/* Product Listing / Detail */
.title { font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; padding: 8px 13px; margin: 2px 5px;
	color: #EE3680 }
.p-img { height: 100px; width: 100px; margin-bottom: 10px }
.rrp { text-align: left; text-decoration: line-through }
.save { text-align: left; color: #EE3680; font-weight: bold }
.now { color: black; font-weight: bold; font-size: 1.4em }
.now span { padding: 3px 5px; background: #F7F699 }
#lp-img { position: absolute; padding: 10px; background: #BBD9F2; z-index: 10 }
#lp-img img { height: 220px; width: 220px }
#lp-img .balloon { height: 220px; width: 77px; background: url(../../images/bg/bg_balloons2.png) top left no-repeat; z-index: 20;
	position: absolute; bottom: 55px; right: -35px }

.red { color: #bc506b }
.green { color: #5dafc3 }