zurück zur Startseite
  

Registrieren Hilfe Benutzerliste Suchen Heutige Beiträge Alle Foren als gelesen markieren

Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Verschiebungen bei größerem Bildschirm

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 28.07.2014, 13:31
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
  
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard Verschiebungen bei größerem Bildschirm
Hallo zusammen, ich habe mal wieder eine wahrscheinlich sehr dumme Frage. Leider kann ich nur Screenshots und das CSS posten, da die Seite nur mit Hosts-Eintrag erreichbar ist. Sicher ist irgendwo ein blöder Fehler drin, den ich nur konsequent übersehe vor Betriebsblindheit - und, weil ich keinen so großen Bildschirm habe wie unser Kunde.
Bei mir sieht die Seite so aus:
seite-bei-ansichtsfenster-1600px.JPG
Und so beim Kunden mit 1920px Bildschirmansicht:
seitenansicht-bei-1920px-ie9.jpg
Es fehlt ein Logo und die Pfeile im Slider verrutschen.
Wenn er das Browserfenster verkleinert, sieht das Ganze so aus:
seite-bei-verkleinertem-browserfenster.jpg
Das zuvor fehlende Logo ist angezeigt und die Pfeile machen immer noch, wozu sie Lust haben.

Das Ganze ist in einem CMS eingebunden, weshalb natürlich der HTML-Code nicht wirklich sinnvoll einsetzbar ist von außen.

Für einen kleinen Schubbs in die richtige Richtung bin ich sehr dankbar!
Liebe Grüße
Seelefant

Code:
/* CSS fuer Desktop Seitenrelaunch Auto Goetz 2014


 * {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: box-sizing: content-box|border-box|initial|inherit; *behavior: url(/scripts/boxsizing.htc);
	} 
body  {
	font-family: Arial, Verdana;
	font-size: 100%;
	width: 101%;
	line-height: 150%;
	background: url(body-hg.jpg) repeat-x #ff00ff;
	}
img  {
	margin: 0;
	padding: 0;
	max-width: 100%;
	height: auto;
	border: 0;
	}
a {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #404040;
   	background-color: #ffffff;
	border-bottom: 1px solid #404040;
   	}
a:visited {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #404040;
   	background-color: #ffffff;
	border-bottom: 1px solid #404040;
   	}
	
a:hover,
a:focus, 
a:active {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #ffffff;
   	background-color: #404040;
	border-bottom: 1px solid #404040;
   	}	
a.bild {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #ffffff;
   	background-color: transparent;
	border: 0;
   	}
a.bild:visited {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #ffffff;
   	background-color: transparent;
	border: 0;
   	}
a.bild:hover, 
a.bild:focus, 
a.bild:active {
	margin:0;
	padding: 0;
   	text-decoration: none;
   	color: #ffffff;
   	background-color: transparent;
	border: 0;
   	}	
.clearfix {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
	}
	
/* Zentrierung */	
#zentrieren  {
	margin: 0 auto;
	padding: 0;
	width: 100%;
	max-width: 1800px;
	min-width: 240px;
	height: auto;
	}	
	
/* Fuer Hintergrundbilder im Kopf- und Fussbereich */
#mantel  {
	float: left;
	margin: 0;
	padding: 8.33333333% 12.5% 0 12.5%;
	width: 100%;
	max-width: 1800px;
	min-width: 240px;
	min-height: 300px;
	background: url(hg-top.jpg) no-repeat #ebebeb;
	background-size: contain;
	}
#unten  {
	float: left;
	margin: 0;
	padding: 0 12.5% 0 12.5%;
	width: 100%;
	max-width: 1800px;
	min-width: 240px;
	min-height: 300px;	
	background: url(hg-bottom.jpg) no-repeat #ebebeb;	
	background-size: contain;
	}
#sitemap  {
	float: left;
	margin: 0;
	padding:  0  12.5% 0 12.5%;
	width: 100%;	
	max-width: 1800px;
	min-width: 240px;
	background-color: #ebebeb;
	}
/* Titelaufbau */	
#titel  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1200px;
	height: auto;
	background-color: #ffffff;	
	background-size: contain;
	}
/* Hauslogo und Marken */		

#logo {
	float: left;
	margin: 0;
	padding: 0;
	width: 33.33333333333333%;
	height: 7.8125em;
	display: inline;
	}
#logo h1 {
	float: left;
	margin: 0;
	padding: 0;
	font-size: 100%;
	}	
#marken {
	float: right;
	margin: 0;
	padding: 0;
	width: 66.66666666666667%;
	height: 7.8125em;
	text-align: right;
	}	
#marken .marke {
	float: right;
	margin: 0;
	padding: 0;
	text-align: right;
	width: 20%;
	height: auto;
	display: inline;
	}	
div.menuesprung {
	display: none;
	}	
iframe {
	overflow: hidden;
	}
/* Ende Hauslogo und Marken */		
#slider  {
	clear: both;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1200px;
	background-color: #ebebeb;
	}	
.events {
  list-style: none;
  }

.callbacks_container {
  position: relative;
  float: left;
  width: 100%;
  }

.callbacks {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.callbacks li {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  }
  
.callbacks img {
  display: block;
  position: relative;
  z-index: 1;
  height: auto;
  width: 100%;
  border: 0;
  }

.callbacks .caption {
  display: block;
  position: absolute;
  z-index: 2;
  font-size: 20px;
  text-shadow: none;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 10px 20px;
  margin: 0;
  max-width: none;
  }	
.callbacks_nav {
  position: absolute;
  top: 50%;
  left: 0;
  opacity: 0.7;
  z-index: 3;
  text-indent: -9999px;
  height: 4em;
  width: 3em;
  overflow: hidden;
  text-decoration: none;
  background: transparent url("themes.gif") no-repeat left top;
  border: 0;
  }
.callbacks_nav:active {
  opacity: 1.0;
  }

.callbacks_nav.next {
  left: auto;
  background-position: right top;
  right: 12.5%;
  }  
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  } 


@media screen and (max-width: 600px) {
  h1 {
    font: 24px/50px "Helvetica Neue", Helvetica, Arial, sans-serif;
    }
  .callbacks_nav {
    top: 40%;
    }
  }
  
/* Ende Titelaufbau */	

/* Klappnavigation */	
	
nav {
	float: left;
	margin: 0;
	padding: 0;
	max-width: 1200px;
	width: 100%;
	background-color: #00d200;
	display: inline;
	}
	
