/* Reset

---------------------------------------------------------------------------------------------------------- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,p,blockquote,th,td {margin:0; padding:0;}

table {border-collapse:collapse;border-spacing:0;}

fieldset,img {border:0;}

address,caption,cite,code,dfn,em,th,var {font-style:normal;font-weight:normal;}

ol,ul {list-style:none;}

caption,th {text-align:left;}

h1,h2,h3,h4,h5,h6 {font-size:100%;}

q:before,q:after {content:'';}

abbr, acronym {border: 0;}



/* Base

---------------------------------------------------------------------------------------------------------- */

body { color:#626365; background:#fff url(../../images/default/body_bg.png) repeat-x 0 0; }

body, button, input, select, textarea {font:12px/1.5 "Verdana", "arial", sans-serif;}

a,img { star:expression(this.onFocus=this.blur()); outline:none;}

a, a:visited { text-decoration:none; color:#8BC53F;}

a:hover { text-decoration:underline; color:#8BC53F}

/*.wordWrap { word-wrap:break-word;}*/



/* Layout

---------------------------------------------------------------------------------------------------------- */

#mainContainer, #mainContainerBottom { width:957px; padding:0 5px; margin:auto; background:url(../../images/default/main_container_bg.png) repeat-y 0 0;}

	#header { height:92px; background: url(../../images/default/header_bg.png) no-repeat 0 0; position:relative;}

	#mainBody { background:url(../../images/default/main_body_bg.png) no-repeat left bottom; min-height:300px; padding:8px;}

	* html #mainBody { height:1%;}

	#footer { font-size:11px; color:#8a8a8a;  background:url(../../images/default/footer_bg.png) repeat-x 0 2px; height:107px; position:relative;}

#mainContainerBottom { height:10px; overflow:hidden; background-position:-967px 0;}



/* Module

---------------------------------------------------------------------------------------------------------- */

/* logo */

.logo { position:absolute; left:44px; top:11px; width:255px; height:80px; background:url(../../images/default/logo.png) no-repeat 0 0; z-index:4;}

.logo h1 a { display:block; width:255px; height:80px;}

.logo h1 span { text-indent:-5000px; display:block;}

/* end logo */



/* login */

.login { position:absolute; right:10px; top:10px; z-index:4;}

.userLogined { text-align:right; font-size:11px; font-weight:bold; color:#fef106;}

.userLogined strong { color:#fff;}

.logoutBtn, .logoutBtn:visited { color: #006837;  text-decoration:underline;}

.logoutBtn:hover {color:#ff6a00; }

/* end login */



/* mainNav */

.mainNav { padding:37px 0 0 328px; width:600px;}

.mainNav ul {padding:0;margin:0; list-style-type:none; background:transparent;}

.mainNav ul li {float:left; height:33px; line-height:33px; display:block; margin-right:10px;}

.mainNav ul ul li {display:block; height:auto; padding:5px 0; margin:0;}



/* style the links for the top level */

.mainNav a, .mainNav a:visited {display:block; float:left; height:33px; width:97px; text-decoration:none; color:#000; text-align:left;border:0; color:#006837; text-align:center; background:url(../../images/default/main_nav_bg.png) no-repeat 0 0;}

.mainNav a span { display:none;}



.mainNav a.aboutUs, .mainNav a.aboutUs:visited { background-position:0 0;}

.mainNav a.gameDetails, .mainNav a.gameDetails:visited { background-position:-107px 0; width:121px;}

.mainNav a.parents, .mainNav a.parents:visited { background-position:-238px 0;}

.mainNav a.playNow, .mainNav a.playNow:visited { background-position:-345px 0;}



/* style the sub level links */

.mainNav ul ul a, .mainNav ul ul a:visited {display:block; font-size:11px; color:#5e3217; border-right:1px solid #5e3217; padding:0 11px 0 11px; width:auto; height:100%; line-height:11px; background:transparent;}

.mainNav ul ul .last a, .mainNav ul ul .last a:visited {border-right:none;}



/* style the table so that it takes no part in the layout - required for IE to work */

.mainNav table {border-collapse:collapse; padding:0; margin:-1px; width:0; height:0; font-size:1em; z-index:1;}



/* style the level hovers */



/* first */



/* for ie6 hover and actived */

* html .mainNav a:hover {color:#fff; border:0; height:33px; position:relative; z-index:100; }

* html .mainNav a:hover, * html .mainNav .actived a {  text-decoration:none; background:url(../../images/default/main_nav_bg.png) no-repeat 0 -40px}

* html .mainNav a.aboutUs:hover, * html .mainNav .actived a.aboutUs, * html  .mainNav .actived a.aboutUs:visited { background-position:0 -40px}

* html .mainNav a.gameDetails:hover, * html .mainNav .actived a.gameDetails, * html  .mainNav .actived a.gameDetails:visited{background-position:-107px -40px; width:121px;}

* html .mainNav a.parents:hover, * html .mainNav .actived a.parents, * html  .mainNav .actived a.parents:visited{background-position:-238px -40px;}

* html .mainNav a.playNow:hover, * html .mainNav .actived a.playNow, * html  .mainNav .actived a.playNow:visited {background-position:-345px -40px;}



* html  .mainNav .actived a:visited .subNav a {display:block; position:relative;}



.mainNav li:hover {position:relative;}

.mainNav :hover > a { color:#fff; border:0; height:33px; background:url(../../images/default/main_nav_bg.png) no-repeat 0 0;}

.mainNav :hover > a.aboutUs, .mainNav .actived a.aboutUs {background-position:0 -40px;}

.mainNav :hover > a.gameDetails, .mainNav .actived a.gameDetails {background-position:-107px -40px; width:121px;}

.mainNav :hover > a.parents, .mainNav .actived a.parents {background-position:-238px -40px;}

.mainNav :hover > a.playNow, .mainNav .actived a.playNow {background-position:-345px -40px;}



/* second */

* html .mainNav ul ul a:hover{color:#ff6a00; border-right:1px solid #5e3217; background:transparent; position:relative; z-index:110; height:100%; }

.mainNav ul ul li:hover {position:relative;}

.mainNav ul ul :hover > a {color:#ff6a00; border-right:1px solid #5e3217; background:transparent; z-index:110; height:100%; }

.mainNav ul ul .last > a { border-right:none;}



/* hide the sub levels and give them a positon absolute so that they take up no room */

.mainNav ul .subNav { position:absolute; height:0; top:33px; left:0; width:360px; }

.mainNav ul ul { visibility:hidden; position:absolute; background:url(../../images/default/main_nav_bg.png) no-repeat 0 -80px;}

.mainNav ul ul .last { background:url(../../images/default/main_nav_bg.png) no-repeat right -80px;}



/* make the second level visible when hover on first level list OR link */

.mainNav ul :hover ul { visibility:visible; height:auto; padding:0; left:0px; }



/* end mainNav */



/* formTable */

.formTable table{ width:100%;}

.formTable table tbody tr th, .formTable table tbody tr td { padding:0px 10px; table-layout:fixed; vertical-align:top;}

.formTable table tbody tr th { font-weight:normal; text-align:right; padding-top:5px; padding-bottom: 5px;}

.formTable table tbody tr td { padding-bottom: 5px;}

.formTable table tfoot tr td {padding:10px; }

.required {}

.message { color:#ff0101; font-size:11px; clear:both }

.tips{ padding-top:5px; color:#8BC53F}

.gender{ padding-top:5px;}

.gender label{ float:left; margin-right:25px; display:inline;}

.agreement { padding-top:10px;}

.agreement label{ margin-bottom:10px; overflow:hidden; display:block;}

.agreement a,.agreement a:visited{ color:#8bc53f;}



* html .agreement label{ height:1%;}



.formTable .text, .formTable .textarea { height:18px; border: none; width:230px; padding:4px 0; color:#92c84a}

.formTable .textarea { height:auto;}

.formTable .textData{ padding-top:4px;}

/* radius and shadow for firefox, safari, chrome */

/*.formTable .text, .formTable .textarea {-moz-border-radius: 3px;  -khtml-border-radius: 3px;  -webkit-border-radius: 3px;  border-radius: 3px; -webkit-box-shadow: 2px 2px 2px #ccc; -moz-box-shadow: 1px 1px 1px #ccc; box-shadow: 2px 2px 2px #ccc;}*/



/* end formTable */



/* formBtn */

.btn { background:url(../../images/default/form_btn_bg.png) no-repeat 0 0; width:92px; height:35px; display:block; cursor:pointer; border:none;}

.btn span { display:none;}



.submitBtn { background-position:0 0;}

.submitBtn:hover { background-position:0 -45px;}



.nextBtn { background-position:-92px 0;}

.nextBtn:hover { background-position:-92px -45px;}

.nextBtnDisabled, .nextBtnDisabled:hover { background-position:-92px -90px; cursor:text;}



.sendBtn { background-position:-184px 0;}

.sendBtn:hover { background-position:-184px -45px;}



.loginBtn { background-position:-276px 0; width:120px; height:45px; margin:auto;}

.loginBtn:hover { background-position:-276px -45px;}



/* end formBtn */



/* content bar */

.contentBar .title { margin-bottom:30px; }

.contentBar .content { position:relative; min-height:410px;}

* html .contentBar .content { height:410px;}

.contentBar h3 { font-size:19px; color:#8bc541; font-weight:normal; margin-bottom:20px;}

.contentBar h4 { color:#8bc541; font-weight:normal; margin-bottom:10px;}

.contentBar p { margin-bottom:20px; line-height:24px; text-align:justify; text-justify:inter-ideograph;}

.contentBar .highlight { font-size:19px; color:#8bc541;}



.contentBar .alignLeft { position:absolute; left:-40px; top:0; width:300px; text-align:center;}

.article .contentBar .alignLeft { top:-30px;}

.contentBar .alignCenter { text-align:center;}



.article, .form { padding:40px 68px 40px 116px;}

.article .title, .detailBar{ padding-left: 280px;}

.formBar { padding:0 0 40px 260px;}

.formBar table tbody tr th {height:42px}

/* end content bar */



/* footer */

.relatedLink { position:absolute; left:30px; bottom:27px; color:#006837;}

.relatedLink a,.relatedLink a:visited{ color:#006837}

.copyright { text-align:center; right:30px; bottom:20px; padding-right:41px; height:31px; line-height:31px;}

/* end footer */



/* Home

----------------------------------------------------------------------------- */

#home #mainBody  { background:none; }

#home #footer { background:none; height:50px;}



/* Login

----------------------------------------------------------------------------- */

.loginBar { background:url(../../images/default/login_bar_bg.png) no-repeat 0 0; width:200px; height:215px; padding:60px 240px 10px 160px; margin:-50px 0 30px 50px; text-align:center; }

.loginBar .formTable .text { height:16px; border:none; width:156px; padding:4px;}

.loginBar .formTable table tbody tr th, .loginBar .formTable table tfoot tr td { text-align:center;}



.forgotPassword, .forgotPassword:hover { font-size:13px; color:#fd8b0b; text-decoration:none; padding-right:20px; background:url(../../images/default/forgot_password_icon_bg.png) no-repeat right center;}

.signupNowBar { margin-left:200px;}

.signupNowBar span { display:none;}

.signupNow, .signupNow:hover { background:url(../../images/default/signup_now_btn_bg.png) no-repeat 0 0; width:259px; height:64px; display:block;}



/* Game

----------------------------------------------------------------------------- */

.gameFlash { padding-bottom:40px;}



/* line

----------------------------------------------------------------------------- */

.line{border-top: 2px dotted #a2c073;padding-right:20px; width:420px}



/* jNice part

----------------------------------------------------------------------------- */

.jNiceInputWrapper {	background: transparent url(../../images/default/input_left.gif) no-repeat left top;	height: 32px;	padding: 0px;}

.jNiceInputInner {	background: transparent url(../../images/default/input_right.gif) no-repeat right top;	padding: 2px 4px 2px 0px;	margin-left:2px;}

.jNiceInputInner div {	height: 26px;}

.jNiceInputInner input {line-height: 18px;vertical-align: middle;height: 17px;color:#404040;border: 0;padding:0px;margin: 0px;}

.jNiceSafari .jNiceInputInner div {position: relative;overflow: hidden;}



.jNiceSafari input {background-color: none;position: absolute;top: -2px;left: -4px;height: 26px; }

.jRadioWrapper, .jCheckboxWrapper {float: left; margin-right:5px; display:inline;}

.jNiceRadio {background: url(../../images/default/radio.gif) no-repeat center top;vertical-align: middle;height: 18px;width: 18px;display:block;}



.jNiceCheckbox {background: url(../../images/default/checkbox.gif) no-repeat center top;vertical-align: middle;height: 18px;width: 18px;display:block}

.jNiceChecked { background-position: center bottom;}

.jNiceSelectWrapper {background:url(../../images/default/input_left.gif) no-repeat;	position:relative;height: 32px;color:#8bc53f;margin-right:5px;}

.setDate .jNiceSelectWrapper{ width:78px; float:left; margin-right:5px;}

.setDate .jNiceSelectWrapper ul{ width:76px;} 



.jNiceSelectWrapper div span {float: none;position: absolute;height: 26px;line-height: 26px;padding: 3px 5px;overflow: hidden;border: none;}

.jNiceSelectWrapper div a.jNiceSelectOpen {display: block;height: 32px;background: url(../../images/default/select_right.gif) no-repeat top right;color:#8BC53F;}

.jNiceSelectWrapper div a.jNiceSelectOpen:hover {text-decoration:none;}

.jNiceSelectWrapper ul {position: absolute;width: 240px;top: 30px;left: 0px;list-style: none;background-color: #FFF;border: solid 1px #8bc53f;display: none;margin: 0px;padding: 0px;height: 150px;z-index:100; overflow:auto}



.jNiceSelectWrapper ul li a,.jNiceSelectWrapper ul li a:visited {display: block;padding: 5px;text-decoration: none;color:#8bc53f;background-color: #FFF;}

.jNiceSelectWrapper ul li a:hover { background:#d3eda6;text-decoration: none; }

.jNiceSelectWrapper ul li a.selected,.jNiceSelectWrapper ul li a.selected:visited {background: #EDEDED;}

.jNiceHidden {display: none;}