/* clearfix */
	.clearfix:after
{
				content: '.';
				display: block;
				height: 0;
				clear: both;
				visibility: hidden;
}
/* this is for ie5mac only, reset for other browsers follows below 
.clearfix {display: inline-block;}
/* Hide from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac - clearfix credits: 
   Tony Aslett (csscreator.com), Mark Hadley and Matt Keogh, 
   Alex Robinson, Holly 'n John (positioniseverything)
   - end clearfix */






/* debug: 

	div, 
	ul, 
	p
{
				background-color: #dfd;
				border-style: solid; border-color: #fdd; border-width: 0 1px 0 0;
}


	.debugsmall
{
				font-size: 65%;
				color: #966;
}

*/






/* start site definitions: */

	*
{
				padding: 0;
				margin: 0;
}



	body
{
				/*height: 550px;*/
				/*overflow: hidden;*/
				text-align: center; /* ie6 (centered content area) */
				font-size: 100.01%;
				font-family: Arial, sans-serif;
				background-color: #37464b;
}



	p
{
				font-size: 11px;
}




	a, 
	img
{
				border-style: none;
}


	a, 
	a:visited
{
				text-decoration: none;
}
	a:hover
{
				/*text-decoration: underline;*/
}

	a:focus
{
				outline: none;
}

	ul, 
	li
{
				list-style-type: none;
				list-style: none;
				/* Einer (nicht mehr auffindbaren) Angabe nach sei es in 
				Bezug auf umfassende Interpretation sinnvoll, beide Angaben 
				fuer ul ul und li zu machen. Bisher konnte ich das nicht 
				bestaetigen, habe aber noch nicht alle Versionen mit 'allen' 
				Browsern durchgespielt. */
}


	strong
{
				font-weight: bold;
}







/* js-helper-class-based initial states for js-animations 
   ------------------------------------------------------------------------
   instead of doing this with jQuery i use a helper class to achieve 
   display:none for initially hidden elements, this is the  earliest point 
   of time this can be done and it should prevent the content from flashing 
   (which might happen if jQuery would do the job as it needs to wait for 
   the DOM to be ready) see index.htm for the second part of this solution and 
   'www.learningjquery.com/2008/10/1-way-to-avoid-the-flash-of-unstyled-content' 
   for further reading, pros and cons etc */

	.js #header, 
	.js #allnav,
	.js #a-imprint
{
				display: none;
}

	.js #line
{
				width: 1px;
}

/* END js-helper-class-based initial states for js-animations */



	p span.sup
{
				font-size: 60%;
				margin: 0 0 -4px 0;
				line-height: 100%;
}


	.stdtextcol
{
				color: #aabdc7;
}

	span.highlighttextcol,
	p.highlighttextcol
{
				color: #fff !important;
				padding-bottom: 20px;
}

	span#indent-tel-number
{
				color: #37464b;	
}


/* =========================================================================
   wrapper div#all 
   ========================================================================= */

   div#all
{
				text-align: left; /* reset body text-align:center for ie6 */
				width: 703px;
				margin: 20% auto 0 auto;
}

	div#allinner
{
				/* without repeating the width here with ie7 the slideshow 
				   sticks to the right border of the viewport, wothout the 
				   positioning Firefox and Safari stick the navigation 
				   elements to the upper border of the viewport */
				width: 703px; 
				position: absolute;
}






/* =========================================================================
   div#header 
   ========================================================================= */

	div#header
{
				height: 90px;
				/* ohne width schiebt ie7 die div aus dem viewport raus weit nach rechts */
				width: 703px;
}



/* -------------------------------------------------------------------------
   company logo 
   ------------------------------------------------------------------------- */

   div#logo
{
				float: left;
				margin: 0 52px 0 0;
}






/* -------------------------------------------------------------------------
   main navigation 
   ------------------------------------------------------------------------- */

	/* initial visibility states */
	div#allnav
{
				/* display: none; */
}




/* level 0 - index -> english | italiano 
   ------------------------------------------------------------------------- */

   


/* level 1 (and anchestors where not overridden), contact|projects|design|info 
   ------------------------------------------------------------------------- */

	div#allnav ul {}

	div#allnav ul li
{
				float: left;
				/* conpletely weird, but with ie6&7 i have to set the font-size 
				   of these li's to 1px less than the height of the nested 
				   a-tags to not have the a-tags space between them */
}

	div#allnav ul li a,
	div#allnav ul li a:visited 
{
				width: 54px;
				display: block;
				font-size: 10px;
				color: #aabdc7;
				/*background-color: #f9f;*/
}

	div#allnav ul li a:hover,
	div#allnav ul li a.act
{
				color: #fff;
}

	* html div#allnav ul li a:hover,
	* html div#allnav ul li a.act
{
				color: #aabdc7;
}

	div#allnav ul li a:active {}


