/************************/
/* GLOBAL PAGE SETTINGS */
/************************/

/* Just some base styles not needed for example to function */
@font-face 
{ 
    font-family: "CalibriRegularWoff";  
    src: url("../fonts/calibri-webfont.woff") 
    format("woff") 
}

@font-face 
{ 
    font-family: "CalibriRegularTTF";  
    src: local("Calibri"), 
    url("../fonts/CALIBRI.ttf") 
    format("TrueType") 
}


*, html { font-family: CalibriRegularWoff, CalibriRegularTTF, Times New Roman }

html, body { 
    background-color: #fef7ed;
    /*margin: 0;
    padding: 0;*/
    height: 100%; /* WICHTIG!!! STRECKT ANZEIGENBEREICH AUF 100% */
    overflow:auto;
	width: 1124px;
}

a:link {
    color: #944148;
    text-decoration: underline; 
}

a:active {
    color: #0000ff; 
    text-decoration: underline; 
}

a:visited {
    color: #944148; 
    text-decoration: underline; 
}

a:hover {
    color: #ff0000; 
    text-decoration: none; 
}


/***********************/
/* NAVIGATION SETTINGS */
/***********************/

.navigation {
    left: 50px;
    width: 580px;
    height: 473px;
	top: 50px;
	position: absolute;
	border: solid 0px #ffffff;
	z-index: 4;    
}

.navigation_image{
    left: 70px;
    width: 473px;
	height: 473px;
	position:relative;
	border: solid 0px #ffffff;
	z-index: 3;
	overflow: hidden;
}
.navigation_imageSchrift{
    top: 80px;
    width: 580px;
	height: 320px;
	position:absolute;
	border: solid 0px #ffffff;
	z-index: 6;
	overflow: hidden;
	background-image:url(../images/navigation/spacer.gif);
    background-repeat:no-repeat;
}

/*
This class is empty - only needed by JavaScript 
but to fullfill all checks by NetBeans it should be alive!
*/
.active {

}



.navi {
    overflow: hidden;
    position: absolute;
    z-index: 6;
}

.navi.point {
    border: 0px solid #000000;
    width: 100px;                /* Width in pixels of full-sized image  */
    height: 96px;               /* Height in pixels of full-sized image */
    background-image:url(../images/navigation/spacer.gif);
    background-repeat:no-repeat;
}

.full {
    position: absolute;
}

.navi.wann {
    position: absolute;
    top:10px;
    left: 180px;
}
.navi.was {
    position: absolute;
    top: 155px;
    left: 55px;
}
.navi.wie {
    position: absolute;
    top: 379px;
    left: 316px;
}
.navi.wo {
    position: absolute;
    top: 226px;
    left: 448px;

}
.navi.warum {
    position: absolute;
    top: 335px;
    left: 115px;
}
.navi.wer {
   position: absolute;
   top: 45px;
   left: 385px;    
}


/********************/
/* CONTACT SETTINGS */
/********************/

.contact{
    position: absolute;
    top:30px;
    left: 500px;
    width: 600px;
    overflow: hidden;
    white-space: nowrap;
    z-index: 2;
    color: #944148;
    text-align:right;
}

.contact > .info {
    font-size: 30px;
}

.contact > .name {
    font-size: 32px;
}

.contact > .tel {
    font-size: 12px;
}

.contact > .details {
    font-size: 12px;
}


/******************/
/* IMAGE SETTINGS */
/******************/

.images {
    top: 285px;
	left: 680px;
	width: 420px;
	height: 630px;
	position: absolute;
	border: solid 0px #ffffff;
	z-index: 1;
}

.images .big {
    top: 220px;
	left: 60px;
	width: 300px;
    height: 300px;
    position: absolute;
	border: solid 0px #ffffff;
	display: block;
    background: #E6E7ED;
    -moz-border-radius: 200px;
    -webkit-border-radius: 200px;
    -khtml-border-radius: 200px;
    border-radius: 200px;
    background-position:50% 50%;
    background-repeat:no-repeat;   
}

.images .mid {
	top: -35px;
	left: -40px;
	width: 200px;
    height: 200px;
    position: absolute;
	border: solid 0px #ffffff;
	display: block;
    background: #E6E7ED;
    -moz-border-radius: 100px;
    -webkit-border-radius: 100px;
    -khtml-border-radius: 100px;
    border-radius: 100px;
    background-position:50% 50%;
    background-repeat:no-repeat; 
}

