@charset "UTF-8";
/* CSS Document */

#preload {
display: none
}
#preload img {
height: 0; width: 0; border: none;
position: absolute;
bottom: 0;
left: 0;
z-index: -30;
}

.buehne {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #75797c;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
}
.buehne #container {
	width: 760px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	height:760px !important;
	background-image:url(../pix/colonia_back1.jpg);
	background-repeat:no-repeat;
	background-position:bottom;
	background-color:#e8ebf1;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
	border:1px solid #CCCCCC;
}
.buehne #mainContent {
	padding:0 100px;
 /* remember that padding is the space inside the div box and margin is the space outside the div box */
}
.buehne #en a{
height:22px;
width:30px;
float:left;
background-image:url(../pix/menu/en1.png);
background-position:-30px 0px;
background-repeat:no-repeat;
}
.buehne #en a:hover {
height:22px;
width:30px;
float:left;
background-image:url(../pix/menu/en1.png);
background-position:0px 0px;
background-repeat:no-repeat;
}
.buehne #de a{
height:22px;
width:30px;
float:left;
background-image:url(../pix/menu/de1.png);
background-position:-30px 0px;
background-repeat:no-repeat;
}
.buehne #de a:hover {
height:22px;
width:30px;
float:left;
background-image:url(../pix/menu/de1.png);
background-position:0px 0px;
background-repeat:no-repeat;
}

/* angaben für KUNST IM ÖFF. RAUM // ZURÜCK ZUR STARTSEITE*/
#kr {
	height: 50px;
	width:280px;
	background-image:url(../pix/Koer.gif);
	outline:none;
	background-repeat:no-repeat;
	background-position:bottom left;

}
.koer:link, .koer:visited {
	display:			block;
	width:				100%;
	height:				100%;
	background-repeat:no-repeat;
	background-image:url(../pix/Koer_retour0.gif);
	outline:none;
	background-position:left bottom;
}
.koer:hover, .koer:active {
background-image:url(../pix/Koer_retour.gif);	
	outline:none;
}
#kren {
	height: 50px;
	width:280px;
	background-image:url(../pix/menu/en/Koer.gif);
	background-repeat:no-repeat;
	background-position:bottom left;

}
.koeren:link, .koer:visited {
	display:			block;
	width:				100%;
	height:				100%;
	background-repeat:no-repeat;
	background-image:url(../pix/menu/en/Koer_retour0.gif);
	background-position:left bottom;
	outline:none;
}
.koeren:hover, .koer:active {
background-image:url(../pix/menu/en/Koer_retour.gif);	
	outline:none;
}


.h3 {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
}
.hr {
border:solid #cccccc 1px;
}
.hr2 {
border:solid #fcad02 1px;
}
/* angaben für PUPLIK.ORG // LOS GEHT'S*/

#pupliklogo {
	height: 50px;
	float:right;
	width:280px;
	background:url(../pix/puplik_logo.gif);
		outline:none;
background-repeat:no-repeat;
	background-position:bottom right;
	}
	
#pupliklogo2 {
	height: 50px;
	float:right;
	width:280px;
	background:url(../pix/puplik_logo0.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
		outline:none;
}

#pupliklogoen {
	height: 50px;
	float:right;
	width:280px;
	background:url(../pix/menu/en/puplik_logo.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
		outline:none;
}
#pupliklogo2en {
	height: 50px;
	float:right;
	width:280px;
	background:url(../pix/menu/en/puplik_logo0.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
		outline:none;
}	

#puplik-content {
	width:600px;
	
}
#puplik-content2 {
background-color:#e8ebf1;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
color:#666666;	

}
#puplik_xmas {
height:680px;
background-image:url(../pix/frohexmas.jpg);
background-repeat:no-repeat;
background-position:center;}

#kontakt {
	height: 50px;
}
/* angaben für PUPLIK.ORG//PROJEKTE...*/
.logo:link, .logo:visited {
	display:			block;
	width:				100%;
	height:				100%;
	background:url(../pix/puplik_logo.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
	outline:none;
}
.logo:hover, .logo:active {
background-image:url(../pix/puplik_logo2.gif)
	
	outline:none;
}
/* das ganze in englisch*/
.logoen:link, .logo:visited {
	display:			block;
	width:				100%;
	height:				100%;
	background:url(../pix/menu/en/puplik_logo.gif);
	background-repeat:no-repeat;
	background-position:bottom right;
	outline:none;
}
.logoen:hover, .logo:active {
background-image:url(../pix/menu/en/puplik_logo2.gif)
outline:none;
}

/* kontakt, impressum, cv, links, etc*/

.kontaktl:link, .kontaktl:visited {
	display:			block;
	width:				100%;
	height:				100%;
	background-repeat:no-repeat;
	background-image:url(../pix/kontakt.gif);
	background-position:right top;
	outline:none;
}
.kontaktl:hover, .kontaktl:active {
background-image:url(../pix/kontakt2.gif);
		outline:none;
}


.lbOn{font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
}
.zurueck a{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
color:#fcad02;
text-decoration:none;
	outline:none;
}
.zuruecka:hover {
color:#D18E02;
	outline:none;
background-color:#E5E5E5;
}
.text {/* der inhalt allgemein*/

	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:9px;
	color:#75797c;
	}
.text a {
color:#fcad02;
text-decoration:none;
font-weight:bold;
		outline:none;
}
.text a:hover {
color:#D18E02;
background-color:#E5E5E5;
	outline:none;
}
/* die listen css*/
.list {
    list-style-type:square;
    margin:6px;
    padding:6px;
    line-height:1.5em;
}
/*projekt-details in iFrame*/
#pro {
	width:500px;
	text-align:right;

}	
#protext {
	text-align:left;
	width:300px;

}
#probild {
	width:200px;
	float:right;
	
	}	

