/* CSS Document */

.nh-magazin-item img, .cmsContent img.main-img {
    width: 100%;
    height: auto;
	margin: 0 0 10px 0;
}

.content img {
	max-width: 100%;
	height:auto;
	margin:0 10px 10px 10px;
    border-radius: 10px;
    -webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.36);
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.36);

	
}
.cmsContent {
	padding: 50px;
}
.cmsContent h2 {
	font-size:1.3rem;
}

.nh-magazin-item h2 {

	font-size:20px;
	padding: 10px;
}

.nh-magazin-list {
    display: flex;
    gap: 30px;
    flex-wrap: wrap;
	padding: 10px;
}

.nh-magazin-item {
    width: auto;
    border: 1px solid grey;    
    border-radius: 10px;
    -webkit-box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.36);
	box-shadow: 5px 5px 15px 5px rgba(0,0,0,0.36);
    box-sizing: border-box!important;
	display: inline-block;
}

.nh-magazin-item p, .nh-magazin-link {
	padding: 10px;
}

.nh-magazin-link {
	
	    text-align: end;

}
.row .story-posts-masonry {
    align-items: flex-start;
	box-sizing: border-box!important;
}
.nh-magazin-item .story-meta {
	padding: 0 20px;
	font-weight:600;
}


.stories__productbox {
	margin: 0 0 20px 0;
	box-sizing: border-box!important;
	
}

.masonry-wrapper {
  max-width: 1320px;  /* Deine Wunschbreite */
  width: 100%;
  margin: 0 auto;     /* Zentriert das Layout auf dem Bildschirm */
  box-sizing: border-box!important;
  align-items: flex-start;
  /* Standard für große Bildschirme: 3 Spalten */
  column-count: 3;
  column-gap: 20px;   /* Abstand zwischen den Spalten */
}

.masonry-item {
  background-color: #f3f4f6;
  margin-bottom: 24px; /* Abstand nach unten (sollte gleich dem Spaltenabstand sein) */
  /*display: inline-block; */
  width: 100%;
  box-sizing: border-box!important;
}	

hr {
    color: rgba(17,34,17,.50)!important;    
}

a.more {
	font-size: 14px;
}

/* --- Responsive Anpassungen --- */

/* Tablets (unter 900px Breite): 2 Spalten */
@media (max-width: 900px) {
  .masonry-wrapper {
    column-count: 2;
  }
}

/* Smartphones (unter 600px Breite): 1 Spalte */
@media (max-width: 600px) {
  .masonry-wrapper {
    column-count: 1;
    padding: 5px;
  }
  .masonry-item {
    margin-bottom: 15px;
  }
.cmsContent {
	padding: 5px;
}	
}


