@media all and (max-width: 400px)   {
	
	#page_wrap {
		position:relative;
		width: 100%;
		height: 100%;
		background-repeat: repeat-x;
		}
	
	#mid_wrap {
	    position:relative;
		width: 476px;
		height: 500px;
		margin: 0px auto  0px auto; /* top right bottom left */
		/* background-image: url(../img/0-login-center-bg_myspa.jpg); */
		background-repeat: no-repeat;
		}
	
}	

@media all  {
	/* CSS Document */
	
	/* ######################################################################################################
	** Body
	** ######################################################################################################*/
	
	body {
	    height: 100%;
		margin: 0px 0px  0px 0px ; /* top right bottom left */
		background-color: 	#fff;
		font-family: 		Arial, sans-serif;
		font-size:			12px;
		color: 				#000;/*#49453b*/;
		text-align: 		left;
		padding-top: 60px;
	}
	
	img {
		border: 0px;
		}
	
	/* ######################################################################################################
	** Wrapper
	** ######################################################################################################*/
	
	
	#page_wrap {
		position:relative;
		width: 100%;
		height: 100%;
	/*	background-image: url(../img/0-login-leftright-bg.gif);*/
		background-repeat: repeat-x;
		}
	
	#mid_wrap {
	    position:relative;
		width: 990px;
		height: 355px;
		margin: 0px auto  0px auto; /* top right bottom left */
		/* background-image: url(../img/0-login-center-bg_myspa.jpg); */
		background-repeat: no-repeat;
		}
	
	/* H E A D ####################################################*/
	
	#mycompany {
		position:	absolute;
		margin:  0px 33px  0px 0px; /* top right bottom left */
		padding: 25px 0px  0px 0px; /* top right bottom left */
		width: 900px;
		height: 43px;
		font-size: 20px;
		text-align: right;
		color:#333;
		top: 0px;
		right: 0px;
		}
	
	
	#login {
		position:absolute;
		height:156px;
		width: 215px;
		/*background-color:#349946;*/
		padding: 50px 10px  10px 10px; /* top right bottom left */
		text-align: right;
		left: 45px;
		top: 80px;
		color: #333;
		}
	
	.login_alert {
		text-align: center;
		position: absolute;
		top: 12px;
		right: 12px;
		width: 200px;
		background-color:#67C3FC;
		color:#fff;
		border: solid 1px #023E62;
		font-weight:bold;
		padding: 5px 5px  5px 5px; /* top right bottom left */
		}
	
	.login_button_wrapper {
		line-height: 12px;
		position: absolute;
		bottom: 12px;
		left: 12px;
		}
	
	.login_button {
		position: relative;
		overflow: visible;
		color: #333333;
		background-color: #FFFFFF;
		background-image: url(../img/button_bg_vbar_green.gif);
		background-repeat: no-repeat;
		background-position: left;
		border: 1px solid #333333;
		margin:   0px 0px  0px 5px; /* top right bottom left */
		padding: 0px 5px 6px 8px; /* top right bottom left */
		font-size:12px;
		height: 20px;
		}
	
	.login_button_hover {
		position: relative;
		overflow: visible;
		border-width: 1px;
		border-style: solid;
		border-color: #333333;
		margin:   0px 0px  0px 5px; 
		padding:   0px 5px  6px 8px; 
		font-size:	12px;
		color:#FFFFFF;
		background-color: #006600;
		vertical-align:bottom;
		cursor: pointer;
		height: 20px;
		}
	
	.login_input {
	    overflow: visible;
		width: 200px;
		height: 16px;
		color: #333333;
		background-color: #FFFFFF;
		border: 1px solid #333333;
		padding: 2px 5px  2px 5px; /* top right bottom left */
		font-size:12px;
		}
	#LoginMobil {
	
		position: absolute;
		top:-110px;
		left: -50px;
	}
	/* H E A D   E N D  ####################################################*/
	
	/* B A S E D   S T A R T  ####################################################*/
	
	.based {
		position: absolute;
		bottom: 0px;
		right: 0px;
		}
	
	
	
	/* B A S E D   E N D  ####################################################*/
	
	/* ######################################################################################################
	** Clearing
	** ######################################################################################################*/
	
	.clearfix:after {
	    content: ".";
	    display: block;
	    height: 0;
	    clear: both;
	    visibility: hidden;
	}
	
	.clearfix {display: inline-block;}
	
	/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	/* End hide from IE-mac */
}