/*
* This file belongs to it-fitness
* author: Christoph Franz - WE DO / franz@we-do.eu
* layout CSS
*/

/* allgemeiner Aufbau */



html{
	background: #ffffff url('./../images/verlauf.png') left top repeat-x;
	height:100%;
}


body{
	background: transparent url('./../images/laufbahn.png') center 10px no-repeat;
	height:100%;
}

#wrapper{
	margin-left:auto;
	margin-right:auto;
	width:600px;
	
}

a:active {
    outline: none;
}

div#section{
	position:absolute;
	top:50%;
	left:50%;
	width:962px;
	height:539px;
	margin-left:-481px;
	margin-top:-270px;
	background-color:#ff0000;
	padding-top:20px;
	background: transparent url('./../images/buttons.png') left -228px no-repeat;
}

div#section  #left,
div#section  #right{
	float:left;
}

div#section  #left{
	width:400px;
	margin-left:30px;
}

div#section  #right{
	width:490px;
	margin-left:10px;
}


h1,h2{color:#e95d0f;margin-bottom:5px;}


div#section  #left h1{
	font-size: 40px;
	margin-bottom:12px;
	margin-top:5px;
}

div#section  #left h2{
	font-size:13px;
}

div#section #left p{
	margin-top:10px;
	font-size:12px;
	line-height:1.3;
	margin-bottom:0px;
}


div#nav{
	position:absolute;
	bottom:50px;
	height:165px;
	width:396px;	
}

/*orange */

div#nav #button_orange,
div#nav #button_orange:link,
div#nav #button_orange:visited{
	display:block;
	width:346px;
	height:61px;
	background: transparent url('./../images/buttons.png') left top no-repeat;
	text-decoration:none;
	color:#515254;
	color:#ffffff;
	font-size:1.1em;
	padding-left:50px;
	padding-top:15px;
	margin-bottom:15px;
	position:absolute;
	left:0px;
	top:0px;
}

div#nav #button_orange:active,
div#nav #button_orange:hover,
div#nav #button_orange:focus{
	background-position:left -77px;
	color:#ffffff;
}
div#nav #button_orange:active{
	background-position:left -154px;
	color:#e95d0f;
}

div#nav #button_orange span,
div#nav #button_orange:link span,
div#nav #button_orange:visited span,

div#nav #button_orange:hover span,
div#nav #button_orange:focus span{
	color:#ffffff !important;
	font-size:2.1em;
	font-weight:bold;
}

div#nav #button_orange:active span {
	color:#e95d0f !important;
}

/* orange ende */


div#nav img{position:absolute;}

/* grau */



div#nav a#button_what,
div#nav a#button_what:link,
div#nav a#button_what:visited{
	display:block;
	width:277px;
	height:73px;
	background: #ffffff url('./../images/buttons.png') -396px top no-repeat;
	position:absolute;
	bottom:0;
	left:0;
}

div#nav a#button_what:hover,
div#nav a#button_what:focus{
	background-position:-396px -76px;
}


div#nav a#button_what:active{
	background-position:-396px -152px;
}




div#nav #button_fit_auf{
	right:-3px;
	bottom:63px;
}


div#nav a#button_twitter,
div#nav a#button_twitter:link,
div#nav a#button_twitter:visited{
	right:0;
	bottom:0px;
	position:absolute;
	display:block;
	width:108px;
	height:24px;
	background: #ffffff url('./../images/buttons.png') -782px -24px no-repeat;	
}


div#nav a#button_twitter:hover,
div#nav a#button_twitter:focus{
	background-position:-782px -54px;
}

div#nav a#button_twitter:active{
	background-position:-782px -84px;	
}




div#nav a#button_facebook,
div#nav a#button_facebook:link,
div#nav a#button_facebook:visited{
	right:0;
	bottom:31px;
	position:absolute;
	display:block;
	width:108px;
	height:24px;
	background: #ffffff url('./../images/buttons.png') -673px -24px no-repeat;	
}

div#nav a#button_facebook:hover,
div#nav a#button_facebook:focus{
	background-position:-673px -54px;
}

div#nav a#button_facebook:active{
	background-position:-673px -84px;
}


#right{
	background: #ffffff url('./../images/maennchen.gif') 86px 191px no-repeat;
	height:500px;
}

#right .container p{
	float:right;
	width:300px;
	text-align:right;
	font-size:1.2em;
	margin-right:10px;
}

#right .container div.addthis_toolbox{
	float:right;
}


#right #logo_initiative{
	float:right;
	margin-top:10px;
}

#more{
	position: absolute;
	height:106px;
	width:225px;
	background: transparent url('./../images/popup.png') left top no-repeat;
	left:240px;
	bottom:40px;
	padding:15px 10px 15px 15px;
	display:none;
}

.more a,
.more a:link,
.more a:visited{
	color:#e95d0f;
	text-decoration:none;
}

.more a:active,
.more a:hover,
.	more a:focus{
	text-decoration:underline;
}

.more{
	position: absolute;
	width:250px;
	left:240px;
	bottom:50px;
}

.more #top,
.more #bottom{
	background-color:#ff0000;
	height:16px;
	overflow:hidden;
	background: transparent url('./../images/buttons.png') -673px top no-repeat;
}

.more #bottom{
	background: transparent url('./../images/buttons.png') -673px -113px no-repeat;
}

.more #c{
	padding-left:10px;
	padding-right:10px;
	background: transparent url('./../images/popup_c.png') left top repeat-y;
}

div#section #left .more #c p{
	margin-top:0px;
}
#close{
	position:absolute;
	right:-15px;
	top:-15px;
	color:#ffffff;
	cursor: pointer;
}

/*player*/

#player{
	position: absolute;
	right: 31px;
	top: 100px;
}

#right{
	background: #ffffff url('./../images/maennchen2.gif') 315px 370px no-repeat;
	height:500px;
}