#proclose {
	text-align:right;
	}	
	
/* ein Scroll-DIV ohne iFrame...*/
#mycustomscroll {
/* Typical fixed height and fixed width example */
width: 540px;
height: 519px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
padding:15px 0px 15px 15px;
background-color:#FFFFFF;
font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#000000;
	border:solid 1px;
	border-color:#CCCCCC;
	border-top:0px;
	float:left;
}
#mycustomscroll a {color:#fcad02;
text-decoration:none;
font-weight:bold;
	outline:none;
}

#mycustomscroll a:hover {
color:#D18E02;
background-color:#E5E5E5;
	outline:none;
}

/* Ende Scroll-DIV ohne iFrame...*/

#mycustomscroll2 {
/* Typical fixed height and fixed width example */
width: 540px;
height: 519px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
padding:15px 0px 15px 15px;
background-color:#FFFFFF;
background-image:url(../pix/aboutpuplik.jpg);
background-repeat:no-repeat;
background-position:bottom left;
font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#000000;
	border:solid 1px;
	border-color:#CCCCCC;
	border-top:0px;
	float:left;
}
#mycustomscroll2 a {color:#fcad02;
text-decoration:none;
font-weight:bold;
	outline:none;
}

#mycustomscroll2 a:hover {
color:#D18E02;
background-color:#E5E5E5;
	outline:none;
}

#diane {
/* Typical fixed height and fixed width example */
width: 540px;
height: 519px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
padding:15px 0px 15px 15px;
background-color:#FFFFFF;
background-image:url(../pix/nane_pre.jpg);
background-repeat:no-repeat;
background-position:top right;
background-position:
font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#000000;
	border:solid 1px;
	border-color:#CCCCCC;
	border-top:0px;
	float:left;
}
#diane a {color:#fcad02;
text-decoration:none;
font-weight:bold;
	outline:none;
}

#diane a:hover {
color:#D18E02;
background-color:#E5E5E5;
	outline:none;
}
#werner {
/* Typical fixed height and fixed width example */
width: 540px;
height: 519px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
padding:15px 0px 15px 15px;
background-color:#FFFFFF;
background-image:url(../pix/werner_pre.jpg);
background-repeat:no-repeat;
background-position:top right;
background-position:
font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#000000;
	border:solid 1px;
	border-color:#CCCCCC;
	border-top:0px;
	float:left;
}
#werner a {color:#fcad02;
text-decoration:none;
font-weight:bold;
	outline:none;
}

#werner a:hover {
color:#D18E02;
background-color:#E5E5E5;
	outline:none;
}
/* Scroll Bar Master Styling Starts Here */

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width: 15px;
background-color: #ffffff;
border-left:solid 1px #999999;
}
.vscrollerbar {
width: 15px;
background-color:#cccccc;

}
/* Scroll Bar Master Styling Ends Here */
.subtitle {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#999999;
}	
/* platzhalter für indexseitenlänge*/


projektscroll {/* der inhalt unter den einzelnen reitern*/


    text-align: left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	padding:15px 0px;
}

