@charset "utf-8";

/* @import url("style.css"); */
@import url("boilerplate.css");
@import url("cloudzoom.css");
@import url("ddsmoothmenu.css");
@import url("font-awesome.min.css");
@import url("jquery.bxslider.css");
@import url("offcanvas.css");
@import url("reset.css");
@import url("mtree.css");
@import url("shariff.min.css");
/* Eigene CSS-Dateien */
@import url("animierter_banner_versandkostenfreie-lieferung.css");
@import url("bestellung.css");
@import url("boxen_kategorien.css");
@import url("boxen_startseite.css");
@import url("cookie.css");
@import url("hauptmenu_responsive.css");
@import url("gewinnspiel.css");
@import url("menu1.css");
@import url("menu2.css");
@import url("menu3.css");
@import url("neuheiten.css");
@import url("popup.css");
@import url("seitenmenu.css"); 

@import url("SpryValidationCheckbox.css");
@import url("SpryValidationSelet.css");
@import url("SpryValidationTextField.css");


@import url("startseite.css");
@import url("template_produkt.css");
@import url("template_produkt_detail.css");
@import url("warenkorb.css");

/* ----------- Farben ----------- */
/* 	
	hellgrau:			#E2E2E2;
	grau:				#666;
	gold: 				#8D6600;
	rot:				#0064A9;
	grün:				#4C7400;	
*/
	

/* ----------- Schriften ----------- */
@font-face {
    font-family: 'open_sanslight';
    src: url('fonts/OpenSans-Light-webfont.eot');
    src: url('fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Light-webfont.woff') format('woff'),
         url('fonts/OpenSans-Light-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'open_sanssemibold';
    src: url('fonts/OpenSans-Semibold-webfont.eot');
    src: url('fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/OpenSans-Semibold-webfont.woff') format('woff'),
         url('fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
         url('fonts/OpenSans-Semibold-webfont.svg#open_sanssemibold') format('svg');
    font-weight: normal;
    font-style: normal;
}


/* Schriftnamen

Open Sans Light:		open_sanslight
Open Sans Semibold:		open_sanssemibold

*/

/* HOMEOFFICE */

#homeoffice {
width: 100%;
}

@media only screen and (min-width: 816px) {
#homeoffice {
width: 50%;
}
}

/* ----------- Inline-Styles überschreiben ----------- */
.site_warenkorb[style] {
   display: block;
   font-size: 1.15rem;
   line-height: 2.0rem;
   font-family: 'open_sanslight';
   width: 72px !important;
   position: relative;
   top: -3px;
   text-align: right;
   color: #fff !important;
   background: rgba(0,0,0,0.0) !important;
   border: none !important;

}

table.site_warenkorb > tbody:nth-child(1) > tr:nth-child(1) > td:nth-child(2) {
	position: relative;
	top: 0px;
}

table.site_warenkorb > tbody:nth-child(1) > tr:nth-child(3) > td:nth-child(1)[style], table.site_warenkorb > tbody:nth-child(1) > tr:nth-child(1) > td:nth-child(1)[style] {
	display: none;	
}

#menu1 > ul:nth-child(1) {
	margin: 0;
	padding: 0;	
}

/* #menu2 > ul:nth-child(1) {
	margin: 0;
	padding: 0;	
} */

#nav ul {
	margin-left: -40px;
}




/* ----------- Ende --- Inline-Styles überschreiben ----------- */

#warenkorb_ausgabe {
	float: right;
	margin-left: 10px;	
} 
	
.site_spacer {
	visibility: hidden;
	display: none;
	height: 0px;	
}

html {
	/* background: url(../bilder/design/leiste_hintergrund.svg);
	background-repeat: repeat-x; */	
}

html, body {
	font-family: 'open_sanslight';	
	font-size: 0.625rem;
	/* overflow-x: hidden; */
}

