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


/*----------------------------------------------------------*/
/*------------------Shop Styling----------------------------*/

.fanshop-main {
	width: 100%;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;

	padding: 0.5%; /*-top right bottom left-*/
  }
  
  .fanshop-article {
	background-color: #fff;
	padding: 20px;
	border-radius: 5px;

	flex-basis: 90%;
	margin: 4% 1% 1% 1%;
  }

  .fanshop-article:first-child {
    flex-basis: 90%;
    margin: 4% 1% 1% 1%;
  }

  .fanshop-article:last-child {
    flex-basis: 90%;
    margin: 4% 1% 8vh 1%;
  }

  .fanshop-article h1 {
    font-size: 2.0em;
	  flex-basis: 90%;
  }
  .fanshop-article h2 {
    font-size: 1.3em;
	  flex-basis: 90%;
  }
  .fanshop-article h3 {
    font-size: 0.95em;
	  flex-basis: 90%;
  }
  .fanshop-article p{
    margin-top: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    line-height: 24px;
    font-size: 1.0em;
	  flex-basis: 90%;
  }
  
  .fanshop-article img{
     width: 100%;
    }

  .fanshop-article ul{
    display: flex;
    flex-flow: row wrap;
    justify-content: left;

    margin: 0% 0% 0% 7%;
  }

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

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

  .fanshop-article {
    flex-basis: 48%;
    margin: 1% 1% 1% 1%;
  }
	
	.fanshop-article:first-child {
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    
    flex-basis: 98%;
    margin: 2% 1% 1% 1%;
  }

  .fanshop-article:nth-child(12) {
    flex-basis: 48%;
    margin: 1% 0.5% 6vh 0.5%;
  }

  .fanshop-article:nth-child(13) {
    flex-basis: 48%;
    margin: 1% 0.5% 6vh 0.5%;
  }
  
}
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------------------------------------------------------*/
/*----------Ab jetzt wird Desktop gestylt------------------*/

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

    .fanshop-article {
    flex-basis: 24%;
    margin: 1% 0.5% 0.5% 0.5%;
    }

    .fanshop-article:first-child {
      background-color: #fff;
      padding: 20px;
      border-radius: 5px;
      
      flex-basis: 99%;
      margin: 1% 0.5% 0.5% 0.5%;
    }

    .fanshop-article:nth-child(10) {
      flex-basis: 24%;
      margin: 1% 0.5% 6vh 0.5%;
    }

    .fanshop-article:nth-child(11) {
      flex-basis: 24%;
      margin: 1% 0.5% 6vh 0.5%;
    }

    .fanshop-article:nth-child(12) {
      flex-basis: 24%;
      margin: 1% 0.5% 6vh 0.5%;
    }

    .fanshop-article:nth-child(13) {
      flex-basis: 24%;
      margin: 1% 0.5% 6vh 0.5%;
    }

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