/* GENERAL */
/* background image: #color url(/) repeat/repeat-y/repeat-x left/right/center top/bottom/center */
body {
	background: #858585 url(/images/bg.png);
	margin: 0;
	font: 12px Arial, Helvetica, sans-serif;
	color: #999;
}

::selection {background: #FFECB3;}
::-moz-selection {background: #FFECB3;}

input, select, textarea {
	font-size: 11px;
	color: #161616;
	background-color: #F3F3F3;
}

.imageround {
    border-radius: 6px 6px 6px 6px;
    border: 3px solid #C6A383;
}

/* This hides the h1 text behind a header image. Put image before h1 text. Put both image and h1 text inside link code. */
h1 {margin: 0; visibility: hidden; display: none;}

h2 {
	text-align: left;
	font: 17px Georgia, Arial, Helvetica, sans-serif;
	font-style: italic;
	font-weight: bold;
	text-indent: 5px;
	color: #111111;
    line-height: 19px;
	background-color:#E6E6E6;
	border-bottom: 1px dotted #999999;
    text-shadow: 1px 1px 1px #AAAAAA;
    border-radius: 8px 8px 6px 6px;
	margin: 0;
}

/* TEXT */
.bodytext {
	text-align: left;
	font: 14px Georgia, Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #111111;
    line-height: 20px;
	text-indent: 12px;
	padding-top: 10px;
}
/* LINK */
.bodytext a,
.bodytext a:visited {
	color: #800;
	text-decoration: none;
	border-bottom: 1px dotted #800;
}
.bodytext a:hover {
	color: #800;
	text-decoration: none;
	border-bottom: 1px dotted #800;
	background-color: #FFECB3;
}

/* SPRITE - Height = half of image */
.download-button {
	display: block;
	width: 49px;
	height: 52px;
	background: url(/images/navi/download-button.png) bottom;
	text-indent: -9999px;
	float: right;
}
.download-button:hover {
	background-position: 0 0;
}

/* IMAGE FLOATING */
.floatleft {
	float: left;
	background-color: #E6E6E6;
	border-radius: 6px 6px 6px 6px;
	border: 3px solid #E6E6E6;
	margin: 0 8px 0 0;	
}
.floatright {
	float: right;
	background-color: #E6E6E6;
    border-radius: 6px 6px 6px 6px;
    border: 3px solid #CCCCCC;
	margin: 2px 0 0 8px;
}

/* IMAGE PUSHDOWN */
.imagedown a img:hover {
	position: relative;
	bottom: -2px;
}

/* TOOOLTIP */
/* <a href="http://www.url.com/" target="_blank" class="tooltip"><img src="/image.png" width="16" height="16" border="0" /><span class="classic">TOOLTIP TEXT</span></a> */
.tooltip {position: relative;}
.tooltip span {
	margin-left: -999em;
	position: absolute;
}
.tooltip:hover span {
	border-radius: 2px 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; 
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 1px 1px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px rgba(0, 0, 0, 0.1);
	font: 11px Tahoma, Arial, sans-serif;
	position: absolute;
	z-index: 99;
	margin-left: 0;
	text-align: center;
	bottom: 23px;
	padding: 5px 6px 6px 6px;
	left: -29px;
	width: 64px;
}

.tooltip:hover img {border: 0;}

.classic {
	background: #000;
	padding: 2px 4px;
	color: #FFF;
}

/* VERTICAL TEXT - Make a div tag called rotation. Put text inside a <p> tag inside the <div> tag */
.rotation {
	position: fixed;
	right: -43px;
	bottom: 52px;
	font: 11px Tahoma, Geneva, sans-serif Verdana, Geneva, sans-serif;
	color: #907440;
	display: block;
}
.rotation p {
	position: relative;
	-ms-transform: rotate(270deg);
	-webkit-transform: rotate(270deg);
	-moz-transform: rotate(270deg);
	-o-transform: rotate(270deg);
	transform: rotate(270deg);
}
