Audio Style
<section class="sec-pad-t-90 sec-pad-b-40" id="audio-video">
<div class="container">
<div class="d-flex justify-content-center align-items-center">
<div class="col-md-12 mb-4 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="heading-1">
<h2>Audio Style</h2> </div>
</div>
</div>
<div class="row justify-content-center align-items-center">
<div class="col-md-10">
<div class="audio wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<audio controls controlsList="nodownload">
<source src="../themes/news_pro/images/sample-audio.mp3" type="audio/ogg">
<source src="../themes/news_pro/images/sample-audio.mp3" type="audio/mpeg"> Your browser does not support the audio element. </audio>
</div>
</div>
</div>
</div>
</section>
Video Style 1
Technology
Lorem ipsum dolor sit amet, consectetuer adipiscing elit Aenean commodo ligula eget dolor
July 4, 2021
<section class="sec-pad-120" id="audio-video">
<div class="container">
<div class="row">
<div class="col-12">
<div class="video-style-title wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<h2>Video Style 1</h2> </div>
<div class="video-style-1"> <img src="img/video/1.jpg" alt="Vieo img">
<div class="video-1-icon">
<a href="https://www.youtube.com/watch?v=_sI_Ps7JSEk" title="Video" data-fancybox>
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z" />
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z" />
</g>
</svg>
</a>
</div>
<div class="video-content-1 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<h5>Technology</h5>
<a href="#" title="tag">
<h3>Lorem ipsum dolor sit amet, consectetuer adipiscing elit Aenean commodo ligula eget dolor</h3></a>
<div class="video-1-date">
<h4><span>July 4, 2021</span></h4> </div>
</div>
</div>
</div>
</div>
</div>
</section>
Video Style 2
Travel
Lorem ipsum dolor sit amet, consectetuer adipiscing elit Aenean commodo ligula eget dolor
July 4, 2021 Admin
<section class="sec-pad-b-120 video-2" id="audio-video">
<div class="container">
<div class="row justify-content-center align-items-center gx-0">
<div class="col-md-12 col-lg-7">
<div class="video-style-2-wapper">
<div class="video-2-title wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<h3>Travel</h3>
<a href="#" title="video">
<h2>Lorem ipsum dolor sit amet, consectetuer adipiscing elit Aenean commodo ligula eget dolor</h2></a>
<div class="video-2-date">
<h5>July 4, 2021 <span class="dot"></span> Admin</h5> </div>
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<div class=" video-style-2"> <i class="fa fa-play"></i> </div>
</a>
</div>
</div>
</div>
</div>
</div>
</section>
Video Style 3
Travel
Lorem ipsum dolor sit amet, consectetuer adipiscing
July 4, 2021
Health
Lorem ipsum dolor sit amet, consectetuer adipiscing
July 4, 2021
Sports
Lorem ipsum dolor sit amet, consectetuer adipiscing
July 4, 2021
Business
Lorem ipsum dolor sit amet, consectetuer adipiscing
July 4, 2021
<section class="sec-pad-80 video-3 bg-secondary">
<div class="container">
<div class="row justify-content-center align-items-center gx-2">
<div class="col-12 col-md-6 col-lg-3">
<div class="video-3-wapper">
<div class="video-3-img wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s"> <img src="img/video/4.jpg" alt="">
<div class="video-3-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk"> <i class="fa fa-play"></i> </a>
</div>
<div class="video-3-tag wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<h6><i><svg id="Layer_1" data-name="Layer 1"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 30"><title>tag</title><path d="M26,1H6A1,1,0,0,0,5,2V7H18a1,1,0,0,1,0,2H5V30a1,1,0,0,0,1.51.86L16,25.17l9.49,5.69A1,1,0,0,0,26,31a1,1,0,0,0,.49-.13A1,1,0,0,0,27,30V2A1,1,0,0,0,26,1Z" transform="translate(-5 -1)"/></svg></i> Travel</h6> </div>
</div>
<div class="video-details-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="video-3-title">
<a href="#" title="tag">
<h4>Lorem ipsum dolor sit amet, consectetuer adipiscing </h4></a>
<h6><i class="fas fa-calendar"></i> July 4, 2021</h6> </div>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3">
<div class="video-3-wapper">
<div class="video-3-img wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s"> <img src="img/video/3.jpg" alt="">
<div class="video-3-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk"> <i class="fa fa-play"></i> </a>
</div>
<div class="video-3-tag">
<h6><i><svg id="Layer_1" data-name="Layer 1"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 22 30"><title>tag</title><path d="M26,1H6A1,1,0,0,0,5,2V7H18a1,1,0,0,1,0,2H5V30a1,1,0,0,0,1.51.86L16,25.17l9.49,5.69A1,1,0,0,0,26,31a1,1,0,0,0,.49-.13A1,1,0,0,0,27,30V2A1,1,0,0,0,26,1Z" transform="translate(-5 -1)"/></svg></i> Health</h6> </div>
</div>
<div class="video-details-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s" ">
<div class="video-3-title ">
<a href="# " title="tag "> <h4>Lorem ipsum dolor sit amet, consectetuer adipiscing </h4></a>
<h6><i class="fas fa-calendar "></i> July 4, 2021</h6>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3 ">
<div class="video-3-wapper ">
<div class="video-3-img wow fadeInUp " data-wow-duration=".5s " data-wow-delay=".15s ">
<img src="img/video/5.png " alt=" ">
<div class="video-3-icon ">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk ">
<i class="fa fa-play "></i>
</a>
</div>
<div class="video-3-tag ">
<h6><i><svg id="Layer_1 " data-name="Layer 1 "
xmlns="http://www.w3.org/2000/svg " viewBox="0 0 22 30 "><title>tag</title><path d="M26,1H6A1,1,0,0,0,5,2V7H18a1,1,0,0,1,0,2H5V30a1,1,0,0,0,1.51.86L16,25.17l9.49,5.69A1,1,0,0,0,26,31a1,1,0,0,0,.49-.13A1,1,0,0,0,27,30V2A1,1,0,0,0,26,1Z " transform="translate(-5 -1) "/></svg></i> Sports</h6>
</div>
</div>
<div class="video-details-3 wow fadeInUp " data-wow-duration=".5s " data-wow-delay=".15s ">
<div class="video-3-title ">
<a href="# " title="tag "> <h4>Lorem ipsum dolor sit amet, consectetuer adipiscing </h4></a>
<h6><i class="fas fa-calendar "></i> July 4, 2021</h6>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 col-lg-3 ">
<div class="video-3-wapper ">
<div class="video-3-img wow fadeInUp " data-wow-duration=".5s " data-wow-delay=".15s ">
<img src="img/video/6.png " alt=" ">
<div class="video-3-icon ">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk ">
<i class="fa fa-play "></i>
</a>
</div>
<div class="video-3-tag ">
<h6><i><svg id="Layer_1 " data-name="Layer 1 "
xmlns="http://www.w3.org/2000/svg " viewBox="0 0 22 30 "><title>tag</title><path d="M26,1H6A1,1,0,0,0,5,2V7H18a1,1,0,0,1,0,2H5V30a1,1,0,0,0,1.51.86L16,25.17l9.49,5.69A1,1,0,0,0,26,31a1,1,0,0,0,.49-.13A1,1,0,0,0,27,30V2A1,1,0,0,0,26,1Z " transform="translate(-5 -1) "/></svg></i> Business</h6>
</div>
</div>
<div class="video-details-3 wow fadeInUp " data-wow-duration=".5s " data-wow-delay=".15s ">
<div class="video-3-title ">
<a href="# " title="tag "> <h4>Lorem ipsum dolor sit amet, consectetuer adipiscing </h4></a>
<h6><i class="fas fa-calendar "></i> July 4, 2021</h6>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Video Style 4
Fashion July 4, 2021
Health
Lorem ipsum dolor sit amet adipiscing
July 4, 2021
Fashion
Lorem ipsum dolor sit amet adipiscing
July 4, 2021
food
Lorem ipsum dolor sit amet adipiscing
July 4, 2021
Entertainment
Lorem ipsum dolor sit amet adipiscing
July 4, 2021
<section class="sec-pad-t-50 sec-pad-b-80 video-4 bg-secondary" id="video-4">
<div class="container">
<div class="d-flex">
<div class="video heading-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<h2>Video Style 4</h2> </div>
</div>
<div class="col-12">
<hr> </div>
<div class="row ">
<div class="col-12 col-md-12 col-lg-8">
<div class="video-4-wapper">
<div class="video-4-left-img wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s"> <img src="img/video/7.jpg" alt="">
<div class="video-4-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z"></path>
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z"></path>
</g>
</svg>
</a>
</div>
</div>
<div class="video-details-4 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="video-4-tag">
<h6> <span>Fashion</span> July 4, 2021</h6> </div>
<div class="video-4-title">
<a href="#" title="tag">
<h3>Lorem ipsum dolor sit amet, consectetuer adipiscing Aenean commodo ligula eget dolor</h3> </a>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-12 col-lg-4">
<div class="row">
<div class="col-12">
<div class="card mb-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="row g-0">
<div class="col-md-4">
<div class="video-4-right-img"> <img src="img/video/8.jpg" alt="">
<div class="video-4-right-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z"></path>
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z"></path>
</g>
</svg>
</a>
</div>
</div>
</div>
<div class="col-md-8">
<div class="card-body">
<div class="video-right-details-4">
<div class="video-4-right-tag">
<h6> <span>Health</span></h6> </div>
<div class="video-3-title-right">
<a href="#" title="tag">
<h4>Lorem ipsum dolor sit amet adipiscing </h4></a>
<h6> July 4, 2021</h6> </div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card mb-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="row g-0">
<div class="col-md-4">
<div class="video-4-right-img"> <img src="img/video/9.jpg" alt="">
<div class="video-4-right-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z"></path>
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z"></path>
</g>
</svg>
</a>
</div>
</div>
</div>
<div class="col-md-8">
<div class="card-body">
<div class="video-right-details-4">
<div class="video-4-right-tag">
<h6> <span>Fashion</span></h6> </div>
<div class="video-3-title-right">
<a href="#" title="tag">
<h4>Lorem ipsum dolor sit amet adipiscing </h4></a>
<h6> July 4, 2021</h6> </div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card mb-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="row g-0">
<div class="col-md-4">
<div class="video-4-right-img"> <img src="img/video/10.jpg" alt="">
<div class="video-4-right-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z"></path>
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z"></path>
</g>
</svg>
</a>
</div>
</div>
</div>
<div class="col-md-8">
<div class="card-body">
<div class="video-right-details-4">
<div class="video-4-right-tag">
<h6> <span>food</span></h6> </div>
<div class="video-3-title-right">
<a href="#" title="tag">
<h4>Lorem ipsum dolor sit amet adipiscing </h4></a>
<h6> July 4, 2021</h6> </div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="card mb-3 wow fadeInUp" data-wow-duration=".5s" data-wow-delay=".15s">
<div class="row g-0">
<div class="col-md-4">
<div class="video-4-right-img"> <img src="img/video/11.jpg" alt="">
<div class="video-4-right-icon">
<a data-fancybox href="https://www.youtube.com/watch?v=_sI_Ps7JSEk">
<svg version="1.1" id="Capa_1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 30.051 30.051" style="enable-background:new 0 0 30.051 30.051;" xml:space="preserve">
<g>
<path d="M19.982,14.438l-6.24-4.536c-0.229-0.166-0.533-0.191-0.784-0.062c-0.253,0.128-0.411,0.388-0.411,0.669v9.069
c0,0.284,0.158,0.543,0.411,0.671c0.107,0.054,0.224,0.081,0.342,0.081c0.154,0,0.31-0.049,0.442-0.146l6.24-4.532
c0.197-0.145,0.312-0.369,0.312-0.607C20.295,14.803,20.177,14.58,19.982,14.438z"></path>
<path d="M15.026,0.002C6.726,0.002,0,6.728,0,15.028c0,8.297,6.726,15.021,15.026,15.021c8.298,0,15.025-6.725,15.025-15.021
C30.052,6.728,23.324,0.002,15.026,0.002z M15.026,27.542c-6.912,0-12.516-5.601-12.516-12.514c0-6.91,5.604-12.518,12.516-12.518
c6.911,0,12.514,5.607,12.514,12.518C27.541,21.941,21.937,27.542,15.026,27.542z"></path>
</g>
</svg>
</a>
</div>
</div>
</div>
<div class="col-md-8">
<div class="card-body">
<div class="video-right-details-4">
<div class="video-4-right-tag">
<h6> <span>Entertainment</span></h6> </div>
<div class="video-3-title-right">
<a href="#" title="tag">
<h4>Lorem ipsum dolor sit amet adipiscing </h4></a>
<h6> July 4, 2021</h6> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>