/* ============================================================================================ 

Autor: wms.im  - Web Media Service & Internet Marketing
Creater: wms.im - the design is created and developed by Web Media Service & Internet Marketing
Date: Mai 2009
Projekt: Homepage activ-fitness-stuttgart.info
all rights reserve by wms.im

============================================================================================ */
/* =======================================================================================
Navigation 
========================================================================================*/
/* background */
ul#nav
{
	list-style-type: none;
	position: relative;
	width: 100px;
	height: 135px;
	border: none;
	padding: 0;
	background-image: url(../images/navibutton.png);
	background-repeat: no-repeat;
	margin-top: 15px;
	margin-left: 15px;
}

ul#nav li
{
	display : inline;
}

ul#nav li a
{
	position: relative;
	display: block;
	text-decoration: none;
}

/* main content-containing */
ul#nav li a span.offset
{
	margin-top: -9000px;
	margin-left: -9000px;
	position: absolute;
}

/* Grundeinstellung hover, focus und active */
ul#nav li a:hover span.offset, ul#nav li a:focus span.offset, ul#nav li a:active span.offset
{
	color: #000000;
	background-image: url(../images/navi_pics/nav_background.png);
	background-repeat: repeat;
	display: block;
	width: 150px;
	height: auto;
	text-decoration: none;
	cursor: help;
}

/* Grundeinstellung span */
ul#nav li a:hover span.offset span, ul#nav li a:focus span.offset span, ul#nav li a:active span.offset span
{
	display: block;
	width: 140px;
	margin: 5px;
	color: #000000; /* font-color */
}

/* Navigationspunkt 1 */

ul#nav li a#nav01
{
	width: 30px;
	height: 30px;
	margin-top: 0px;
	margin-left: 0px;
	position: absolute;
}

ul#nav li a#nav01:hover, ul#nav li a#nav01:focus, ul#nav li a#nav01:active
{
	background : transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

/* ausrichtung popup */
ul#nav li a#nav01:hover span.offset, ul#nav li a#nav01:focus span.offset, ul#nav li a#nav01:active span.offset
{
	margin-top: 0px;
	margin-left: 115px;
}

/* Navigationspunkt 2 */

ul#nav li a#nav02
{
	width: 30px;
	height: 30px;
	margin-top: 0px;
	margin-left: 35px;
	position: absolute;
}

ul#nav li a#nav02:hover, ul#nav li a#nav02:focus, ul#nav li a#nav02:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav02:hover span.offset, ul#nav li a#nav02:focus span.offset, ul#nav li a#nav02:active span.offset
{
	margin-top: 0px;
	margin-left: 80px;
}

/* Navigationspunkt 3 */
ul#nav li a#nav03
{
	width: 30px;
	height: 30px;
	margin-top: 0px;
	margin-left: 70px;
	position: absolute;
}

ul#nav li a#nav03:hover, ul#nav li a#nav03:focus, ul#nav li a#nav03:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav03:hover span.offset, ul#nav li a#nav03:focus span.offset, ul#nav li a#nav03:active span.offset
{
	margin-top: 0px;
	margin-left: 45px;
}

/* Navigationspunkt 4 */
ul#nav li a#nav04
{
	width: 30px;
	height: 30px;
	margin-top: 35px;
	margin-left: 0px;
	position: absolute;
}

ul#nav li a#nav04:hover, ul#nav li a#nav04:focus, ul#nav li a#nav04:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav04:hover span.offset, ul#nav li a#nav04:focus span.offset, ul#nav li a#nav04:active span.offset
{
	margin-top: -35px;
	margin-left: 115px;
}

/* Navigationspunkt 5 */
ul#nav li a#nav05
{
	width: 30px;
	height: 30px;
	margin-top: 35px;
	margin-left: 35px;
	position: absolute;
}

ul#nav li a#nav05:hover, ul#nav li a#nav05:focus, ul#nav li a#nav05:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav05:hover span.offset, ul#nav li a#nav05:focus span.offset, ul#nav li a#nav05:active span.offset
{
	margin-top: -35px;
	margin-left: 80px;
}

/* Navigationspunkt 6) */
ul#nav li a#nav06
{
	width: 30px;
	height: 30px;
	margin-top: 35px;
	margin-left: 70px;
	position: absolute;
}

ul#nav li a#nav06:hover, ul#nav li a#nav06:focus, ul#nav li a#nav06:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav06:hover span.offset, ul#nav li a#nav06:focus span.offset, ul#nav li a#nav06:active span.offset
{
	margin-top: -35px;
	margin-left: 45px;
}

/* Navigationspunkt 7 */
ul#nav li a#nav07
{
	width: 30px;
	height: 30px;
	margin-top: 70px;
	margin-left: 0px;
	position: absolute;
}

ul#nav li a#nav07:hover, ul#nav li a#nav07:focus, ul#nav li a#nav07:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav07:hover span.offset, ul#nav li a#nav07:focus span.offset, ul#nav li a#nav07:active span.offset
{
	margin-top: -70px;
	margin-left: 115px;
}

/* Navigationspunkt 8 */
ul#nav li a#nav08
{
	width: 30px;
	height: 30px;
	margin-top: 70px;
	margin-left: 35px;
	position: absolute;
}

ul#nav li a#nav08:hover, ul#nav li a#nav08:focus, ul#nav li a#nav08:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav08:hover span.offset, ul#nav li a#nav08:focus span.offset, ul#nav li a#nav08:active span.offset
{
	margin-top: -70px;
	margin-left: 80px;
}

/* Navigationspunkt 9 */
ul#nav li a#nav09
{
	width: 30px;
	height: 30px;
	margin-top: 70px;
	margin-left: 70px;
	position: absolute;
}

ul#nav li a#nav09:hover, ul#nav li a#nav09:focus, ul#nav li a#nav09:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav09:hover span.offset, ul#nav li a#nav09:focus span.offset, ul#nav li a#nav09:active span.offset
{
	margin-top: -70px;
	margin-left: 45px;
}

/* Navigationspunkt 10 */
ul#nav li a#nav10
{
	width: 100px;
	height: 30px;
	margin-top: 105px;
	margin-left: 0px;
	position: absolute;
}

ul#nav li a#nav10:hover, ul#nav li a#nav10:focus, ul#nav li a#nav10:active
{
	background: transparent url(../images/navibutton.png) no-repeat -130px 0px;
}

ul#nav li a#nav10:hover span.offset, ul#nav li a#nav10:focus span.offset, ul#nav li a#nav10:active span.offset
{
	margin-top: -105px;
	margin-left: 115px;
}

/* =======================================================================================
Ende Navigation
========================================================================================*/