/* die projektliste als pseudo-tab-text-box*/
#menu {
	width:560px;
	margin-top:25px;
	clear:left;
}
	/* INSTALLATIONEN Reiter*/
	#installmenu {
		height:31px;
		width:115px;
		float:left;
	}
	.installationen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/installation.png);
	}
	.installationen:hover {
	background-image:url(../pix/menu/installation.png);
	background-position:0 -31px;
	outline:none;
	}
	
	.installaktiv {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/installation.png);
	background-position:0 -62px;
	}
	.installaktiv:hover {
	background-image:url(../pix/menu/installation.png);
	background-position:0 -62px;
	outline:none;
	}
	/* OBJEKTE Reiter*/
	#objektemenu {
		height:31px;
		width:75px;
		float:left;
	}
	.objekte {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/objekte.png);
	}
	.objekte:hover {
	background-image:url(../pix/menu/objekte.png);
	background-position:0 -31px;
		outline:none;
}
	
	.objekteaktiv {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/objekte.png);
	background-position:0 -62px;
		outline:none;
}
	.objekteaktiv:hover {
	background-image:url(../pix/menu/objekte.png);
	background-position:0 -62px;
	outline:none;
vv
	}
	
	/* INTERVENTIONEN Reiter*/
	#interventmenu {
		height:31px;
		width:121px;
		float:left;	
	}
	.interventionen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/interventionen.png);
	}
	.interventionen:hover {
	background-image:url(../pix/menu/interventionen.png);
	background-position:0 -31px;
		outline:none;
}
	.interventionenaktiv {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/interventionen.png);
	background-position:0 -62px;
		outline:none;
}
	.interventionenaktiv:hover {
	background-image:url(../pix/menu/interventionen.png)
	background-position:0 -62px;
		outline:none;
}
	/* TIPP DER WOCHE Reiter*/
	#tippmenu {
		height:31px;
		width:125px;
		float:left;
	}
	.tipp {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/tippderwoche.png);
	}
	.tipp:hover {
	background-image:url(../pix/menu/tippderwoche.png);
		background-position:0 -31px;
	outline:none;
	}
	
	.tippaktiv {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/tippderwoche.png);
		background-position:0 -62px;
	outline:none;
	}
	.tippaktiv:hover 	{
	background-image:url(../pix/menu/tippderwoche.png);
		background-position:0 -62px;

	}
	/* KONTAKT Reiter*/
	#kontaktmenu 	{
		height:31px;
		width:120px;
		float:left;
	}
	.kontakt 	{
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/kontakt.png);
	}
	.kontakt:hover {
		background-image:url(../pix/menu/kontakt.png);
		background-position:0 -31px;
	outline:none;
	}
	
	.kontaktaktiv {
	display:block;
	width:				100%;
	height:				100%;
		background-image:url(../pix/menu/kontakt.png);
		background-position:0 -62px;
	outline:none;
	}
	.kontaktaktiv:hover {
		background-image:url(../pix/menu/kontakt.png);

			background-position:0 -62px;
	outline:none;
	}
	

/*ENGLISCH_MENUTABS*/
	
	/* INSTALLATIONEN Reiter*/
	#installmenuen {
		height:31px;
		width:115px;
		float:left;
	}
	.installationenen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/installations.png);
	}
	.installationenen:hover {
	background-image:url(../pix/menu/en/installations.png);
	background-position:0 -31px;
		outline:none;
}
	
	.installaktiven {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/installations.png);
	background-position:0 -62px;
	}
	.installaktiven:hover {
	background-image:url(../pix/menu/en/installations.png);
	background-position:0 -62px;
	outline:none;
	}
	/* OBJEKTE Reiter*/
	#objektemenuen {
		height:31px;
		width:75px;
		float:left;
	}
	.objekteen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/objects.png);
	}
	.objekteen:hover {
	background-image:url(../pix/menu/en/objects.png);
	background-position:0 -31px;
		outline:none;
}
	
	.objekteaktiven {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/objects.png);
	background-position:0 -62px;
	}
	.objekteaktiven:hover {
	background-image:url(../pix/menu/en/objects.png);
	background-position:0 -62px;
	outline:none;
	}
	
	/* INTERVENTIONEN Reiter*/
	#interventmenuen {
		height:31px;
		width:121px;
		float:left;	
	}
	.interventionenen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/interventions.png);
	}
	.interventionenen:hover {
	background-image:url(../pix/menu/en/interventions.png);
	background-position:0 -31px;
		outline:none;
}
	.interventionenenaktiv {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/interventions.png);
	background-position:0 -62px;
	}
	.interventionenenaktiv:hover {
	background-image:url(../pix/menu/en/interventions.png)
	background-position:0 -62px;
		outline:none;
}
	
	/* TIPP DER WOCHE Reiter*/
	#tippmenuen {
		height:31px;
		width:125px;
		float:left;
	}
	.tippen {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/hintoftheweek.png);
	}
	.tippen:hover {
	background-image:url(../pix/menu/en/hintoftheweek.png);
		background-position:0 -31px;
	outline:none;
	}
	
	.tippaktiven {
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/hintoftheweek.png);
		background-position:0 -62px;

	}
	.tippaktiven:hover 	{
	background-image:url(../pix/menu/en/hintoftheweek.png);
		background-position:0 -62px;
	outline:none;
	}
	/* KONTAKT Reiter*/
	#kontaktmenuen 	{
		height:31px;
		width:120px;
		float:left;
	}
	.kontakten 	{
	display:block;
	width:				100%;
	height:				100%;
	background-image:url(../pix/menu/en/contact.png);
	}
	.kontakten:hover {
		background-image:url(../pix/menu/en/contact.png);
		background-position:0 -31px;

	}
	
	.kontaktaktiven {
	display:block;
	width:				100%;
	height:				100%;
		background-image:url(../pix/menu/en/contact.png);
		background-position:0 -62px;

	}
	.kontaktaktiven:hover {
		background-image:url(../pix/menu/en/contact.png);
		background-position:0 -62px;
	outline:none;
	}
		
		*:focus
{
 -moz-outline: none  !important;
 -moz-outline-offset: 1px         !important;
 -moz-outline-radius: 5px         !important;
}