/*  GRID OF THREE   ============================================================================= */

.span_2_of_2 {
	width: 46%;
	padding-right: 2%; 
}

.span_3_of_3 {
	width: 100%; 
}

.span_2_of_3 {
	width: 61.1%;
}

.span_1_of_3 {
    width: 32%;
    min-width: 160px;
}
.span_1 {
	width: 33.3%;
	//min-width: 160px;
	float: left; 
}
.span_2 {
	width: 60%;
	float: left; 
}
.active{
	width:80%;
	height:100%;
	margin-left: 1.6%;
	left: 0;
	top:0;
	}

.hidden{
display: none;
height: 0px;
	}

.show{
	display: show;
	 transition: opacity 1s ease-out;
	}
	 
@media only screen and (max-width: 806px) {
	body {
	min-width: 500px;
}
.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%;
		
	}
	.span_1_of_3 {
		width: 100%;
	}
	.span_2_of_2 {
	width: 100%; 
	min-width: 300px;
}
.headline_weiss {
    color: #FFFFFF;
    cursor: pointer;
    font-family: 'clugnormal';
    font-size: 120%;
    letter-spacing: 0.1pt;
}
.subline {
		display: none;
		}
}
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 600px) {
	#main {
	margin: 5px auto;
	width: 95%;
}
	.span_3_of_3 {
		width: 100%; 
	}
	.span_2_of_3 {
		width: 100%;
		
	}
	.span_1_of_3 {
		width: 100%;
	}
	.span_2_of_2 {
	width: 100%; 
	min-width: 300px;
}
.headline_weiss {
    color: #FFFFFF;
    cursor: pointer;
    font-family: 'clugnormal';
    font-size: 120%;
    letter-spacing: 0.1pt;
}
body {
	min-width: inherit;
}
.subline {
		display: none;
		}
.img { 
 max-width: 300px;
 float: none;
}
footer {
	margin: auto;
	width: 95%;
	}
}

.group:before, .group:after {
    content: "";
    //display: table;
}
.clear {
    clear: both;
}
.group:before, .group:after {
    content: "";
    //display: table;
}
.group {
	margin: auto;	
}
.col {
    display: block;
    float: left;
    margin: 2% 5px;
}
.col80 {
	width: 80%;
	margin: auto;
}
.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
.col:last-child {margin-right: 0;}

/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 480px) {
#main {
	margin: 5px auto;
	width: 95%;
	}
.col { 
		margin: 1% 0 1% 0%;
	}
.subline {
		display: none;
		}
.span_2_of_2 {
	width: 50%; 
}
footer {
	margin: auto;
	width: 95%;
	}
}