.huskygeheul {
    display: flex;
    flex-wrap: wrap;
    margin: -0.3rem 0 1rem -0.3rem;  /* Negativer Rand oben, positiver Rand unten */
}

.audiobutton {
    flex: 1 1 calc(25% - 0.6rem);
    max-width: calc(25% - 0.6rem);
    margin: 0.3rem;  /* Positiver Rand oben, rechts, unten und links */
    box-sizing: border-box;
    overflow: hidden; 
    position: relative; 
}

.audiobutton img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s ease-in-out;  
}
.audiobutton:hover img {
    transform: scale(1.05);  
    cursor: pointer;  
}

@media (max-width: 768px) {
    .audiobutton {
        flex: 1 1 calc(50% - 0.6rem);
        max-width: calc(50% - 0.6rem);
    }
}

@media (max-width: 480px) {
    .xaudiobutton {
        flex: 1 1 100%;
        max-width: 100%;
    }
	button {
		padding: .5rem !important;
	}
}