/* Standard Stylesheet
www.projektname.de
Start: 01.01.2006
Letzte Aenderung: 10.02.2006
*/

@font-face {
    font-family: 'HollywoodHills';
    src: url('fonts/hollh___-webfont.eot');
    src: url('fonts/hollh___-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/hollh___-webfont.woff') format('woff'),
         url('fonts/hollh___-webfont.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}


/* Reset all */
*{
	padding: 0;
	margin: 0;
	border: 0;
}

/* Allgemeines */
body {
	font-size: 11px;
	font-style: italic;
	line-height: 1.6em;
	color: #505050;
	background: #fff url(gfx/bg.jpg);
	font-family: Georgia, "Times New Roman", serif;
}

body.sub {
background: transparent;
}

a:link {
	color: #333;
	background-color: #fff;
	text-decoration: none;
}

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

a:hover {
	text-decoration: underline;
}

/* Clear Class */
.c {
	clear: both;
}

img, a img {
	border: 0;
}

.keine-anzeige {
	display: none;
}

/* Absaetze */
p {
	font-size: 1em;
	line-height: 1.7em;
	margin: 0.5em 0;
	clear: both;
}

/* Kleinerer Text */
.s {
	font-size: 0.9em;
}

/* Links- bzw. Rechtsausrichtung für Elemente */
.leftalign {
	float: left;
	margin: 0 0.5em 0 0;
}

.rightalign {
	float: right;
	margin: 0 0 0 0.5em;
}

h1 {

}

h2 {

}

h3 {

}

h4 {

}

#outer-wrap {
height: 731px;
overflow: hidden;	
position: relative;
}

#wrapper {
width: 1300px;
height: 731px;
position: absolute;
left: 50%;
margin-left: -650px;
}

#wrapper.home {
background: url(gfx/bg-home.jpg) no-repeat center center;
}

#wrapper.life {
background-image: url(gfx/bg-life.jpg);
}

#wrapper.dancing {
background-image: url(gfx/bg-dancing.jpg);
}

#wrapper.kontakt {
background-image: url(gfx/bg-kontakt.jpg);
}

#wrapper.presse {
background-image: url(gfx/bg-presse.jpg);
}

#wrapper.galerie {
background-image: url(gfx/bg-galerie.jpg);
}

#wrapper-inner {
width: 1300px;
left: 50%;
margin-left: -650px;
position: absolute;
}

#wrapper-inner .gohome {
width: 400px;
height: 145px;
background: transparent;
display: block;
position: absolute;
top: 30px;
left: 400px;
text-indent: -9999px;
}

#navi {
position: absolute;
left: 200px;
top: 200px;
width: 200px;
height: 400px;
}

#navi a {
display: block;
text-indent: -9999px;
position: absolute;
}

#navi a:hover {
#z-index: 99;
}

#navi a.life {
width: 197px;
height: 179px;
background: url(gfx/navi-button-live.png);
top: 0;
left: -50px;
}

#navi a.life:hover, #navi a.life.active {
background: url(gfx/navi-button-live-hover.png);
}

#navi a.dancing {
width: 214px;
height: 124px;
background: url(gfx/navi-button-dancing.png);
top: 90px;
}

#navi a.dancing:hover, #navi a.dancing.active {
background: url(gfx/navi-button-dancing-hover.png);
}

#navi a.kontakt {
width: 155px;
height: 73px;
background: url(gfx/navi-button-kontakt.png);
top: 170px;
left: -10px;
z-index: 4;
}

#navi a.kontakt:hover, #navi a.kontakt.active  {
background: url(gfx/navi-button-kontakt-hover.png);
}

#navi a.presse {
width: 187px;
height: 148px;
background: url(gfx/navi-button-presse.png);
top: 175px;
left: 30px;
z-index: 0;
}

#navi a.presse:hover, #navi a.presse.active {
background: url(gfx/navi-button-presse-hover.png);
}

#navi a.facebook {
width: 144px;
height: 51px;
background: url(gfx/navi-button-facebook.png);
top: 255px;
left: 5px;
}

#navi a.facebook:hover {
background: url(gfx/navi-button-facebook-hover.png);
}

