﻿body {
	background: #000;
	padding: 0px;
	margin: 0px;
	font-family: Trebuchet MS;
	background-image: url('../images/3d.jpg');
	-webkit-background-size:100% 100%;
	 -moz-background-size: 100% 100%;/*Firefox*/
	 background-size:100% 100%;
    background-repeat: no-repeat;		
}

p,h1,h2,h3 {
	margin: 0;
	padding: 0;
}

*::-moz-selection {
    background: none repeat scroll 0 0 #fff;
    color: #8CBBC8;
}

@font-face {
	font-family: icons;
	src: url('icons.ttf');
}

#login-form {
	background-image: url("bg.png");
	border-bottom: 3px solid #FFFFFF;

	-webkit-box-shadow: 0 0 10px #000000;
	-moz-box-shadow: 0 0 10px #000000;
	box-shadow: 0 0 10px #000000;
	display: block;
	height: 250px;
	left: 0;
	position: fixed;
	top: 0;
	width: 100%;

	-webkit-transition: all .6s ease-in-out;
	-moz-transition: all .6s ease-in-out;
	-o-transition: all .6s ease-in-out;
	-ms-transition: all .6s ease-in-out;
	transition: all .6s ease-in-out;
}

#login_toggle {
	display: none;
}

#login_toggle:checked + #login-form {
	top: -250px;
}

#toggle {
	background-image: url("../images/bck.jpg");
	border: 3px solid #FFFFFF;
	float: right;
	padding: 5px 50px;
	position: relative;
	right: 80px;
	top: 250px;
	color: #fff;
	border-top: 0px;
	text-shadow: 0 0 1px #000000;
	border-radius: 0 0 4px 4px;
	-webkit-box-shadow: 1px 4px 4px #000000;
	-moz-box-shadow: 1px 4px 4px #000000;
	box-shadow: 1px 4px 4px #000000;
	cursor: pointer;
}

#loginForm, #registerForm {
	right: 10%;
	top: 8%;
}

#input {
	position: relative;
	margin: 0 0 12px;
	height:38px;
}

.input:focus {
	-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) inset;
	-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) inset;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) inset;
}

.input + span {
	background: none repeat scroll 0 0 rgba(65, 72, 72, 0.75);

	-webkit-border-radius: 4px 0px 0px 4px;
	-moz-border-radius: 4px 0px 0px 4px;
	border-radius: 4px 0px 0px 4px;
	color: #FFFFFF;
	font-family: icons;
	font-size: 20px;
	position: absolute;
	top: 6px;
	z-index: -1;

	-webkit-transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	-ms-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
	left: 0;
}

.input:focus + span {
	left: -32px;
	z-index:1;
}

#loginForm .input, #registerForm .input {
	background: none repeat scroll 0 0 #FFFFFF;
	border: 1px solid #FFFFFF;

	-webkit-border-radius: 5px 5px 5px 5px;
	-moz-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;

	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) inset;
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) inset;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) inset;
	color: #9D9E9E;
	font-size: 14px;
	font-weight: 300;
	padding: 15px 25px;
	text-shadow: 1px 1px 0 #FFFFFF;
	width: 250px;
	display: block;
	z-index: 1;

	-webkit-transition: all 0.5s ease 0s;
	-moz-transition: all 0.5s ease 0s;
	-o-transition: all 0.5s ease 0s;
	-ms-transition: all 0.5s ease 0s;
	transition: all 0.5s ease 0s;
}

#loginForm .input:hover, #registerForm .input:hover {
	background: none repeat scroll 0 0 #DFE9EC;
	color: #414848;
}

.submit {
	-webkit-transition: all 0.2s linear 0s;
	-moz-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
	background: none repeat scroll 0 0 #999;
	border: 1px solid #1C6C7A;

	-webkit-border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;

	-webkit-box-shadow: 0 0 5px #fff;
	-moz-box-shadow: 0 0 5px #fff;
	box-shadow: 0 0 5px #fff;
	color: #000;
	cursor: pointer;
	font-size: 14px;
	margin-bottom: 10px;
	padding: 8px 5px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
	width: 99%;
}

.submit:active,.submit:focus {
	background: none repeat scroll 0 0 #999;
	border: 1px solid #0C4C57;

	-webkit-box-shadow: 0 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
	-moz-box-shadow: 0 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
	box-shadow: 0 1px 6px 4px rgba(0, 0, 0, 0.2) inset;
	position: relative;
	top: 1px;
}

.left {
	color: #000;
	float: left;
	width: 300px;
	margin: 15px 35px 10px;
	text-shadow: 0 0 1px #000000;
	-moz-transition:all .6s ease;
}

.center {
	float: left;
	margin: 15px 35px 10px;
}

.right {
	float: left;
	margin: 15px 35px 10px;
}

.grey a {
    color: #fff;
    text-shadow: 0 0 0 #fff;
	-moz-transition:all .6s ease;
}

.left:hover{
	text-shadow: 0 0 0 #fff;
}

.left:hover .grey a{
	text-shadow: 0 0 1px #000000;
}

label span{
	font-family: icons;		
}
#grad {
  background: -webkit-radial-gradient(red 5%, green 15%, blue 60%); /* Safari 5.1-6.0 */
  background: -o-radial-gradient(red 5%, green 15%, blue 60%); /* For Opera 11.6-12.0 */
  background: -moz-radial-gradient(red 5%, green 15%, blue 60%); /* For Firefox 3.6-15 */
  background: radial-gradient(red 5%, green 15%, blue 60%); /* Standard syntax */
}