html
{
	height:				100%;
}

/* Body Style */
body
{
	margin:				0;
	padding:			0;
	height:				100%;
	background-color:	#0F0F0F;
}

/* Add a black background color to the top navigation */
div.topnav
{
    background-color:   #000000;
    overflow:           hidden;
    z-index:            99;
}

/* Style the links inside the navigation bar */
div.topnav a.nav
{
    float:              left;
}

div.topnav a.nav_right
{
    float:              right;
}


div.topnav a
{
    display:            block;
    color:              #DD7015;
	text-align:         center;
    padding:            12px 14px;
    text-decoration:    none;
    font-size:          18px;
    font-family:        sans-serif;
}

/* Change the color of links on hover */
div.topnav a:hover
{
	background-color:   #000000;
	font-weight:		bolder;
}

/* Hide the link that should open and close the topnav on small screens */
div.topnav .icon
{
    display:            none;
} 

/* Setup div to house the header image and header menu. */
div.menu
{
	background-color:	#000000;
	width:				100%;
	padding:			0;
	margin:				0;
}

div.heading
{
	background:			url('/images/header.png');
	background-size:	cover;
	color:				#DD7015;
	min-height:			300px;
	position:			relative;
}

div.heading p
{
	display:			block;
	font-size:			72px;
	font-weight:		bold;
	margin-left:		8px;
	margin-bottom:		4px;
	position:			absolute;
	bottom:				0;
}

/* div describing the content part of the page */
div.content
{
	display:			block;
	width:				100%;
}

div.content p
{
	width:				90%;
	color:				#B0B0B0;
	font-size:			125%;
	margin-left:		2em;
}

div.ico
{
	color:				#DD7015;
	font-size:			72px;
	font-weight:		bold;
	float:				left;
}

div.content h1 
{
	color:				#DD7015;
	margin-bottom:		0;
	padding-top:		6px;
}

div.content h2
{
	color:				#DD7015;
	margin-top:			10px;
}

div.content a
{
	text-decoration:	none;
}

div.content h3
{
	color:				#DD7015;
	margin:				8px 15px;
}

div.content h4
{
	margin:				3px 30px;
}

div.content img
{
	display:			block;
	width:				80%;
	height:				auto;
	margin:				auto;
	padding:			1em;
}

div.content a.nav
{
	float:				left;
}

div.content a.center
{
	display:			inline-block;
	margin:				0;
}

div.content a.nav_right
{
	float:				right;
}

div.footer
{
	text-align:			center;
}

div.entry_body
{
	padding:			2em;
}

ul.cli
{
	width:				90%;
	list-style:			none;
	background:			#000000;
	padding:			20px;
	margin:				0 auto 2em auto;
	font-family:		monospace;
	font-size:			large;
	color:				#056005;
}

li.command:before
{
	content:			"$ ";
}

li.command
{
	font-weight:		bold;
	margin-bottom:		3px;
}

pre
{
	width:				90%;
	background:			#000000;
	padding:			20px;
	margin:				0 auto 2em auto;
	font-family:		monospace;
	font-size:			large;
	color:				#056005;
}

dl
{
	background:			black;
	display:			block;
	overflow:			hidden;
	padding:			20px;
	width:				90%;
	margin:				0 auto 2em auto;
	font-family:		monospace;
	font-size:			large;
	color:				#056005;
}

dt
{
	clear:				left;
	float:				left;
	width:				10%;
}

dd
{
	float:				left;
	width:				70%;
}

div.content img.left_float
{
	float:				left;
	height:				auto;
	width:				200px;
	margin:				15px;
	box-shadow:			10px 10px 5px #000000;
}

li.output
{
	font-weight:		bold;
	margin-bottom:		3px;
}

canvas
{
	background:			#204077;
	color:				#FFFFFF;
	cursor:				pointer;
}

/* Preload images from html */
div#preload
{
	display:			none;
}

/* Contact Form */
input.email
{
	width:				100%;
	box-sizing:			border-box;
}

textarea.email
{
	width:				100%;
	min-height:			250px;
	box-sizing:			border-box;
}
