*{
	/*default Einstellungen verändern*/
	margin: 0px;
	padding: 0px;
	box-sizing: border-box; /*padding and border are included in the width and height*/
}

/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*-------------Zuerst wird Handy gestylt--------------------*/



	/*---------------------------------------------------*/
	/*-------------------SPONSORENSEITE------------------*/
	
  
  .sponsoren-article {
	background-color: #fff;
	padding: 4%;
	border-radius: 5px;
	
	/*--benötigt für Gruppierung der Bilder--*/
	display: flex;/*--float--*/
	flex-direction: row;/*--Objekte in Reihe schalten--*/
	justify-content: space-around;
	flex-wrap: wrap;/*--Umbrüche gerzeugen--*/
	align-items: center;
  }
	
	.linksponsoren{
		display: flex;/*--float--*/
	    width: 100%;
	}

	.imgsponsoren{
	   background-color: #f1f1f1;
	   border-radius: 5px;
	   padding: 2%;
	   margin: 0 0 5% 0;
	   width: 100%;
	}



/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*--------------Ab jetzt wird Tablet gestylt----------------*/

@media only screen and (min-width:700px){  /*---Grenze anpassen ????---*/

  /*---------------------------------------------------*/
  /*-------------------SPONSORENSEITE------------------*/

	.sponsoren-article {
		background-color: #fff;
		padding: 2%;
		border-radius: 5px;
		
		/*--benötigt für Gruppierung der Bilder--*/
		display: flex;/*--float--*/
		flex-direction: row;/*--Objekte in Reihe schalten--*/
		justify-content: space-between;
		flex-wrap: wrap;/*--Umbrüche gerzeugen--*/
		align-items: center;
  }

	.linksponsoren{
		display: flex;/*--float--*/
	    width: 48%;
	}

	.imgsponsoren{
	   background-color: #f1f1f1;
	   border-radius: 5px;
	   padding: 2%;
	   margin: 2% 1% 2% 1%;
	   width: 100%;
	}





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

/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*--------------Ab jetzt wird Computer gestylt--------------*/

@media only screen and (min-width:1100px){ 
	/*---Grenze anpassen ????---*/
	
  /*---------------------------------------------------*/
  /*-------------------SPONSORENSEITE------------------*/
  
  .sponsoren-article {
	background-color: #fff;
	padding: 1% 2% 2% 2%;
	border-radius: 5px;
	
	/*--benötigt für Gruppierung der Bilder--*/
	display: flex;/*--float--*/
	flex-direction: row;/*--Objekte in Reihe schalten--*/
	justify-content: space-between;
	flex-wrap: wrap;/*--Umbrüche gerzeugen--*/
	align-items: center;
  }

	.linksponsoren{
		display: flex;/*--float--*/
	    width: 32%;
	}

	.imgsponsoren{
	   width: 100%;
	   background-color: #f1f1f1;
	   padding: 2%;
	   border-radius: 5px;
	   margin: 4% 2% 2% 0%;
	}
	
	
	    




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

/*--"float" muss bei jedem Element benutzt werden--*/

/*---------------------------------
.flexbox {
	width: 90%;
	margin: 5%;
	background: #dadada;
	float: left;
}

.flexelement {
	background: #ff6600;
	color: #ffffff;
	text-align: center;
	margin: 10px;
	padding: 15px 0 15px 0;
	float: left;
}
-----------------------------------*/

/*--display: flex; verhält sich wie float: left;--*/
/*--display: flex; immer mit Präfixen arbeiten, funktioniert bereits für Firefox--*/
/*--------------------------------------------------------------------------------*/
/*--flex-direction: row; = Standard = float: left;--*/
/*--flex-direction: row-reverse; = float: right;--*/
/*--flex-direction: column; = Objekte stapeln sich übereinander;--*/
/*--flex-direction: column-reverse; = Reihenfolge wird umgedreht;--*/
/*--------------------------------------------------------------------------------*/
/*--justify-content: flex-start; = Standard --*/
/*--justify-content: center; = Zentrierung der Elemente mit Elternelement --*/
/*--justify-content: flex-end; = float: right; aber rechtsbündig 1-4 --*/
/*--justify-content: space-around; = um jede Box ist gleich viel Abstand links und rechts--*/
/*--justify-content: space-between; = Boxen links und rechts bündig mit Elternelement, es macht keine Umbrüche --> flex-wrap: wrap;--*/
/*--flex-wrap: wrap; = Elemente werden umgebrochen--*/
/*--flex-wrap: wrap; und margin: 0 0 1% 0; = Grid Layout; Umbrüche mit width: 49%; generieren;--*/
/*--align-items: flex-start; = Standard;--*/
/*--align-items: flex-end; = Ausrichtung an Außenbox;--*/
/*--align-items: stretch; = alle Boxen gleich groß, sie werden gestreckt;--*/
/*--align-items: center; = alle Boxen werden zentriert;--*/
/*--align-items: baseline; = alle Boxen an der Textunterkante ausgerichtet;--*/
/*----*/
/*----*/