nav.desktop {
	list-style-type: none;
 	}


nav ul {
    padding: 0;
    margin: 0;
}

nav ul:after {
    clear: both;
    content: " ";
    display: block;
    font-size: 0;
    height: 0;
    visibility: hidden;
    color: #ffffff;	
}

nav ul,nav ul li{
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */
}
nav ul li {
    color: #ffffff;
    list-style: none; /* keine Veränderung bei Wechsel der Hintergrundfarbe */
    float: left;
}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.5em 1em 0.5em 1em;
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */
	font-weight: bold;
	border: 1px solid #00d200;
}
nav ul li a:hover {  /* scheint keinen Einfluss zu haben */
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.5em 1em 0.5em 1em;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav ul li:hover a, nav ul li:hover > ul li a  {  /* Klappt auf mit Unterpunkten */
    color: #ffffff;
	background-color: #404040; /* keine Veränderung bei Wechsel der Hintergrundfarbe */		
	font-weight: bold;
	border: 1px solid #404040;
}

nav ul li:hover > a {  /* wird bei Maus-Hover angezeigt */
    color: #ffffff !important;
	padding: 0.5em 1em 0.5em 1em;
	font-weight: bold;
	border: 1px solid #404040;	
}
nav ul li:hover > ul {
    color: #ffffff;
    visibility: visible;
/* keine Veränderung bei Wechsel der Hintergrundfarbe */
}

nav ul li ul{
    display: inline;
    visibility: hidden;
    position: absolute;
    padding: 0;
	color: #ffffff;
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */	
	z-index: 10;
}
nav ul li ul li{
    color: #ffffff;
	float: none;
}
nav ul li ul li a {
    color: #ffffff;
	font-weight: bold;
	border: 1px solid #404040;
}
nav ul li ul li a:hover { /* ändert Hintergrundfarbe bei Hover auf Unterpunkten */
	color: #000000 !important;
	background-color: #ffffff !important;
	font-weight: bold;
	border: 1px solid #404040;
	
}
nav ul li a:visited {
	padding: 0.5em 1em 0.5em 1em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #00d200;
	font-weight: bold;
	border: 1px solid #00d200;
}

nav ul li a:hover {
	padding: 0.5em 1em 0.5em 1em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav a:hover,
nav a:focus, 
nav a:active {
	padding: 0.5em 1em 0.5em 1em;
	color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}



/* ENDE - Navigation - Made by Hellmedia*/	
	

	
/* Ende Navigation */

/* Inhalte */	
#inhaltsbox  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1200px;
	height: auto;
	color: #404040;
	background-color: #ffffff;
	}
#inhalt  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 74%; /* 870px */
	}
#unternavigation {
	float: left;
	margin: 1% 0;
	padding: 0;
	width: 100%;
	font-size: 0.8em;
	background-color: #ffffff;
	display: inline;
	}
#navunten  nav.menuesprung { 
	display: none;
 	} 	
#navunten  nav.desktop {
	margin: 0;
	padding: 0;
	width: 100%;
	display: inline;
	list-style-type: none;
 	}		
#unternavigation ul{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-decoration: none;
	display: inline;
	background-color: #ffffff;
	}
#unternavigation ul li {
	float: left;
	margin: 0.25em;
	padding: 0;
	color: #000000;
	background-color: #ffffff;
	display: inline;
	border: 0;
	}	
#unternavigation ul li a {
	margin:0;
	padding: 0.25em;
   	text-decoration: none;
   	color: #404040;
   	background-color: #ffffff;
	border: 0;
	border-right: 1px solid #404040;
	border-bottom: 1px solid #404040;
   	}
#unternavigation ul li a:visited {
	margin:0;
	padding: 0.25em;
   	text-decoration: none;
   	color: #404040;
   	background-color: #ffffff;
	border: 0;
	border-right: 1px solid #404040;
	border-bottom: 1px solid #404040;
   	}
	
#unternavigation ul li a:hover,
#unternavigation ul li a:focus, 
#unternavigation ul li a:active {
	margin:0;
	padding: 0.25em;
   	text-decoration: none;
   	color: #ffffff;
   	background-color: #404040;
	border-right: 1px solid #404040;
	border-bottom: 1px solid #404040;
   	}	
#spalte  {
	float: right;
	margin: 0;
	padding: 0.75% 0.75% 0 0;
	width: 25%;
	}	
#spalte #suche {
	float: left;
	margin: 0 0 2% 0;
	padding: 4% 2% 0 2%;
	width: 100%;
	color: #404040;
	background-color: #ebebeb;
	}
	
#spalte #suche h3 {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	color: #404040;
	}	
#spalte #suche p {
	float: left;
	margin: 0;
	padding: 2% 2% 2% 6%;
	width: 100%;
	}	
#spalte #suche form {
	float: left;
	margin: 0.5% 0 0 0;
	padding: 0.5%;
	width: 100%;
	color: #404040;
	background-color: #ebebeb;
	}	
#spalte #suche fieldset {
	float: left;
	margin: 0;
	padding: 0.5%;
	width: 100%;
	border: 1px solid #404040;
	}	
#spalte #suche input.eingabefeld {
	float: left;
	margin: 0;
	padding: 0.5%;
	width: 69%;
	}	
#spalte #suche input.absenden {
	float: left;
	margin: 0;
	padding: 0.5%;
	width: 30%;
	}	
#spalte #fzgschnell {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	color: #ffffff;
	background-color: #e30613;
	}
#spalte #fzgschnell figure {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	}	
	
#spalte #fzgschnell h3 {
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	font-size: 100%;	
	text-align: center;	
	}
#spalte #fzgschnell p {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 100%;	
	font-weight: bold;
	text-align: center;
	}	
#spalte #beilngries {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: transparent;
	}
#spalte  #beilngries  p {
	float: left;
	margin: 0;
	padding: 2% 2% 2% 6%;
	width: 100%;
	font-size: 100%;
	text-align: left;
	}	
#spalte #neumarkt{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: transparent;
	}	
#spalte  #neumarkt  p {
	float: left;
	margin: 0;
	padding: 2% 2% 2% 6%;
	width: 100%;
	font-size: 100%;
	text-align: left;
	}	
#spalte #ap-beilngries {
	float: left;
	margin: 2% 0;
	padding: 1% 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	}
	
#spalte #ap-neumarkt{
	float: left;
	margin: 2% 0;
	padding: 1% 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	}