/* Einfache fließende Medien
   Hinweis: Für fließende Medien müssen Sie die Attribute 'height' und 'width' des Medium aus dem HTML-Code entfernen
   http://www.alistapart.com/articles/fluid-images/ 
*/

img, object, embed, video {
	max-width: 100%;
}
/* IE 6 unterst�tzt keine maximale Breite, verwenden Sie daher eine Standardbreite von 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver-Eigenschaften für fließende Raster
	----------------------------------
	dw-num-cols-mobile:		6;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Idee durch den Artikel "Responsive Web Design" von Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	und "Golden Grid System" von Joni Korpi
	http://goldengridsystem.com/
*/


/* ----------- MEDIA-QUERIES ----------- */
/* Layout für Mobilgeräte: 480px oder weniger. */

.gridContainer {
	margin-left: auto;
	margin-right: auto;
	width: 100%;
	/* background: rgba(255,255,255,0.86); */ 
	/* background: rgba(0,0,0,0.76); */ 
	box-sizing: border-box;
	position: relative;
	padding: 0 8;
}

#logo {
	display: block; 
	height: 90px; 
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

#menu1 {
	display: table-cell;
	text-align: right;
	vertical-align: middle;
	height: auto;
}


#slider {
	width: 100%;
	float: left;
	margin-top: 2px;
	margin-bottom: 10px !important;
}

/* #slider_links, #slider_rechts {
	width: 50%;
	float: left;
} */


#hauptmenu, #hauptmenu_neu {
	display: none;
}

#suche, #login {
	background: #E2E2E2;
	z-index: 30000;
	visibility: hidden;
	font-size: 1.25rem;
	position: absolute;
	right: 0;
	padding: 10px 5px;
}


@media only screen and (min-width: 481px) {
#suche, #login {
	background: #E2E2E2;
	z-index: 30000;
	visibility: hidden;
	font-size: 1.25rem;
	position: absolute;
	right: 0;
	top: 155px !important;
	padding: 10px 5px;
}
}

@media only screen and (min-width: 800px) and (max-width: 879px) {
#suche, #login {
	background: #E2E2E2;
	z-index: 30000;
	visibility: hidden;
	font-size: 1.25rem;
	position: absolute;
	right: 135px !important;
	top: 155px !important;
	padding: 10px 5px;
}
}


#gutschein_code_eingabe {
	background: #E2E2E2;
	padding: 10px;	
	display: block;
	width: 100%;
	float: left;
	clear: both;
	text-align: center;
	margin-bottom: 20px;
}

#gutschein_code_eingabe a {
	text-decoration: none !important;
	display: block;
	margin: 5px 0;
	background: #0064A9;
	border: none !important;
	font-family: 'open_sanssemibold';
	font-size: 1.75rem !important;
}

#gutschein_code_eingabe a:hover {
	background: #666 !important;
}

#gutschein_code_ausgabe {
	color: #4C7400;	
}

#topseller {
	float: left;
	clear: both;	
}

#inhalt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	color: #0064A9;
}

#footer {
	margin-left: 0;
	width: 63.333%;

    margin: 0 auto;
    display: flex;
    justify-content: center;
	/* NEU */

	text-align: center;
	font-size: 1.2rem;
	color: #666;
	padding: 8px 0px;
	/* background: #bbdcf2; */
}

/* Formularfelder */
input, .textarea {
	padding: 10px;	
	font-size: 1.32rem;
	color: #666;
	width: 100%;
	margin: 0 auto;
	border: 1px solid #666;
	background: #fff;
	/* -moz-box-shadow:inset 2px 2px 2px 0px rgba(0,0,0,0.15);
	-webkit-box-shadow: inset 2px 2px 2px 0px rgba(0,0,0,0.1.5);
	box-shadow:inset 2px 2px 2px 0px rgba(0,0,0,0.15); */
}

.input_submit {
	background: #0064A9;
	font-family: 'open_sanslight';
	padding: 10px;
	color: #fff;
	font-size: 1.55rem !important;	
	border: 0 !important;
	cursor: pointer;
}

