html,body,div,span,applet,object,iframe,h1,h2,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
    display: block;
}

body {
    line-height: 1;
}

ol,ul {
    list-style: none;
}

blockquote,q {
    quotes: none;
}

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

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

:invalid {
    box-shadow: none;
}

:-moz-submit-invalid {
    box-shadow: none;
}

:-moz-ui-invalid {
    box-shadow: none;
}


body {
	background: #f2f3f4;
	font-family: Roboto, sans-serif;
	font-weight: 400;
}
input {
	filter: none;
}
#login {
	position: absolute;
	top: 45%;
	left: 50%;
	transform: translate(-50%, -45%);
	width: 100%;
	max-width:380px;
	height: 400px;
	line-height: 1.5;
	display: block;
	text-align: center;
	box-sizing: border-box;
}

#login-box h2 {
	font-size: 29px;
	font-weight: 300;
	line-height: 1.2;
	text-align: left;
	margin-bottom: 30px;
	color: rgba(0,0,0,0.4);
}

#login-box {
	position: absolute;
	left: 0;
	width: 100%;
	max-width:380px;
	background: #fff url("logo.svg?2.5") left 19px top 18px no-repeat;
	background-size: 230px;
	border-top: 0px solid #1C5CE8;
	padding: 100px 35px 35px 35px;
	text-align: left;
	box-sizing: border-box;
	border-radius: 15px;
	z-index: 100;
	box-shadow: 0 3px 12px rgba(0, 0, 0, 0.03), 0 3px 12px rgba(0, 0, 0, 0.07);
}