#spalte a.ap:link {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.ap:visited {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.ap:hover,
#spalte  a.ap:focus,
#spalte  a.ap:active  {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte #eins-b {
	float: left;
	width: 100%;
	text-align: center;
	border-right: 1px solid #ffffff;
	}
#spalte #eins-b  p {	
	font-size: 1em;
	text-align: center;
	}
#spalte #zwei-b {
	float: right;
	width: 100%;
	text-align: center;
	border-left: 1px solid #ffffff;
	}	
#spalte #zwei-b  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte #eins-n {
	float: left;
	width: 100%;
	text-align: center;
	border-right: 1px solid #fffffff;
	}
#spalte #eins-n  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte #zwei-n {
	float: right;
	width: 100%;
	text-align: center;
	border-left: 1px solid #ffffff;
	}	
#spalte #zwei-n  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte a.button:link {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.button:visited {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.button:hover,
#spalte  a.button:focus,
#spalte  a.button:active  {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	

#spalte   h3{
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	border: 0;
	}	
#spalte   figure{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	border: 0;
	}	
#spalte   p{
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	text-align: left;
	background-color: transparent;
	border: 0;
	}	

#spalte #service {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	color: #00d200;
	background-color: transparent;
	}
#spalte  a.buttonservice:link {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonservice:visited {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonservice:hover,
#spalte  a.buttonservice:focus,
#spalte  a.buttonservice:active  {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		

	
#spalte #anfrage {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	color: #00d200;
	background-color: transparent;
	}
#spalte  a.buttonanfrage:link {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonanfrage:visited {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonanfrage:hover,
#spalte  a.buttonanfrage:focus,
#spalte  a.buttonanfrage:active  {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 100%;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		

	
#spalte #social {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 98%;
	background-color: #ffffff;
	border: 0;
	}			
#spalte #social p{
	float: left;
	width: 50%;
	display: inline;
	}					
/* Fusszeile */	
#fusszeile  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1200px;
	height: auto;
	background-color: #ffffff;
	}	
#co2vermerk	  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 98%;
	font-size: 75%;
	background-color: #ffffff;
	}
#copyright  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 98%;
	background-color: #ffffff;
	}
#address  {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	background-color: #ffffff;
	}
#address .address {
	float: left;
	margin: 0;
	padding: 0;
	}	
#hell  {
	float: right;
	margin: 0;
	padding: 0 1%;
	width: 50%;
	text-align: right;
	background-color: #ffffff;
	}	
#navunten  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	color: #ffffff;
	background-color: #404040;
	}
#navunten ul {
	float: left;  
	margin: 0;
	padding: 0;
	width: 100%;
	list-style-type: none;
	text-align: left;
	background-color: #404040;   
 	}   
#navunten ul  li.inactive {
	float: left; 
	margin: 0 1em;
	display: inline;
	color: #ffffff;
	background-color: #404040;   
   	}  
#navunten a.inactive {
   	font-weight: bold;
	padding: 0.5em;
   	text-decoration: none;
	display: block;
	color: #ffffff;
	background-color: #404040; 
	border-bottom: 0;
   	}
#navunten a.inactive:visited {
	padding: 0.5em;
   	font-weight: normal;
	display: block;
   	text-decoration: none;
	color: #ffffff;
	background-color: #404040; 
	border-bottom: 0;
   	}
#navunten a.inactive:hover, 
#navunten a.inactive:focus, 
#navunten a.inactive:active {
   	font-weight: bold;
	padding: 0.5em;
   	text-decoration: none;
	display: block;
	color: #ffffff;
	background-color: #00d200; 
	border-bottom: 0;
   	} 
#navunten ul  li.active {
	float: left; 
	margin: 0 1em;
	display: inline;
	color: #ffffff; 
	background-color: #00d200;
	border-bottom: 0;	
   }    
#navunten a.active {
   	font-weight: bold;
	padding: 0.5em;
   	text-decoration: none;
	display: block;
	color: #ffffff; 
	background-color: #00d200;
	border-bottom: 0;	
   	}

#navunten a.active:hover, 
#navunten a.active:focus, 
#navunten a.active:active {
   	font-weight: bold;
	padding: 0.5em;
   	text-decoration: none;
	display: block;
   	color: #ffffff;
	background-color: #404040;
	border-bottom: 0;	
   	} 	
#insitemap  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1200px;
	font-size: 75%;
	background-color: transparent;
	}
#insitemap ul {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	background-color: transparent;   
	}	
#insitemap  ul  li {
	float: left; 
	margin: 0.25% 2%;
	padding: 0;
	width: 47%;
	display: inline;
	color: #404040;
	border: 0;
   	}  
#insitemap ul ul {
	float: left;
	margin: 0.25% 0.25% 0.25% 10%;
	padding: 0;
	width: 49%;
	}	
#insitemap  a:link {
   	font-weight: bold;
   	text-decoration: none;
	display: block;
   	color: #404040;
	background-color: transparent;   	
	border-bottom: 0;
   	}
#insitemap  a:visited {
   	font-weight: normal;
	display: block;
   	text-decoration: none;
	color: #404040;
	background-color: transparent;   	
	border-bottom: 0;
   	}
#insitemap a:hover, 
#insitemap a:focus, 
#insitemap a:active {
   	font-weight: bold;
   	text-decoration: none;
	display: block;
   	color: #ebebeb;
	background-color: #404040;
   	} 

	
/* Absatzvorlagen */

/* Grundsätzliches */
.top  {
	float: left;
	margin: 1%;
	padding: 1%;
	width: 48%;
	height: auto;
	border: 0.1em solid #ebebeb;
	}
.top:hover  {
	float: left;
	margin: 1%;
	padding: 1%;
	width: 48%;
	height: auto;
	background-color: #404040;
	border: 0.1em solid #404040;
	}	
.topbild  {
	float: left;
	margin: 0;
	padding: 1%;
	width: 50%;
	height: 7em;
	}
.topue  {
	float: left;
	margin: 0;
	padding: 1%;
	width: 50%;
	height: 7em;
	}	
.topbe  {
	float: left;
	margin: 0;
	padding: 1%;
	width: 50%;
	height: 7em;
	}	
.toppreis  {
	float: left;
	margin: 0;
	padding: 1%;
	width: 50%;
	height: 7em;
	}
.vbwerte   {
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	height: 7em;
	}

.vorlage  {
	float: left;
	margin: 1% 0;
	padding: 1%;
	width: 100%;
	height: auto;
	border: 0.1em solid #ebebeb;
	}
