/* default login css */

/*intro css */
#intro_top { width:100%; z-index:1; position:relative; height:auto; padding:80px 0; background:#03add8; background-repeat:no-repeat; background-size:100% auto; background-position:center -50px; background-attachment:fixed; }
#login_wrap { width:100%; height:100%; background: black;}
#login_all { width:520px; max-width:94%; border-radius:20px; display:block; margin:0 auto; color:#fff; }
.intro_social_container { width:100%; height:auto; text-align:center; padding-top:20px; }
.intro_social_btn { display:inline-block; width:40px; height:40px; margin:0 3px; border-radius:50%; }
.login_not_member { text-align:center; padding-top:5px; }

/* active_user intro  */
#intro_section_user { padding:72px 0; }
.active_user { height:110px; text-align:center; float:left; overflow:hidden; }
#last_active { width: 100%; height:110px; margin:0 auto; }
.active_avatar { width:110px; height:110px; border-radius:50%; }
#last_active .left-arrow,
#last_active .right-arrow { width: 0; height: 0; border-top: 10px solid transparent;  border-bottom: 10px solid transparent;  margin-top: 5px; cursor: pointer; margin-top:40px; }
#last_active .left-arrow {  float: left; border-right: 10px solid #ccc; display:none;}
#last_active .left-arrow:hover { border-right: 10px solid #000; }
#last_active .right-arrow { float: right;  border-left: 10px solid #ccc; display:none; }
#last_active .right-arrow:hover { border-left: 10px solid #000; }
#last_active .last-clip {  margin: 0 20px; overflow: hidden; position: relative; }
#last_active .last_10 { height: 110px; width: 10000%;  overflow: hidden;  position: relative; }

/* section css */
.section { width:100%; height:auto; margin:0 auto;background: black;}
.section_content { width:100%; max-width:1100px; margin:0 auto; }
.section_inside { margin:0 auto; }

@media screen and (max-width:1120px){
	.section_inside { width:96%; }
}
@media screen and (min-width:1121px){
	#intro_top { background-attachment: fixed; }
}
@media screen and (max-width:1100px){
	#intro_top { padding: 40px 0; }
}
@media screen and (max-width:768px){
	#intro_top { padding: 30px 0;  }
}
#intro_top:before {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    content: ' ';
    background: rgba(0, 0, 0, 0.6);
}

.forms {
    margin: 0 auto;
    max-width: 500px;
    min-height: 599px;
    overflow: hidden;
    position: relative;
    padding: 0;
    /*background: url(images/loginbg.jpg) no-repeat center;*/
    box-shadow: 0 12px 15px 0 rgba(0,0,0,.24), 0 17px 50px 0 rgba(0,0,0,.19);
}
}
.login {
    padding: 20px;
}
#register { display: none; }
#guest { display: none; }
#login, #register, #guest  {
	width: 100%;
	height:100%;
	position:absolute;
	padding: 70px 50px 50px 50px;
	background: rgba(0, 0, 0, 0.68);
}
.forms .tab-group {
	list-style: none;
	padding: 0;
	margin: 0;
	background: rgba(0, 0, 0, 0.9);
}
.forms .tab-group:after {
	content: "";
	display: table;
	clear: both;
}
.forms .tab-group li a {
	display: block;
	text-decoration: none;
	padding: 18px;
	background: rgba(0, 0, 0, 0.5);
	color: #8e8e8e;
	font-size: 18px;
	float: left;
	width: 33.334%;
	text-align: center;
	border-top: 3px solid transparent;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.forms .tab-group li a:hover {
	background: #dedfdf;
	color: #666;
}
.forms .tab-group .active a {
	background: #000000;
	color: #fff;
	border-bottom: 3px solid #1161ee;
}
.forms .group{
	margin-bottom:15px;
}
.forms .group .label,
.forms .group .input,
.forms .group .button{
	width:100%;
	color:#fff;
	display:block;
}

.forms .group .input,
.forms .group select,
.forms .group .button{
	padding:15px 20px;
	border-radius:25px;
	width: 100%;
	border: 1px solid #3f3f3f !important;
	background:rgba(255,255,255,.1);
}
.forms input:focus {
	outline: 0;
	border-color: #2e5ed7;
}
.forms .group .label{
	color:#fff;
	font-size:12px;
}
.forms .group .button{
	border:none;
	background:#1161ee;
}
.forms .group select{
    color: #fff;
}
.forms .group option{
	background:#000;
}
.forms .button:hover, .button:focus { background: #56ae26; }
.text-p { text-align: right; }
.text-p a { color: #1383ea; }