@charset "utf-8";
/*
Theme Name: dark room - the theme for fast register
Theme URI: http://uedemo.com/
Description: 
Version: Alpha 0.2
Author: jeffery
Author URI: http://uedemo.com/
Tags: black, custom header, fixed width, two columns,three columns widgets
*/
/*@-root: Reset CSS */
	/*@-reset:margin & padding*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}
	/*@-reset:border*/
fieldset, img {
	border: 0;
}
abbr, acronym {
	border: 0;
	font-variant: normal;
}
	/*@-reset:font*/
address, caption, cite, code, dfn, th, var, optgroup {
	font-style: inherit;
	font-weight: inherit;
}
h1, h2, h3, h4, h5, h6 {
	font-weight:700;
}
abbr, acronym {
	border: 0;
	font-variant: normal;
}
input, button, textarea, select, optgroup, option {
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
}
code, kbd, samp, tt {
	font-size: 100%;
}
/*@purpose To enable resizing for IE */
/*@branch For IE6-Win, IE7-Win */
input, button, textarea, select {
 *font-size: 100%;
}
	/*@-reset:line-height*/
body {
	line-height: 1.5;
}
	/*@-reset:list-style*/
/*
ol, ul {
	list-style: none;
}
*/
	/*@-reset:table*/
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
caption, th {
	text-align: left;
}
	/*@-reset:sub & sup*/
sup, sub {
	font-size: 100%;
	vertical-align: baseline;
}
	/*@-reset:a & ins text-decoration*/
/* remember to highlight anchors and inserts somehow! */
:link, :visited, ins {
	text-decoration: none;
}
	/*@-reset:q & blockquote*/
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
/*global class*/
.hidden { display:none; }