.vorlage-center  {
	float: left;
	margin: 1% 0;
	padding: 1%;
	width: 100%;
	height: auto;
	text-align: center;
	border: 1px solid #ebebeb;
	}	
#vorlage-sitemap  {
	float: left;
	margin: 1% 0;
	padding: 1%;
	width: 100%;
	height: auto;
	line-height: 200%;
	border: 0.1em solid #ebebeb;
	}	

a.vorlagen:link  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: left;
	color: #404040;
	background-color: #ffffff;
	border: 0;
	}
a.vorlagen:visited {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: left;
	color: #404040;
	background-color: #ffffff;
	border: 0;
	}
a.vorlagen:hover,
a.vorlagen:focus,
a.vorlagen:active  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: left;
	color: #404040;
	background-color: #ebebeb;
	border: 0;
	}
#map_canvas_34	{
	width: 100% !important;
	height: auto;
	}
#map_canvas_167	{
	width: 100% !important;
	height: auto;
	}	
.rot {
	color: #e30613;
	text-align: left;	
	}
.gruen {
	color: #00d200;
	text-align: left;	
	}
.blau {
	color: #94c9e4;
	text-align: left;	
	}	
.normal {
	color: #404040;
	text-align: left;	
	}	
/* Ende Grundsätzliches */	
	
/* Teaserlisten */
div.teaser-grossbild  {
	float: left;
	margin: 1% 0;
	padding: 1%;
	width: 100%;
	border: 0.1em solid #ebebeb;
	}

div.tgb-ue  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	}		
	
div.t-grossbild  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	}

/* Ende Teaserlisten */	

/* Text zweispaltig */	

div.text-zweisp-li {
	float: left;
	margin: 0;
	padding: 0 0 1% 0;
	width: 50%;
	border: 1px solid ebebeb;
	}	
div.text-zweisp-re  {
	float: left;
	margin: 0;
	padding: 0 1% 0 0;
	width: 50%;
	border: 1px solid ebebeb;
	}
/* Ende Text zweispaltig */		


div.zweibilder-links  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 48%;	
	}
div.zweibilder-rechts  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 48%;		
	}
div.dreibilder-links  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 32%;		
	}
div.dreibilder-mitte  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 32%;	
	}
div.dreibilder-rechts  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 32%;	
	}
div.text-zweisp-li  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 48%;		
	}
div.text-zweisp-re  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 48%;		
	}
div.zweiteaser-links  {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	}
div.zweiteaser-um  {
	float: left;
	margin: 0;
	height: 15em;
	}	
div.zweit-bild-li  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 23%;		
	}
div.zweit-text-li  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 77%;		
	}
div.zeiteaser-rechts  {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	}
div.zweit-bild-re  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 23%;	
	}
div.zweit-text-li  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 77%;		
	}
div.bild-links  {
	float: left;
	margin: 0;
	padding: 2% 1%;
	width: 38%;	
	}
div.text-rechts  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 58%;		
	}
div.bild-rechts  {
	float: left;
	margin: 0;
	padding: 2% 1%;
	width: 38%;	
	}
div.text-links  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 58%;	
	}
.formular {
	float: left;
	width: 30%;
}	
.form-input {
	float: left;
	width: 70%;
}
.form-textarea {
	float: left;
	width: 70%;
}
div.form-send {
	float: left;
	margin: 0 0 0 30%;
	width: 100%;
}	
.ohne {
	margin: 0;
	padding: 0;
}

.umkastenteaser {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: #ffffff;
	}