.input_submit:hover {
	background: #666 !important;
	color: #fff !important;
}

.input_submit_dunkel {
	background: #0064A9 !important;
	font-family: 'open_sanssemibold';
	padding: 10px;
	color: #fff;
	font-size: 1.55rem !important;	
	border: none;
	cursor: pointer;
}

.input_submit_dunkel:hover {
	background: #666;
	color: #fff !important;
}

.input_tel_vorwahl, .input_tel_rufnummer {
	width: 100%;	
}


/* Suchfeld responsive */
#suche_responsive {
	text-align: center;	
}

.produkt_suche input {
	/* border-top: 1px solid #3C347A !important;
	border-bottom: 1px solid #3C347A !important;
	border-left: 4px solid #3C347A !important;
	border-right: 4px solid #3C347A !important; */
	margin: 0 auto !important;
}

/* Benutzername / Passwort (Login-Fenster) */
#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(1) > td:nth-child(1)[style],
#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(2) > td:nth-child(1)[style] {
	color: #666 !important;	
}

/* Beschriftung aktiver Login */
#abmelden {
	color: #666 !important;	
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a:hover[style],
#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a[style] {
	background-color: rgba(0,0,0,0.0) !important;
	cursor: pointer;	
}

#login > form:nth-child(3) > a:nth-child(4) {
	text-decoration: none;	
	color: #fff;
	display: block;
	width: 100%;
	text-align: center;
	background: #0064A9 !important;
	font-size: 1.35rem;
	font-family: 'open_sanssemibold';
	border: 0px !important;
	padding: 5px;
}

#login > form:nth-child(3) > a:nth-child(4):hover {
	background: #666 !important;
	color: #fff !important;
	padding: 5px !important;
	cursor: pointer;
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a:nth-child(1):hover {
	background: #666;
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a:nth-child(1), #registrierungsbutton a {
	text-decoration: none;	
	color: #fff;
	display: block;
	width: 100%;
	text-align: center;
	font-size: 1.35rem;
	font-family: 'open_sanslight';
	border: 0px !important;
	padding: 5px;
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) {
	padding-left: 0 !important;	
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1)[style] {
	background: #0064A9 !important;
	border: 0 !important;
	width: 100% !important;
	height: auto !important;
	padding: 5px !important;
	text-align: center !important;
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1)[style]:hover {
	background: #666 !important;
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1):hover {
	background: #666 !important;
}



/* Layout für Tablet-PCs: 481 bis 768 px. Erbt Stile vom: Layout für Mobilgeräte. */

@media only screen and (min-width: 481px) {
.gridContainer {
	/* width: 90.675%; */
	width: 100%;
}

#logo, #menu3 {
	/* width: 90.675%; */
	width: 100%;
	margin: 0 auto !important;
}

#menu1 {
	clear: none;
	float: right;
	margin: 0px;
	/* margin-left: 2.5641%; */
	width: auto;
	/* width: 60%; */
	/* width: 35.8974%; */
	display: block;
}

/*--XX #hauptmenu, #hauptmenu_neu {
	display: block;
	width: 100%;
	clear: both;
	float: left;
	margin-left: 0;
	margin-bottom: 7px !important;
}

#hauptmenu_responsive {
	display: none;
}

*/

#suche {
	position: absolute;
	right: 134px;
	top: 0;
}

#login {
	position: absolute;
	right: 134px; 
	top: 0;
}

#inhalt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

/* #menu2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
} */

#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: flex;
}

/* Formularfelder */
input {
	padding: 5px;	
	font-size: 1.32rem;
}

.input_submit {
	padding: 5px;
	font-size: 1.2rem;	
	margin-top: 5px;
}

.input_submit:hover {
	font-size: 1.2rem;
	color: #666;
}

}


@media only screen and (min-width: 601px) {
.gridContainer {
	background-size: 1200px;
	
}

}