/*layout*/
body {
	background-color:#010101;
	color:#aeaeae;
	font:80%/1.5 Georgia, "Times New Roman", Times, serif;
}
a { color:#8e220c; padding-bottom:1px;}
a:hover {
	color:#8e220c;
	text-decoration:underline;
}
figure {
	margin: 0;
}
.fm-layout {
    margin: 0 auto;
}
.fm-layout fieldset {
    border: 1px solid #DCDCDC;
    padding: 10px;
    position: relative;
	display:block;
}
.fm-layout fieldset div.fm-req, .fm-layout fieldset div.fm-opt {
	margin:15px 15px 5px;
	height:40px;
	line-height:40px;
    position: relative;
	clear:both;
	zoom:1;
}
.fm-layout fieldset div.fm-req{
	background:url(../images/input.png) no-repeat 123px 3px transparent;
}
.fm-layout fieldset label, .fm-layout fieldset .label {
    cursor: default;
    float: left;
    padding-right: 24px;
	_padding-right:24px;
    position: relative;
    text-align: right;
    width: 112px;
	height:36px;
	line-height:40px;
	font-size: 16px;
}
.fm-layout fieldset label strong, .fm-layout fieldset .label strong {
    color: #FF3300;
    font-size: 120%;
    font-weight: 700;
    position: absolute;
    right: 10px;
}
.fm-layout fieldset div.fm-multi {
    clear: both;
    margin: 14px 0 0;
    overflow: hidden;
    padding: 0;
}
.fm-layout fieldset div.fm-multi label {
    color: #FF7544;
    display: inline;
    float: none;
    font-family: verdana;
    font-size: 13px;
    font-weight: 700;
    position: static;
	line-height:10px;
}
.fm-layout fieldset div.fm-multi ul {
    float: left;
    list-style: none outside none;
}
.fm-layout fieldset div.fm-verify .verify-code-x {
    display: inline;
}
.fm-layout fieldset div.fm-verify .verify-code-y {
    margin: 5px 0 0 200px;
}
.fm-layout fieldset div.fm-verify img {
    vertical-align: middle;
    width: 155px;
}
.fm-layout div.fm-submit {
    margin: 10px 0;
    text-align: center;
}
.fm-layout div.fm-submit .btn {
    background: none;
    border: 0 none;
    cursor: pointer;
    height: 60px;
	line-height:60;
    letter-spacing: 5px;
    text-align: center;
	text-indent:-999em;
    width: 260px;
	overflow:hidden;
	*display:block;
	zoom:1;
}
.fm-layout fieldset input, .fm-layout fieldset textarea {
	background: transparent;
    border: 1px solid #191410;
 }
.fm-layout fieldset input {
    width: 149px;
	color:#fff;
}
.fm-layout fieldset textarea {
    height: 100px;
    width: 360px;
}
.fm-layout fieldset div.fm-req input {
	height:25px;
	line-height:25px;
	padding-left:5px;
}
.fm-layout fieldset div.fm-multi input {
    border: 0 none;
    width: auto;
}
.fm-layout fieldset input.size50 {
    width: 359px;
}
.fm-layout fieldset input.size24 { width:194px; border-color: transparent;}
.fm-layout fieldset input.size3 {
    width: 30px;
}
.fm-layout fieldset input.size8 {
    width: 60px;
}
.fm-layout fieldset .hint {
    color: #854F15;
	display:none;
}
.fm-layout fieldset .hint-y {
    display: block;
    margin-left: 170px;
}
.fm-layout fieldset .error input {
    /*background: none repeat scroll 0 0 #FFDFDD;*/
    border: 1px solid #FF4621;
}
.fm-layout fieldset .error .hint {
    color: #FF3300;
}
.fm-layout fieldset .remind input {
    /*background: none repeat scroll 0 0 #FFFCC7;*/
    border: 1px solid #F7A900;
}
.fm-layout fieldset .remind .hint {
    color: #F7A900;
}
.fm-layout fieldset .ok input {
    /*background: none repeat scroll 0 0 #E9FFCF;*/
    border: 1px solid #61A216;
}
.fm-layout fieldset input:focus, .fm-layout fieldset input.focus, .fm-layout fieldset textarea:focus, .fm-layout fieldset textarea.focus, .fm-layout fieldset .error input:focus, .fm-layout fieldset .error input.focus, .fm-layout fieldset .error textarea:focus, .fm-layout fieldset .error textarea.focus, .fm-layout fieldset .remid input:focus, .fm-layout fieldset .remid input.focus, .fm-layout fieldset .remid textarea:focus, .fm-layout fieldset .remid textarea.focus, .fm-layout fieldset .ok input:focus, .fm-layout fieldset .ok input.focus, .fm-layout fieldset .ok textarea:focus, .fm-layout fieldset .ok textarea.focus {
    /*background: none repeat scroll 0 0 #E2F5FF;
    border: 1px solid #00A8FF;*/
}
.fm-layout fieldset .check input {
    background-image: url("images/check.gif");
    background-position: 99% 1px;
    background-repeat: no-repeat;
}
/*	
	@name pop-tips
	@author <a href="mailto:dark.gu@gmail.com">Jeffery</a>
	@version 2009.09.09 beta release
*/
.pop-tips {
	background:#fff;
	border:1px solid #52a104;
	line-height:22px;
	position:relative;
	padding:3px;
	width:260px;
	/*border radius*/
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	-webkit-border-top-left-radius:5px 5px;
	-webkit-border-top-right-radius:5px 5px;
	-webkit-border-bottom-right-radius:5px 5px;
	-webkit-border-bottom-left-radius:5px 5px;
	border-top-left-radius:5px 5px;
	border-top-right-radius:5px 5px;
	border-bottom-right-radius:5px 5px;
	border-bottom-left-radius:5px 5px;
}
.pop-tips .pop-tips-skin {
	background:#fcc;
	text-align:center;
}
.pop-tips .tips {
	display:inline-block;
	text-align:left;
	break-word:break-word;
	word-wrap:break-word;
	word-break:break-all;
	padding:0 5px;
}
.pop-tips .arrow {
	display:block;
	height:0;
	line-height:0;
	width:0;
	margin-left:-7px;
	position:absolute;
}
.pop-tips .arrow span {
	position:absolute;
}
	/*.arrow-top*/
.pop-tips .arrow-top {
	border-right:7px dashed transparent;
	border-bottom:8px solid #52a104;
	border-left:7px dashed transparent;
	top:-8px;
	left:50%;
}
.pop-tips .arrow-top span {
	border-right:6px dashed transparent;
	border-bottom:7px solid #fff;
	border-left:6px dashed transparent;
	left:-6px;
	bottom:-8px;
}
	/*.arrow-right*/
.pop-tips .arrow-right {
	border-top:7px dashed transparent;
	border-bottom:7px dashed transparent;
	border-left:8px solid #52a104;
	top:12px;
	right:-8px;
	margin:-7px 0 0;
}
.pop-tips .arrow-right span {
	border-top:6px dashed transparent;
	border-bottom:6px dashed transparent;
	border-left:7px solid #fff;
	left:-8px;
	bottom:-6px;
}
	/*.arrow-bottom*/
.pop-tips .arrow-bottom {
	border-top:8px solid #52a104;
	border-right:7px dashed transparent;
	border-left:7px dashed transparent;
	bottom:-8px;
	left:50%;
}
.pop-tips .arrow-bottom span {
	border-right:6px dashed transparent;
	border-top:7px solid #fff;
	border-left:6px dashed transparent;
	left:-6px;
	top:-8px;
}
	/*.arrow-left*/
.pop-tips .arrow-left {
	border-top:7px dashed transparent;
	border-right:8px solid #52a104;
	border-bottom:7px dashed transparent;
	top:12px;
	left:-8px;
	margin:-7px 0 0;
}
.pop-tips .arrow-left span {
	border-top:6px dashed transparent;
	border-right:7px solid #fff;
	border-bottom:6px dashed transparent;
	right:-8px;
	bottom:-6px;
}
/* -End- pop-tips */

#wrapper { width:100%; margin:0 auto; overflow:hidden;}
#header , #main { margin:0 auto;}
#header { height:195px; }
#logo { width:720px;}
#logo a { display:block; height:175px; line-height:160; width:236px; margin:0 auto; overflow:hidden;}
.column {position:relative; z-index: 20;}
#container .fm-register { width:450px; margin-left: 515px; position:relative; z-index: 20;}
#container .fm-layout { width:430px; height:270px; }
.fm-layout fieldset { color:#000; display:block; margin:0; padding:0; border:0 none; font-weight:bold;}
.fm-layout fieldset legend { display:none;}
.fm-layout fieldset div.fm-multi { margin-top:0px; text-align:center; }
.fm-layout div.fm-submit { height: 100px; margin:0 0 10px 0;}
#footer {
	clear:both;
	display:block;
	font-size:12px;
	height:30px;
	margin-top:50px;
	position:relative;
	text-align:center;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}
#copyright {
    display: block;
    line-height: 180%;
	font-size:10px;
	color:#786345;
}
#footer ul li {
    display: inline-block;
	*display:inline;
	zoom:1;
}
#footer ul li {
    border-right: 1px solid #786345;
    line-height: 12px;
    padding-right: 2px;
}
#footer ul li.last {
    border-right: 0 none;
}
#footer ul li a {
    color: #786345;
    font-size: 12px;
    margin: 0 2px;
}
.pop-tips {
    background: none repeat scroll 0 0 #e7e3c3;
    border: 3px solid #a6804e;
    line-height: 22px;
    padding: 3px;
    position: relative;
    width: 86%;
	display:none;
}
.pop-tips .pop-tips-skin {
    background: none repeat scroll 0 0 #e7e3c3;
	/*color:#854f15;*/
    text-align: left;
}
.pop-tips .arrow-bottom {
    border-left: 11px dashed transparent;
    border-right: 11px dashed transparent;
    border-top: 12px solid #a6804e;
	bottom:-12px;
}
.pop-tips .arrow-bottom span {
    border-left: 8px dashed transparent;
    border-right: 8px dashed transparent;
    border-top: 9px solid #e7e3c3;
    left: -8px;
    top: -14px;
}
.pop-tips .arrow-left {
	border-top:11px dashed transparent;
	border-right:12px solid #a6804e;
	border-bottom:11px dashed transparent;
	top:12px;
	left:-12px;
	margin:-12px 0 0;
}
.pop-tips .arrow-left span {
	border-top:8px dashed transparent;
	border-right:9px solid #e7e3c3;
	border-bottom:8px dashed transparent;
	right:-12px;
	bottom:-8px;
}