#navi a.impressum {
width: 123px;
height: 20px;
background: url(gfx/navi-button-impressum.png);
top: 310px;
left: 40px;
}

#navi a.impressum:hover, #navi a.impressum.active {
background: url(gfx/navi-button-impressum-hover.png);
}

#navi span.unterstuetzung {
display: block;
text-indent: -9999px;
position: absolute;
top: 330px;
left: 30px;
width: 113px;
height: 59px;
background: url(gfx/navi-wolkeunterstuetzt.png);
}

#navi a.plan {
width: 50px;
height: 44px;
background: url(gfx/navi-button-plan.png);
top: 390px;
left: 30px;
}

#navi a.plan:hover {
background: url(gfx/navi-button-plan-hover.png);
}

#navi a.worldvision {
width: 65px;
height: 52px;
background: url(gfx/navi-button-worldvision.png);
top: 380px;
left: 90px;
}

#navi a.worldvision:hover {
background: url(gfx/navi-button-worldvision-hover.png);
}

#wrapper a.galerie {
display: block;
width: 101px;
height: 127px;
position: absolute;
background: url(gfx/button-galerie.png);
text-indent: -9999px;
}

#wrapper a.galerie:hover {
background: url(gfx/button-galerie-hover.png);
}

#wrapper.home a.galerie {
right: 160px;
top: 122px;
}

#wrapper.life a.galerie {
left: 290px;
top: 50px;
}

#wrapper.dancing a.galerie {
left: 390px;
top: 340px;
}

#wrapper.kontakt a.galerie {
right: 180px;
top: 180px;
}

#wrapper.presse a.galerie {
right: 390px;
top: 45px;
}

#wrapper.galerie a.galerie {
left: 310px;
top: 70px;
}

#wrapper.life #button-wolkes-welt {
width: 159px;
height: 144px;
position: absolute;
right: 250px;
top: 120px;
background: url(gfx/button-koffer.png) no-repeat left top;
text-indent: -99999px;
}

#wrapper.life #button-wolkes-welt:hover {
background: url(gfx/button-koffer-hover.png) no-repeat left top;
}

#wrapper.life #kompass {
display: block;
position: absolute;
width: 80px;
height: 87px;
top: 210px;
right: 220px;
background: url(gfx/kompass.png) no-repeat left top;
text-indent: -99999px;
}

.kontakt #content {
width: 275px;
height: 433px;
right: 300px;
top: 240px;
position: absolute;
}

.presse #content {
width: 275px;
height: 433px;
right: 320px;
top: 240px;
position: absolute;
}

.dancing #content {
width: 330px;
height: 433px;
right: 320px;
top: 240px;
position: absolute;
}

.dancing #content a.video-thumb {
display: block;
position: absolute;
text-indent: -9999px;
}

#tooltip {
width: 151px;
height: 108px;
background: url(gfx/tooltip.png) no-repeat left top;
color: #fff;
padding: 55px 30px;
line-height: 40px;
font-weight: bold;
position: absolute;
text-align: center;
}

.dancing #content a.video-thumb:hover span {
display: block;
-moz-transform:rotate(-10deg);
-webkit-transform:rotate(-10deg);
-o-transform:rotate(-10deg);
transform:rotate(-10deg);
z-index: 9999999999;
}

.dancing #content a.video-01 {
width: 81px;
height: 76px;
top: 0;
left: 0;
background: url(gfx/video-thumb-01.png) no-repeat left top;
}

.dancing #content a.video-02 {
width: 81px;
height: 71px;
top: 63px;
left: 30px;
background: url(gfx/video-thumb-02.png) no-repeat left top;
}

.dancing #content a.video-03 {
width: 83px;
height: 72px;
top: 55px;
right: 45px;
background: url(gfx/video-thumb-03.png) no-repeat left top;
}

.dancing #content a.video-04 {
width: 82px;
height: 77px;
top: 5px;
right: 130px;
background: url(gfx/video-thumb-04.png) no-repeat left top;
}

.dancing #content a.video-05 {
width: 83px;
height: 80px;
top: 210px;
left: 80px;
background: url(gfx/video-thumb-05.png) no-repeat left top;
}

.dancing #content a.video-06 {
width: 83px;
height: 71px;
top: 160px;
left: 25px;
background: url(gfx/video-thumb-06.png) no-repeat left top;
}

