@import url(https://fonts.googleapis.com/css?family=Roboto:400,100,500,700);

.email{
	margin-bottom: 10px;
	background-image: url(images/avatar.svg);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: 10px 50%;
}

.password {
	background-image: url(images/keyhole.svg);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: 10px 50%;
}

.email, .email:active, .email:focus, .password, .password:active, .password:focus {
	font-size: 18px;
	font-weight: 100;
	padding-left: 40px;
	padding-right: 20px;
}

.link, .link:hover, .link:active, .link:focus{
	text-decoration: none;
	margin-bottom: 10px;
	font-size: 18px;
	color: rgba(0,0,0,0.7);
	outline: none;
	border: none;
}

.login, .login:hover, .login:active, .login:focus{
	margin-bottom: 15px;
	font-size: 16px;
	font-weight: 700;
	outline: none;
	width: 100%;
	height: 50px;
	border: none;
	color: #eee;
	background: #212121;
	transition: 0.2s ease-in-out;
	-webkit-box-shadow: 0px 5px 0px 0px #0f0f0f;
	-moz-box-shadow: 0px 5px 0px 0px #0f0f0f;
	box-shadow: 0px 5px 0px 0px #0f0f0f;
}

.register, .register:hover, .register:active, .register:focus{
	margin: 20px 0px;
	font-size: 16px;
	font-weight: 700;
	outline: none;
	width: 100%;
	height: 50px;
	border: none;
	color: #eee;
	background: #8BC34A;
	line-height: 2;
	transition: 0.2s ease-in-out;
	-webkit-box-shadow: 0px 5px 0px 0px #48790F;
	-moz-box-shadow: 0px 5px 0px 0px #48790F;
	box-shadow: 0px 5px 0px 0px #48790F;
}

.login:hover{
	background: #131313;
}

.register:hover{
	background: #689F38;
}

::-webkit-input-placeholder {
	font-size: 18px;
	font-weight: 100;
	color: #EEEEEE;
}
:-moz-placeholder { 
	font-size: 18px;
	font-weight: 100;
	color: #EEEEEE;
}

::-moz-placeholder { 
	font-size: 18px;
	font-weight: 100;
	color: #EEEEEE;
}

:-ms-input-placeholder {  
	font-size: 18px;
	font-weight: 100;
	color: #EEEEEE;
}