/* ---------------------------------------------------------
   Basisgestaltung und Layoutbereiche
   ---------------------------------------------------------*/
@media screen {

  	/* border-box für alle Elemente  */
  	* {
	    -webkit-box-sizing: border-box;    
    	   -moz-box-sizing: border-box;
        	    box-sizing: border-box;
  	}

  	/* -------------
     Basisformatierung  */ 
  	html {
    	font-family: 'Open Sans', Arial, sans-serif;
	    font-size: 100%; 
  	}
  	body { 
    	background: white;
	    color: #333;
    	font-size: 12px; font-size: 0.80rem; 
	    margin: 0 auto; 
  	}
  	/* Überschriften und Fließtext gestalten */ 
  	h2   { font-size: 22px; font-size: 1.375rem; }  
  	h3   { font-size: 20px; font-size: 1.25rem; }
  	main { line-height: 1.7; }

  	/* Elemente verstecken in visuellen Layouts */  
  	.hideme {
    	position: absolute;
    	top: -32768px;
    	left: -32768px;
  	}

  	/* Info: nicolasgallagher.com/micro-clearfix-hack/ */ 
  	.cf:before, .cf:after { content: " "; display: table; } 
  	.cf:after, .clear { clear: both; } 

	#googleMap {
		width: 95%;
		height: 400px;
		margin-bottom: 40px;
	}

	/* ----------------------------------------------------
		Page Parameters
   	----------------------------------------------------*/
	#wrapper {
		padding: 0;
		margin:  0;
		left: 0;
		background: none;
		width:100%;
	}
	#wrapper p{
		margin: 0;
	}
	ul {
		padding-left: 1em;
	}
	.nopad{
		padding: 0;
	}
	h1 {
		font-family: "Open Sans";
		font-size: 1.5em;
		color: #EF890E;
		font-weight: normal;
		margin: 0;
	}
	h2 {
		font-family: "Open Sans", Arial, Helvetica, sans-serif;
		font-size: 1.1em;
		color: #333333;
		font-weight: normal;
	}

	/* ----------------------------------------------------
		Page Header
   	----------------------------------------------------*/
  	.pageheader{
    	background-color: white;
    	color: black; 
  	}

  	/* Padding für Layoutbereiche */ 
  	.pageheader, 
  	.inside,
  	nav, 
  	div.wrap{
    	padding: 0.3em;
  	}

  	.pageheader h1 {
    	color: white; 
	    padding: 0;
    	margin: 0;  
	    font-family: Dosis, 'Open Sans', sans-serif; 
    	font-size: 32px; 
	    font-size: 2rem;
    	letter-spacing: 1px;
  	}
  	.pageheader a {
    	color: white;
    	text-decoration: none; 
  	}
  	.pageheader p {
    	padding: 0;
    	margin: 0;
  	}
	header .hgroup {
	    font-size: 16px; 
	    font-size: 1.0rem;
	}

	header .hgroup a{
		color: #333333;
		text-decoration: none;
	}
	header .hgroup a:hover{
		color: #333333;
		text-decoration: underline;
	}

	/* ----------------------------------------------------
		Page main picture
   	----------------------------------------------------*/
	#site-sl {
		background: none;
		width: 100%;
		padding: 0;
		margin: 0;
	}
	/* ----------------------------------------------------
		Page Navigation
	   ----------------------------------------------------*/
	.nav-container {
		background: none;
	    width: 100%;
		max-width:1080px;
		margin:0 auto;
		padding: 0;
	}

	.columns-tel {
		background: none;
		padding:0em; /* 0px */
		padding-left: 20px;
		padding-top: 14px;
	}
	.columns-tel a{
		color:#000000;
		font-family: "open sans", arial;
		font-size: 1.2em;
		font-weight: bold;
		text-align: left;
	}
	#menu-button {
		display:block;
		color: #000;
		width: 90px;
		height: 24px;
		background: url(../../images/menu-icon.png) no-repeat 16px center;
		cursor: pointer;
		border: 0;
		margin-top: 0px;
	}
	#menu-button:hover {
	}
	#menu-button:before {
	}
	#menu-button.collapsed:before {
	}
	#main-menu.collapsed {
	  display: none;
	}


	/* ----------------------------------------------------
		Page Content
	   ----------------------------------------------------*/
	.site-content {
		background: none;
		padding-top:20px;
		padding-bottom:1em;
		padding-left: 20px;
		color:#333333;
		text-align: left;
		font-family: "Open Sans", arial;
		font-size: 0.80em;
	}
	.site-content a{
		color: #006AB4;
		text-decoration: underline;
	}
	.site-content a:hover{
		color: #E30614;
		text-decoration: underline;
	}
	.site-content .thumbnail {
		border: 0; 
		height:auto; 
		max-width:100%;
	}
	.thumbnail_gal {
		border: 0; 
		margin-bottom: 4px;
		width: auto;
		height: 135px; 
		max-width:100%;
	}
	.galthumb {
		width: 185px;
		text-align: center;
		padding-right: 4px;
		margin: 0;
		float: left;
	}
	.inhaltsbereich {
	    background: none;
		padding-left: 20px;
		z-index: 7;
	}
	.inhaltsbereich img{
		padding-top: 1em;
		padding-bottom: 1em;
	}
	.row {
		background: none;
		width:auto;
		padding-bottom: 1em;
	}
	.row:before, 
	.row:after {
		content:'';
		display:table;
	}
	.row:after {
		clear:both;
	}
	.row .row {
		margin-left:-1em;
		margin-right:-1em;
	}
	.columns {
		background: none;
		float:left;
		padding-left:0; /* 22.4px */
		padding-right:1.4em; /* 22.4px */
	}
	.zweispaltig{
		padding-bottom: 1em;
	}

	p { margin-bottom:15px; }
	.floatRight, .floatright { float:right !important; }
	.floatLeft, .floatleft { float:left !important; }

	.alignRight, .alignright { text-align:left; }
	.alignLeft, .alignleft { text-align:left; }
	.alignCenter, .aligncenter { text-align:left; }


	/* ----------------------------------------------------
		Page Footer
	   ----------------------------------------------------*/
	.pagefooter {
	    background-color: #333333;
	    color: white; 
	    padding: 0.3em;
	}
	.footercontent a {
	    color: white;
	    text-decoration: none;  
	}
	.footercontent a:hover{
		color: white;
		text-decoration: underline;
	}

	/* ----------------------------------------------------
		Kontaktformular
	   ----------------------------------------------------*/
	.label {
		font-family: "Open Sans", arial;
		font-size: 0.9em;
		color: #1f3065;
		font-weight: normal;
	}
	.input {
	    border: solid 1px #888888;
	    background-color:#eeeeee;
	    width: 100%;
	    max-width: 600px;
	    padding: 0.2em; 
		font-family: "Open Sans", arial;
		font-size: 0.9em;
		color: #1f3065;
		font-weight: normal;
	}
	.textArea {
	    border: solid 1px #888888;
	    background-color:#eeeeee;
	    width: 100%;  
	    max-width: 600px;
	    padding: 0.2em; 
		font-family: "Open Sans", arial;
		font-size: 0.9em;
		color: #1f3065;
		font-weight: normal;
	}

}   
/* ----------------------------------------------------
	Fokuspunkt
   ----------------------------------------------------*/