.dancing #content a.video-07 {
width: 85px;
height: 81px;
top: 100px;
left: 115px;
background: url(gfx/video-thumb-07.png) no-repeat left top;
}

.dancing #content a.video-08 {
width: 86px;
height: 76px;
top: -50px;
left: 90px;
background: url(gfx/video-thumb-08.png) no-repeat left top;
}

.dancing #content a.video-09 {
width: 86px;
height: 82px;
top: 180px;
right: -50px;
background: url(gfx/video-thumb-09.png) no-repeat left top;
}

.dancing #content a.video-10 {
width: 83px;
height: 79px;
top: 150px;
right: 60px;
background: url(gfx/video-thumb-10.png) no-repeat left top;
}

.dancing #content a.video-11 {
width: 132px;
height: 124px;
bottom: 60px;
right: 35px;
background: url(gfx/video-thumb-11.png) no-repeat left top;
}

.dancing #content a.video-12 {
width: 83px;
height: 71px;
top: 130px;
right: -30px;
background: url(gfx/video-thumb-12.png) no-repeat left top;
}

.dancing #content a.video-13 {
width: 86px;
height: 75px;
bottom: 55px;
right: -40px;
background: url(gfx/video-thumb-13.png) no-repeat left top;
}

.dancing #content a.video-thumb:hover {
-moz-transform:rotate(10deg);
-webkit-transform:rotate(10deg);
-o-transform:rotate(10deg);
transform:rotate(10deg);
} 

#content h1, .life h1 {
margin-bottom: 20px;
font-family: 'HollywoodHills',arial, helvetica, sans-serif;
text-transform: uppercase;
font-style: normal;
font-weight: normal;
font-size: 28px;
}

.life h1 {
margin-bottom: 0px;
color: #008200;
}

.presse h1 {
color: #00337e;
}

.kontakt h1 {
color: #6d15a4;
}

.presse #content a.pdf {
display: block;
position: absolute;
}

.presse #content a.pdf-01 {
width: 89px;
height: 90px;
background: url(gfx/pdf-01.png) no-repeat left bottom;
left: 0px;
top: 30px;
}

.presse #content a.pdf-02 {
width: 66px;
height: 74px;
background: url(gfx/pdf-02.png) no-repeat left bottom;
left: 100px;
top: 60px;
}

.presse #content a.pdf-03 {
width: 73px;
height: 73px;
background: url(gfx/pdf-03.png) no-repeat left bottom;
left: 10px;
top: 120px;
}

.presse #content a.pdf-04 {
width: 83px;
height: 100px;
background: url(gfx/pdf-04.png) no-repeat left bottom;
left: 180px;
top: 120px;
}

.presse #content a.pdf-05 {
width: 85px;
height: 91px;
background: url(gfx/pdf-05.png) no-repeat left bottom;
left: 0px;
top: 210px;
}

.presse #content a.pdf-06 {
width: 67px;
height: 74px;
background: url(gfx/pdf-06.png) no-repeat left bottom;
left: 100px;
top: 180px;
}

.presse #content a.pdf-07 {
width: 67px;
height: 67px;
background: url(gfx/pdf-07.png) no-repeat left bottom;
left: 180px;
top: 250px;
}

.presse #content a.pdf-08 {
width: 66px;
height: 74px;
background: url(gfx/pdf-02.png) no-repeat left bottom;
left: 260px;
top: 180px;
}

.presse #content a.pdf-09 {
width: 67px;
height: 74px;
background: url(gfx/pdf-06.png) no-repeat left bottom;
left: 120px;
top: 270px;
}

.presse #content a.pdf-10 {
width: 73px;
height: 73px;
background: url(gfx/pdf-03.png) no-repeat left bottom;
left: 0px;
top: 310px;
}

.presse #content a:hover {
background-position: left top;
}

.presse #content a span.title {
width: 151px;
height: 108px;
display: none;
position: absolute;
left: -150px;
top: -80px;
background: url(gfx/tooltip-presse.png) no-repeat left top;
color: #fff;
padding: 10px 30px;
line-height: 40px;
font-weight: bold;
}

