* {
	/* Set border-box box sizing for all elements  */
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	-ms-box-sizing:border-box;
	box-sizing:border-box;
	font-family: 'Open Sans', sans-serif;
	font-size:14px;
	text-decoration: none;
	/* serve transitions for all elements on the page */
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	-o-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

/* GENERAL PAGE LAYOUT */

body {
	background-color: #a5aeb9; /* slate blue */
	margin:0;
	padding:0;
}

.wrapper {
	max-width:900px;
	/* center div */
	margin:0 auto;
	padding:0;
	/* allow absolute positioning for child elements */
	position: relative;
}

header {
	width:100%;
	background-color:#111;
	border-bottom: 4px solid #eee;
	padding:20px;
	position: relative;
	height: 240px;	
}

footer {
	width:100%; 
	min-height: 100px;
	background-color: #222;
	border-top:4px solid #eee;
	text-align: center;
	padding: 14px 0;
	color:white;
}

/* MENU */
.wrapper > a {
	background-image:url(../images/logo.png);
	width:187px;
	height: 60px;
	display: block;
}

nav {
	position: absolute;
	top: -20px; 
	right:20px; 
}

nav ul li {
	display: inline-block;
	padding:0 15px;
	list-style-type: none;
}

.menu {
	color:white;
	font-size: 14px;	
}

.menu:hover {
	border-bottom: 1px solid white;
}

/* HEADLINE */

.headline {
	position: absolute;
	top:92px;
	left: 14px;
}

h1 {
	background-image:url(../images/logo.png);
	background-repeat: no-repeat;
	width:107px;
	height: 75px;
	/* h1 and h2 become inline */
	display: inline-block;
	position: relative;
	top:-45px;
}

h1 > a {
	/* remove all text */
	font-size: 0;
	opacity: 0;
	text-shadow: 0 0 0;
	display: block;
	width:100%;
	height: 100%;
	cursor: pointer;
}

h2 {
	display: inline-block;
	color: white;
	line-height: 60px;
	/* left border */
	border-left: 1px solid white;
	padding-left: 36px;
	font-weight: 300;
	font-size: 1.5em;
}

/* FORM */

/* general form elements */
form {
	width:575px;
	padding:28px 0 28px 28px;
	margin:0 auto;
	margin-top: 42px;
	margin-bottom: 35px;
	background-color: #D9D9D9;
	box-shadow: 0px 0px 3px rgba(255,255,255,.5) inset, 0px 0px 4px rgba(0,0,0,.3);
}

input[type="text"], input[type="password"] {
  	box-sizing: border-box;
    background: none repeat scroll 0 0 #ededed;
    border-color: #7a848e;
    border-radius: 1px 1px 1px 1px;    
    border-style: solid;
    border-width: 1px;
    display: block;
    height: 35px;
    margin: 7px 0 21px 0;
    padding: 0 8px;
    border-radius: 0px;
    box-shadow: 1px 0px 2px rgba(0,0,0,.2);
}

input[type="text"]:focus, .dropdown:focus, input[type="password"]:focus {
	background-color: #ffffff;
	box-shadow: 1px 0px 4px rgba(246,139,1,.6);
	border-color: #f68b01
}

fieldset {
	border:none;
	padding:0;
	margin:0;
}

legend {
	padding: 0px;
}

label, select {
  	margin-right: 5px;
    width: 100%;
    display: inline-block;
    position: relative;
  	margin:0;
  	font-size: 14px;
}

input[type="checkbox"] {
	display: inline;
	margin-bottom: 21px;
}

hr {
	border: 0 solid #B9B9B9;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
    margin: 0px 21px 21px 0;
}

/* form elements and layout */

.dropdown {
	margin:7px 0 21px 0;
	height: 35px;
	line-height: 35px;
	padding:7px;
	background-color: #ededed;
	border:1px solid #7a848e;
}


.short {
	/* set lengths of form fields */
	width:245px;
	display: inline-block;
}

.standard {
	/* set lengths of form fields */
	width:517px;
}

.fieldset-wrap {
  width:auto;
  padding:0;
}

.floatleft {
  float:left;
  display:inline-block;
  width:50%;
  padding:0;
}

.floatright {
  display:inline-block;
  width:50%;
  padding:0;
}

label > span {
	/* helper text */
	font-size: 12px;
    left: 275px;
    position: absolute;
    top: 26px;
    width: 244px;
}

.check-text {
	display: inline;
	font-family: 'Open Sans', sans-serif;
	margin-left: 21px;
	font-size: 14px;
}

/* Button */
.button {
	padding:7px 20px; 
	background-color:#222;
	color:white;
	border:none;
	text-decoration: none; 
	border-radius:3px;
	border:1px solid #111;
	box-shadow: 0px 1px 1px rgba(255,255,255,.4) inset, 0px 1px 1px rgba(0,0,0,.4);
	cursor:pointer;
}

.button:hover {
	background-color:#f68b01;
	border-color: #9b3f00;	
}

.button:focus {
	background-color: #F65801;
	border-color: #F62F01;
	box-shadow: 0 0 4px rgba(0,0,0,.4) inset;
}

/* CONFIRMATION PAGE */

.confirmation-box {
	width:600px;
	margin:0 auto;
	padding:0;
	padding:49px;
	background-color: #eee;
	margin-top:35px;
	margin-bottom:35px;
	border:1px solid #ccc;
	box-shadow: 0 0 3px rgba(0,0,0,.2);
}
.confirmation-box p {
	font-size:1.1em;
}