/* Small */
@media screen and (max-width:1020px) {
	.site-content .thumbnail {
		padding-bottom: 10px;
	}
	.logo {
		width: 100%;
		margin: 10px 0 0 0;
		padding: 0;
	}
	.logo img{
		max-width: 300px;
		width: 100%;
		height: auto;
	}
	.emailcontainer {
		margin-top: 10px;
		margin-left: 10px;
		display: block;
		clear: both;
	}
	.telcontainer {
		margin: 20px 0 0 10px;
		clear: both;
	}
	#nav {
		width: 100%;
		background-color: #333333;
		margin: 8px 0 0 0;
	}
	.nav-container {
    	width: 100%;
    	min-height: 40px;
		background: none;
		padding: 0;
		padding-top: 8px;
	}

}

/* Large */
@media screen and (min-width:1020px) {
	.alignRight, .alignright { text-align:right; }
	.alignLeft, .alignleft { text-align:left; }
	.alignCenter, .aligncenter { text-align:center; }

	.site-content{
		padding-top:4em;
	}
	body { 
	    width: auto;     /* war 90% */ 
	    max-width: none; /* war 1080px */
	    box-shadow: 0;   /* war 0 2px 6px rgba(0,0,0,0.3) */
	    margin: 0;       /* war 1em auto */  
	}

	/* Normaler Hintergrund */ 
	html {
	    background: white; /* war #ddd url("grey-bg.png") repeat left top; */ 
	    color: black;
	}
	#googleMap {
		width: 80%;
		height: 400px;
		margin-bottom: 40px;
	}

	/* ----------------------------------------------------
	Page Header
   	----------------------------------------------------*/
  	.pageheader {
    	margin-bottom: 0.5em;
  	}
  	/* Layoutbreite  bei full-page-layout nicht durch body */
  	.pageheader .inside, nav, div.wrap, .pagefooter .inside {
    	width: 1020px;
    	margin: 0 auto;
  	}
  	.pageheader {
    	min-height: 130px;
    	margin-top: 0px;
  	}

	header .hgroup {
    	padding-top: 40px;
	    font-size: 16px; 
	    font-size: 1.0rem;
	}
	.logo {
		width: 360px;
		margin: 10px 0 0 0;
		padding: 0;
		float: left;
	}
	.logo img{
		width: 300px;
		height: auto;
	}
	#nav {
		width: 100%;
		background-color: #333333;
		margin: 0;
		margin-bottom: 6px;
	}
	.nav-container {
    	width: 1020px;
    	min-height: 30px;
    	margin: 0 auto;
		background: none;
		padding: 0;
		padding-top: 3px;
	}
	#wrapper {
		margin:  0 auto;
		background: none;
		width:1020px;
	}
	#site-sl {
		width: 100%;
	}	
	#site-sl img{
		width: 100%;
		height: auto;
	}	
	/* hide the button in desktop view */
	#menu-button {
		display: none;
	}
	/* always show the menu in desktop view */
	#main-menu.collapsed {
		display: block;
	}
	.pagefooter {
    	clear:both;
  	} 	
	.inhaltsbereich {
		background: none;
		min-height: 600px;
		padding-left: 0;
	}
	.inhaltsbereich img{
		padding-top: 0;
		padding-bottom: 0;
	}
	.zweispaltig{
		padding-bottom: 0;
	}	
	.columns-tel {
		display: none;
	}
	.telcontainer {
		float: left;
	}
	.emailcontainer {
		float: left;
	}

}