/* level 2 
   ------------------------------------------------------------------------- */


	/* all 
	   --- */

	/* initial visibility state */
	div#allnav ul ul
{
				display: none;
}

	div#allnav ul ul li
{
				width: 96px;
				/*background-color: #af7;*/
}

	div#allnav ul ul li a,
	div#allnav ul ul li a:visited
{
				width: 96px;
}




	/* contact - no sub categories 
	   --------------------------- */




	/* projects 
	   -------- */

	div#allnav ul ul#ul-projects
{
				position: absolute;
				top: 0;
				left: 535px;
				/* width needed by ie6, without nested li's will not float */
				width: 192px;
				/*background-color: #9f9;*/
}




	/*  design 
	   ------ */

	div#allnav ul ul#ul-design
{
				position: absolute;
				top: 0;
				left: 630px;
}




	/* info 
	   ---- */

	div#allnav ul ul#ul-info
{
				position: absolute;
				top: 0;
				left: 476px;
				/* width needed by ie6, without nested li's will not float */
				width: 352px;
}

	div#allnav ul ul#ul-info li
{
				width: auto;
}

	div#allnav ul ul#ul-info a
{
				width: auto;
				margin: 0 0 0 16px;
}





/* level 3 
   ------------------------------------------------------------------------- */



   /* all 
      --- */

	div#allnav ul ul ul li
{
				float: none;
				padding-bottom: 6px;
}


	div#allnav ul ul ul li a,
	div#allnav ul ul ul li a:visited
{
				font-size: 9px;
}





	/* contact - no sub categories 
	   --------------------------- */




	/* projects 
	   -------- */

	div#allnav ul ul #ul-projects-architecture
{
				margin: 26px 0 0 0;
				/*background-color: #ddd;*/
}


	div#allnav ul ul #ul-projects-interior
{
				margin: 26px 0 0 0;
				/*background-color: #ccc;*/
}





	/* design 
	   ------ */

	div#allnav ul ul #ul-design-objects
{
				margin: 26px 0 0 0;
}




	/* info - no sub categories 
	   ------------------------ */



/* END main navigation ----------------------------------------------------- */







/* -------------------------------------------------------------------------
   line anmation, tax id number, imprint link 
   ------------------------------------------------------------------------- */

	div#linewrapper
{
				float: left;
				width: 703px;
				/* ist in ie6/7 sonst zu hoch */
				height: 2px;
				/* ie6: height: ohne springt die div NACH der Animation auf 
				   eine zu grosse Hoehe */
				overflow: hidden;
				margin: 13px 0 9px 0;
				/*background-color: #00f;*/
}
	div#line
{
				width: 703px;
				/* ist in ie6/7 sonst zu hoch */
				height: 1px;
				border-style: solid;
				border-width: 1px 0 0 0;
				border-color: #fff;
}




	/* tax id number */
	div#header-textadd
{
				float: left;
				width: 420px;
				/*background-color: #0f0;*/
}


	div#header-textadd p
{
				float: left;
				width: 120px;
				font-size: 9px;
				color: #aabdc7;
}




	/* imprint link */
	div#header-textadd a,
	div#header-textadd a:visited
{
				float: left;
				font-size: 9px;
				color: #aabdc7;
				width: 90px;
}

	div#header-textadd a:hover,
	div#header-textadd a.act
{
				color: #fff;
}










/* -------------------------------------------------------------------------
   language switcher
   ------------------------------------------------------------------------- */

	div#langnav
{
				clear: right;
				float: right;
				width: 104px;
				/*background-color: #f00;*/
}

	div#langnav ul {}

	div#langnav ul li
{
				float: left;
				width: 52px;
				text-align: right;
}

	div#langnav ul li a, 
	div#langnav ul li a:visited
{
				display: block;
				width: 48px;
				height: 12px;
				font-size: 9px;
				color: #fff;
				margin: 0 0 0 4px;
}











/* =========================================================================
   div#mainarea 
   ========================================================================= */

	div#mainarea
{
				/* safari4 (not 3) shows and immediately hides any content 
				   loaded in here by Ezjax without position: relative */ 
				position: relative;
				margin: 14px 0 0 0;
}








/* -------------------------------------------------------------------------
   left column
   ------------------------------------------------------------------------- */



	div#leftcol
{
				float: left;
				width: 184px;
				margin: 0 32px 0 0;
				/*border-style: solid;
				border-width: 0 32px 0 0;
				border-color: #479;*/
				min-height: 100px;
}



	div#leftcol p
{
				float: left;
				color: #fff;
				padding: 20px 0 0 0;
				margin: 4px 0 0 0;
}

	div#leftcol p#contactexactmarge1
{
				margin: 0 0 70px 0;
}

	div#leftcol p#contactexactmarge2
{
				margin: 0 0 70px 0;
}



