.sounds{display:flex;align-items:center;gap:40px;position:relative;.sound:hover{.play{opacity:1;transition:.5s}}.navigation,.play{width:42px;height:42px;background-color:rgb(var(--land));border-radius:50%;color:rgb(var(--forest));cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;span{font-size:42px}}.play{position:absolute;top:45%;left:50%;transform:translate(-50%,-50%);align-content:center;text-align:center;span{font-size:24px}}.play.playing{opacity:0;transition:.5s}.swiper-slide{width:max-content;margin:0 20px;.sound{width:376px;height:376px;background-repeat:no-repeat;background-size:cover;background-position:50%;.contentContainer{z-index:1;width:100%;position:absolute;bottom:0;color:#FFF;display:flex;align-items:center;justify-content:center;margin-bottom:10px;.content{width:max-content;margin:0 10px;text-align:center;h4{text-transform:none}hr{margin:5px 0}span{display:block;font-size:17px}}}}}}@media screen and (max-width:440px){.sounds{gap:0;position:relative;.navigation,.play{z-index:2;width:24px;height:24px;span{font-size:24px}}.play{span{font-size:18px}}.navigation.previous{left:8px}.navigation.next{right:8px}.swiper-slide{margin:0 12px;.sound{width:228px;height:228px;.contentContainer{.content{h4{font-size:17px}span{font-size:10px}}}}}}}