@media only screen and (min-width: 880px) {
.menu1_links {
	display: inline;
}
}

/* Desktoplayout - Erbt Stile von: den Layouts für Mobilgeräte und Tablet-PCs. */

@media only screen and (min-width: 1300px) {
.gridContainer {
	width: 93.1%;
	max-width: 1200px;
	/* padding-left: 0.95%;
	padding-right: 0.95%; */
	margin: auto;
}

#logo, #menu3 {
	/* width: 93.1%;
	max-width: 1100px; */
	margin: auto;
}

#menu1 {
	clear: none;
	/* float: right; */
	/* margin-left: 2.0408%;
	width: 38.7755%; */
	display: table-cell;
}

#hauptmenu_responsive {
	display: none;
}

#inhalt {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}

/* #menu2 {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
} */

#footer {
	clear: both;
	float: left;
	margin-left: 0;
	width: 100%;
	display: flex;
}

}

@media only screen and (min-width: 800px) {
#suche {
	position: absolute;
	right: 235px;
	top: 0;
}

#login {
	position: absolute;
	right: 235px; 
	top: 0;
}	
}

/* ----------- SONSTIGE STYLES ----------- */
body {
	/* background: url(../bilder/design/linien_hintergrund.svg), url(../bilder/design/logo-element_hintergrund.svg);
	background-repeat: repeat, no-repeat; */
	/* background: url(../bilder/design/hintergrund_foto.jpg) 0 40px no-repeat;
	background-size: 100% !important;
	background-color: #3e3e3e; */
}

.unterueberschrift {
	font-size: 1.4rem;
	font-family: 'open_sanssemibold';
	margin: 18px 0 8px 0;
	display: block;
	text-align: left;	
}

.unterueberschrift_2 {
	font-size: 1.55rem;
	font-family: 'open_sanssemibold';
	margin: 0 0 8px 0;
	display: block;
	text-align: left;	
}

.fliesstext {
	line-height: 2.47rem;	
	font-size: 1.47rem;
	text-align: justify;
	color: #666;
	padding: 0;
	/* padding-bottom: 20px; */
}

.fliesstext_detailansicht {
	line-height: 1.9625rem;	
	font-size: 1.35rem;
	text-align: justify;
	color: #666;
	padding: 0;
}

.fliesstext p, .fliesstext_detailansicht p {
	display: block;
	margin: 8px 0;	
}

.fliesstext a, .fliesstext_detailansicht a, #produktliste_preis a, 
#suchergebnisse_links > a:nth-child(6), #warenkorb_artikel > a:nth-child(3) {
	font-family: 'open_sanslight';
	color: #666;
	letter-spacing: 0.05rem;
	text-decoration: underline !important;
}

ol {
	margin-left: 24px;	
}

.fliesstext a:hover, .fliesstext_detailansicht a:hover, #produktliste_preis a:hover, 
#suchergebnisse_links > a:nth-child(6):hover, #warenkorb_artikel > a:nth-child(3):hover {
	color: #0064A9; 
	
}

.widerrufsbelehrung {
	padding: 10px;
	background: #fff;
	border: 1px solid #666;	
	color: #666 !important;
}

