/* Global Definitions */
body, form { margin: 0; padding: 0; }
img { border: none; }
.clear { font-size: 0px; line-height: 0px; clear: both; }

body {
	background:  #151616;
	text-align:  center;
	font-family: "Trebuchet MS",Tahoma,Verdana,Arial,sans-serif;
	font-size:   14px;
	line-height: 18px;
	font-weight: normal;
	color:       #ffffff;
}

h1, h2, h3, p { margin-top: 0; }
h1 { font-size: 22px; margin-bottom: 18px; }
h2 { font-size: 18px; }
.spacer-36 { font-size: 24px; height: 24px; }
.spacer-53 { font-size: 53px; height: 53px; }

a { color: #ffffff; text-decoration: underline; }
a:hover { color: #b0b0b0; }

/* Layout */
#wrapper {
	position:   relative;
	width:      986px;
	margin:     0 auto;
	background: transparent url('/img/layout/bg-illumination.png') no-repeat 0 0;
	text-align: left;
}
	#header {
		position: relative;
		height:   112px;
	}

	#logo {
		display:  block;
		position: absolute;
		top:      15px;
		left:     144px;
	}

	#steps {
		display:         block;
		position:        absolute;
		top:             44px;
		left:            123px;
		width:           814px;
		background:      transparent url('/img/layout/bg-nav.png') repeat-x 0 5px;
		list-style-type: none;
	}
		.step-item {
			float:         right;
			font-family:   "Trebuchet MS",Tahoma,Verdana,Arial,sans-serif;
			font-size:     14px;
			font-weight:   bold;
			color:         #ffffff;
			padding:       5px 10px;
			margin:        0 0 0 8px;
			background:    #3d4a4e;
			-webkit-border-radius: 8px;
			-moz-border-radius: 8px;
			border-radius: 8px;
		}
			.step-item-current {
				background: #f57000;
			}
			.step-item a { color: #ffffff; text-decoration: none; }

.content-box {
	margin-left: 123px;
	padding:     15px;
	background:  #292d2e;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
}
	.contentbox-left {
		width: 50%;
		float: left;
	}
	.contentbox-right {
		width: 50%;
		float: right;
	}

	#footer {
		margin:      20px 0 0 122px;
		text-align:  center;
		font-size:   12px;
		color:       #909090;
	}
		#footer a {
			color:           #909090;
			text-decoration: none;
		}
		#footer a:hover { text-decoration: underline; }

#preload { visibility: hidden; font-size: 1px; line-height: 1px; }
#preload img { width: 1px; height: 1px; }

/* Forms */
label {
	display:       block;
	font-size:     20px;
	font-weight:   bold;
	color:         #d6d6d6;
	margin-bottom: 0.5em;
}

input {
	padding:     2px 5px;
	font-family: "Trebuchet MS",Tahoma,Verdana,Arial,sans-serif;
	font-size:   14px;
	font-weight: normal;
	border:      1px solid #909090;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}

.submit {
	font-family:   "Trebuchet MS",Tahoma,Verdana,Arial,sans-serif;
	font-size:     14px;
	font-weight:   bold;
	color:         #ffffff;
	padding:       5px 10px;
	background:    #3d4a4e;
	cursor:        default;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	border:        none;
	cursor:        pointer;
}
.submit:hover {
	background: #f57000;
}

.error {
	padding: 5px;
	margin:  0 15px 15px 0;
	border:  1px solid #cc0000;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	background:    #ffebe8;
	color:         #505050;
}

/* About page (index) */
.step-case-img, .step-case-text { vertical-align: top; }
.step-case-text { padding-left: 20px; }
.step-case-spacer {
	font-size:   1px;
	line-height: 1px;
	height:      20px;
}

/* Step 2 (copy code) */
.codeview {
	width:       730px;
	display:     block;
	background:  #ffffff;
	padding:     2px 5px;
	white-space: nowrap;
	overflow:    auto;
	color:       #000000;
	border:      1px solid #909090;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
