/* CSS Document */
@import url("reset.css");
@import url("fonts.css");


/* inicial

-------------------------------------------------------------- */

body
{
	/*-webkit-text-size-adjust:none;*/
	/*font-family: 'SourceSansProLight', sans-serif;*/
	font-family: 'SourceSansProRegular', sans-serif;
	/*min-width:1000px;*/
	background-color:#f2f2f2;
}
input,
textarea
{
	font-family: 'SourceSansProRegular', sans-serif;
}

select{
	color: #666;
	font-size: 12px;
	border: 1px solid #999;	
	font-family: 'SourceSansProRegular', sans-serif;
}

input[type="submit"],
input[type="button"]
{
	cursor:pointer;
}
	
a
{
	color:#00ff00;
	cursor:pointer;
}
a:link,
a:visited
{
	text-decoration:none;	
}

a:hover,
a:active
{
	text-decoration:underline;	
}

.clearfix
{
	clear:both;	
}

h1, h2, h3, h4, h5 { font-weight:normal; }

strong{ font-family: 'SourceSansProBold'; font-weight:normal; }


/* estructura bàsica

-------------------------------------------------------------- */
.login{
	width:400px;
}

.register{
	width:540px;
}

.container{
	margin:50px auto 0 auto;
}

.container .top{
	background-color:#fff;
	border:1px solid #ddd;
	padding:20px;
	-webkit-border-top-left-radius: 5px;
	-webkit-border-top-right-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

.container .bottom{
	background-color:#ddd;
	border:1px solid #ddd;	
	padding:20px;
	font-size:13px;
	color:#808080;
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 5px;
	-moz-border-radius-bottomright: 5px;
	-moz-border-radius-bottomleft: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
}

.container h1{
	margin-bottom:10px;
}

.container h2{
	margin-bottom:10px;
	margin-top:40px;
	font-size:14px;
	font-family: 'SourceSansProBold'; 
}


.container .top p{
	font-size:13px;
	line-height:18px;
	color:#666;	
	margin-top:30px;
}

.container form{
	margin-top:10px;	
}

.container form label{
	display:block;
	font-size:13px;
	font-family: 'SourceSansProBold'; 
	font-weight:normal;
	margin-bottom:5px;
	margin-top:30px;
}

.container form input[type="text"],
.container form input[type="password"],
.container form select{
	border:1px solid #ccc;
	padding:7px;
	font-size:13px;
	color:#666;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
.container form select.signIn{
	height: 31px;
	width: 240px;
}

.container form input.error,
.container form select.error{
	border:1px solid #E42518;
	color:#E42518;	
}

.login form input[type="text"],
.login form input[type="password"]{
	width:344px;
}

.login form select{
	width:360px;
	height: 30px;
}

.register form input[type="text"]{
	width:225px;
}

.container form p{
	font-size:11px !important;	
	margin-top:10px !important;
}

.container form p a{
	color:#999;
}

.container form input[type="submit"],
.container form input[type="button"]{
	color:#fff;
	border:none;
	background-color:#E42518;
	padding:5px 10px;
	font-size:12px;
	text-transform:uppercase;
	font-family: 'brandon_grotesque_boldregular', Arial, Helvetica, sans-serif;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin-top:30px;
	min-width:85px;
}
.container form input[type="submit"]:hover,
.container form input[type="button"]:hover{
	
	background-color:#A4131C;
}
.container .bottom .button {
	
	float:left;
	min-width:85px;	
}
.container .bottom .button a{
	color:#e4e4e4;
	display:block;
	background-color:#303030;	
	padding:5px 10px;
	font-size:12px;
	line-height:16px;
	text-transform:uppercase;
	font-family: 'brandon_grotesque_boldregular', Arial, Helvetica, sans-serif;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	margin-top:20px;
	text-align:center;
	text-decoration:none;
}
.container .bottom .button a:hover,
.container .bottom .button a:active{
	color:#fff;
	background-color:#000;	
}

.alert{
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color:#FFC3C2;
	border:1px solid #FF8F8F;
	color:#A50E0A;
	padding:10px;
	font-size:12px;
	margin-top:40px;	
}

.register .left{
	float:left;	
	margin-right:20px;
	width:239px;
}

.register .right{
	float:left;	
	width:239px;
}

.register .legal{
	font-size:13px !important;	
	margin-top:30px !important;
}

.register .legal a{
	color:#666;
	text-decoration:underline;
}

.register .legal a:hover,
.register .legal a:active{
	color:#000;
	text-decoration:underline;
}

/* footer

-------------------------------------------------------------- */

.footer{
	font-size:12px;
	line-height:18px;
	color:#999;
	text-shadow:0 1px 0 #fff;
	margin-top:20px;
	padding-bottom:40px;
	text-align:center;	
}

.footer a{
	color:#999;	
}
.footer a:hover,
.footer a:active,
.footer a.active{
	color:#666;	
}


@media(max-width:410px){
	.login{ box-sizing: padding-box; width:100%;}
	.container form input[type="text"], 
	.container form input[type="password"], 
	.container form select{
		box-sizing:border-box;
		width:100%;
	}
}


@media(max-width:550px){
/*
	.login{ box-sizing: padding-box; width:100%;}
	.container form input[type="text"], 
	.container form input[type="password"], 
	.container form select{
		box-sizing:border-box;
		width:100%;
	}

*/

	.container{ margin:0;}
	
	.container.register{
		width: 100%!important;
	}
	
	.register .left,
	.register .right{
		width: 100%;
	}
	
	.register form input[type="text"], 
	.register form input[type="password"], 
	.container form select.signIn{
		box-sizing:border-box;
		width:100%;
	}

}