/*****************************************************************
 Projekt: 			
 Datei: 				responsive.css
 Beschreibung: 	Media Queries for responsive Web
 Autor:					NGI, webundso GmbH
 Contact: 			info@webundso.ch
 Datum:					30.01.13
 
	Verwendete Farben:
	#fff    = weiss
	#000    = schwarz
	#D41C1E = rot
	#6C2427 = dunkelrot
	#e3e3e3 = grau	
	
*****************************************************************/

/*--------------------------------------------------------------*/
/* Desktop */
/*--------------------------------------------------------------*/


#rightContent figure img {
	height: auto;
	max-width: 100%;
}

/*--------------------------------------------------------------*/
/* Smartphones */
/*--------------------------------------------------------------*/

@media only screen and (max-width: 768px) {
	
img, embed, object, video {
  max-width: 100%;
  height: auto;
  width: auto;
}	

	#wrap {
		max-width: 100%; 
		width: 100%;
		margin: 0;
		text-align: left;
		background: #fff;
/* 		border: 1px solid red; */
		}
	#header, #navigation {
		display: none;
	}
	#header_sp {
		display: block;
	}
	#logo {
		position: inherit;
		text-align: center;
		margin-top: 50px;
	}
	#logo img {
		width: 	300px;
	}	
			#mobileNav {
		display: none;
		position: absolute;
		top: 50px;
		width: 99%;
		background: #fff;
		z-index: 300;
		padding: 0 10px;
	}
	#mobileTrigger {
		background: url(../img/hamburger.png) left center no-repeat;
		padding-left: 40px;
		font-weight: bold;
		text-transform: uppercase;
		cursor: pointer;
		position: absolute;
		top: 15px;
		left: 10px;
		height: 30px;
		vertical-align: middle;
		padding-top: 5px;
	}
	#rootline {
		display: block;
		margin-left: 23px;
		font-size: 12px;
	}
	#languages {
		right: 35px;
		top: 18px;
	}
	#mobileSearch {
		position: absolute;
		top: 20px;
		right: 10px;
	}
	#menuh ul {
		margin: 0;
	}
	#menuh .L1 {
		width: 100%;
	}
	#menuh .L1 li {
		padding: 0;
		display: block;
		border-right: 0;
	}
	#menuh .L1 li a {
		padding: 5px 0 !important;
		display: block;
		border-bottom: 1px solid #e3e3e3;
	}
	#menuh .L1 li a span {
		display: inline;
		font-size: 19px;
	}
	#menuh .L2 {
		position: inherit;
		visibility: visible;
		display: none;
		padding: 0;
	}
	#menuh .L1 li.act .L2 {
		display: block !important;
	}
	#menuh .L2 li {
		border: 0;
	}
	#shortcuts {
		position: relative;
		right: 0;
		left: 0;
		top: 0;
		bottom: 0;
	}
	#shortcuts li {
		float: none;
		height: auto;
	}
	#shortcuts li.spc {
		display: none;
	}
	#shortcuts li a {
		font-size: 19px;
		padding: 5px 0 !important;
		display: block;
		border-bottom: 1px solid #e3e3e3;	
	}
	#Tubes {
		border: 0;
	}
	#middleTube, .element2cols .linkeSpalte,
	#rightTube, .element2cols .rechteSpalte {
		width: 100% !important;
		float: none;
		border: 0;
	}
	#footer {
		height: auto;
	}
	.news-img-wrap {
/* 		display: none; */
	}
	.news-more-trigger span, .news-more-trigger1 a, .read-more a, .news-more-trigger {

	}
	.news-list-left,
	#middleContent .news-list-left{
		width: auto;
		float: none;
	}
	.contenttable table, .contenttable thead,.contenttable tbody,.contenttable th,.contenttable td,.contenttable tr { 
		display: block; 
	}
	.news-img-wrap {
	}
	
	.delegierte ul li .detail .left, .delegierte ul li .detail .right {
		float: none;
		width: 100%;
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	.contenttable thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	.contenttable td { 
		/* Behave  like a "row" */
		border: none;
		position: relative;
		padding-left: 0%; 
	}
	
	.contenttable td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
	
}