@charset "utf-8";

*		{ margin: 0px; padding: 0px; border: 0px; }
html	{ height: 100.2%; }
body	{ background-color: #ffffff; }


body {/*KlK - mobilefirst - neu Juli 2020*/
background: #fcfcfc; /*#fdb84a;*/ /*#fcfcfc;*/ /*falls bild nicht vorhanden*/
background-image: url(../images/nohgges.jpg);
background-position: center top;
background-attachment: scroll;
background-repeat: repeat-y;
	font-family: Arial, Verdana, Tahoma, san-serif; 
font-size: 16px; /*Fontsizechange auf dieser Basis berechnen sich die em-Schriften*/
line-height: 130%;
color: #000;
text-align: left;	/* !!! */
}

.clear {/*modkd*/
   	 float: none;
   	 clear:both;
	 height: 1px;
	 background:transparent;
	 width: 1px;
}	


/* *** Rahmen des Anmelde-Formulars *** */
fieldset.input {
border: 0px;
}	


/*Farbe */

/* --------------------------
ICONS RÄNDER ENTFERNEN 
-------------------------- */
td.buttonheading img {
border: 0 none;
text-decoration: none;
}

img a {
border: 0 none;
text-decoration: none;
}



/*----------------------------------
BEGINN LAYOUT
----------------------------------*/


/*wrapper*/
#wrapper {
    width: 100%;
    margin: 0% 0%;
height: auto;
position: relative;
margin: 0 auto; /* !!! */
text-align: left; /* !!! */

}


/*block1 - xxx*/
#block1 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    margin: 0% 0% 58px 0%;
    padding: 0% 0% 0% 0%;
  position: fixed;
  top:      0px;
  z-index: 100;
}

#mobil1 {	/*Farbfläche fürs Menü*/
    height: 0px;
}

#position-101 {	/*Farbfläche fürs Menü*/
    background: #68c3cb;
    height: 50px;
    margin: 0% 0% 1.5% 0%;
    padding: 0% 0% 0% 0%;
}

/*block2 - xxx*/
#block2 {
	clear: both;
	float: none;
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-201 {	/*Logo*/
    margin: 58px 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

.logo img {
    width: 100%;
    max-width: 600px;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
    overflow: hidden;
}

#position-202 {	/*Header*/
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

/*block3- xxx*/
#block3 {
   	float: none;
   	clear: both;
    width: 93%;
    height: auto;
    margin: 2% auto 0% auto;
    padding: 0% 2% 0% 0%;
}

#position-301 {	/*Content volle Breite für iframe schuhe.de*/
    width: 98%;
    height: auto;
    margin: 0% 2% 0% -2%;
    padding: 0;

}

#position-301 h3 {
	line-height: 120%;
	color: #1f3e65;	/*blau*/
	color: #f29400;	/*orange*/
	margin: 2.5% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}


.textfotos img {
	width: 100%;
	height: auto;
    margin: 1% 0% 0% 0%;
    padding: 1% 0% 1% 0%;
}

.headlines img {
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
    overflow: hidden;
}
	
p.icons img {
	height: 20px;
	width: auto;
    margin: 0% 0% 0% 0%;
    padding: 1% 0.5% 0% 0.5%;
}

.senkel img {
	height: 100%;
	width: 100%;
    margin: 0% auto 0% auto;
    padding: 1% 0.5% 0% 0.5%;
    overflow: hidden;
}

/*block42 - xxx*/
#block42 {
	height: 0px;
	visibility: hidden;
}

#position-701 {	/**/
}

/*block41 - xxx*/
#block41 {
	height: 0px;
	visibility: hidden;
}

#position-501 {	/**/
}

#position-502 {	/**/
}

#position-503 {	/**/
}

#position-504 {	/**/
}

/*block4 - xxx*/
#block4 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

