@import 'library.less';


#login-box {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,00);
	pointer-events: none;
	z-index: 0;
	overflow-y: auto;
	visibility: hidden;
	.transition;
	
	.login-box-container {
		position: absolute;
		width: 800px;
		height: 460px;
		top: 0px;
		left: 0px;
		right: 0px;
		bottom: 0px;
		margin: auto;
		opacity: 0; 
		background: #F1F1F1 url(../images/color-bg.jpg);
		background-position: 0px 385px;
		background-repeat: no-repeat;
		box-shadow: 0px 8px 64px rgba(0,0,0,0.3);
		.transition;
		.scale(0.95);
		.border-radius(15px);
		
		.title {
			text-align: center;
			line-height: 64px;
			text-transform: uppercase;
			letter-spacing: 2px;
			border-bottom: 1px solid fadeout(@blue, 70%);
		}
		
		.columns {
			padding-top: 25px;
			font-size: 16px;
			line-height: 18px;
			
			.column {
				float: left;
				
				&.left {
					width: 222px;
					margin: 0 35px 0 90px;
				}
				&.right {
					width: 430px;
				}
			}
		}
		
		.grey {
			color: fadeout(#000, 66%);
		}
		
		input[type="text"] {
			padding: 10px 25px;
			line-height: 28px;
			background: #fff;
			font-size: 15px;
			border: 1px solid #E5E5E5;
			width: 300px;
			margin-top: 5px;
			.border-radius;
			
			&:focus {
				outline: none;
			}
		}
		
		.agreement {
			position: relative;
			top: 32px;
			left: -130px;
			
			a {
				text-decoration: underline;
			}
		}
		
		.ok {
			position: relative;
			width: 100px;
			float: right;
			z-index: 2;
		}
		.rules {
			margin-top: 60px;
			display: block;
			color: @blue;
			text-decoration: underline;
		}
		
		.likebox-fix {
			position: relative;
			overflow: hidden;
			width: 50px;
			height: 21px;
			margin: 45px 27px 32px 27px;
			
			iframe {
				display: block;
				position: absolute;
				left: -65px;
				top: -32px;
			}
		}
		.likebox-fix {
			.scale(2.05);
		}
		.si {
			color: @blue;
			text-decoration: underline;
			text-transform: uppercase;
			font-size: 15px;
		}
			
		#uLogin {	
			.item {
				display: inline-block;
				height: 50px;
				width: 178px;
				background-repeat: no-repeat;
				cursor: pointer;
				margin: 0;
				opacity: 1 !important;
				background-image: url(../images/login-with-fb.png);
				background-color:  transparent;
				cursor: pointer !important;
				.box-sizing;				
			}
		}
			
	}
	
	&.shown {
		z-index: 1005;
		pointer-events: auto;
		background: rgba(0,0,0, 0.7);
		visibility: visible;
		
		.login-box-container {
			opacity: 1;
			.transition(@delay: 400ms);
			.scale(1);
		}
	}
}

[id*="ul_"] {
	z-index: 10000005 !important;
}