#regForm { position:relative;}
#regForm .pop-tips {
    right: 0;
    position: absolute;
    top: 57px;
    width: 180px;
	z-index:99;
}
#regForm .btn-facebook {
	background:url(../images/btn-facebook.png) no-repeat 0 0;
	vertical-align:middle;
	width:38px;
	height:38px;
	line-height:38;
	overflow:hidden;
	display:block;
	text-indent:-999em;
	position:absolute;
	top:116px;
	right:34px;
}

#container .fm-register .fb-comment{
	min-width:100px;
	height:30px;
	position:absolute;
	left:30px;
	top:-28px;
	z-index:10;
}

#wrapper , #header , #main , #container , .container-skin , .main-content {
	background-repeat:no-repeat;
	background-position:center 0;
	background-attachment:scroll;
}
#wrapper { min-width: 1000px; background-position:center bottom;}
#container { background-position:center 170px;}
.container-skin { background-position:center 340px;}
.main-content { background-position:center 510px;}
.main-content-skin { width:1000px; height: 770px; margin:0 auto; position: relative;}
#header-top{width:972px; height:100%; margin:0 auto; position:relative;}
#logo{width:400px; height:300px; position:absolute; left:20px; bottom:-50px;}
#logo h1{display:none;}

.clearfix:before, .clearfix:after{
  content: " "; 
  display: table;
}
.clearfix:after{
  clear: both;
}
.clearfix{
	zoom: 1;
}
.gallery {
	list-style: none outside none;
	width: 390px;
	margin: 10px 10px 10px 548px;
}
.gallery li {
	display: inline;
}
.gallery a {
	cursor: zoom-in;
	display: block;
	float: left;
	width: 179px;
	height: 55px;
	margin: 5px;
	border: 2px solid #a1dfe4;
	overflow: hidden;
}
.gallery img {
	width: 100%;
	height: 100%;
  -webkit-transition: all 0.2s;
     -moz-transition: all 0.2s;
      -ms-transition: all 0.2s;
       -o-transition: all 0.2s;
          transition: all 0.2s;
}
.gallery a:hover img {
  -webkit-transform: scale(1.1,1.1);
     -moz-transform: scale(1.1,1.1);
      -ms-transform: scale(1.1,1.1);
       -o-transform: scale(1.1,1.1);  
          transform: scale(1.1,1.1);
}
.flash {
	position: absolute;
	z-index: 10;
}
.flash .flash-layer {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}
#flashButton {
	width: 260px;
	height: 90px;
	top: 190px;
	right: 130px;
}
#flashLogo {
	width: 350px;
	height: 165px;
	top: -150px;
	right: 79px;
}
#effect-role {
	position: absolute;
	width: 1400px;
	height: 1100px;
	left: -460px;
	top: -195px;
	background-position: 0 0;
	background-repeat: no-repeat;
	-webkit-animation: role 1s linear 0s infinite alternate;
		 -moz-animation: role 1s linear 0s infinite alternate;
		  -ms-animation: role 1s linear 0s infinite alternate;
			 -o-animation: role 1s linear 0s infinite alternate;
					animation: role 1s linear 0s infinite alternate;
}
@keyframes role
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-moz-keyframes role /* Firefox */
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-webkit-keyframes role /* Safari 和 Chrome */
{
0%   {opacity:0;}
100% {opacity:1;}
}