.login_ueberschrift {
	color: #666;
	font-size: 1.45rem;
	font-family: 'open_sanssemibold';
	display: block;
	text-align: center;
	padding: 5px 0;
	background: #E2E2E2;	
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a:nth-child(1) {
	background: #E2E2E2;		
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:nth-child(1) > a:hover {
	background: #E2E2E2 !important;	
}

#login > form:nth-child(3) > table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(4) > td:nth-child(1) > div:hover {
	background: #E2E2E2 !important;	
}


.schatten {
text-shadow: 1px 3px 3px #000000;
filter: dropshadow(color=#000000, offx=1, offy=3);	
}


.rot {
	color: #0064A9;
}

.gruen {
	color: #4C7400;	
}

.grau {
	color: #666;
}

.gruen {
	color: #4C7400;	
}

.fettrot {
	font-family: 'open_sanssemibold';
	color: #0064A9;	
}

.fettgruen {
	font-family: 'open_sanssemibold';
	color: #363;
}

.fett {
	font-family: 'open_sanssemibold';	
	font-size: 1.52rem;
}

.blocksatz {
	text-align: justify;	
}

.bild_garantiekarte {
	margin-left: 20px;
}

.bild_zertifikat {
	margin: 0 0 0 20px;
	display: block !important;
	float: right !important;
	clear: both !important;	
}

#social_plugins {
	margin: 7px 0 14px 0;
	display: block;
	width: 100%;
}

#social_plugins div {
	padding: 8px 20px 8px 0;
	display: block;
	float: left;
	width: 100% 	
}

#social_plugins div:nth-child(2) {
	padding-top: 6px !important;	
}	

	#sprache {
	margin: 0 auto;
	box-sizing: border-box;
	}
	
	#sprache li {
		list-style-type: none !important;	
	}
	
	#sprache a {
		display: table-cell;
		vertical-align: middle;	
		text-decoration: none !important;
	}
	
	#sprache img {
		border: 1px solid rgba(255,255,255,1.0);
	}
	
	#sprache img:nth-child(1) {
		border: 1px solid rgba(255,255,255,1.0);
	}
	
	#sprache img:hover {
		cursor: pointer;
		border: 1px solid rgba(255,255,255,0.0);
		text-decoration: none !important;	
	}

@media only screen and (min-width: 1313px) {
#sprache {
		position: absolute;
		left: 0;
		box-sizing: border-box;
	}
}




@media only screen and (min-width: 407px) {

#social_plugins div {
  	padding: 0 20px 0 0;
	width: auto;
	display: block;
}

#social_plugins div:nth-child(2) {
	padding-top: 0px !important;	
}
}

/* Platzhalter Formularfelder */
::-webkit-input-placeholder {
	/* color: #0064A9; */
	color: #0064A9 !important;
}
:-moz-placeholder {
	/* color: #0064A9; */
	color: #0064A9 !important;
}
.placeholder {
	/* color: #0064A9; */
	color: #0064A9 !important;
}

/* Darstellung Inhaltsbereich */
#inhalt {
	padding: 0px 10px;
	position: relative;	
}

#topseller {
	width: 100%;
	margin: 10px 0;
	/* height: auto; */
	background: #0064A9;
}

#facebook {
	display: none;	
}

#facebook2 {
	width: 100%;
	display: block;	
	float: right;
}

#seiteninhalt {
	background: #fff;	
}

.noblock {
	text-align: left !important;	
}

/* Darstellung Suchergebnisse */

#suchergebnisse {
	float: left; 
	clear: both; 
	width: 100%;
}

#suchergebnisse a {
	text-decoration: none;	
}

#suchergebnisse_tabelle {
	font-size: 1.35rem; 
	font-family: 'open_sanslight'; 
	color: #666; 
	width: 100%;
}

#suchergebnisse_bild {
	padding: 0px 12px 0 0;
}

#suchergebnisse_bild img {
	max-width: 450px !important;
    width: 450px !important;
	/* border: 1px solid #0064A9 !important;	*/
	margin-top: 7px;
}

#suchergebnisse h1 {
	text-align: left !important;
	font-size: 1.55rem;
	line-height: 2.50rem;
	color: #666;
	display: block;
	font-family: 'open_sanslight';
	padding-bottom: 7px;
	/* border-bottom: 1px solid #0064A9; */
	padding-top: 10px;
}

#suchergebnisse h1:hover {
	text-decoration: none !important;
	color: fff !important; 	
}

#suchergebnisse_text {
	 padding: 0;	
}

