✏️ Editing: _audio.scss Writable

.ova-audio-wrap {

.list-audio {
		margin: 0;
		padding: 0;
		padding-top: 30px;
		list-style: none;
		
		li {
			border-bottom: 1px solid rgba(217, 217, 217, 0.12);
		}
		.item {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 47px 25px;
			margin-bottom: 17px;
			.audio-name {
				margin: 0;
				font-size: 32px;
				font-weight: 700;
				color: #fff;
				text-transform: uppercase;

span {
					font-weight: normal;
				}
			}

.download-audio {
				font-size: 15px;
				font-family: 'Manrope', sans-serif;
				font-weight: 800;
				text-transform: uppercase;
				color: #fff;
				letter-spacing: 0.17em;
			}

&:hover {
				background: rgba(255, 255, 255, 0.1);

.audio-name span {
					color: var(--primary);
				}
			}
		}

div[id^="mep_"]{
			width: 550px !important;
		}

span.mejs-time-buffering {
			height: 4px;
		}

.mejs-container, .mejs-container .mejs-controls, .mejs-embed, .mejs-embed {
			background: transparent;
		}

.mejs-time-total.mejs-time-slider {	
			height: 4px;
			margin-top: 10px;
		}

.mejs-controls .mejs-time-rail .mejs-time-current {
			background-color: #F1FF4F;
			height: 4px;
		}

.mejs-controls .mejs-time-rail .mejs-time-loaded {
			height: 4px !important;
		}

.mejs-time-hovered {
			height: 4px;
		}

.mejs-time-handle-content {
			top: -7px !important;
			border-radius: 50%;
		}

.mejs-container * {
			font-family: var(--primary-font);
		}

span.mejs-currenttime, span.mejs-duration {
		    font-size: 21px;
		}

.mejs-button {
			width: 43px;
		}

.mejs-horizontal-volume-total {
			height: 4px;
			margin-top: 4px;
		}

.mejs-horizontal-volume-current {
			background-color: #F1FF4F;
		}

.mejs-button.mejs-playpause-button {
			border: 1px solid #fff;
			width: 43px;
		    height: 43px;
		    border-radius: 50%;
		    display: flex;
		    align-items: center;
		    justify-content: center;
		    flex-shrink: 0;
		    button {
		    	margin: 0;
		    }
		}
		.mejs-time.mejs-currenttime-container {
		    min-width: 60px;
		}

}

@media screen and ( max-width: 1200px ) {

.ova-audio-wrap .list-audio .item {
		flex-direction: column;
		row-gap: 15px;

.download-audio {
			margin-top: 10px;
		}
	}
}

@media screen and ( max-width: 600px ) {

.ova-audio-wrap .list-audio .item .audio-name {
		font-size: 24px;
	}
}

🔐 Sid Gifari File Manager Pro