/**		
  * Dynamix Portfolio, version 0.1 beta
  * (c) 2008 amorphik.com - r3mix.ch / Marc Hottinger
  *
  * last update: 2004-04-30
  *
  * http://www.amorphik.com/ | http://www.r3mix.ch
  *
  * This css file may not be used, modified, copied, etc. without the
  * autorisation of amorphik and/or r3mix - Marc Hottinger.
  *
  * ----------------------------------------
  * marc.hottinger (at) amorphik (dot) com
  * ----------------------------------------
  *
  * This css file is defining the layout of the images view mode of the site
  * This css file is overridden by IE7.js on ie6.
*/

/* COLOR SCHEME
	Body Background:		black
	Main Text:				silver
	Links:					white
	Headers:				white
	Color one:				(orange) needs to be defined
	Color two:				(yellow) needs to be defined
*/
/* CSS FILES
	main.css -->			defines the main layout of the site, such as basic html elements, etc...
	print.css -->			defines the layout of the site when printed. Hides number of useless elements when printed out.
	dynamic.css -->			defines the layout of ajax loaded elements
	images.css -->			defines the layout for the images mode of the site
	text.css -->			defines the layout for the text mode of the site
*/


/*scene part*/
#scene				{ position: absolute; z-index: 100; top: 0px; left: -400px; width: 3000px; height: 17500px; /*background-image: url(../images/portfolio/layout/backgrounds/dotted_1.png); background-repeat: repeat*/ }

/*markers*/
.marker				{ position: absolute; z-index: 9999; top: 0px; left: 0px; width: 100%; height: 50px; border-bottom: 1px none #333; }
#selectionMarker	{ top: 120px; left: 450px }

/*scene content*/
/*maps*/
.map				{ position: absolute; top: -1000px; left: -1000px  }
img.map 			{  }

.project			{ visibility: visible; position: absolute; top: 0; left: 0; width: 225px; height: 135px }
/*selection*/
#p1					{ z-index: 900 }
#p2					{ z-index: 899 }
#p3					{ z-index: 898 }
#p4					{ z-index: 897 }
#p5					{ z-index: 896 }
#p6					{ z-index: 895 }
#p7					{ z-index: 894 }
#p8					{ z-index: 893 }
#p9					{ z-index: 892 }
#p10				{ z-index: 891 }
#p11				{ z-index: 890 }
#p12				{ z-index: 889 }

/*2004*/
#p1_2004			{ z-index: 900 }
#p2_2004			{ z-index: 899 }

/*2005*/
#p1_2005			{ z-index: 900 }
#p2_2005			{ z-index: 899 }
#p3_2005			{ z-index: 898 }
#p4_2005			{ z-index: 897 }
#p5_2005			{ z-index: 896 }
#p6_2005			{ z-index: 895 }

/*2006*/
#p1_2006			{ z-index: 900 }
#p2_2006			{ z-index: 899 }
#p3_2006			{ z-index: 898 }
#p4_2006			{ z-index: 897 }
#p5_2006			{ z-index: 896 }
#p6_2006			{ z-index: 895 }
#p7_2006			{ z-index: 894 }
#p8_2006			{ z-index: 893 }
#p9_2006			{ z-index: 892 }
#p10_2006			{ z-index: 891 }

/*2007*/
#p1_2007			{ z-index: 900 }
#p2_2007			{ z-index: 899 }
#p3_2007			{ z-index: 898 }
#p4_2007			{ z-index: 897 }
#p5_2007			{ z-index: 897 }

/*2008*/
#p1_2008			{ z-index: 898 }
#p2_2008			{ z-index: 897 }
#p3_2008			{ z-index: 900 }
#p4_2008			{ z-index: 899 }
#p5_2008			{ z-index: 898 }

/*coming soon*/
#coming_soon		{ visibility: visible; position: absolute; z-index: 897; top: 0; left: 0; width: 225px; height: 135px }

/*backStage part*/

#backStage			{ position: absolute; z-index: 101; top: 0px; left: 100%; width: 5000px; height: 17500px; /*background-image: url(../images/portfolio/layout/backgrounds/dotted_1.png); background-repeat: repeat*/ }

/*backStage content*/
/*pages*/


#backStage							{ color: white; font-size: 0.9em }
#backStage h1						{ line-height: 1.2em; margin-top: 30px }
#backStage h2						{ line-height: 1.1em; margin-top: 20px }
#backStage .page p					{ margin: 0px }
#backStage .marker					{ position: absolute; top: 120px; left: 50px; }
#backStage .content					{ position: absolute; top: 170px; left: 50px; width: 500px; }

#backStage .column1					{ position: absolute; top: 0px; left: 0px; width: 140px; height: 100% }
#backStage .column2					{ position: absolute; top: 0px; left: 150px; width: 140px; height: 100% }
#backStage .column3					{ position: absolute; top: 0px; left: 300px; width: 140px; height: 100% }
#backStage .column4					{ position: absolute; top: 0px; left: 450px; width: 140px; height: 100% }
#backStage .column5					{ position: absolute; top: 0px; left: 600px; width: 140px; height: 100% }
#backStage .column6					{ position: absolute; top: 0px; left: 750px; width: 140px; height: 100% }

/*page1*/
#page1								{ position: absolute; top: 0px; left: 0px }
#page2								{ position: absolute; top: 0px; left: 0px }
#page3								{ position: absolute; top: 0px; left: 0px }
#page4								{ position: absolute; top: 0px; left: 0px }
#page4 > .content > #links			{ position: absolute; top: 50px; }
#page4 > .content > #links ul		{ list-style: none; padding-left: 0px; margin-left: 0px }
#page4 > .content > #links li		{ line-height: 1.5em }