#suchergebnisse_text h1 {
	text-align: left !important;
	font-size: 1.57rem;
	line-height: 2.20rem;
	color: #0064A9;
	font-family: 'open_sanslight';
	margin-top: -7px;
}

#suchergebnisse .no_h1_link {
	font-size: 1.57rem;
	font-family: 'open_sanssemibold';
	line-height: 3.2rem;
	background: rgba(0,0,0,0.0) !important;	
	color: #0064A9 !important;
	/* margin-bottom: 10px !important; */
	display: block;
	
}

#suchergebnisse .no_h1_link:hover {
	color: #E81E41 !important;
}

#suchergebnisse a {
	font-family: 'open_sanslight';
	color: #0064A9;
	letter-spacing: 0.05rem;
}

#suchergebnisse a:hover {
	color: #0064A9; 
}

#suchergebnisse ul {
	margin-left: 20px;	
}

#suchergebnisse img {
	width: 200px !important;	
}

#suchergebnisse_preise_buttons {
	padding: 10px 0px; 
	border-bottom: 1px dashed #666;	
}

#suchergebnisse_links {
	float: left;	
}

#suchergebnisse_rechts {
	float: right;
	text-align: right;	
}

#suchergebnisse_rechts_english {
	float: right;
	text-align: right;	
}

@media only screen and (min-width: 631px) {
	.bild_zertifikat {
		margin-left: 20px;	
	}
}


@media only screen and (min-width: 902px) { 
#logo {
	display: block; 
	height: 120px;
	margin-left: auto;
	margin-right: auto;
}
}

@media only screen and (min-width: 911px) {
.input_tel_vorwahl, .input_tel_rufnummer {
	width: 100%;
	float: none !important;	
}

}

@media only screen and (min-width: 920px) {
.input_tel_vorwahl, .input_tel_rufnummer {
	float: inherit !important;	
}

.input_tel_vorwahl {
	width: 70px !important;
	margin-right: 10px !important;
}

.input_tel_rufnummer {
	width: 120px !important;	
}

}


@media only screen and (min-width: 1000px) {

#inhalt {
	padding: 10px;		
}

/* #seiteninhalt {
	margin-right: 410px;	
} */

}

h1 {
	font-size: 2.25rem;
	font-family: 'open_sanssemibold';
	line-height: 3.2rem;
	color: #666;
	margin-bottom: 7px;
	text-align: left;
}

@media only screen and (min-width: 1300px) {

	#hauptmenu, #hauptmenu_neu  {
	display: block;
	width: 100%;
	clear: both;
	float: left;
	margin-left: 0;
	/* border-bottom: 1px solid #000; */
	background: #fff; 
}

#hauptmenu_responsive {
	display: none;
}
	
}

.img_links {
	float: left;
	padding-right: 10px;
	padding-bottom: 10px;	
}

/* ----------------------------------------------
 * Generated by Animista on 2018-10-19 13:40:10
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation bounce-in-top
 * ----------------------------------------
 */
@-webkit-keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}
@keyframes bounce-in-top {
  0% {
    -webkit-transform: translateY(-500px);
            transform: translateY(-500px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    opacity: 0;
  }
  38% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
    opacity: 1;
  }
  55% {
    -webkit-transform: translateY(-65px);
            transform: translateY(-65px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  72% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  81% {
    -webkit-transform: translateY(-28px);
            transform: translateY(-28px);
    -webkit-animation-timing-function: ease-in;
  }
  90% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
  95% {
    -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    -webkit-animation-timing-function: ease-out;
            animation-timing-function: ease-out;
  }
}


.animation_begruessung {
	-webkit-animation: bounce-in-top 1.1s both;
	        animation: bounce-in-top 1.1s both;
}

@media only screen and (min-width: 1300px) {
#suche, #login {
	background: #E2E2E2;
	z-index: 30000;
	visibility: hidden;
	font-size: 1.25rem;
	position: absolute;
	right: 645px;
	top: 155px !important;
	padding: 10px 5px;
}
}