/* left navigation
   ------------------------------------------------------------------------- */

   div#leftnav {}

	div#leftnav ul
{
				float: left;
				border-style: solid;
				border-width: 1px 0 0 0;
				border-color: #fff;
}

	div#leftnav ul li
{
				float: left;
				width: 184px;
				border-style: solid;
				border-width: 0 0 1px 0;
				border-color: #fff;
}

	div#leftnav ul li.picswitchlink 
{
				background-image: url(../../skin/img/bg_line_fff_w184.gif);
				background-position: 0 16px;
				background-repeat: no-repeat;
				background-color: #48565b;
}





	div#leftnav ul li a,
	div#leftnav ul li a:visited,
	div#leftnav ul li a:active
{
				font-size: 10px;
}

	div#leftnav ul li.pagelink a,
	div#leftnav ul li.pagelink a:visited,
	div#leftnav ul li.pagelink a:active
{
				float: left;
				width: 182px;
				padding: 3px 0 2px 2px;
				color: #aabdc7;
}

	div#leftnav ul li.pagelink a:hover,
	div#leftnav ul li.pagelink a.act
{
				color: #fff;
}



	div#leftnav ul li.picswitchlink a
{
				float: left;
				display: inline-block;

				width: 12px;
				height: 13px;
				line-height: 13px;
				padding: 2px 1px 1px 2px;
				color: #000;
}

	div#leftnav ul li.picswitchlink a:hover,
	div#leftnav ul li.picswitchlink a.act
{
				color: #fff;
}

 
	div#leftnav ul li.picswitchlink span.morepics
{
				clear: left;
				float: left;
				width: 184px;
}


	div#leftnav ul li.picswitchlink span.morepics a
{
				float: left;
				padding: 3px 1px 1px 2px;
				/*background-color: #5aa;*/
}




	div#leftnav ul li.picswitchlink div.arrowlink,
	div#leftnav ul li.picswitchlink div.arrowlinksecondrow
{
				float: right;
				width: 40px;
}

	div#leftnav ul li.picswitchlink div.arrowlink a,
	div#leftnav ul li.picswitchlink div.arrowlinksecondrow a
{
				width: 20px;
				padding: 0;
				margin: 0;
}

	div#leftnav ul li.picswitchlink div.arrowlinksecondrow a
{
				padding: 1px 0 0 0;
}



	div#leftnav ul li.picswitchlink div.arrowlink img {}










/* -------------------------------------------------------------------------
   right (main) column
   ------------------------------------------------------------------------- */

	div#rightcol
{
				float: left;
				width: 487px;
				overflow: auto;
	
}

	div#rightcol2
{
				float: left;
				width: 736px;
				overflow: auto;
				<width: 487px geändert auf 736px>
}

	div#rightcol p
{
				color: #aabdc7;
				margin: 4px 0 0 0;
}





	div#mainarea p a,
	div#mainarea p a:visited
{
				color: #aabdc7;

}

	div#mainarea p a:hover
{
				color: #fff;

}


	div#rightcol h1
{
				color: #fff;
				font-size: 11px;
				font-weight: normal;
				padding: 0 0 10px 0;
}



	div#rightcol p strong
{
				font-weight: normal;
				color: #fff;
}


	div#rightcol p.subline-left
{
				float: left;
}


	div#rightcol p.subline-right
{
				text-align: right;
}


	div#rightcol div#piccontainer 
{
				width: 15000px;
				/*  width: 6500px; 
	   ------ */
}


	div#rightcol div#piccontainer div.onepic
{
				float: left;
				width: 500px;
				
}
	div#rightcol2 div#piccontainer div.onepic2
{
				float: left;
				width: 750px;
				<hier von 500px auf 750px geändert>
}

	div#rightcol div#piccontainer div.onepic div
{
				width: 487px;
				
}
	div#rightcol2 div#piccontainer div.onepic2 div
{
				width: 736px;
				<hier von 487px auf 736px geändert>
}

	div#rightcol div#piccontainer div.onepic div p.subline-left
{
				float: left;
				padding: 0 0 0 4px;
}


	div#rightcol div#piccontainer div.onepic div p.subline-right
{
				float: right;
				padding: 0 4px 0 0;
				text-align: right;
}





	div.slideshow
{
					width: 703px;
					height: 473px;
					overflow: hidden;
					margin: auto;
}
					

	.imprint
{
					width: 400px;
					color: #fff !important;
					padding-bottom: 24px;
}




/* tables definitions
   ------------------------------------------------------------------------- */

	table
{
				font-size: 11px;
				color: #fff;
}

	table td
{
				vertical-align: top;
				padding-bottom: 11px;
}


	div#mainarea-wrapper div#mainarea table td.tdyear
{
				width: 50px;
}


	div#mainarea-wrapper div#mainarea table td.tdlabel
{
				width: 217px;
}

	div#mainarea-wrapper div#mainarea table td p
{
				padding-bottom: 12px !important;
				color: #fff; /* souldn't be needed, but something i didn't discover yet overwrites colour if not present here */
}


	div#mainarea-wrapper div#mainarea table td p a,
	div#mainarea-wrapper div#mainarea table td p a:visited
{
				color: #aabdc7;

}
	div#mainarea-wrapper div#mainarea table td p a:hover
{
				color: #fff;

}