.images .small {
	top: 45px;
	left: 220px;
	width: 145px;
    height: 145px;
    position: absolute;
	border: solid 0px #ffffff;
	display: block;
    background: #E6E7ED;
    -moz-border-radius: 80px;
    -webkit-border-radius: 80px;
    -khtml-border-radius: 80px;
    border-radius: 80px;
    background-position:50% 50%;
    background-repeat:no-repeat; 
}

.image.big.wann{
    background-color: #ff6945;
}
.image.mid.wann{
    background-color: #ff6945;
}
.image.small.wann{
    background-color: #ff6945;
}

.image.big.wo{
    background-color: #c2d448;   
}
.image.mid.wo{
    background-color: #b8c736;   
}
.image.small.wo{
    background-color: #dfe088;   
}

.image.big.wer{
    background-color: #ffc03c;    
}
.image.mid.wer{
    background-color: #f4b418;    
}
.image.small.wer{
    background-color: #fadfa0;    
}

.image.big.wie{
    background-color: #79bdc7;  
}
.image.mid.wie{
    background-color: #2d859b;  
}
.image.small.wie{
    background-color: #00aeb2;  
}

.image.big.was{
    background-color: #f32153;    
}
.image.mid.was{
    background-color: #f32153;    
}
.image.small.was{
    background-color: #f32153;    
}

.image.big.warum{
    background-color: #c46274;    
}
.image.mid.warum{
    background-color: #e1b4c7;    
}
.image.small.warum{
    background-color: #a94d85;    
}


/********************/
/* CONTENT SETTINGS */
/********************/

.content {
    width: 620px;
	top: 450px;
	left: 100px;
	position: absolute;
	border: solid 0px #ffffff; 
	z-index: 1;
	display:inline;
}

.header.headline {
    font-size: 30px;
}

.header.info {
    font-size: 16px;
}

.content.main  {
    font-size: 16px;
    position: absolute;
    overflow-x: hidden;
    color: #944148;
}

.content.main > .wann .highlight {
    color: #ff6945;
}

.content.main > .wo .highlight {
    color: #c2d448;
}

.content.main > .was .highlight {
    color: #f32153;
}

.content.main > .wie .highlight {
    color: #00aeb2;
}

.content.main > .warum  .highlight{
    color: #c46274;
}

.content.main > .wer .highlight {
    color: #ffc03c;
}

.content.main table{
    color: #944148;    
}

table td.space {
	border-width: 1px;
	padding: 0px;
	border-style: dotted;
	border-color: gray;
	
}

table th.left {
	background-color: #fbd1a3;
}

table th.right {
	background-color: #f69e67;
}


#overlay {
   position: fixed;
   z-index:199;
   top: 0px;
   left: 0px;
   height:100%;
   width:100%;

}

.overlay {
    font-size:9px; 
    color: #944148;
    font-style:normal; 
    display:none;
    width:100%;
}

.overlay.anmeldung{
    font-size:13px;
    height: auto;
    left: 10px;
    width: 90%;
    background-color: #fef7ed;
    left:5%;
    position:relative;
}

.overlay.impressum{
    font-size:12px;
    height: auto;
    width: 90%;
    text-align:left;
    background-color: #fef7ed;
    left:5%;
    position:relative;
}

* html #overlay { /* ie6 hack */
   position: absolute;
   height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
}

.overlayBG {
   background-color:#000;
   -ms-filter: "Alpha(Opacity=75)";
   filter:alpha(opacity=75);
   -moz-opacity: 0.75;
   opacity: 0.75;
}

#lightBox {
   position:fixed;
   top:40%;
   left:50%;
   margin-left:-200px;
   margin-top:-200px;
   z-index:200;
   width:400px;
   /*height:430px;*/
   height: auto;
   background-color: #fef7ed;
   text-align:center;
   -moz-border-radius: 20px;
   -webkit-border-radius: 20px;
   -khtml-border-radius: 20px;
   border-radius: 20px;
      
}

* html #lightBox { /* ie6 hack */
   position: absolute;
   margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
}

textarea {
    resize: none;
}

.emailInput{
   width:220px;   
}

.telInput{
   width:220px;   
}

.emailSecurity{
    width:100px;
}.addr {

}