.login--title {
	font-size      : 1.6em;
	font-weight    : 700;
	color          : #FFF;
	text-transform : uppercase;
	text-align     : center;
	border         : 0;
	margin         : 10px -10px 30px -10px;
	padding        : 10px 10px;
	border-radius  : 1px 1px 0 0;
}

.login--container:not(.nobg) {
	background-size : cover;
}

.login--form {
	max-width             : 1160px;
	width                 : 100%;
	margin                : 0 auto;
	display               : grid;
	grid-template-columns : 7fr 5fr;
	grid-template-rows    : 1fr;
	grid-gap              : 0;
	background            : rgba(0, 0, 0, 0.5);
	padding               : 20px 15px;
	border-radius         : 5px;
	box-sizing: border-box;
}

.login--tabs {
	padding-left : 20px;
}

.login--tab {
	background    : rgba(120, 120, 120, 0.5);
	padding       : 10px 20px;
	border-radius : 5px 5px 0 0;
	display       : inline-block;
	color         : var(--white);
	cursor        : pointer;
}

.login--tab.active {
	background  : rgba(0, 0, 0, 0.5);
	font-weight : bold;
}

.login--tab:hover {
	background  : rgba(0, 0, 0, 0.5);
	font-weight : bold;
}

.login--block {
	position       : relative;
	width          : 60%;
	margin         : 0 auto;
	padding        : 10px 10px 10px;
	box-sizing     : border-box;
	vertical-align : middle;
	border         : 0;
}

.login--block .showpass {
	position  : absolute;
	font-size : 1.5em;
	top       : 15px;
	right     : 10px;
}

.login--block input {
	height         : 2.7em;
	width          : 100%;
	border         : 0 solid var(--blue);
	font-size      : 1.35em;
	font-weight    : normal;
	line-height    : 2.5em;
	padding        : 7px 10px !important;
	color          : #222;
	background     : rgba(250, 250, 250, 0.8);
	vertical-align : middle;
	text-align     : center;
	outline-style  : none;
	border-radius  : 5px;
}

.login--block input:focus {
	background         : rgba(250, 250, 250, 1);
	transition         : all 300ms ease;
	-webkit-transition : all 300ms ease;
	-moz-transition    : all 300ms ease;
}

body.night .login--block input:focus {
	background: var(--black);
}

.login--block input.required {
	border-left : 2px solid #E74C3C;
}

.login--block .logo {
	position   : absolute;
	top        : -60px;
	width      : 100%;
	text-align : center;
}

.login--block .copy {
	position : absolute;
	bottom   : -25px;
	left     : 0;
	color    : #222 !important;
}

.login--block div.result.green {
	color : #FFF;
}

.login--block .showpass {
	position  : absolute;
	font-size : 1.5em;
	top       : 18px;
	right     : 20px;
	color     : var(--gray-dark);
}

.login--block .header {
	color          : #222;
	font-weight    : 700;
	text-transform : uppercase;
}

a.forgot--button {
	color                 : rgba(250, 250, 250, 0.5);
	border                : 1px solid rgba(250, 250, 250, 0.5);
	border-radius         : 5px;
	-moz-border-radius    : 5px;
	-webkit-border-radius : 5px;
	text-align            : center;
	box-sizing            : border-box;
	padding               : 5px 10px 5px 10px;
	font-size             : 1.15em;
}

a.forgot--button:hover {
	color  : rgba(250, 250, 250, 1);
	border : 1px solid rgba(250, 250, 250, 1);
}

a.login--button {
	padding               : 5px 15px 5px 15px !important;
	width                 : 100%;
	line-height           : 2.5em !important;
	font-size             : 1.05em;
	font-weight           : 700;
	display               : inline-block;
	text-align            : center;
	text-decoration       : none;
	text-transform        : uppercase;
	float                 : right;
	color                 : #FFF;
	background            : #01579B;
	border                : 1px solid #01579B;
	border-radius         : 5px;
	-moz-border-radius    : 5px;
	-webkit-border-radius : 5px;
	box-sizing            : border-box;
	/*box-shadow            : 0 14px 10px -10px #01579B !important;*/
}

a.login--button#fackebutton {
	color      : #222;
	background : #B0BEC5;
	border     : 1px solid #B0BEC5;
	box-shadow : 0 14px 10px -10px #B0BEC5 !important;
}

a.login--button:hover {
	background         : #0288D1;
	border             : 1px solid #0288D1;
	color              : #FFF;
	transition         : all 300ms ease;
	-webkit-transition : all 300ms ease;
	-moz-transition    : all 300ms ease;
}

a.login--button:active {
	background         : #F1C40F;
	border             : 1px solid #F39C12;
	color              : #FFF;
	transition         : all 100ms linear;
	-webkit-transition : all 100ms linear;
	-moz-transition    : all 100ms linear;
}

@media (min-width : 1501px) {

	.login--block {
		width : 50%;
	}

}

@media (min-width : 768px) and (max-width : 1200px) {

	.login--block {
		width : 60%;
	}

}

@media (max-width : 767px) {

	.login--block {
		width : 90%;
	}

	.login--block .zagolovok {
		background : transparent;
	}

	.login--block a.blue,
	.login--block .blue {
		/*color : #FFF;*/
	}

	.login--block input {
		background : #FFF;
	}

	.login--block input:focus {
		background : #FFF;
	}

	.login--block .copy {
		padding    : 10px;
		position   : fixed;
		bottom     : 5px;
		box-sizing : border-box;
		width      : 100vw;
	}

	.login--block div.red,
	.login--block div.green {
		background : rgba(250, 250, 250, 0.7);
		padding    : 10px;
	}

	.login--block .showpass {
		top : 17px;
	}

	.login--form {
		grid-template-columns : 1fr;
		grid-template-rows    : unset;
	}

}