/* Letzte Änderung: 11.12.2013 durch Stefan Bohres */
/* Nur Modifizierungen der Standard-CSS-Datei structure.css */ 

/* Farben */
/* #e8e8e8  Hellgrau für Hintergrund */
/* #8c1b9b  Pink Beginn     "Leistungen"    */
/* #c427da  Pink Ende       "Leistungen"    */
/* #ffac30  Gelb Beginn     "Service"   */
/* #ffce3e  Gelb Ende       "Service"   */
/* #6c9e01  Hellgrün Beginn "Download" */
/* #8eb701  Hellgrün Ende   "Download" */
/* #2786ad  Blau Beginn     "Kontakt" */
/* #32a3d4  Blau Ende       "Kontakt" */
/* #007437  Grün Beginn     "Über uns"    */
/* #00823d  Grün Ende       "Über uns"    */

/* #e41c42  Rot              "Überschriftstreifen Lebensmittel */ 

@media screen, projection
{
  body { 
    background:#e8e8e8;
	background-image: none;
	} 

.ym-wbox {
  padding-bottom: 300px; 
  }
/* Hauptnavigation schiebt die anderen Layer nach unten */
header {
 background-color:#ffffff;
	}

#topnavigation { padding-left:0.3em; }

/* -------------------- Serviectelefon oberhalb Navigation ---------------- */
#servicetelefon {
	line-height:1.45em;
	margin-left:0.4em; 
	}
#servicetelefon img { 
	float:left;
	margin: 3px 10px 0 0; 
	}

nav { 
    padding:0 0 1.0em 0; 
	background-color:#ffffff;
	}
	
nav .navibox {
/*	margin:10px; für 4 Bilder */
	margin:5px;
	}
	
nav .navibox a h2 {
	background-image:url(../../grafik/winkeltrans.png); background-repeat:no-repeat; background-position: right;
	}
nav .navibox a:hover h2 {
	background-image:url(../../grafik/winkeltransweiss.png); background-repeat:no-repeat; background-position: right;
	}		
	
