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

/* TWO COLUMNS*?

/* -----------------------------------
layout 1: simple
----------------------------------- */

.ein2,.zwei2 { margin-bottom: 1em; }

/* -----------------------------------
layout 2: 25-48
----------------------------------- */

@media (min-width: 40em) and (max-width: 100em)
{
	.ein2,.zwei2
	{
		float: left;
		width: 45%;
	}

}



/* THREE COLUMNS*?

/* -----------------------------------
layout 1: simple
----------------------------------- */

.ein3,.zwei3,.drei3 { margin-bottom: 1em; }

/* -----------------------------------
layout 2: 25-48
----------------------------------- */

@media (min-width: 30em) and (max-width: 50em)
{
	.ein3,.zwei3
	{
		float: left;
		width: 45%;
	}
	.drei3 { clear:both; width: 45%; }

}


/* -----------------------------------
layout 3: 25-48
----------------------------------- */

@media (min-width: 50em) and (max-width: 100em)
{
	.ein3,.zwei3,.drei3
	{
		float: left;
		width: 30%;
	}

}



/* FOUR COLUMNS*?

/* -----------------------------------
layout 1: simple
----------------------------------- */

.ein4,.zwei4,.drei4,.vier4 { margin-bottom: 1em; }

/* -----------------------------------
layout 2: 25-48
----------------------------------- */

@media (min-width: 39em) and (max-width: 49em)
{
	.ein4,.zwei4,.drei4,.vier4
	{
		float: left;
		width: 45%;
	}
	.funf4 { clear:both; width: 99%; }

}


/* -----------------------------------
layout 3: 48-65
----------------------------------- */

@media (min-width: 49em) and (max-width: 60em)
{
	.ein4,.zwei4,.drei4
	{
		float: left;
		margin-right: 3%;
	}

	.ein4,.zwei4,.drei4 { width: 30%; }

	.vier4 { clear:both; width: 25%; }

}

/* -----------------------------------
layout 4: 65+
----------------------------------- */

@media (min-width: 60em)
{
	.ein4,.zwei4,.drei4,.vier4
	{
		float: left;
		margin-right: 3%;
	}

	.ein4,.zwei4,.drei4,.vier4 { width: 22%; }

	.vier4 { margin-right: 0; }
	.container { max-width: 65em; }
}