@import url(reset.css);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700);

/* Orange:   #ff9a2e                       */
/* Blå:      #007eff     rgba(0,126,255,1)*/
/* Blå-mørk: #0f78d2     rgba(15,120,210,1)*/

html, body {padding:0;}
body {
	color: #333;
	font-family:'Roboto';
	font-size:14px;
	font-weight:normal;
	background:url(../images/login-back.png) no-repeat bottom center fixed;
	background-size:cover;
	padding:100px 20px 0 20px;
}

.loginbox {
	width:100%;
	max-width:480px;
	background:#219edf;
	margin:0 auto;
	border-radius:5px;
	box-shadow: 0 0 6px rgba(0,0,0,0.2);
}

.hide {
	display:none;
}
.login-head {
	background:transparent url(../images/login-top.png) no-repeat top center;
	border-top-left-radius:6px;
	border-top-right-radius:6px;
}

.login-head h2 {
	color:#fff;
	font-size:25px;
	font-weight:normal;
	text-align:right;
	padding:20px 20px 35px 20px;
}
/*Clearfix*/
.login-head ul:before,
.login-head ul:after {content:"."; display:block; clear:both; visibility:hidden; height:0;}

.login-head ul li {
	float:left;
	width:30%;
	margin-left:10px;
}
.login-head ul li a {
	display:block;
	line-height:32px;
	text-align:center;
	color:#fff;
	background-color:#333;
	border-top-left-radius:3px;
	border-top-right-radius:3px;
	cursor:pointer;
}
.login-head ul li a.active {
	color:#333;
	background:#f5f5f5;
}
form {
	padding:20px;
	background:#f5f5f5;
	border:1px solid #ddd;
	border-top:1px solid #fff;
}
.login-inner {
	width:100%;

}
.login-bottom {
	background:#f5f5f5 url(../images/bottom_back.png) repeat-x bottom left;
	height:60px;
	line-height:60px;
	border:1px solid #ddd;
	border-top:1px solid #fff;
	border-bottom-left-radius:6px;
	border-bottom-right-radius:6px;
	padding:0 10px;
	text-align:center;
}
.login-bottom span,
.login-bottom a {color:#999; text-decoration:none; padding-left:10px;}
.msg-info {
	background-color:#eee;
	border:1px solid #e0e0e0;
	border-radius:3px;
	padding:10px;
	margin-bottom:20px;
}

.inp-group {
	margin-bottom:20px;
	font-size:15px;
	display:block;
}
/*Clearfix*/
.inp-group:before,
.inp-group:after {content:"."; display:block; clear:both; visibility:hidden; height:0;}

.inp-group label {
	float:left;
	width:100%;
	margin-bottom:2px;
	padding-left:3px;
}
input[type=text],
input[type=password] {
	width:100%;
	max-width:100%;
	color:#dd7700;
	border:0;
	outline: none;
    box-sizing:border-box;
	box-shadow: 0 0 0 1px #ccc;
	font-size:17px;
	height:42px;
	line-height:42px;
	padding:0 10px;
}
input[type=submit] {
	width:100%;
	color:#fff;
	background: #359ae3;
	background: -webkit-linear-gradient(#359ae3, #2777b1); /* For Safari 5.1 to 6.0 */
	background: -o-linear-gradient(#359ae3, #2777b1); /* For Opera 11.1 to 12.0 */
	background: -moz-linear-gradient(#359ae3, #2777b1); /* For Firefox 3.6 to 15 */
	background: linear-gradient(#359ae3, #2777b1); /* Standard syntax */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#359ae3', endColorstr='#2777b1',GradientType=0 );
	border:0;
	   -moz-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
	        box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.3);
	font-size:17px; 
	height:58px;
	line-height:58px;
	cursor:pointer;
}
.check label {
	display:block;
	float:left;
	white-space:nowrap;
	padding-left:0;
}
.check input,
.check label span {vertical-align:middle;}
.check label span {padding-left:10px;}

.alert {padding:10px; border:1px solid transparent; border-radius:4px; margin-bottom:20px;}
.alert-success {color:#3c763d; background-color:#dff0d8; border-color:#d6e9c6;}
.alert-danger {color:#a94442; background-color:#f2dede; border-color:#ebccd1;}
h3 {font-size:21px; font-weight:normal; margin-bottom:20px;}

@media only screen and (max-width: 767px) {
    body {padding-top:80px;}
    .login-head ul li {
        float:left;
        width:48%;
        margin:0 1%;
    }
}