/* =INITIAL 
   v2.1, by Faruk Ates - www.kurafire.net
   Addendum by Robert Nyman - www.robertnyman.com */

/* Neutralize styling: 
   Elements we want to clean out entirely: */
html, body, form, fieldset {
	margin: 0;
	padding: 0;
	font: 100%/120% Tahoma, Arial, sans-serif;
}

/* Neutralize styling: 
   Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
	margin: 0.8em;
	padding: 0;
}

/* Apply left margin:
   Only to the few elements that need it: */
li, dd, blockquote {
	margin: 0;
}

/* Miscellaneous conveniences: */
form label {
	cursor: pointer;
}

fieldset {
	border: none;
}

a {
	outline: none;
}

a img, :link img, :visited img {
	border: none;
}

/* Form field text-scaling */
input, select, textarea {
	font-size: 100%;
}

html, body {
	background-color: #99c;
}

a:link, a:visited {
	color: #00c;
	text-decoration: none;
}

a:hover, a:active {
	color: #c03;
}

h1 {
	font-size: 1.2em;
	color: #333;
	margin: 0.7em;
	
}

h2 {
	font-size: 1em;
	color: #f9f;
	margin: 0.6em 0.8em;
}

ul {
	list-style-type: none;
}

#wrapper {
	width: 760px;
	border-right: 1px solid #666;
	border-bottom: 1px solid #666;
	background-image: url(images/bg.jpg);
	position: absolute;
	left: 50%;
	margin-left: -380px;
	margin-top: 10px;
}

#menu {
	float:left;
	padding-top: 5px;
	font-weight: bold;
	width: 170px;
	height: 420px;
}

#home #menu, #cred #menu, #link #menu {
	background: url(images/main_two.jpg) no-repeat right bottom;
}

#bio #menu {
	background: url(images/bio_two.jpg) no-repeat right bottom;
}

#port #menu, #gallery #menu {
	background: url(images/port_three.jpg) no-repeat right bottom;
}

#down #menu {
	background: url(images/down_two.jpg) no-repeat right bottom;
}

#scrap #menu {
	background: url(images/scrap_two.jpg) no-repeat right bottom;
}

#cont #menu {
	background: url(images/cont_two.jpg) no-repeat right bottom;
}

#guest #menu {
	background: url(images/guest_two.jpg) no-repeat right bottom;
}

.bio, .port, .scrap, .down, .link, .cont, .guest {
    width: 170px;
    height: 26px;
}

.heart {
	position: absolute;
	bottom: 0px;
	width: 60px;
	height: 60px;
	background: url(images/heart.jpg);
}

.bio {
	background: url(images/menu_01.jpg);
}

.port {
	background: url(images/menu_02.jpg);
}

.scrap {
	background: url(images/menu_03.jpg);
}

.down {
	background: url(images/menu_04.jpg);
}

.link {
	background: url(images/menu_05.jpg);
}

.cont {
	background: url(images/menu_06.jpg);
}

.guest {
	background: url(images/menu_07.jpg);
}

a:hover .bio, a:hover .port, a:hover .scrap, a:hover .down, a:hover .link, a:hover .cont, a:hover .guest, #bio .bio, #port .port, #gallery .port, #scrap .scrap, #down .down, #link .link, #cont .cont, #guest .guest {
	background-position: -170px;
	cursor: pointer; /* This seems to be needed for IE, wtf?! */
}

a:hover .heart, #cred .heart {
	background-position: -60px;
	cursor: pointer;
}

#content, iframe {
	font-size: 0.8em;
	float: right;
	width: 589px;
	height: 510px;
}

#webstat {
display: none;
}

.leftimg {
	float: left;
	margin: -0.4em 0.6em 0 0;
}

.rightimg {
	float: right;
	margin: 0.4em 2em;
}

#port #content, #gallery #content, #scrap #content {
	width: 570px;
	height: 500px;
	overflow: auto;
	padding: 10px 10px 0;
}

#scrap #content {
	height: 510px;
	padding: 0 10px 0;
}

#port #content img, #gallery #content img, #scrap #content img {
	margin: 0 0 8px 7px;
	filter: alpha(opacity=100);
	opacity: 1.0;
}

#port #content img {
margin: 0;
}

#port #content dl {
margin: 0 4px 8px 10px;
float: left;
background: #fff;
color: #4d4d67;
border-left: 5px solid #fff;
border-top: 5px solid #fff;
border-right: 5px solid #fff;
}

#port #content dt {
height: 145px;
overflow: hidden;
}

#port #content dd {
text-align: center;
font-weight: bold;
}

#port #content :hover img, #gallery #content :hover img, #scrap #content :hover img {
	filter: alpha(opacity=70);
	opacity: 0.70;
}

#picture #wrapper {
	width: 800px;
	margin-left: -401px;
	border: 1px solid #666;
	background: url(images/bg.jpg) repeat-y;
	text-align: center;
}

#picture #wrapper p {
	font-size: 0.8em;
	color: #333;
}

#footer {
	height: 20px;
	width: 100%;
	clear:both;
	font-size: 0.6em;
	color: #333;
	text-align: center;
}

#footer a:link, #footer a:visited, form a:link, form a:visited {
	color: #333;
}

#footer a:hover, #footer a:active, form a:hover, form a:active {
	color: #333;
	text-decoration: none;
	border-bottom: 1px dotted #333;
}

#infobox {
	font: 0.7em/1.3em Verdana, Arial, sans-serif;
	color: #000;
	text-align: left;
	float: right;
	display: inline;
	width: 125px;
	height: 156px;
	margin: 8px;
	background-image: url(images/boxbg.gif);
}

.date {
	font-weight: bold;
	color: #333;
}

/* _________________________My Last Words_________________________ */

form {
	margin-top: 100px;
}

form p {
	display: inline;
	color: #333;
	font-size: 0.8em;
	margin-left: 0.5em;
}

form label {
	color: #333;
	margin-left: 40px;
}

form input {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: #000;
	background-color: #99c;
	padding: 2px;
	border: 1px solid #666;
}

.button {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #99c;
	padding: 2px;
	background-image: none;
	border: 1px solid #666;
}

form textarea {
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	color: #000;
	font-size: 0.9em;
	background-color: #99c;
	padding: 2px;
	border: 1px solid #666;
}

.kontroll {
	width: 452px;
	clear: both;
}

.left {
	width: 160px;
	float: left;
	padding-bottom: 5px;
}

.right {
	width: 290px;
	float: right;
	padding-bottom: 5px;
}	color: #000;
	font-size: 0.9em;
	background-color: #99c;
	padding: 2px;
	border: 1px solid #666;
}

.kontroll {
	width: 452px;
	clear: both;
}

.left {
	width: 160px;
	float: left;
	padding-bottom: 5px;
}

.right {
	width: 290px;
	float: right;
	padding-bottom: 5px;
} {
	width: 290px;
	float: right;
	padding-bottom: 5px;
}