#position-801 {	/*Imagebild*/
    width: 94%;
    height: auto;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-802 {	/*Imagebild*/
    width: 94%;
    height: auto;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-803 {	/*Imagebild*/
    width: 94%;
    height: auto;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-804 {	/*Imagebild*/
    width: 94%;
    height: auto;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-805 {	/*Imagebild*/
    width: 94%;
    height: auto;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

.linie img {
	height: 10px;
	width: 100%;
}

/*block6 - xxx*/
#block6 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    margin:  0% 0% 1% 0%;
    padding: 0% 0% 0% 0%;
    background: #f0ebdb;   /*beige*/
}

#block6 h6 {
	font-size: 0.9em;
	text-align: left;
}
 
#position-401 {	/*Fußzeile*/
	min-height: 30px;
    margin: 3% 0% 0% 0%;
    padding: 1.5% 2% 1.5% 2%;
}
#position-402 {	/*Fußzeile*/
	min-height: 30px;
    margin: 1% 0% 0% 0%;
    padding: 1.5% 2% 1.5% 2%;
}
#position-405 {	/*kleines Kontaktformular*/
	min-height: 30px;
	width: 96%;
    margin: 0% auto 0% auto;
    padding: 0.5% 0% 0.5% 0%;
    background: #f9fafc;	/*Farbe aus Breezingform in dem gewählen Template*/
    border-top: 2px solid #f0ebdb;   /*beige*/
    border-bottom: 2px solid #f0ebdb;   /*beige*/
}

#block7 {
}

#position-403 {	/*Logos*/
	min-height: 30px;
    margin: 1% 0% 0% 0%;
    padding: 1.5% 2% 1.5% 2%;
    background: #f0ebdb;   /*beige*/
}
#position-404 {	/*Logos-Desk*/
	height: 0px;
	visibility: hidden;
}

h6.marken img {
	height: 24%;
	width: 24%;
    margin: 0% 0% 0% 0%;
    padding: 2% 0.5% 0% 0.5%;
	text-align: center;
	overflow: hidden;
}


h6.desk-marken img {
	height: 12%;
	width: 12%;
    margin: 0% 0% 0% 0%;
    padding: 0% auto 0% auto;
	text-align: center;
	overflow: hidden;
}



h6.smicons img {
	height: 36px;
	width: auto;
    margin: 0% 0% 0% 0%;
    padding: 1% 0.5% 0% 0.5%;
	overflow: hidden;
}


/*block5 - xxx*/
#block5 {
}

#position-901 {	/* unter Content*/
	visibility: hidden;
}

#position-902 {	/* unter Content*/
	visibility: hidden;
}

#position-903 {	/* unter Content*/
	visibility: hidden;
}



/*block8 - xxx*/
#block8 {
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-601 {	/* unter Content*/
    width: 100%;
    height: 50px;
    margin: 0% auto 0% auto;
    padding: 0% 0% 0% 0%;
    background: #68c3cb;
}


.ig-category-description { /*Beschreibung in der IGNITE Gallerie*/
	background: #f1ece1;
	background: #f9f6f1 !important; /*45% vom Beigeton*/
	padding: 2%;
	}
	
	
	
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/
/*EEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEE*/


/*******BEGINN MEDIA SCREEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEN*******/


/*AUSGABE SCREEN - Ergänzungen unter 768px Breite*/
@media screen and (max-width: 768px) {
	
	/**/
    #wrapper {
    background: none;
border-bottom: 3px solid white; /*zur besseren Ansicht beim Programmieren, welche Bildschirmbreite zum Einsatz kommt	*/
}


}
/*AUSGABE SCREEN*/




@media screen and (min-width: 769px) and (max-width: 1024px) {
	
        body {
        background-image: url(../images/hgges.jpg);
    }

	/**/
    #wrapper {
    background: white;
border-bottom: 3px solid white; /*zur besseren Ansicht beim Programmieren, welche Bildschirmbreite zum Einsatz kommt*/
	
}

/*block3- xxx*/
#block3 {
   	float: none;
   	clear: both;
    width: 93%;
    height: auto;
    margin: 2% auto 0% auto;
    padding: 0% 2% 0% 0%;
}