@-o-keyframes role /* Opera */
{
0%   {opacity:0;}
100% {opacity:1;}
}
.text-center {
	margin: 15px 20px;
	font-family: Arial;
	font-size: 12px;
	text-align: center;
	line-height: 16px;
}
/*skin-1*/
.skin-1 #wrapper { background-image:url(../images/1/bg_wrapper.jpg);}
.skin-1 #header { background-image:url(../images/1/bg_header.jpg);}
.skin-1 #main { background-image:url(../images/1/bg_main.jpg); }
.skin-1 #container { background-image:url(../images/1/bg_container.jpg); }
.skin-1 .container-skin { background-image:url(../images/1/bg_container_skin.jpg); }
.skin-1 .main-content { background-image:url(../images/1/bg_main_content.jpg); }
.skin-1 #effect-role {
	background-image:url(../images/1/effect_role.jpg);
}
/*skin-2*/
.skin-2 #wrapper { background-image:url(../images/2/bg_wrapper.jpg);}
.skin-2 #header { background-image:url(../images/2/bg_header.jpg);}
.skin-2 #main { background-image:url(../images/2/bg_main.jpg); }
.skin-2 #container { background-image:url(../images/2/bg_container.jpg); }
.skin-2 .container-skin { background-image:url(../images/2/bg_container_skin.jpg); }
.skin-2 .main-content { background-image:url(../images/2/bg_main_content.jpg); }
.skin-2 #effect-role {
	background-image:url(../images/2/effect_role.jpg);
}