:root {
--c-white: #fff;
--c-black: #000;
--c-yellow-300: #f8eb6c;
--c-yellow-400: #ffe500;
--c-brown-200: #eee9e0;
--c-brown-300: #eae5dc;
--c-brown-400: #dbd1bf;
--c-brown-500: #cbbba0;
--c-brown-600: #b1a188;
--c-brown-700: #432918;
--c-gray-200: #bebebe;
--c-gray-300: #f0f0f0;
--c-gray-400: #efefef;
--c-gray-500: #535353;
--c-gray-600: #d5d5d5;
--c-gray-700: #626262;
--c-primary: var(--c-yellow-400);
--c-text: var(--c-black);
--f-main: "Noah", sans-serif;
--f-headings: "Noah", sans-serif;
--wrapper-width: 120rem;
--padding-width: 2rem;
--gutter-width: 2rem;
--transition-duration: 0.25s;}
.audio-wrapper{
max-width: 79.3rem  ;
margin: 0 auto 36px !important;
padding: 0;
}
@media (max-width: 79.3rem) {
.audio-wrapper {
padding: 0 20px;
}
}
.audiotop {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 18px;
}
.audio-player {
display: flex;
flex-direction: column;
gap: 18px;
font-family: sans-serif;
}
.play-btn {
width: 44px;
height: 44px;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 20px;
}
.audio-info {
display: flex;
justify-content: space-between;
align-items: center;
flex: 1;
}
.audio-title {
font-family: var(--f-headings);
font-weight: 700;
font-size: 28px;
letter-spacing: 0.03em;
}
.audio-time {
font-size: 20px;
letter-spacing: 0.03em;
font-family: var(--f-main);
}
.progress-bar-container {
background: #b1b1b1;
height: 14px;
width: 100%;
border-radius: 0px;
overflow: hidden;
cursor: pointer;
}
.progress-bar {
background: #ffe100;
height: 100%;
width: 0%;
}