@charset "UTF-8";
/* CSS Document for my Self-Portrait Website */
/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */

header, section, footer, aside, nav, article, figure {
	/* [disabled]display: block; */
}
body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 100%;
	color: #FFF;
	margin: 0px;
	padding: 0px;
	background-color: #000;
}
#centeringDiv {
	background-color: #000;
	height: 750px;
	width: 980px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
	left: auto;
	right: auto;
	border: 10px double #FFF;
}
header {
	position: absolute;
	z-index: 15;
	height: 76px;
	width: 980px;
	left: 11px;
	top: 91px;
	font-family: Coalition;
	font-size: 80px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}
#centeredHeader {
	border: 3px solid #FFF;
	padding: 0px;
	height: 80px;
	text-align: center;
	width: 980px;
}
.centering {
	text-align: center;
}
#contentArea {
	background-color: #000;
	position: absolute;
	z-index: 50;
	height: 347px;
	width: 580px;
	left: 201px;
	top: 211px;
	overflow: auto;
	border: 2.5px solid #FFF;
	padding: 5px;
	font-family: Verdana, Geneva, sans-serif;
}
.photoleft {
	text-align: center;
	padding: 5px;
	float: left;
	border: 1px dotted #000;
	margin-top: 0px;
	margin-right: 35px;
	margin-bottom: 5px;
	margin-left: 0px;
}
.photoright {
	text-align: center;
	margin: 5px;
	padding: 5px;
	float: right;
	border: 1px dotted #000;
}
.roundedEdgeImage{
	border-radius: 5px;
	-o-border-radius: 5px;	
	-ms-border-radius: 5px;	
	-moz-border-radius: 5px;	
	-webkit-border-radius: 5px;	
}
.dropShadow {
	box-shadow: 10px 10px 5px #000;
	-o-box-shadow: 10px 10px 5px #000;
	-ms-box-shadow: 10px 10px 5px #000;
	-moz-box-shadow: 10px 10px 5px #000;
	-webkit-box-shadow: 20px 20px 90px #000;	
}

#topNavBox {
	position: absolute;
	width: 980px;
	height: 73px;
	z-index: 51;
	left: -1px;
	top: 594px;
	font-size: 13px;
}
#navTable {
	border: 2.5px solid #FFF;
}
/*
Purpose of this code: To stylize text links
This code assumes that the larger container(s)/div(s)/table(s) for all links has a class="links".
Add this code to you main style sheet
*/
.links {/*apply class="links" to your larger container(s)/div(s)/table(s) for all links*/
	font-family:Coalition, Geneva, sans-serif;/*you can change to another font, even a custom font*/
	font-size:100%;	
}
.links a:link, .links a:visited {/* link is a normal link, visited is if previously clicked */
	color: #FFF;
	text-decoration:none;
	/*you can add more styles as desired*/
}
.links a:hover, .links a:active {/* hover is when mouse hovers over link, active is when the mouse is pressed down on link */
	color: #FFF;
	font-size:18px;
	text-decoration:underline;
	letter-spacing:1px;
	/*you can add more styles as desired*/
}

#leftBoarder {
	position: absolute;
	width: 180px;
	height: 383px;
	z-index: 51;
	left: 10px;
	top: 214px;
}

#rightBoarder {
	position: absolute;
	width: 167px;
	height: 363px;
	z-index: 2;
	top: 214px;
	right: 10px;
}
#topBoarder {
	position: absolute;
	width: 619px;
	height: 115px;
	z-index: 52;
	left: 203px;
	top: 10px;
}
footer {
	background-color: #000;
	position: absolute;
	z-index: 2;
	height: 45px;
	width: 293px;
	left: 604px;
	top: 676px;
	margin: 5px;
	border: 2.5px solid #FFF;
	text-align: right;
}