nav .blau {
	background-color:#32a3d4; 
	background: -moz-linear-gradient(left, #2786ad, #32a3d4); 
	background: linear-gradient(to right, #2786ad, #32a3d4); 
	}	
	
nav .pink {
	background-color:#c427da; 
	background: -moz-linear-gradient(left, #8c1b9b, #c427da); 
	background: linear-gradient(to right, #8c1b9b, #c427da); 
	}		
	
nav .gelb {
	background-color:#ffce3e; 
	background: -moz-linear-gradient(left, #ffac30, #ffce3e); 
	background: linear-gradient(to right, #ffac30, #ffce3e); 
	}		
	
nav .gruen {
	background-color:#00823d;
	background: -moz-linear-gradient(left, #007437, #00823d);
	background: linear-gradient(to right, #007437, #00823d);
	}	
	
nav .hellgruen {
	background-color:#8eb701;
	background: -moz-linear-gradient(left, #6c9e01, #8eb701);
	background: linear-gradient(to right, #6c9e01, #8eb701);
	}
	
nav a { color:#ffffff;	
		}
nav img {
	max-width:100%;
	height:auto;
	}
nav .blau a img {
	border-top: 5px solid #FFFFFF;
	padding: 0;
}

nav .blau a:hover img {
	border-top: 5px solid #32a3d4;
	padding: 0;
}

nav .pink a img {
	border-top: 5px solid #FFFFFF;
	padding: 0;
}

nav .pink a:hover img {
	border-top: 5px solid #c427da;
	padding: 0;
}

nav .gelb a img {
	border-top: 5px solid #FFFFFF;
	padding: 0;
}

nav .gelb a:hover img {
	border-top: 5px solid #ffce3e;
	padding: 0;
}

nav .gruen a img {
	border-top: 5px solid #FFFFFF;
	padding: 0;
}

nav .gruen a:hover img {
	border-top: 5px solid #00823d;
	padding: 0;
}

nav .hellgruen a img {
	border-top: 5px solid #FFFFFF;
	padding: 0;
}

nav .hellgruen a:hover img {
	border-top: 5px solid #8eb701;
	padding: 0;
}

main { 
/*	margin:30px 10px 10px 10px; */
	margin:30px 5px 10px 5px;
 	}
 
/*------------------------------------------------------------------------------------------------------*/
/* Positionierung der Content Container. ym-col2 aus dem Standard-Layout wird ausgeblendet
   *
   * |------------------------------ ----------|
   * | header                                  |
   * |-----------------------------------------|
   * | nav                                     |
   * |-----------------------------------------|
   * | .ym-col2    | .ym-col1    |  .ym-col3   |
   * | (weg)       | 70 %        |   30%       |
   * |-----------------------------------------|
   * | footer                                  |
   * |-----------------------------------------|
   */
  
  /* padding:'padding-top' 'padding-right' 'padding-bottom' 'padding-left' */
  /* padding in em, damit bei Schriftvergrößerung der Überschrift die Navibox mit nach unten wandert */
/*  .ym-col1 { width: 70%; } */
  .ym-col1 { width: 60%; }
/*  .ym-cbox { padding:0 4.6em 1.0em 1.0em; } */
  .ym-cbox { padding:0 0 1.0em 1.0em; }

  /* Linke Spalte */
  .ym-col2 { display:none; }
  .ym-cbox-left { display:none; } 
  
/* Rechte Spalte für Infobox oder Navigation */
/*  .ym-col3  { margin-left:70%; margin-right:0; } */
  .ym-col3  { margin-left:80%; margin-right:0; }
/*  Spalte wird heruntergeschoben, um gleiche Höhe mit Hauptinhalt zu erreichen */
/*  .ym-cbox-right { padding:2.9em 1.0em 1.0em 0; } */
  .ym-cbox-right { padding:2.9em 0 0 0.5em; } 

footer {
 /* footer an die richtige Stelle schieben */
/*  margin: -35px auto 0; */
    margin: -300px auto 0;
	}

/* ------------------------------------------------------------------------------------------------- */
/* Ende Seitenelemente YAML, Beginn eigenes CSS                                                      */
/* ------------------------------------------------------------------------------------------------- */


/* -------------------- Sitemap im Footer auf der Startseite ------- */
/* Sitemap oberhalb des Footers auf der Startseite bekommt Hintergrundfarbe, Klassennamen ohne Leerzeichen anhängen */	

#footermap {
	background-color: #6F6F6F;
	padding:0; 
	text-align:left;
	margin:0;
	}
	
#footermap h2 {
    font-weight:700;
	font-size:110%;
	padding:0;
    margin:0;
	color:#eeeeee;
	 }
#footermap h2.rubrik { margin:0.3em 1.0em 0.2em 0.9em; }

#footermap img.telefon { padding:0.15em 1.0em; }

#footermap h2.hotline { margin:0.5em 1.0em 0.2em 0.9em; font-size:130%; }

#footermap ul { margin-left:1.2em; }

/* --- Überschrift mit Farbe --------------------------------*/
/* padding:'padding-top' 'padding-right' 'padding-bottom' 'padding-left' */


/* -------------------- Fotos ------------------------------ */

/* HTML5-Element figure für zoomfähige Bilder im Hoch- oder Querformat, hier schmaler */

figure.quer {
	width:33%;
	}

figure.hoch {
	width:33%;
	}

/* -------------------- Formulare ------------------------- */
/* YAML-Elemente stylen */

/* Gestaltung der kapselnden DIV-Elemente */
	.ym-form div.ym-fbox-text,
	.ym-form div.ym-fbox-select,
	.ym-form div.ym-fbox-check,
	.ym-form div.ym-fbox-button {
		padding: 0.15em 1.0em;
		margin-bottom: 0.25em; 
	}

	/* Gestaltung der einzelnen Formularelemente mit annähend gleicher Breite */
	.ym-form .ym-fbox-text input,
	.ym-form .ym-fbox-text textarea {
		line-height: 1em;
		padding: 0.15em 0.3em; 
		margin-top: -2px;
	}

	.ym-form .ym-fbox-select select {
		line-height: 1em;
		padding: 0.1em 2px 0.1em 1px;
		margin-top: -2px;
	}

	/* proportional fonts for all form elements */
	.ym-form input,
	.ym-form textarea,
	.ym-form select,
	.ym-form optgroup {
		font-family: Calibri, Arial, Verdana, "Helvetica Neue", Helvetica, sans-serif;
		-webkit-box-shadow: inset 0 0 4px #eee;
		-moz-box-shadow: inset 0 0 4px #eee;
		box-shadow: inset 0 0 4px #eee;
	}

	.ym-form optgroup {
		font-style:normal;
		font-weight:bold;
	}

   .ym-form input[type=submit] { padding:0.2em; cursor:pointer; }
   
   .ym-form input[type=submit]::-moz-focus-inner {
		border: 0; 
		padding: 0;
	}
   
      
/* ------------------------------------------------------------------------------------------------- */
/* Ende Eigenes CSS                                                                                  */
/* ------------------------------------------------------------------------------------------------- */

}

@media screen and ( max-width: 759px ) {
#phonenavigation { padding-left:10px; }
 /* padding:'padding-top' 'padding-right' 'padding-bottom' 'padding-left' */

#topnavigation {padding:5px 0 10px 10px; }
#servicetelefon { display:none; }
}