html
{
	height: 100%;
}

body 
{

	font-family: Georgia, serif;
	text-align: center;
	height: 100%;
	width: 100%;
	background-color: #333;
	padding: 0;
	margin: 0;
}

a
{
	color: #eee;
	text-decoration: none;
}

a:hover
{
	color: #ccc;
}

#wrapper
{
	width: 100%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	border: 2px solid #f00;
	background-color: #333;
	border: 0;
	margin: 0 auto -105px;
	
}

#spacer
{
	height: 50px;
}

#shadow_wrap
{
	box-shadow: 0px 0px 20px 5px #000;
}
#kylesev
{
	background-image: url(../image/nav/nav-sprite_wide.jpg);
	background-position: 50% 0;
	width: 100%;
	height: 113px;
	color: #fff;
	font-size: 58px;
	font-style: italic;
	font-family: Georgia, serif;
}

#kylesev:hover
{
	background-position: 50% -467px;
}

#graphic
{
	background-image: url(../image/nav/nav-sprite_wide.jpg);
	background-position: 50% -113px;
	width: 100%;
	height: 113px;
	color: #fff;
	font-size: 48px;
	font-style: italic;
	font-family: Georgia, serif;
}

#graphic:hover
{
	background-position: 50% -580px;
}

#website
{
	background-image: url(../image/nav/nav-sprite_wide.jpg);
	background-position: 50% -226px;
	width: 100%;
	height: 113px;
	color: #fff;
	font-size: 48px;
	font-style: italic;
	font-family: Georgia, serif;
}

#website:hover
{
	background-position: 50% -693px;
}

#muchmore
{
	background-image: url(../image/nav/nav-sprite_wide.jpg);
	background-position: 50% -339px;
	width: 100%;
	height: 113px;
	color: #fff;
	font-size: 48px;
	font-style: italic;
	font-family: Georgia, serif;
}

#muchmore:hover
{
	background-position: 50% -806px;
}

#kylesev span.name,
#graphic span.graphic,
#website span.website,
#muchmore span.more
{
	position: relative;
	top: 25%;
/*	left: 50%;*/
	text-shadow: 0 0 5px #000;
	cursor: pointer;
}

#kylesev span.name:hover,
#graphic span.graphic:hover,
#website span.website:hover,
#muchmore span.more:hover
{
	text-shadow: 0 0 10px #aaa;
}

#hover_info
{
	width:100%;	
	margin-top: 15px;
	position: relative;
	font-size: 22px;
}

#hover_info div
{
	width: 100%;
	color: #fff;
	display: none; 
	position: absolute;
}


.footer, 
.push
{
	height: 105px;
}

#undermenu
{
	height: 105px;
	width: 100%;
	background-color: #fefefe;
	/*border: 1px solid #ddd;*/
	box-shadow: 0 0 2px #000;
	margin: 0 auto;
	text-align: center;
	/*padding-left: 300px;*/
	background-image: url(../image/nav/footer_bg_sprite.png);
	background-position: 0 0;
	font-family: Georgia, serif;
	box-shadow: 0px 0px 20px 5px #000;
}

#undermenu:hover
{
	background-image: url(../image/nav/footer_bg_sprite.png);
	background-position: 0 -127px;
}

.umitem
{
	width: 100px;
	float: left;
	margin-left: 120px;
	margin-top: 40px;
	font-size: 28px;
	font-style: italic;
	color: #4e4e4e;
	text-shadow: 0 0 3px #bebebe;
}

.umitem:hover
{
	color: #737272;
	text-shadow: 0 0 6px #fff;
	cursor: pointer;
}

#kyleinfo,
#graphicinfo,
#websiteinfo,
#moreinfo
{
	display: none;
	background-image: url(../image/nav/white_90opac_bg.png);
	background-repeat: repeat;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border: 3px solid #333;
	-webkit-box-shadow: 0 0 10px #000;
	-moz-box-shadow: 0 0 10px #000;
    text-align: left;
	height: 300px;
	width: 100%;
	padding: 10px;
	position: relative;
	top: -565px;
	left: 25%;
	z-index: 6;
}

.close
{
	background-image: url(../image/nav/close2.png);
	background-position: 0 0;
	background-color: transparent;
	height: 40px;
	width: 40px;
	position: relative;
	top: -30px;
	left: 470px;
	cursor: pointer;
}

.close:hover
{
	background-position: 0 -40px;
}

#kylesev_info, 
#graphic_info, 
#website_info, 
#muchmore_info 
{
	/*background-image: url(../image/nav/info_bg.png);
	background-position: 0 0;
	background-color: #f0f0f0;*/
	background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, rgb(71,71,71)),
    color-stop(1, rgb(168,166,168))
);
background-image: -moz-linear-gradient(
    center bottom,
    rgb(71,71,71) 0%,
    rgb(168,166,168) 100%
);
	display: none;
	width: 100%;	
	/*border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;*/
	margin: 0 auto;
	padding: 40px 0;
	color: #fff;
	font-size: 14px;
	/*text-shadow: 0 0 10px #000;*/
	box-shadow: inset 0px 0px 5px #000;
}

#muchmore_info
{
	/*margin-top: -17px;*/
}

.tooltip 
{
	text-align: center;
	border: 1px solid #eee;
	border-radius: 10px;
	display:none;
	background:#333;
	font-size:14px;
	height: auto;
	/*width:160px;*/
	padding:20px;
	color:#ddd;
	box-shadow: 0px 0px 10px 5px #000;
}

.contact
{
	width: 260px;
}

.stack
{
	margin-top: 25px;
	position: absolute;
	right: 150px;
}

.information
{
	position: relative;
	left: 20px;
	top: -7px;
}

.informationtip
{
	width: 260px;
}
