Audio Style
<section class="audio-video">
<div class="container">
<div class="audio-video-block">
<h2>Audio Title</h2>
<audio controls="">
<source src="../assets/theme/audio/welcome.mp3" type="audio/mpeg">
</audio>
</div>
</div>
</section>
Video Style 1
<section class="audio-video dt-section">
<div class="container">
<div class="audio-video-block">
<div class="video1 video-popup" style="background-image: url(../themes/custom/edu_care/assets/images/elements/video/image-21.png); background-repeat: no-repeat; background-size: cover;">
<div class="video-block">
<a class="svg-wrapper" data-fancybox href="https://youtu.be/h1D5IFsUEFc">
<svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
<path data-name="Path 40238" d="M178.6,33.6a75,75,0,1,0,75,75A75.052,75.052,0,0,0,178.6,33.6Zm0,6.818A68.182,68.182,0,1,1,110.418,108.6,68.132,68.132,0,0,1,178.6,40.42Zm-25.568,35.8v64.773L210.986,108.6Z" transform="translate(-103.6 -33.602)" fill="#1a1a1a"/>
</svg>
</a>
</div>
</div>
</div>
</div>
</section>
Video Style 2
<section class="audio-video dt-section">
<div class="container">
<div class="audio-video-block">
<div class="video2 video-popup" style="background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)) ,url(../themes/custom/edu_care/assets/images/elements/video/image-21.png); background-repeat: no-repeat; background-size: cover;">
<div class="video-block">
<a class="svg-wrapper" data-fancybox href="https://youtu.be/h1D5IFsUEFc">
<svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
<path data-name="Path 40238" d="M178.6,33.6a75,75,0,1,0,75,75A75.052,75.052,0,0,0,178.6,33.6Zm0,6.818A68.182,68.182,0,1,1,110.418,108.6,68.132,68.132,0,0,1,178.6,40.42Zm-25.568,35.8v64.773L210.986,108.6Z" transform="translate(-103.6 -33.602)" fill="#1a1a1a"/>
</svg>
</a>
</div>
</div>
</div>
</div>
</section>