h2 {
	font-size: 29px;
	font-weight: 300;
	line-height: 1.3;
	text-align: left;
	margin-bottom: 30px;
	color: #42576c;
}
h3 {
	font-size: 17px;
	font-weight: 300;
	text-align: left;
	margin: 6px 0 50px 0;
	color: #42576c;
}
a {
	font-size: 18px;
	font-weight: 300;
	color: #7289DA;
	text-decoration: none;
}
a:hover {
	color: #242424;
}
input[type="text"] {
	background: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDQzOC41MjkgNDM4LjUyOSIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDM4LjUyOSA0MzguNTI5OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPGc+CgkJPHBhdGggZD0iTTIxOS4yNjUsMjE5LjI2N2MzMC4yNzEsMCw1Ni4xMDgtMTAuNzEsNzcuNTE4LTMyLjEyMWMyMS40MTItMjEuNDExLDMyLjEyLTQ3LjI0OCwzMi4xMi03Ny41MTUgICAgYzAtMzAuMjYyLTEwLjcwOC01Ni4xLTMyLjEyLTc3LjUxNkMyNzUuMzY2LDEwLjcwNSwyNDkuNTI4LDAsMjE5LjI2NSwwUzE2My4xNiwxMC43MDUsMTQxLjc1LDMyLjExNSAgICBjLTIxLjQxNCwyMS40MTYtMzIuMTIxLDQ3LjI1My0zMi4xMjEsNzcuNTE2YzAsMzAuMjY3LDEwLjcwNyw1Ni4xMDQsMzIuMTIxLDc3LjUxNSAgICBDMTYzLjE2NiwyMDguNTU3LDE4OS4wMDEsMjE5LjI2NywyMTkuMjY1LDIxOS4yNjd6IiBmaWxsPSIjNDQ0NDQ0Ii8+CgkJPHBhdGggZD0iTTQxOS4yNTgsMzM1LjAzNmMtMC42NjgtOS42MDktMi4wMDItMTkuOTg1LTMuOTk3LTMxLjEyMWMtMS45OTktMTEuMTM2LTQuNTI0LTIxLjQ1Ny03LjU3LTMwLjk3OCAgICBjLTMuMDQ2LTkuNTE0LTcuMTM5LTE4Ljc5NC0xMi4yNzgtMjcuODM2Yy01LjEzNy05LjA0MS0xMS4wMzctMTYuNzQ4LTE3LjcwMy0yMy4xMjdjLTYuNjY2LTYuMzc3LTE0LjgwMS0xMS40NjUtMjQuNDA2LTE1LjI3MSAgICBjLTkuNjE3LTMuODA1LTIwLjIyOS01LjcxMS0zMS44NC01LjcxMWMtMS43MTEsMC01LjcwOSwyLjA0Ni0xMS45OTEsNi4xMzljLTYuMjc2LDQuMDkzLTEzLjM2Nyw4LjY2Mi0yMS4yNjYsMTMuNzA4ICAgIGMtNy44OTgsNS4wMzctMTguMTgyLDkuNjA5LTMwLjgzNCwxMy42OTVjLTEyLjY1OCw0LjA5My0yNS4zNjEsNi4xNC0zOC4xMTgsNi4xNGMtMTIuNzUyLDAtMjUuNDU2LTIuMDQ3LTM4LjExMi02LjE0ICAgIGMtMTIuNjU1LTQuMDg2LTIyLjkzNi04LjY1OC0zMC44MzUtMTMuNjk1Yy03Ljg5OC01LjA0Ni0xNC45ODctOS42MTQtMjEuMjY3LTEzLjcwOGMtNi4yODMtNC4wOTMtMTAuMjc4LTYuMTM5LTExLjk5MS02LjEzOSAgICBjLTExLjYxLDAtMjIuMjIyLDEuOTA2LTMxLjgzMyw1LjcxMWMtOS42MTMsMy44MDYtMTcuNzQ5LDguODk4LTI0LjQxMiwxNS4yNzFjLTYuNjYxLDYuMzc5LTEyLjU2MiwxNC4wODYtMTcuNjk5LDIzLjEyNyAgICBjLTUuMTM3LDkuMDQyLTkuMjI5LDE4LjMyNi0xMi4yNzUsMjcuODM2Yy0zLjA0NSw5LjUyMS01LjU2OCwxOS44NDItNy41NjYsMzAuOTc4Yy0yLDExLjEzNi0zLjMzMiwyMS41MDUtMy45OTksMzEuMTIxICAgIGMtMC42NjYsOS42MTYtMC45OTgsMTkuNDY2LTAuOTk4LDI5LjU1NGMwLDIyLjgzNiw2Ljk0OSw0MC44NzUsMjAuODQyLDU0LjEwNGMxMy44OTYsMTMuMjI0LDMyLjM2LDE5LjgzNSw1NS4zOSwxOS44MzVoMjQ5LjUzMyAgICBjMjMuMDI4LDAsNDEuNDktNi42MTEsNTUuMzg4LTE5LjgzNWMxMy45MDEtMTMuMjI5LDIwLjg0NS0zMS4yNjUsMjAuODQ1LTU0LjEwNEM0MjAuMjY0LDM1NC41MDIsNDE5LjkzMiwzNDQuNjUyLDQxOS4yNTgsMzM1LjAzNiAgICB6IiBmaWxsPSIjNDQ0NDQ0Ii8+Cgk8L2c+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPGc+CjwvZz4KPC9zdmc+Cg==) no-repeat scroll 17px 17px;
	padding: 5px 20px 5px 45px;
	border-radius: 5px;
	border: 1px solid #cbcbcb;
	margin-bottom: 13px;
	color: #BBB;
	font-size: 17px;
	font-weight: 400;
	width: 100%;
	height: 52px;
	box-sizing: border-box;
	outline-style: none;
	box-shadow: none;
}
input[type="text"]:focus,
input[type="text"].focus {
	outline: 0;
	border: 1px solid #e50914;
	color: #444;
}
input[type="password"] {
	background: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDQwMS45OTggNDAxLjk5OCIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDAxLjk5OCA0MDEuOTk4OyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+CjxnPgoJPHBhdGggZD0iTTM1Ny40NSwxOTAuNzIxYy01LjMzMS01LjMzLTExLjgtNy45OTMtMTkuNDE3LTcuOTkzaC05LjEzMXYtNTQuODIxYzAtMzUuMDIyLTEyLjU1OS02NS4wOTMtMzcuNjg1LTkwLjIxOCAgIEMyNjYuMDkzLDEyLjU2MywyMzYuMDI1LDAsMjAwLjk5OCwwYy0zNS4wMjYsMC02NS4xLDEyLjU2My05MC4yMjIsMzcuNjg4Qzg1LjY1LDYyLjgxNCw3My4wOTEsOTIuODg0LDczLjA5MSwxMjcuOTA3djU0LjgyMSAgIGgtOS4xMzVjLTcuNjExLDAtMTQuMDg0LDIuNjYzLTE5LjQxNCw3Ljk5M2MtNS4zMyw1LjMyNi03Ljk5NCwxMS43OTktNy45OTQsMTkuNDE3VjM3NC41OWMwLDcuNjExLDIuNjY1LDE0LjA4Niw3Ljk5NCwxOS40MTcgICBjNS4zMyw1LjMyNSwxMS44MDMsNy45OTEsMTkuNDE0LDcuOTkxSDMzOC4wNGM3LjYxNywwLDE0LjA4NS0yLjY2MywxOS40MTctNy45OTFjNS4zMjUtNS4zMzEsNy45OTQtMTEuODA2LDcuOTk0LTE5LjQxN1YyMTAuMTM1ICAgQzM2NS40NTUsMjAyLjUyMywzNjIuNzgyLDE5Ni4wNTEsMzU3LjQ1LDE5MC43MjF6IE0yNzQuMDg3LDE4Mi43MjhIMTI3LjkwOXYtNTQuODIxYzAtMjAuMTc1LDcuMTM5LTM3LjQwMiwyMS40MTQtNTEuNjc1ICAgYzE0LjI3Ny0xNC4yNzUsMzEuNTAxLTIxLjQxMSw1MS42NzgtMjEuNDExYzIwLjE3OSwwLDM3LjM5OSw3LjEzNSw1MS42NzcsMjEuNDExYzE0LjI3MSwxNC4yNzIsMjEuNDA5LDMxLjUsMjEuNDA5LDUxLjY3NVYxODIuNzI4ICAgeiIgZmlsbD0iIzQ0NDQ0NCIvPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=) no-repeat scroll 17px 17px;
	padding: 5px 20px 5px 45px;
	border-radius: 5px;
	border: 1px solid #cbcbcb;
	color: #BBB;
	font-size: 17px;
	font-weight: 400;
	width: 100%;
	height: 52px;
	box-sizing: border-box;
	outline-style: none;
	box-shadow: none;
}
input[type="password"]:focus,
input[type="password"].focus {
	outline: 0;
	border: 1px solid #e50914;
	color: #444;
}
input[type="submit"] {
	padding: 12px 0 12px 0;
	border-radius: 25px;
	background: #e50914;
	background-size: cover;
	background-position: 96% center;
	border: 0px solid #259efa;
	color: #fff;
	font-size: 17px;
	font-weight: 400;
	display: block;
	cursor: pointer;
	transition: background 0.65s, color 0.65s;
	width: 100%;
	height: 52px;
	box-sizing: border-box;
}
input[type="submit"]:hover {
	background: #b31e23;
	background-size: cover;
	transition: background 0.65s, color 0.65s;
	background-position: 96% center;
	border: 0px solid #4285F4;
	color: #fff;
}
input[type="submit"]:focus,
input[type="submit"].focus {
	outline: 0;
	background: rgba(0,0,0,0.7) url("loader.svg") no-repeat;
	background-size: 40px;
	background-position: 96% center;
	transition: background 0.65s, color 0.65s;
	border: 0px solid #38669E;
	color: #ccc;
}
.error {
	text-align: center;
	position: relative;
	padding: 15px 20px 15px 20px;
	margin-top: 10px;
	margin-bottom: -3px;
	border-radius: 3px 3px 0 0;
	font-size: 16px;
	width: 100%;
	background: #872723;
	line-height: 1.2;
	color: #fff;
	animation: flipInX 0.5s;
	box-sizing: border-box;
	transform: scaleY(1);
	transform-origin: bottom;
}
.error::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%);
	width: 0;
	height: 0;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	border-top: 10px solid #872723;
}
.errorinfo {
	text-align: center;
	position: relative;
	padding: 15px 20px 15px 20px;
	margin-top: 10px;
	margin-bottom: -3px;
	border-radius: 3px 3px 0 0;
	font-size: 16px;
	width: 100%;
	background: #872723;
	line-height: 1.2;
	color: #fff;
	animation: flipInX 0.5s;
	box-sizing: border-box;
	transform: scaleY(1);
	transform-origin: bottom;
	opacity: 0;
}
.errorinfo::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%);
	width: 0;
	height: 0;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	border-top: 10px solid #872723;
	opacity: 0;
}
.wave {
	opacity: .6;
	position: absolute;
	top: -20%;
	left: 35%;
	background: #4d4f72;
	width: 600px;
	height: 600px;
	margin-left: -250px;
	margin-top: -250px;
	transform-origin: 50% 48%;
	border-radius: 43%;
	z-index: -5;
	animation-name: drift;
	animation-duration: 5000ms;
	animation-timing-function: linear;
	animation-delay: 0.25s;
	animation-iteration-count: infinite;
}
.wave.-three {
	animation-name: drift;
	animation-duration: 7000ms;
	animation-timing-function: linear;
	animation-delay: 0.5s;
	animation-iteration-count: infinite;
	z-index: -5;
}
.wave.-two {
	transform: rotate(0deg);
	animation-name: drift;
	animation-duration: 9000ms;
	animation-timing-function: linear;
	animation-delay: 0.75s;
	animation-iteration-count: infinite;
	opacity: .1;
	background: yellow;
	z-index: -5;
}
@keyframes drift {
	from {
		transform: rotate(0deg);
		z-index: -5;
	}
	from {
		transform: rotate(360deg);
		z-index: -5;
	}
}
#error {
	text-align: center;
	position: relative;
	padding: 10px 20px 10px 20px;
	margin: -10px 0 10px 0;
	border-radius: 5px;
	font-size: 16px;
	width: 100%;
	background: #ead7d7;
	border: 1px solid #ead7d7;
	line-height: 1.2;
	color: #872723;
	animation: flipInX 0.5s;
	box-sizing: border-box;
	transform: scaleY(1);
	transform-origin: bottom;
	box-sizing: border-box;
}
#error::after {
	content: "";
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translate(-50%);
	width: 0;
	height: 0;
	border-right: 8px solid transparent;
	border-left: 8px solid transparent;
	border-top: 10px solid #ead7d7;
}