/* ==========================================================================
   Login
   ========================================================================== */
.login-body{
	background-color:#EFFBFF;
	overflow-x: hidden;
}

.login{
	padding-left: 5%;
	padding-right: 5%;
}

@media(min-width: 481px){
	.login{
		width: 100%;
		background-color:#EFFBFF;
	}

}

.login-change-lang-area{
	text-align: right;
}

.sitelogo{
	margin-top: 20px;
	text-align:center;
}

.login-block{
	margin: 0px 70px 0 70px;
}
@media(max-width: 480px){
	.login-block{
		margin: 0;
	}
}

.login-btn{
	display: inline-block;
	font-size: 150%;
	padding: 10px 100px 10px 100px;
}

.login-btn:hover{
	opacity: 0.6;
	cursor: pointer;
}

@media(max-width: 480px){
	.login-btn{
		padding: 10px 70px 10px 70px;
	}
}

/*.login-auth{
	background-color: #FFF;
	padding-top: 20px;
	padding-bottom: 20px;
	box-shadow: 5px 5px 5px #C2C2C2;
	text-align: center;
	border: 1px solid #C2C2C2;
}*/

.own-auth{
	background-color: #FFF;
	box-shadow: 5px 5px 5px #C2C2C2;
	padding-bottom: 42px;
	text-align: center;
	border:1px solid #C2C2C2;
	overflow-y: hidden;
    transition: all 300ms 0s cubic-bezier(0.65, 0.05, 0.36, 1);
	height: 0px;
}

.own-auth-open{
	height: 247px;
}

.login-form{
	width: 100%;
	background-color: #FFF;
}

.switch-form{
	cursor: pointer;
	font-weight: bold;
	text-align: center;
}

@media(min-width: 481px){
	.switch-form:hover{
		opacity: 0.8;
	}
}

.switch-form:after{
	content: "▲";
	position:absolute;
	transition: all 300ms 0s ease;
}

.open-form:after{
	transform:rotate(180deg);
}

.login-form-area{
	height: 100%;
}

.input-login-pass-box{
	max-width: 500px;
	margin-top: 10px;
	margin-bottom: 10px;
}
@media(max-width: 480px){
	.input-login-pass-box{
		max-width: 240px;
	}
}

.login-information{
	margin-top: 20px;
}

.information-area{
	height: 500px;
	background-color: white;
	text-align: left;
	padding: 0px 30px 0px 0px;
	overflow:auto;
	box-shadow: 5px 5px 5px #C2C2C2;
}

.infotext{
	padding: 20px 30px 10px 30px;
	font-size: 110%;
	padding-top: 20px;
	word-break: break-all;
}

@media(max-width:480px){
	.information-area{
		padding: 0px 20px 0px 0px;
		overflow:auto;
		height: 400px;
	}

	.infotext{
		padding: 20px 0px 10px 0px;
		font-size: 110%;
		padding-top: 20px;
		word-break: break-all;
	}
}
