/* 
base style of site.
www.DingDongQuan.com by www.DingDongQuan.com
Copyright (c) 2010 www.DingDongQuan.com. Please don't steal.
*/

/* SETUP */

body { margin: 0; padding: 0; background: white url(/medias/imgs/bg.gif); }
body, div, td { font: 12px/1.4em Georgia; }
#container { margin: auto; width: 1002px; }

/* LINKS */

a {text-decoration: none;}
a img {border: none;}
a:link { color: blue; }
a:visited { color: gray; }
a:hover { color: red; background-color: pink; }

/* HEADER */

#header { position: relative; height: 60px; }
#logo { position: absolute; width: 300px; height: 60px; }
#flack { position: absolute; left: 305px; width: 320px; height: 60px; }
#set_lang { position: absolute; right: 0; }
#general { position: absolute; right: 0; bottom: 0; line-height: 22px; text-align: right; }

/* NAV */

#nav { clear: both; position: relative; margin-left: 102px; }
#module { clear: both; overflow: hidden; line-height: 24px; }
#module span { position: relative; float: left; font-size: 120%; margin: 0 -1px 0 0; border: 1px solid #092e20; background: white url(/medias/imgs/bg.gif); }
#module a { display: block; padding: 3px 9px; }
#module a:hover { color: white; background: #092e20; }
#m_she-he a:hover { background: red; }
#m_pregnant a:hover { background: aqua; }
#m_baby a:hover { background: purple; }
#m_children a:hover { background: olive; }
#m_young a:hover { background: fuchsia; }
#m_elder a:hover { background: blue; }
#m_diet a:hover { background: gray; }
#m_health a:hover { background: maroon; }
#m_fashion a:hover { background: navy; }
#m_mall a:hover { background: lime; }
#home #m_home a, #she-he #m_she-he a, #pregnant #m_pregnant a, #baby #m_baby a, #children #m_children a, #young #m_young a, #elder #m_elder a, #diet #m_diet a, #health #m_health a, #fashion #m_fashion a, #mall #m_mall a { color: white; background: #092e20; }
#catalogs { clear: both; overflow: hidden; line-height: 28px; color: white; }
#catalogs a { color: white; }
#catalogs a:hover { color: red; }

/* SEARCH */

#search { line-height: 28px; margin: -44px 0 5px; padding: 12px 0 0; border-top: 4px black solid; color: white; background-color: #092e20; text-align: right; vertical-align: middle; }
#sister_sites { margin: -11px auto auto 12px; float: left; text-align: center; vertical-align: middle; font-size: 12px; line-height: 18px; }
#sister_sites a { color: yellow; }

/* FIELDSET & LEGEND */

fieldset { padding: 3px; }
legend { vertical-align: middle; }

/* FORM */

.form_inline { position: relative; display: inline; }
.errorlist { background-color: yellow; }

/* CONTENT */

hr { color: #eee; background-color: #ccc; height: 1px; border: 0; margin: 0; }
h1 { margin-top: 20px; margin-bottom: 15px; font-size: 200%; font-weight: bold; text-align: center; }
h2 { margin-top: 10px; margin-bottom: 5px; font-size: 150%; font-weight: bold; }
h3 { margin-top: 5px; margin-bottom:0; font-size: 125%; font-weight: bold; }

/* HOME */

#focused_topics { float: left; width: 400px; }
#focus_pics { display: inline; position: relative; float: left; width: 400px; height: 300px; overflow: hidden; }
#focus_pic { position: absolute; }
#focus_pic span { overflow: hidden; }
#focus_pic img { width: 400px; height: 300px; }
#focus_btn { display: inline; text-align: center; }
#focus_btn span { float: left; cursor: pointer; opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50); }
#focus_btn img { width: 66px; height: 66px; }
#focus_btn .current { opacity: 1; -moz-opacity: 1; filter: alpha(opacity=100); border: 2px solid #092e20; }
#focus_tdiv { position: absolute; left: 0; bottom: 0; height: 18px; background-color: #eee; opacity: 0.5; -moz-opacity: 0.5; filter: alpha(opacity=50); }
#focus_t { position: absolute; left: 12px; bottom: 6px; font-weight: bold; }
#focus_t .normal { display: none; }
#comment_topics { float: left; width: 100%; }
.ctdiv { padding: 3px 0; width: 400px; }
#recommended_topics { float: right; width: 602px; }
.rdiv { padding: 0 0 5px 5px; float: left; width: 296px; }
.rtdiv { padding-bottom: 5px; width: 100%; height: 75px; }
.rimg { margin-right: 3px; width: 70px; height: 70px; border: 1px solid #092e20; }
.ra { font-size: 120%; font-weight: bold; }
.rtddiv { padding-top: 5px; color: gray; text-indent: 24px; }
.rtrdiv { padding-bottom: 1px; }
.rtrdiv a:link { color: #092e20; }
.ca a:link { color: #f39; }
#topics { float: left; width: 100%; }
#mall_topics { padding: 0 6px; }
.mdiv { padding: 5px; float: left; height: 130px; width: 100px; text-align: center; }
.m_topics { float: left; width: 501px; height: 330px; }
.mrimg { width: 100px; height: 100px; }
.wdiv { float:left; width: 100%; }
#topics ul, #comment_topics ul, #mall_topics ul, .m_topics ul, #trelation ul { margin: 0; padding: 0; }
#topics ul li, #comment_topics ul li, #mall_topics ul li, .m_topics ul li, #trelation ul li { margin: 0 0 0 10px; padding: 3px 5px; display: block; float: left; background-color: #cccccc; border: #cccccc 1px solid; }
#topics ul li.on, #comment_topics ul li.on, #mall_topics ul li.on, .m_topics ul li.on, #trelation ul li.on { border-bottom-color: #fff; background-color: #fff; color: #f39; }
.hidden { display: none }
.tdiv { padding: 3px; float: left; width: 495px; }

/* TOPIC */

#topic { float: left; width: 750px; }
.timg { margin-right: 5px; max-width: 100px; max-height: 100px; }
.page { padding: 3px 7px; font-size:125%; border: 1px solid #092e20; }
.pdiv { padding: 5px; text-align: right; background-color: #eee; }
.ndiv { padding: 5px; }
.cdiv { padding: 5px 0; background-color: #eee; }
.hdiv { padding-bottom: 15px; text-align: center; }
.gdiv { margin: 5px 25px; padding: 5px; min-height: 100px; color: #092e20; font-size: 120%; background-color: #ffeedd; }
.ediv { padding: 5px; font-size: 120%; }
#trelation { float: right; padding-left: 3px; width: 249px; background-color: #eee; }
.trdiv { padding-top: 3px; float: left; width: 249px; font-size: 110%; }

/* MY ZONE */

#my_zone #nav_area { float: left; width: 150px; }
#my_zone ul.zone_nav { list-style: none; margin: 0; padding: 0; }
#my_zone ul.zone_nav li a { display: block; margin: 3px 0; padding: 5px 0 5px 20px; color: #fff; text-decoration: none; }
#my_zone ul.zone_nav li a { background: url(/medias/imgs/member/ouds_ddq_zone_nav_off.gif) no-repeat; }
#my_zone ul.zone_nav li a:hover { background: url(/medias/imgs/member/ouds_ddq_zone_nav_over.gif) no-repeat; }
#my_zone #content_area { float: left; padding: 5px; width: 840px; }
#my_zone #content_area div { padding: 5px; }

/* FOOTER */

#footer { clear: both; padding: 20px; text-align: center; font-size: 90%; }
#footer #statement { margin: 3px; padding: 9px; background-color: #eee; }