@import url("//fonts.googleapis.com/css?family=Titillium+Web:400,700,600,400italic,600italic,700italic,300,300italic");
@import url("//netdna.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css"); /* Font Awesome */
@import url("/css/bootstrap-3.2.0.css"); /* Bootstrap */
@import url("/css/reset.css"); /* Reset stylesheet */
@import url("/css/common.css"); /* Common stylesheet */

/* */
body {
	background: #f5f5f5;
	font-family: "Titillium Web", "Arial";
	font-weight: 300;
	line-height: 1.4em;
	margin: 0px;
}

h1,
h2,
h3,
h4,
h5,
h6,
h7 {
	color: #999999;
	font-family: "Titillium Web", "Arial";
	font-weight: 300;
}

/* Wrapper */
#wrapper {
	background: #1e1e1e;
	border: solid #cccccc 1px;
	box-shadow: 0px 0px 15px -5px rgba(0, 0, 0, 0.75);
	-moz-box-shadow: 0px 0px 15px -5px rgba(0, 0, 0, 0.75);
	-webkit-box-shadow: 0px 0px 15px -5px rgba(0, 0, 0, 0.75);
	bottom: 0px;
	height: 295px;
	left: 0px;
	margin: auto;
	position: absolute;
	right: 0px;
	top: 0px;
	width: 752px;
}

/* Logo */
#logo {
	float: left;
	margin: 107px 32px 106px 32px;
}

/* Body */
#loginbox {
	background: #fcfcfc;
	border-left: solid #f3f3f3 1px;
	float: right;
	height: 100%;
    padding: 36px;
	width: 500px;
}

#loginbox h1 {
	margin-top: 0px;
}



/* Responsive */
@media screen and (max-width: 1024px) {
	#wrapper {
		position: relative;
		width: auto;
	}
	
	#logo,
	#loginbox {
		display: block;
		float: none;
		width: auto;
	}
	
	#logo img {
		display: block;
		margin: 0px auto;
	}
}

@media screen and (max-width: 768px) {
	#loginbox label {
		width: 100%;
	}
}

@media screen and (max-width: 500px) {
	#loginbox button {
		margin: 10px 0px;
		width: 100%;
	}
}