/* 
	Pizza GOGO MyShop
	login page
	Author: Mark Willis, Jan 2018
*/

html, body {
	background: #CCCCCC;
	background-image: url('../img/backgrounds/1.jpg');
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-attachment: fixed;
	height: auto;
	width: 100%;
}

div#auth_login {
	width: 700px;
	height: 400px;
	position: absolute;
}
div#auth_login_left {
	background: #F7F7F7;
	background: #E0121A;
	width: 250px;
	height: 400px;
	float: left;
	position: relative;
	
	-webkit-border-top-left-radius: 3px;
	-webkit-border-bottom-left-radius: 3px;
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-bottomleft: 3px;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
	
	-moz-box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
	-webkit-box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
	box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
}
div#auth_login_right {
	background: #222222;
	background: rgba(22,22,22,0.7);
	width: 450px;
	height: 400px;
	float: left;
	position: relative;
	
	-webkit-border-top-right-radius: 3px;
	-webkit-border-bottom-right-radius: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;
	border-top-right-radius: 3px;
	border-bottom-right-radius: 3px;
	
	-moz-box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
	-webkit-box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
	box-shadow: 0 0 80px 15px rgba(0,0,0,0.3) inset;
}

div.auth_login_pad {
	padding: 80px 35px 35px 35px;
}
div#auth_logo {
	display: block;
	position: absolute;
	width: 128px;
	height: 128px;
	top: 136px;
	left: 60px;
	background: url('../img/logo/128.png') 0px 0px no-repeat;
	overflow: hidden;
	text-indent: -1000px;
}

div.auth_blur {
	-moz-filter: blur(10px);
    -ms-filter: blur(10px);
    -o-filter: blur(10px);
    -webkit-filter: blur(10px);
    filter: blur(10px);
    height: 100%;
    width: 100%;
}
div.auth_background {
    background-image: url('../img/backgrounds/1.jpg');
	background-color: #2f3136;
    background-position: 50%;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

div#auth_login h2 {
	color: #FFFFFF;
	font-size: 28px;
}
div#auth_login p {
	color: #FFFFFF;
	font-size: 16px;
	line-height: 1.6em;
}

div#login_help {
	height: 160px;
	overflow: auto;
}
div#login_help div.login_help_box {
	display: none;
}


/* Mobile Styles */
@media only screen and (min-width: 0px) and (max-width: 767px) {
	html, body {
		background-image: url('../img/backgrounds/2.jpg');
	}
	
	div#auth_login {
		width: 100%;
		height: auto;
		position: absolute;
	}
	div#auth_login_left {
		width: 100%;
		height: auto;
		float: none;
		
		padding: 8px 0 5px 0;
		
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	div#auth_login_right {
		width: 100%;
		height: auto;
		float: none;
		
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}
	
	div.auth_login_pad {
		padding: 30px;
	}
	div#auth_logo {
		display: block;
		position: relative;
		top: 0;
		left: 0;
		width: 64px;
		height: 64px;
		margin: 0 auto 0 auto;
		background: url('../img/logo/128.png') 0px 0px no-repeat;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
	}
	
	div#login_help {
		height: auto;
		min-height: 160px;
		overflow: auto;
	}
}