#position-301 {	/*Content volle Breite für iframe schuhe.de*/
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0;

}

#position-301 h3 {
	line-height: 120%;
	color: #1f3e65;	/*blau*/
	color: #f29400;	/*orange*/
	margin: 2.5% 0% 0% 0%;
	padding: 0% 0% 0% 0%;
}



/*block4 - xxx*/
#block4 {
   	float: none;
   	clear: both;
    width: 94%;
    height: auto;
    margin: 0 auto;
    padding: 0;
}

#position-801 {	/*Imagebild*/
    width: 49%;
    height: auto;
    float: left;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-802 {	/*Imagebild*/
    width: 49%;
    height: auto;
    float: left;
    margin: 0% auto 3% 2%;
    padding: 0% 0% 0% 0%;
}

#position-803 {	/*Imagebild*/
    width: 49%;
    height: auto;
    float: left;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

#position-804 {	/*Imagebild*/
    width: 49%;
    height: auto;
    float: left;
    margin: 0% auto 3% 2%;
    padding: 0% 0% 0% 0%;
}

#position-805 {	/*Imagebild*/
    width: 48.5%;
    height: auto;
    float: left;
    margin: 0% auto 3% auto;
    padding: 0% 0% 0% 0%;
}

.zentr-button img {
	width: 40%;
	height: auto;
}


#block6 {
	display: flex;
}

#block6 h6 {
}
 
#position-401 {	/*Fußzeile Kontaktdaten*/
   	float: none;
   	clear: both;
	float: left;
	width: 30.3%;
	min-height: 30px;
    margin: 0% auto 0% auto;
    padding: 0% 0% 0% 0.5%;
    order: 2;
    border-right: 4px solid white;
}
#position-402 {	/*Fußzeile SocialMedia + Newsletter*/
   	float: none;
   	clear: both;
	float: left;
	width: 23.3%;
	min-height: 30px;
    margin: 0% auto 0% auto;
    padding: 0% 0% 0% 0.5%;
    order: 3;
    background: none;
}
#position-405 {	/*Kontaktformular*/
   	float: none;
   	clear: both;
	width: 40.3%;
	min-height: 30px;
    margin: 0% auto% 0% auto;
    padding: 0% 0% 0% 0%;
    background: #f0ebdb;   /*beige*/
    order: 1;
    border-right: 4px solid white;
}

#block7 {
   	float: none;
   	clear: both;
    width: 96%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 2% 0% 2%;
    background: #f0ebdb;   /*beige*/
}

#position-403 {	/*Logos*/
	float: none;
	width: 100%;
	min-height: 30px;
    margin: 0% auto 0% auto;
    padding: 0% 0% 0% 0%;
    background: #f0ebdb;   /*beige*/
    border-top: 2px solid white;
}
#position-404 {	/*Logos-Desk*/
	height: 0px;
	visibility: hidden;
}


}


@media screen and (min-width: 1025px) /*and (max-width:1439px)*/ {

        body {
        background-image: url(../images/hgges.jpg);
    }

	/**/
    #wrapper {
    background: white;
border-bottom: 3px solid white; /*zur besseren Ansicht beim Programmieren, welche Bildschirmbreite zum Einsatz kommt*/
    max-width: 1200px;
    margin: 0% auto;
    padding: 0% 0% 0% 0%;
    
	
}


/*block1 - xxx*/
#block1 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    margin: 0% 0% 58px 0%;
    padding: 0% 0% 0% 0%;
  position: relative;
  top:      0px;
}



#position-101 {	/*Farbfläche fürs Menü*/
    background: #68c3cb;
    height: 50px;
    margin: 0% 0% 1.5% 0%;
    padding: 0% 0% 0% 0%;
}

/*block2 - xxx*/
#block2 {
    width: 100%;
    height: auto;
    margin: -30px 0% 0% 0%;
    padding: 0;
}

#position-201 {	/*Logo*/
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}


/********************* BLOCK 20 - DESKTOPANSICHT CONTENT 3SPALTIG (TODO: ) ***********************/

