/*

Name: Nice Login and Signup Panel using Mootools 1.2

Tutorial URI: http://web-kreation.com/demos/login_form_mootools_1.2/

Author: Jeremie Tisseau

Author URI: http://web-kreation.com/

Date: August 2008



	The CSS, XHTML and design is released under Creative Common License 2.5:

	http://creativecommons.org/licenses/by-sa/2.5/



*/



/* Login Panel */

#top {

/*  	background: url(../images_login/login_top.jpg) repeat-x 0 0;

*/	height: 38px;

	position: relative;

}



#top ul.login {

	display: block;

	position: relative;

  	float: right;

  	clear: right;

  	height: 22px;

	width: auto;

  	font-weight: bold;

	line-height: 22px;

	margin: 0;

	right: 0px;

  	color: white;

  	font-size: 80%;

	text-align: center;

/*  	background: url(../images_login/login_r.jpg) no-repeat right 0;

*/	padding-right: 5px;

}



#top ul.login li.left {

/*  	background: url(../images_login/login_l.jpg) no-repeat left 0;

*/  	height: 38px;



	padding: 0;

	margin: 0;

  	display: block;

	float: left;

}



#top ul.login li {

 	text-align: left;

	font:16px "calibriregular";

  	padding: 0 6px;

	display: block;

	float: left;

	height: 38px;

/*  	background: url(../images_login/login_m.jpg) repeat-x 0 0;

*/}



#top ul.login li a {

	color: #fff;

}



#top ul.login li a:hover {

	color: white;

}



/*Login*/

/* toggle effect - show/hide login*/

#login {

	width: 100%;

	color: white; height:auto !important;

	background: #1E1E1E;

	position: relative;

	z-index: 3;

	height: 0;

}



#login a {

	text-decoration: none;

	font-size:11px;

	color: #fff;

}



#login a:hover {

	color: white;

}



#login .loginContent {

	width: 600px;

	height: 80px;

	margin: 0 auto;

	padding-top: 25px;

	text-align: left;

	

}



#login .loginContent .left {

	width: 120px;

	float: left;

	padding-left: 65px;

	font-size: 0.95em;

	 

}



#login .loginContent .right {

	width: 290px;

	float: right;

	text-align: right;

	padding-right: 65px;

	font-size: 0.95em;

}



#login .loginContent form {

	margin: 0 0 10px 0;

	height: 26px;

}



#login .loginContent input.field {

	border: 1px #1A1A1A solid;

	background: #464646;

	margin-right: 5px;

	margin-top: 4px;

	color: white;

	width:180px;

	padding:5px; outline:none;


}

.admin_user {
    background: none repeat scroll 0 0 #f2f2f2;
    border: 1px solid #ddd;
    border-radius: 4px;
    float: left;
    margin-right: 13px;
    margin-top: 25px;
    min-height: 100px;
    padding: 25px 5px 0;
    text-align: center;
    width: 17%;
}


.admin_user > a:hover {
    color: #ff4b10;
}
.admin_user > img {
    margin-bottom: 5px;
}
.admin_user a{
    color: #333; margin:0px;
    font-size: 13px; text-align:center;
}
.admin_user:last-child {
    margin-right:0;
}
#login .loginContent input:focus.field {

	background: #545454;

}



#login .loginContent input.rememberme {

	border: none;

	background: transparent;

	margin: 0;

	padding: 0;

}


input,textarea{  outline:none;}

#disc_code {
    margin: 8px 0;
}
#login .loginContent input.button_login {

    background: none repeat scroll 0 0 #e6190e;

    border: 0px solid #ce3400;

    border-radius: 3px;

    color: #fff;

    cursor: pointer;

    height: 27px; line-height:5px;

    width: 67px;

	font-family:"calibriregular";

	font-size:15px;float: right;margin-top: 6px;  margin-right: 40px;

}

#login .loginClose {

	display: block;

	position: absolute;

	right: 15px;

	top: 10px;

	width: 70px;

	font-size: 0.8em;

	text-align: left;

}



#login .loginClose a {

	display: block;

	width: 100%;

	height: 20px;

	background: url(../images_login/button_close.jpg) no-repeat right 0;

	padding-right: 10px;

	border: none;

	font-size: 0.9em;

	color: white;

}



#login .loginClose a:hover {

	background: url(../images_login/button_close.jpg) no-repeat right -20px;

}
 @media only screen and (min-width: 768px) and (max-width: 959px) 
{
/*#login {
    height: 158px !important;
}
*/
/*.temp > div{
	background-color: #1e1e1e;
    height: 200px !important;
    margin: 0;
    overflow: hidden;
    position: relative;
	}*/
	
.temp > div {
    height: auto !important;
}	
	
#login {
    background: none repeat scroll 0 0 #1e1e1e;
    color: white;
    height: 120px !important;
    position: relative;
    width: 100%;
} 

	 
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
	#login {
    background: none repeat scroll 0 0 #1e1e1e;
    color: white;
    height: 220px !important;
    position: relative;
    width: 100%;
    z-index: 3;
}
}
@media only screen and (max-width: 480px) {
	#login {
    background: none repeat scroll 0 0 #1e1e1e;
    color: white;
    height: 220px !important;
    position: relative;
    width: 100%;
    z-index: 3;
}
}
