@charset "utf-8";
/***************************************
Rastersystem
von Dominik Pschenitschni - celement.de
Version 0.8
****************************************
Das Rastersystem erlaubt uns die Positionierung von Elementen zu vereinfachen.
Dieses System basiert auf 12 Spalten. Mehrere Spalten können zu größeren
zusammengefasst werden.
Spalten können auch verschachtelt werden.*/

/*Das Raster bekommt overflow damit die clears gefloatet werden.*/
.grid { overflow:hidden	; }

/*Verschachtelte Spalten sollten in ein Element mit der Klasse "subgrid"
gefügt werden um einen Umbruch zu vermeiden.*/
.subgrid {
	margin-left:-20px;
	margin-right:-20px;
	overflow:hidden;
}

/*Spalten werden gessetzt*/
.col ,  .col2 ,
.col3,  .col4 ,
.col5,  .col6 ,
.col7,  .col8 ,
.col9,  .col10,
.col11, .col12 {
	float:left;
	padding:0 20px 0 20px;
}

/*padding-bottom bekommen nur Spalten in #content, weil es nicht gut
aussehen würde, wären diese direkt untereinander.*/
#content .col  , #content .col2 ,
#content .col3 , #content .col4 ,
#content .col5 , #content .col6 ,
#content .col7 , #content .col8 ,
#content .col9 , #content .col10,
#content .col11, #content .col12 {
	padding-bottom:20px;
}

/*Defintion der Spaltenbreiten*/
.col      { width: 40px; }
.col2     { width:120px; }
.col3     { width:200px; }
.col4     { width:280px; }
.col5     { width:360px; }
.col6     { width:440px; }
.col7     { width:520px; }
.col8     { width:600px; }
.col9     { width:680px; }
.col10    { width:760px; }
.col11    { width:840px; }
.col12    { width:920px; }

/*Klassen zur Einrückung von Spalten*/
.indent   { margin-left: 80px; }
.indent2  { margin-left:160px; }
.indent3  { margin-left:240px; }
.indent4  { margin-left:320px; }
.indent5  { margin-left:400px; }
.indent6  { margin-left:480px; }
.indent7  { margin-left:560px; }
.indent8  { margin-left:640px; }
.indent9  { margin-left:720px; }
.indent10 { margin-left:800px; }
.indent11 { margin-left:880px; }


/*und nun das selbe mit margin
***************************************/
/*Spalten bekommen ein margin-left und -right*/
.marg.col,   .marg.col2,
.marg.col3,  .marg.col4,
.marg.col5,  .marg.col6,
.marg.col7,  .marg.col8,
.marg.col9,  .marg.col10,
.marg.col11, .marg.col12 {
	float:left;
	padding:0;
	margin:0 20px 0 20px;
}

/*margin-bottom bekommen nur Spalten in #content weil in
diesem Inhaltsbereich Schrift nicht untereinander sein sollte*/
#content .marg.col  , #content .marg.col2 ,
#content .marg.col3 , #content .marg.col4 ,
#content .marg.col5 , #content .marg.col6 ,
#content .marg.col7 , #content .marg.col8 ,
#content .marg.col9 , #content .marg.col10,
#content .marg.col11, #content .marg.col12 {
	margin-bottom:15px;
}

/*wenn du nicht willst, dass eine Spalte direkt nach einer
andern beginnt, kannst du ihr einen Einzug geben. */
.marg.indent   { margin-left:100px; }
.marg.indent2  { margin-left:180px; }
.marg.indent3  { margin-left:260px; }
.marg.indent4  { margin-left:340px; }
.marg.indent5  { margin-left:420px; }
.marg.indent6  { margin-left:500px; }
.marg.indent7  { margin-left:580px; }
.marg.indent8  { margin-left:660px; }
.marg.indent9  { margin-left:740px; }
.marg.indent10 { margin-left:820px; }
.marg.indent11 { margin-left:900px; }