.presse #content a span.date {
color: #ccc;
position: absolute;
left: -120px;
top: -35px;
display: none;
color: #55f1ff;
border-top: 1px solid #4666a4;
width: 140px;
padding-top: 3px;
}

.presse #content a:hover span {
display: block;
}


#pages-wrap {
width: 288px;
height: 433px;
right: 320px;
top: 210px;
position: absolute;
}

#pages {
width: 250px !important;
margin-top: 20px;
}

#pages li {
background #fff;
height: 433px;
}

#pages-wrap .controlls {
position: absolute;
bottom: 155px;
left: 260px;
width: 55px;
}

#pages-wrap .prev {
display: block;
height: 20px;
width: 20px;
background: url(gfx/gallery-arrow-prev.png) no-repeat left top;
text-indent: -9999px;
cursor: pointer;
position: absolute;
left: 0;
top: 0;
}

#pages-wrap .next {
display: block;
height: 20px;
width: 20px;
background: url(gfx/gallery-arrow-next.png) no-repeat left top;
text-indent: -9999px;
cursor: pointer;
position: absolute;
right: 0;
top: 0;
}


#gallery-wrap {
width: 388px;
height: 433px;
position: absolute;
right: 270px;
top: 190px;
z-index: 2;
}

#gallery-wrap .frame {
background: url(gfx/gallery-rahmen.png);
width: 388px;
height: 389px;
position: absolute;
top: 0;
left: 0;
}

#gallery-wrap #gallery {
z-index: -1;
position: absolute;
margin: 0;
list-style: none;
left: 45px;
top: 40px;
width: 312px;
height: 299px;
}

#gallery-wrap #gallery li {
float: left;
width: 312px;
height: 299px;
}

#gallery-wrap .controlls {
position: absolute;
bottom: 40px;
right: 100px;
width: 55px;
}

#gallery-wrap .prev {
display: block;
height: 20px;
width: 20px;
background: url(gfx/gallery-arrow-prev.png) no-repeat left top;
text-indent: -9999px;
cursor: pointer;
position: absolute;
left: 0;
top: 0;
}

#gallery-wrap .next {
display: block;
height: 20px;
width: 20px;
background: url(gfx/gallery-arrow-next.png) no-repeat left top;
text-indent: -9999px;
cursor: pointer;
position: absolute;
right: 0;
top: 0;
}

a.galerie-damals {
display: block;
width: 183px;
height: 103px;
position: absolute;
left: 450px;
top: 200px;
text-indent: -9999px;
background: url(gfx/galerie-button-damals.png);
}

a.galerie-damals:hover {
background: url(gfx/galerie-button-damals-hover.png);
}

a.galerie-arbeit {
display: block;
width: 185px;
height: 79px;
position: absolute;
left: 380px;
top: 320px;
text-indent: -9999px;
background: url(gfx/galerie-button-arbeit.png);
}

a.galerie-arbeit:hover {
background: url(gfx/galerie-button-arbeit-hover.png);
}

a.galerie-leben {
display: block;
width: 160px;
height: 89px;
position: absolute;
left: 520px;
top: 450px;
text-indent: -9999px;
background: url(gfx/galerie-button-leben.png);
}

a.galerie-leben:hover {
background: url(gfx/galerie-button-leben-hover.png);
}

#subwrap {
width: 430px;
height: 420px;
position: absolute;
top: 270px;
left: 50px;
overflow: auto;
padding-right: 30px;
}

#subwrap h1 {
margin-bottom: 20px;
font-family: 'HollywoodHills', arial, helvetica,sans-serif;
font-size: 25px;
font-style: normal;
font-weight: normal;
}

#video-wrap{
position: absolute;
left: 40px;
top: 55px;
}

#preloader {
position: absolute;
top: 50%;
left: 50%;
width:433px;
height:365px;
background: url(gfx/loader-screen.png) no-repeat left top;
margin-left: -286px;
margin-top: -283px;
}

#preloader #loading-img {
width: 170px;
height: 104px;
position: absolute;
right: -80px;
top: 30px;
}

#preloader #loader {
width: 170px;
height: 104px;
background: url(gfx/loader-bg.png) no-repeat left top;
position: relative;
z-index: 10;
}

#preloader #loadingbar {
position: absolute;
top: 16px;
left: 22px;
}