a.teaserkasten-links:link {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}	
a.teaserkasten-links:visited {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-links:hover,
a.teaserkasten-links:focus,
a.teaserkasten-links:active {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;	
	}	

a.teaserkasten-mitte:link {
	float: left;
	margin: 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-mitte:visited {
	float: left;
	margin: 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-mitte:hover,
a.teaserkasten-mitte:focus,
a.teaserkasten-mitte:active {
	float: left;
	margin: 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
	
a.teaserkasten-rechts:link  {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-rechts:visited {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-rechts:hover,
a.teaserkasten-rechts:focus,
a.teaserkasten-rechts:active  {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 31.609154%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
figure.tk-bild {
	float: left;
	width: 100%;
	height: 14.0625em;
	text-align: center;
	}	
figure.tk-banner {
	float: left;
	width: 100%;
	height: 14.0625em;
	text-align: center;
	}	
h3.tk {
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	font-size: 100%;
	text-align: center;
	}	
p.tk-text {
	float: left;
	margin: 0;
	padding: 0 1.5%;
	width: 100%;
	text-align: left;
	overflow: hidden;
	}	
a.teaserbanner-links:link {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}	
a.teaserbanner-links:visited {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-links:hover,
a.teaserkasten-links:focus,
a.teaserkasten-links:active  {
	float: left;
	margin: 1% 1.25% 1% 0;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
a.teaserbanner-rechts:link {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-rechts:visited {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-rechts:hover,
a.teaserbanner-rechts:focus,
a.teaserbanner-rechts:active {
	float: left;
	margin: 1% 0 1% 1.25%;
	padding: 0;
	width: 65.89%;
	height: 20em;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
/* Ende Absatzvorlagen */	
	

/* Ende CSS fuer Desktop Seitenrelaunch Auto Goetz 2014 */


/* Anzeige Fluid */
@media screen and (max-width:1400px) {
body  {
	font-size: 95%;
	line-height: 140%;
	}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.5em;
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */
	font-weight: bold;
	border: 1px solid #00d200;
}
nav ul li a:hover {  /* scheint keinen Einfluss zu haben */
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.5em;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav ul li:hover a, nav ul li:hover > ul li a  {  /* Klappt auf mit Unterpunkten */
    color: #ffffff;
	background-color: #404040; /* keine Veränderung bei Wechsel der Hintergrundfarbe */		
	font-weight: bold;
	border: 1px solid #404040;
}

nav ul li:hover > a {  /* wird bei Maus-Hover angezeigt */
    color: #ffffff !important;
	padding: 0.5em;
	font-weight: bold;
	border: 1px solid #404040;	
}

nav ul li a:visited {
	padding: 0.5em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #00d200;
	font-weight: bold;
	border: 1px solid #00d200;
}

nav ul li a:hover {
	padding: 0.5em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav a:hover,
nav a:focus, 
nav a:active {
	padding: 0.5em;
	color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
	}	
  .callbacks_nav {
    top: 42.5%;
    }	
}	


@media screen and (max-width:1175px) {
body  {
	font-size: 90%;
	line-height: 130%;
	}
nav ul li a {
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.3em;
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */
	font-weight: bold;
	border: 1px solid #00d200;
}
nav ul li a:hover {  /* scheint keinen Einfluss zu haben */
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.3em;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav ul li:hover a, nav ul li:hover > ul li a  {  /* Klappt auf mit Unterpunkten */
    color: #ffffff;
	background-color: #404040; /* keine Veränderung bei Wechsel der Hintergrundfarbe */		
	font-weight: bold;
	border: 1px solid #404040;
}

nav ul li:hover > a {  /* wird bei Maus-Hover angezeigt */
    color: #ffffff !important;
	padding: 0.3em;
	font-weight: bold;
	border: 1px solid #404040;	
}

nav ul li a:visited {
	padding: 0.3em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #00d200;
	font-weight: bold;
	border: 1px solid #00d200;
}

nav ul li a:hover {
	padding: 0.3em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav a:hover,
nav a:focus, 
nav a:active {
	padding: 0.3em;
	color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
	}
  .callbacks_nav {
    top: 40%;
    }	
}	


@media screen and (max-width:1050px) {
/* Fuer Hintergrundbilder im Kopf- und Fussbereich */
#mantel  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1800px;
	min-width: 240px;
	min-height: 300px;
	background: url(leer.jpg) no-repeat #ebebeb;
	background-size: contain;
	}
#unten  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	max-width: 1800px;
	min-width: 240px;
	min-height: 300px;	
	background: url(leer.jpg) no-repeat #ebebeb;
	background-size: contain;
	}
#sitemap  {
	float: left;
	margin: 0;
	padding:  0;
	width: 100%;	
	max-width: 1800px;
	min-width: 240px;
	background-color: #ebebeb;
	}
.callbacks_nav {
  top: 30%;
  left: 0;
  }
.callbacks_nav.next {
  background-position: right top;
  right: 0;
  } 							
}	


@media screen and (max-width:1075px) {

	
.callbacks_nav {
  top: 35%;
  left: 0;
  }	
}


@media screen and (max-width:800px) {
body  {
	font-size: 90%;
	line-height: 130%;
	}
	
/* Hauslogo und Marken */		

#logo {
	float: left;
	margin: 0;
	padding: 0;
	width: 50%;
	height: auto;
	}
#logo h1 {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	}		
	
nav.desktop {
	display: none;
	}		
div.menuesprung {
	float: left;
	margin: 0;
	padding: 2% 1%;
	width: 50%;
	height: auto;
	text-align: center;
	color: #00d200;
	background-color: #ffffff;
	display: inline;
	}		
/* Hauslogo und Marken */		


#marken {
	display: none;
	}	
	
/* Ende Hauslogo und Marken */			
	
nav ul li a {
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.3em;
	background-color: #00d200;  /* keine Veränderung bei Wechsel der Hintergrundfarbe */
	font-weight: bold;
	border: 1px solid #00d200;
}
nav ul li a:hover {  /* scheint keinen Einfluss zu haben */
    text-decoration: none;
    display: block;
    color: #ffffff;
    padding: 0.3em;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav ul li:hover a, nav ul li:hover > ul li a  {  /* Klappt auf mit Unterpunkten */
    color: #ffffff;
	background-color: #404040; /* keine Veränderung bei Wechsel der Hintergrundfarbe */		
	font-weight: bold;
	border: 1px solid #404040;
}

nav ul li:hover > a {  /* wird bei Maus-Hover angezeigt */
    color: #ffffff !important;
	padding: 0.3em;
	font-weight: bold;
	border: 1px solid #404040;	
}

nav ul li a:visited {
	padding: 0.3em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #00d200;
	font-weight: bold;
	border: 1px solid #00d200;
}

nav ul li a:hover {
	padding: 0.3em;
	text-decoration: none;
    display: block;
    color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
}
nav a:hover,
nav a:focus, 
nav a:active {
	padding: 0.3em;
	color: #ffffff;
	background-color: #404040;
	font-weight: bold;
	border: 1px solid #404040;
	}	
#inhalt  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%; /* 870px */
	}

#spalte  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	}	
	
#inhalt  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%; 
	}
.unsichtbar {
	display: none;
	}	

#spalte #suche {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	color: #404040;
	background-color: #ebebeb;
	}

#spalte #fzgschnell {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	color: #ffffff;
	background-color: #e30613;
	}

#spalte #fzgschnell p {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
	}	
#spalte #beilngries {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: transparent;
	}
#spalte  #beilngries  p {
	float: left;
	margin: 0;
	padding: 2%;
	width: 100%;
	font-size: 100%;
	text-align: left;
	}	
#spalte #neumarkt{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	background-color: transparent;
	}	
#spalte  #neumarkt  p {
	float: left;
	margin: 0;
	padding: 2%;
	width: 100%;
	font-size: 100%;
	text-align: left;
	}	
#spalte #ap-beilngries {
	float: left;
	margin: 2% 0;
	padding: 1% 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	}
	
#spalte #ap-neumarkt{
	float: left;
	margin: 2% 0;
	padding: 1% 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	}
#spalte a.ap:link {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.ap:visited {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.ap:hover,
#spalte  a.ap:focus,
#spalte  a.ap:active  {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte #eins-b {
	float: left;
	width: 100%;
	text-align: center;
	border-right: 1px solid #ffffff;
	}
#spalte #eins-b  p {	
	font-size: 1em;
	text-align: center;
	}
#spalte #zwei-b {
	float: right;
	width: 100%;
	text-align: center;
	border-left: 1px solid #ffffff;
	}	
#spalte #zwei-b  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte #eins-n {
	float: left;
	width: 100%;
	text-align: center;
	border-right: 1px solid #fffffff;
	}
#spalte #eins-n  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte #zwei-n {
	float: right;
	width: 100%;
	text-align: center;
	border-left: 1px solid #ffffff;
	}	
#spalte #zwei-n  p {	
	font-size: 1em;
	text-align: center;
	}	
#spalte a.button:link {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.button:visited {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.button:hover,
#spalte  a.button:focus,
#spalte  a.button:active  {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	

#spalte   h3{
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	font-size: 100%;
	font-weight: bold;
	text-align: center;
	border: 0;
	}	
#spalte   figure{
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: center;
	border: 0;
	}	
#spalte   p{
	float: left;
	margin: 0;
	padding: 1%;
	width: 100%;
	text-align: left;
	background-color: transparent;
	border: 0;
	}	