#block20 {
    width: 100%;
    height: auto;
    float: left;
    margin: 2% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

/********************* BLOCK 3 - CONTENT (TODO: ) ***********************/

#block3{
    width: 100%;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-301 {	/*Content*/
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}



/********************* BLOCK 4 - SCHNELLLINKS (TODO: ) ***********************/

#block4 {
display: none;
}

#position-801 {	/*schnelllinks*/
	display: none;
}

#position-802 {	/*schnelllinks*/
	display: none;
}

#position-803 {	/*schnelllinks*/
	display: none;
}

#position-804 {	/*schnelllinks*/
	display: none;
}

#position-805 {	/*schnelllinks*/
	display: none;
}



/********************* BLOCK 5 - KUNDENSTIMMEN + LIEBLINGSORT (TODO: ) ***********************/

#block5 {
    width: 0%;
    float: left;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}



/*block42 - schnürsenkel*/
#block42 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    visibility: visible;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-701 {	/*Schnelllinks quer*/
	float: left;
    width: 100%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

/********************* BLOCK 41 - SCHNELLLINKS quer (TODO: ) ***********************/

/*block41 - Schnelllinks quer*/
#block41 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    min-height: 200px;
    visibility: visible;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-501 {	/*Schnelllinks quer*/
	float: left;
    width: 22%;
    height: auto;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}

#position-502 {	/*Schnelllinks quer*/
	float: left;
    width: 22%;
    height: auto;
    margin: 0% 0% 0% 4%;
    padding: 0% 0% 0% 0%;
}

#position-503 {	/*Schnelllinks quer*/
	float: left;
    width: 22%;
    height: auto;
    margin: 0% 0% 0% 4%;
    padding: 0% 0% 0% 0%;
}

#position-504 {	/*Schnelllinks quer*/
	float: left;
    width: 22%;
    height: auto;
    margin: 0% 0% 0% 4%;
    padding: 0% 0% 0% 0%;
}



/********************* FOOTERBEREICH (TODO: FÜR IPAD UND DESKTIOP EIGENE MODULE ERSTELLEN) ***********************/

#block6 {
    width: 100%;
    height: auto;
    float: left;
    margin: 2% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
    background: #f0ebdb;   /*beige*/
display: flex;
}

#position-401 {	/*Fußzeile - links*/
    width: 30%;
    float: left;
    margin: 0% 0%;
    padding: 1% 0% 0% 2%;
    order: 1;
}
#position-402 {	/*Fußzeile - mitte*/
    width: 20%;
    float: left;
    margin: 0% 0%;
    padding: 1% 0% 0% 2%;
    order: 3;
}
#position-405 {	/*Karte*/
    width: 50%;
    float: left;
    margin: 0% 0%;
    padding: 0% 0% 0% 0%;
    order: 2;
}

#block7 {
   	float: none;
   	clear: both;
    width: 96%;
    height: auto;
    margin: 1.5% 0% 0% 0%;
    padding: 2% 2% 2% 2%;
    background: #f0ebdb;   /*beige*/
    border-top: 2px solid white;
}
#position-403 {	/*Fußzeile - logos*/
    display: none;
}
#position-404 {	/*Fußzeile - Logos Desktop*/
	visibility: visible;
	min-height: 100px;
    margin: 0% 0% 0% 0%;
    padding: 0% 0% 0% 0%;
}



}


@media screen and (min-width: 1440px) {
	
	/**/
    #wrapper {
    background: white;
border-bottom: 3px solid white; /*zur besseren Ansicht beim Programmieren, welche Bildschirmbreite zum Einsatz kommt*/
	
}


/*block1 - xxx*/
#block1 {
   	float: none;
   	clear: both;
    width: 100%;
    height: auto;
    margin: 0% 0% 58px 0%;
    padding: 0% 0% 0% 0%;
  position: relative;
  top:      0px;
}





}



/*******ENDE MEDIA SCREEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEEN*******/

/*DRUCKAUSGABE Vorgaben*/
@media print {
	/*noch ausfüllen*/
}