#spalte #service {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	color: #00d200;
	background-color: transparent;
	}
#spalte  a.buttonservice:link {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonservice:visited {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonservice:hover,
#spalte  a.buttonservice:focus,
#spalte  a.buttonservice:active  {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		

	
#spalte #anfrage {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	color: #00d200;
	background-color: transparent;
	}
#spalte  a.buttonanfrage:link {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonanfrage:visited {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonanfrage:hover,
#spalte  a.buttonanfrage:focus,
#spalte  a.buttonanfrage:active  {
	float: left;
	margin: 0.5em;
	padding: 0.25em 0;
	width: 47%;
	height: 2em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		

#spalte #social {
	float: left;
	margin: 2% 0;
	padding: 0;
	width: 98%;
	background-color: #ffffff;
	border: 0;
	}			
#spalte #social p{
	float: left;
	width: 50%;
	display: inline;
	}

.callbacks_nav {
  top: 17.5%;	
    }	

}		


	



@media screen and (max-width:540px) {
iframe {
	width: 100%;	
    }	

#spalte #suche {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	color: #404040;
	background-color: #ebebeb;
	}

#spalte #fzgschnell {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	color: #ffffff;
	background-color: #e30613;
	}


#spalte a.ap:link {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.ap:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.ap:hover,
#spalte  a.ap:focus,
#spalte  a.ap:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
	
#spalte a.button:link {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.button:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;	
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.button:hover,
#spalte  a.button:focus,
#spalte  a.button:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #ffffff;
	background-color: #646464;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	


#spalte  a.buttonservice:link {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonservice:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonservice:hover,
#spalte  a.buttonservice:focus,
#spalte  a.buttonservice:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		

	
#spalte  a.buttonanfrage:link {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}	
#spalte  a.buttonanfrage:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #00d200;
	background-color: #404040;
	text-align: center;
	text-decoration: none;
	border: 0;
	}
#spalte  a.buttonanfrage:hover,
#spalte  a.buttonanfrage:focus,
#spalte  a.buttonanfrage:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0.25em 0;
	width: 100%;
	height: 2.5em;
	font-size: 100%;
	font-weight: normal;
	color: #404040;
	background-color: #ebebeb;
	text-align: center;
	text-decoration: none;
	border: 0;
	}		
/* Text zweispaltig */	

div.text-zweisp-li {
	float: left;
	margin: 0;
	padding: 0 0 1% 0;
	width: 100%;	
	border: 1px solid ebebeb;
	}	
div.text-zweisp-re  {
	float: left;
	margin: 0;
	padding: 0 1% 0 0;
	width: 100%;	
	border: 1px solid ebebeb;
	}
/* Ende Text zweispaltig */		


div.zweibilder-links  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;	
	}
div.zweibilder-rechts  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;		
	}
div.dreibilder-links  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;		
	}
div.dreibilder-mitte  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;	
	}
div.dreibilder-rechts  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;	
	}
div.text-zweisp-li  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;		
	}
div.text-zweisp-re  {
	float: left;
	margin: 0;
	padding: 0 1%;
	width: 100%;		
	}
div.zweiteaser-links  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	}
div.zweiteaser-um  {
	float: left;
	margin: 0;
	height: auto;
	}	

div.zeiteaser-rechts  {
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
	}



.formular {
	float: left;
	width: 30%;
}	
.form-input {
	float: left;
	width: 70%;
}
.form-textarea {
	float: left;
	width: 70%;
}
div.form-send {
	float: left;
	margin: 0 0 0 30%;
	width: 100%;
}	

#navunten ul  li.inactive {
	float: left; 
	margin: 0 1em;
	display: inline;
	width: 100%;
	color: #ffffff;
	background-color: #404040;   
	text-align: center;
   	}  
#navunten ul  li.active {
	float: left; 
	margin: 0 1em;
	display: inline;
	width: 100%;
	color: #ffffff;
	background-color: #404040; 
	text-align: center;	
   	}  	

a.teaserkasten-links:link {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}	
a.teaserkasten-links:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-links:hover,
a.teaserkasten-links:focus,
a.teaserkasten-links:active {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;	
	}	

a.teaserkasten-mitte:link {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-mitte:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-mitte:hover,
a.teaserkasten-mitte:focus,
a.teaserkasten-mitte:active {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
	
a.teaserkasten-rechts:link  {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-rechts:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserkasten-rechts:hover,
a.teaserkasten-rechts:focus,
a.teaserkasten-rechts:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
figure.tk-bild {
	float: left;
	width: 100%;
	height: auto;
	text-align: center;
	}	
figure.tk-banner {
	float: left;
	width: 100%;
	height: auto;
	text-align: center;
	}	
	
a.teaserbanner-links:link {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}	
a.teaserbanner-links:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-links:hover,
a.teaserkasten-links:focus,
a.teaserkasten-links:active  {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
a.teaserbanner-rechts:link {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-rechts:visited {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ffffff;
	border: 1px solid #00d200;
	}
a.teaserbanner-rechts:hover,
a.teaserbanner-rechts:focus,
a.teaserbanner-rechts:active {
	float: left;
	margin: 0.5em 0;
	padding: 0;
	width: 100%;
	text-align: center;
	color: #404040;
	background-color: #ebebeb;
	border: 1px solid #00d200;
	}	
/* Ende Absatzvorlagen */	
  .callbacks_nav {
    top: 12.5%;
    }	
}



@media screen and (max-width:475px) {
  .callbacks_nav {
    top: 12.5%;
    }	
}

@media screen and (max-width:320px) {
  .callbacks_nav {
    top: 10%;
    }	
}
/* Ende Hauslogo und Marken */		
/* Ende Anzeige Fluid */
HTML-Code:
<!DOCTYPE html>
<html lang="de">
	<head>
		<meta charset="windows-1252">
		<title><%Article.SEO.Title%> <%TITLE%><%/TITLE%></title>
		<meta name="description" content="<%Article.SEO.Description%>">
		<meta name="keywords" content="<%Article.SEO.Keywords%>">
		<%Base%>
		<meta name="revisit-after" content="4 days">
		<meta name="googlebot" content="index,follow">
		<meta name="robots" content="index,follow">
		<meta name="application-name" content="Auto G&ouml;tz Beilngries und Neumarkt - Neufahrzeuge von Skoda und Seat, Gebrauchtwagen, Werkstatt-Service und Unfallinstandsetzung">   
		<meta name="author" content="Auto G&ouml;tz Beilngries und Neumarkt">
		<meta name="viewport" content="width=width-device">
		<!-- Viewport nur einsetzen, wenn smartphone, etc ein eigenes CSS erhalten! -->
		<meta name="viewport" content="width=device-width,target-densitydpi=device-dpi,intial-scale=1">		
		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">	
		<!-- Definitionen f&uuml;r Favicon auf mobilen Endegeraeten -->
		<link rel="apple-touch-icon-precomposed" sizes="54x54" href="apple-touch-icon-54x54-precomposed.png">
		<link rel="apple-touch-icon-precomposed" sizes="72x72" href="apple-touch-icon-72x72-precomposed.png">
		<link rel="apple-touch-icon-precomposed" sizes="129x129" href="apple-touch-icon-129x129-precomposed.png">
		<link rel="apple-touch-icon-precomposed" sizes="144x144" href="apple-touch-icon-144x144-precomposed.png">
		<link rel="apple-touch-icon-precomposed"  href="apple-touch-icon-precomposed.png">  <!-- identisch mit dem ersten -->
		<link rel="stylesheet" href="normalize.css" media="all">
		<link rel="stylesheet" href="standard.css" media="all">			
		<link rel="stylesheet" href="smartphone.css" media="only screen and (min-device-width:240px) and (max-device-width:540px) and (orientation:portrait)">
		<link rel="stylesheet" href="smartphone.css" media="only screen and (min-device-width:241px) and (max-device-width:539px) and (orientation:landscape)">
		<link rel="stylesheet" href="ipad-portrait.css" media="only screen and (min-device-width:540px) and (max-device-width:800px) and (orientation:portrait)">
		<link rel="stylesheet" href="ipad-landscape.css" media="only screen and (min-device-width:541px) and (max-device-width:800px) and (orientation:landscape)">
		<!-- <link rel="stylesheet" href="iphone4.css" media="only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5)"> -->		
		<link rel="stylesheet" href="print.css" media="print">		
<!--[if lte IE 7]>
		<link rel="stylesheet" href="iesieben.css" media="all">	
<![endif]-->		
		
<!-- 
This Slider is Licensed under the MIT license.

Copyright (c) 2011-2012 Viljami Salminen, http://viljamis.com/

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
-->

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  <script src="responsiveslides.min.js"></script>

  <script>
    // You can also use "$(window).load(function() {"
    $(function () {



      // Slideshow 4
      $("#slider4").responsiveSlides({
        auto: true,
        pager: false,
        nav: true,
        speed: 500,
		timeout: 10000, 
        namespace: "callbacks",
        before: function () {
          $('.events').append("<li>before event fired.</li>");
        },
        after: function () {
          $('.events').append("<li>after event fired.</li>");
        }
      });

    });
  </script>
		<script>
			document.createElement("aside");
			document.createElement("section");
			document.createElement("nav");
			document.createElement("header");
			document.createElement("footer");
			document.createElement("article");
			document.createElement("figure");			
		</script>
	</head>  
	<body>	

	<div id="zentrieren">
		<div id="mantel">
			<header id="titel">
				<figure id="logo">
					<h1>
						<a class="bild" href="http://www.auto-goetz.de" title="Zur Startseite von Auto G&ouml;tz GmbH - Skoda und Seat in Beilngries und Neumarkt">
							<figure><img src="logo.jpg" width="400px" height="125px" alt="Logo Auto G&ouml;tz GmbH - Skoda und Seat in Beilngries und Neumarkt" title="Logo Auto G&ouml;tz GmbH - Skoda und Seat in Beilngries und Neumarkt"></figure>
						</a>
					</h1>
				</figure>
			    <div  class="menuesprung"> <a class="bild" href="<%Article(72,0)%>" title="Zur Navigation"><figure><img src="menue-symbol.jpg" alt="Zur Navigation" title="Zur Navigation" width="50px" height="50px"></figure></a></div>
				<div id="marken">
					<figure class="marke"><a class="bild" href="<%Article(14,0)%>" title="Zum Gebrauchtwagenangebot"><img src="eins-plus.jpg" alt="Logo Eins Plus Gebrauchtwagen" title="Eins Plus Gebrauchtwagen bei Auto G&ouml;tz Beilngries, Neumarkt" width="77px" height="125px"></a></figure>
					<figure class="marke"><a class="bild" href="<%Article(35,0)%>" title="Zum Skoda Club 2013"><img src="skoda-club.jpg" alt="Logo Skoda Club 2013" title="Skoda-Club bei Auto G&ouml;tz Beilngries, Neumarkt" width="70px" height="125px"></a></figure>
					<figure class="marke"><a class="bild" href="<%Article(34,0)%>" title="Zur Webasto Standheizung"><img src="webasto.jpg" alt="Logo Skoda" title="Webasto Standheizung bei Auto G&ouml;tz Beilngries, Neumarkt" width="101px" height="125px"></a></figure>
					<figure class="marke"><a class="bild" href="<%Article(16,0)%>" title="Zum Seat Neufahrzeugangebot"><img src="seat.jpg" alt="Logo Seat" title="Seat bei Auto G&ouml;tz Beilngries, Neumarkt" width="90px" height="125px"></a></figure>
					<figure class="marke"><a class="bild" href="<%Article(15,0)%>" title="Zum Skoda Neufahrzeugangebot"><img src="skoda.jpg" alt="Logo Skoda" title="Skoda bei Auto G&ouml;tz Beilngries, Neumarkt" width="63px" height="125px"></a></figure>
				</div>
		
				<section id="slider">

						<ul class="responsiveslides" id="slider4">				
							<li><a class="bild" href="<%Article(102,0)%>" title="Aktuelles zu Bild 1"><img src="bild-1.jpg" alt="Aktuelles zu Bild 1"></a></li>
							<li><a class="bild" href="<%Article(103,0)%>" title="Aktuelles zu Bild 2"><img src="bild-2.jpg" alt="Aktuelles zu Bild 2"></a></li>
							<li><a class="bild" href="<%Article(104,0)%>" title="Aktuelles zu Bild 3"><img src="bild-3.jpg" alt="Aktuelles zu Bild 3"></a></li>
							<li><a class="bild" href="<%Article(105,0)%>" title="Aktuelles zu Bild 4"><img src="bild-4.jpg" alt="Aktuelles zu Bild 4"></a></li>
							<li><a class="bild" href="<%Article(106,0)%>" title="Aktuelles zu Bild 5"><img src="bild-5.jpg" alt="Aktuelles zu Bild 5"></a></li>
						</ul>
				
				</section>
			</header>
			<nav class="desktop"> 
				<ul>			
				<%GlobalContainer(150, Top-Navigation)%>      			
        		</ul>
        	</nav>			
			<section id="inhaltsbox">
				<aside id="spalte">
					<section id="suche"><%GlobalContainer(2, Suche)%></section>
					<section id="fzgschnell"><%GlobalContainer(3, Fzgschnell)%></section>
					<%RelatedContainer(11, Spalte)%>
					<%GlobalContainer(12, Anfragen)%>
					<section id="social"><%GlobalContainer(8, Socialmedia)%></section>
				</aside>			
				<section id="inhalt">	
				<nav id="unternavigation" class="desktop"><ul><%Navigation(1, horizontal, 2)%></ul></nav>
					<%Template%> 
				</section>
			</section>	
		</div>
		<footer id="unten">
			<section id="fusszeile">
				<section id="co2vermerk">
					<%GlobalContainer(10, CO2-Vermerk)%>
				</section>			
				<section id="copyright">
					<section id="address">
						<div class="address" itemscope itemtype="http://data-vocabulary.org/Organization"> 
						&copy;&nbsp;<span itemprop="name">Auto G&ouml;tz GmbH,&nbsp;</span>
						<span itemprop="address" itemscope itemtype="http://data-vocabulary.org/Address">
							<span itemprop="street-address">Ludwigskanal 11,&nbsp; </span>
							<span itemprop="locality">Beilngries,&nbsp; </span>
						</span>
						<span itemprop="tel">Telefon: 08641 6063630</span>
						</div>
					</section>	
					<section id="hell">Letzte &Auml;nderung: <%Project.DateModified%> <br> <a href="http://www.hellmedia.de" title="Zu Hellmedia" target="_blank">&copy; Software HELLMEDIA</a> - Design und Realisierung <a href="http://www.ardio.at" title="Zu ardio OG" target="_blank">ardio OG</a></p>
					</section>
				</section>
				<section id="navunten">
					<ul>
						<%Navigation(2, horizontal, 1)%>
					</ul>
				</section>				
			</section>			
		</footer>	
		<footer id="sitemap">
			<section id="insitemap"><%GlobalContainer(9, Sitemap)%>
			</section>
		</footer>		
	</div>	
	</body>
</html>
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 28.07.2014, 14:34
Erfahrener Benutzer
XHTMLforum-Mitglied
  
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard
ich kann bei den vorhandenen informationen nur raten.

es sieht für mich so aus, wäre der rechte pfeil absolut positioniert und hat eine angabe wie "right: 100px". ein äußeres element, das die pfeile umschließt, müsste position: relative kriegen, denn jetzt scheint es so als würde sich der pfeil immer an der browsergröße ausrichten.

könnte es beim logo vielleicht sein, dass es ab einer gewissen breite nicht mehr in die zeile passt und umbricht und ein element herum "overflow: hidden" hat?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 28.07.2014, 14:53
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
  
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard
Hi dazzle89, vielen Dank erst Mal für Deine Antwort!

Das mit dem umschließenden Element hatte ich auch in Verdacht, aber das ist relative positioniert. Die beiden Pfeile werden gemeinsam ausgerichtet und sollen sich am linken Rand orientieren. Es klappt ja auch mit den Pfeilen bis hin zum kleinsten Smartphone - nur, wenn es größer wird, als die Seite maximal breit werden darf gibt es Schwierigkeiten. Das irritert mich.
Der Slider ist allerdings ein "Fertigprodukt" - eventuell laufen im Hintergrund nach Einstellungen, die ich nicht kenne und nicht beeinflussen kann. Was ich mit dem Quelltext finden konnte, habe ich überprüft ...

Das Logo verschwindet eventuell nur beim Kunden, den Menschen mit gleich großem Bildschirm, wie der Kunde sehen es - Mysterium .... Jedenfalls gibt es kein Overflow "hidden" in dem Bereich.
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
  #4 (permalink)  
Alt 28.07.2014, 14:55
Erfahrener Benutzer
XHTMLforum-Mitglied
  
Registriert seit: 02.01.2012
Beiträge: 487
dazzle89 wird schon bald berühmt werden
Standard
dann hast du für den rechten pfeil pixel als einheit verwendet, oder? und da der contentbereich bei kleineren fenstern auch kleiner wird, verschiebt sich der pfeil. positionier den rechten pfeil mit "right" und nicht "left" und passe den wert an
Mit Zitat antworten
  #5 (permalink)  
Alt 28.07.2014, 15:43
Benutzerbild von seelefant
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
  
Registriert seit: 29.01.2006
Ort: im Steirischen Salzkammergut
Beiträge: 260
seelefant wird schon bald berühmt werden
Standard
nein, leider nicht - ich habe jetzt das gesamte CSS für den Slider zerpflückt und neu zusammengesetzt, von % auf em umgestellt - px kommen eh nicht vor. Aber das Mistvieh will nicht, sobald ich die Fenstergröße auf 1920px Breite einstelle.
Hier muss vielleicht ein eigenes CSS her - so wie für die kleineren Auflösungen auch ... Das ist vielleicht noch eine Idee ....

Danke Dir erst Mal, das hat mich zumindest soweit weiter gebracht, dass ich noch mal neu zu denken angefangen habe ...
__________________
Die Gelassenheit ist eine anmutige Form des Selbstbewußtseins.
Marie von Ebner-Eschenbach
Mit Zitat antworten
Antwort

« Vorheriges Thema | Nächstes Thema »
Themen-Optionen
Ansicht
Linear-Darstellung Linear-Darstellung

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.
BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus

Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
CSS Background beim Laden über den vollen Bildschirm DiiiDiii CSS 2 10.01.2014 14:49
"Hintergrund"-Bild über kompletten Bildschirm - IE scrollt nicht bzw. nur teilweise RollingStones CSS 4 17.12.2011 16:50
Leiste am Unteren Bildschirm rand mutantenboss CSS 8 25.07.2010 13:42
Bildschirm bleibt weiß bei include formular... bastien Serveradministration und serverseitige Scripte 6 02.01.2007 19:46
Vertikaler Background über ganzen Bildschirm emonem CSS 6 26.07.2006 13:19


Alle Zeitangaben in WEZ +2. Es ist jetzt 03:00 Uhr.

Datenschutzerklärung - Impressum - Archiv - Nach oben

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2023, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023