AUDIO TITLE
<div class="audio-style-1">
<h2>AUDIO TITLE</h2>
<audio controls="" controlslist="nodownload">
<source src="../themes/custom/classic_pro/assets/mp3/bgm.ogg" type="audio/ogg">
<source src="../themes/custom/classic_pro/assets/mp3/bgm.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
VIDEO TITLE
Why Choose Us
<div class="video-style-1">
<h2>VIDEO TITLE</h2>
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-12">
<div class="why-us-content">
<h3>Why Choose Us</h3>
<div class="skill-lists">
<div class="item progress-bar-style-4 wow fadeInRight" data-wow-duration=".80s" data-wow-delay="0s" style="visibility: visible; animation-duration: 0.8s; animation-delay: 0s; animation-name: fadeInRight;">
<div class="progress-details"><h5>Graphic Design</h5><h5>90%</h5></div>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 90%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="item progress-bar-style-4 wow fadeInRight" data-wow-duration=".80s" data-wow-delay="0s" style="visibility: visible; animation-duration: 0.8s; animation-delay: 0s; animation-name: fadeInRight;">
<div class="progress-details"><h5>Digital Marketing</h5><h5>97%</h5></div>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 97%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="item progress-bar-style-4 wow fadeInRight" data-wow-duration=".80s" data-wow-delay="0s" style="visibility: visible; animation-duration: 0.8s; animation-delay: 0s; animation-name: fadeInRight;">
<div class="progress-details"><h5>Motion Graphics</h5><h5>95%</h5></div>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 95%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
<div class="item progress-bar-style-4 wow fadeInRight" data-wow-duration=".80s" data-wow-delay="0s" style="visibility: visible; animation-duration: 0.8s; animation-delay: 0s; animation-name: fadeInRight;">
<div class="progress-details"><h5>App Development</h5><h5>98%</h5></div>
<div class="progress">
<div class="progress-bar" role="progressbar" style="width: 98%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 col-md-6 col-12">
<div class="why-us-video">
<div class="play-video">
<div data-fancybox="video-gallery" data-src="https://www.youtube.com/watch?v=h1D5IFsUEFc&t=3s" title="Play">
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60">
<g id="Group_37272" data-name="Group 37272" transform="translate(-917 -1881)">
<g id="Path_37942" data-name="Path 37942" transform="translate(917.141 1881.141)" fill="#FFF">
<path d="M 29.86128997802734 59.22257995605469 C 25.89731979370117 59.22257995605469 22.05219078063965 58.44633865356445 18.43269920349121 56.91542816162109 C 14.93643951416016 55.43664169311523 11.7963695526123 53.31951141357422 9.099720001220703 50.62285995483398 C 6.403069972991943 47.92620849609375 4.285940170288086 44.78614044189453 2.807149887084961 41.28987884521484 C 1.276239991188049 37.67039108276367 0.4999999701976776 33.82526016235352 0.4999999701976776 29.86128997802734 C 0.4999999701976776 25.89731979370117 1.276239991188049 22.05219078063965 2.807149887084961 18.43269920349121 C 4.285940170288086 14.93643951416016 6.403069972991943 11.7963695526123 9.099720001220703 9.099720001220703 C 11.7963695526123 6.403069972991943 14.93643951416016 4.285940170288086 18.43269920349121 2.807149887084961 C 22.05219078063965 1.276239991188049 25.89731979370117 0.4999999701976776 29.86128997802734 0.4999999701976776 C 33.82526016235352 0.4999999701976776 37.67039108276367 1.276239991188049 41.28987884521484 2.807149887084961 C 44.78614044189453 4.285940170288086 47.92620849609375 6.403069972991943 50.62285995483398 9.099720001220703 C 53.31951141357422 11.7963695526123 55.43664169311523 14.93643951416016 56.91542816162109 18.43269920349121 C 58.44633865356445 22.05219078063965 59.22257995605469 25.89731979370117 59.22257995605469 29.86128997802734 C 59.22257995605469 33.82526016235352 58.44633865356445 37.67039108276367 56.91542816162109 41.28987884521484 C 55.43664169311523 44.78614044189453 53.31951141357422 47.92620849609375 50.62285995483398 50.62285995483398 C 47.92620849609375 53.31951141357422 44.78614044189453 55.43664169311523 41.28987884521484 56.91542816162109 C 37.67039108276367 58.44633865356445 33.82526016235352 59.22257995605469 29.86128997802734 59.22257995605469 Z" stroke="none"/>
<path d="M 29.86128997802734 1 C 25.964599609375 1 22.18500137329102 1.762950897216797 18.62747955322266 3.267650604248047 C 15.19081878662109 4.721240997314453 12.10417175292969 6.802379608154297 9.453269958496094 9.453269958496094 C 6.802379608154297 12.10417175292969 4.721240997314453 15.19081878662109 3.267650604248047 18.62747955322266 C 1.762950897216797 22.18500137329102 1 25.964599609375 1 29.86128997802734 C 1 33.75798034667969 1.762950897216797 37.53758239746094 3.267650604248047 41.09510040283203 C 4.721240997314453 44.53176116943359 6.802379608154297 47.618408203125 9.453269958496094 50.26930999755859 C 12.10417175292969 52.92020034790039 15.19081878662109 55.00133895874023 18.62747955322266 56.45492935180664 C 22.18500137329102 57.95962905883789 25.964599609375 58.72257995605469 29.86128997802734 58.72257995605469 C 33.75798034667969 58.72257995605469 37.53758239746094 57.95962905883789 41.09510040283203 56.45492935180664 C 44.53176116943359 55.00133895874023 47.618408203125 52.92020034790039 50.26930999755859 50.26930999755859 C 52.92020034790039 47.618408203125 55.00133895874023 44.53176116943359 56.45492935180664 41.09510040283203 C 57.95962905883789 37.53758239746094 58.72257995605469 33.75798034667969 58.72257995605469 29.86128997802734 C 58.72257995605469 25.964599609375 57.95962905883789 22.18500137329102 56.45492935180664 18.62747955322266 C 55.00133895874023 15.19081878662109 52.92020034790039 12.10417175292969 50.26930999755859 9.453269958496094 C 47.618408203125 6.802379608154297 44.53176116943359 4.721240997314453 41.09510040283203 3.267650604248047 C 37.53758239746094 1.762950897216797 33.75798034667969 1 29.86128997802734 1 M 29.86128997802734 0 C 46.35322952270508 0 59.72257995605469 13.36935043334961 59.72257995605469 29.86128997802734 C 59.72257995605469 46.35322952270508 46.35322952270508 59.72257995605469 29.86128997802734 59.72257995605469 C 13.36935043334961 59.72257995605469 0 46.35322952270508 0 29.86128997802734 C 0 13.36935043334961 13.36935043334961 0 29.86128997802734 0 Z" stroke="none" fill="#FFF"/>
</g>
<path data-name="Icon ionic-ios-play-circle" d="M33.375,3.375a30,30,0,1,0,30,30A30,30,0,0,0,33.375,3.375ZM45.462,33.937,25.673,45.909a.642.642,0,0,1-.966-.563V21.4a.639.639,0,0,1,.966-.563L45.462,32.812A.661.661,0,0,1,45.462,33.937Z" transform="translate(913.625 1877.625)" fill="#000"/>
</g>
</svg>
</div>
</div>
<div class="images">
<img src="../themes/custom/classic_pro/assets/img/home/home-1/image-1.jpg" alt="Image">
<div class="image-2">
<img src="../themes/custom/classic_pro/assets/img/home/home-1/image-2.jpg" alt="Image">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
VIDEO TITLE
<div class="video-style-2">
<h2>VIDEO TITLE</h2>
<div class="container">
<div class="row">
<div class="col-12 col-md-8 col-lg-6 mx-auto text-center">
<div class="item">
<img src="../themes/custom/classic_pro/assets/img/pages/about-1/rtttt.jpg" alt="Image">
<div class="play-video">
<div data-fancybox="video-gallery" data-src="https://www.youtube.com/watch?v=h1D5IFsUEFc&t=3s" title="Play">
<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 60 60">
<g id="Group_37272" data-name="Group 37272" transform="translate(-917 -1881)">
<g id="Path_37942" data-name="Path 37942" transform="translate(917.141 1881.141)" fill="#1b1c21">
<path d="M 29.86128997802734 59.22257995605469 C 25.89731979370117 59.22257995605469 22.05219078063965 58.44633865356445 18.43269920349121 56.91542816162109 C 14.93643951416016 55.43664169311523 11.7963695526123 53.31951141357422 9.099720001220703 50.62285995483398 C 6.403069972991943 47.92620849609375 4.285940170288086 44.78614044189453 2.807149887084961 41.28987884521484 C 1.276239991188049 37.67039108276367 0.4999999701976776 33.82526016235352 0.4999999701976776 29.86128997802734 C 0.4999999701976776 25.89731979370117 1.276239991188049 22.05219078063965 2.807149887084961 18.43269920349121 C 4.285940170288086 14.93643951416016 6.403069972991943 11.7963695526123 9.099720001220703 9.099720001220703 C 11.7963695526123 6.403069972991943 14.93643951416016 4.285940170288086 18.43269920349121 2.807149887084961 C 22.05219078063965 1.276239991188049 25.89731979370117 0.4999999701976776 29.86128997802734 0.4999999701976776 C 33.82526016235352 0.4999999701976776 37.67039108276367 1.276239991188049 41.28987884521484 2.807149887084961 C 44.78614044189453 4.285940170288086 47.92620849609375 6.403069972991943 50.62285995483398 9.099720001220703 C 53.31951141357422 11.7963695526123 55.43664169311523 14.93643951416016 56.91542816162109 18.43269920349121 C 58.44633865356445 22.05219078063965 59.22257995605469 25.89731979370117 59.22257995605469 29.86128997802734 C 59.22257995605469 33.82526016235352 58.44633865356445 37.67039108276367 56.91542816162109 41.28987884521484 C 55.43664169311523 44.78614044189453 53.31951141357422 47.92620849609375 50.62285995483398 50.62285995483398 C 47.92620849609375 53.31951141357422 44.78614044189453 55.43664169311523 41.28987884521484 56.91542816162109 C 37.67039108276367 58.44633865356445 33.82526016235352 59.22257995605469 29.86128997802734 59.22257995605469 Z" stroke="none"/>
<path d="M 29.86128997802734 1 C 25.964599609375 1 22.18500137329102 1.762950897216797 18.62747955322266 3.267650604248047 C 15.19081878662109 4.721240997314453 12.10417175292969 6.802379608154297 9.453269958496094 9.453269958496094 C 6.802379608154297 12.10417175292969 4.721240997314453 15.19081878662109 3.267650604248047 18.62747955322266 C 1.762950897216797 22.18500137329102 1 25.964599609375 1 29.86128997802734 C 1 33.75798034667969 1.762950897216797 37.53758239746094 3.267650604248047 41.09510040283203 C 4.721240997314453 44.53176116943359 6.802379608154297 47.618408203125 9.453269958496094 50.26930999755859 C 12.10417175292969 52.92020034790039 15.19081878662109 55.00133895874023 18.62747955322266 56.45492935180664 C 22.18500137329102 57.95962905883789 25.964599609375 58.72257995605469 29.86128997802734 58.72257995605469 C 33.75798034667969 58.72257995605469 37.53758239746094 57.95962905883789 41.09510040283203 56.45492935180664 C 44.53176116943359 55.00133895874023 47.618408203125 52.92020034790039 50.26930999755859 50.26930999755859 C 52.92020034790039 47.618408203125 55.00133895874023 44.53176116943359 56.45492935180664 41.09510040283203 C 57.95962905883789 37.53758239746094 58.72257995605469 33.75798034667969 58.72257995605469 29.86128997802734 C 58.72257995605469 25.964599609375 57.95962905883789 22.18500137329102 56.45492935180664 18.62747955322266 C 55.00133895874023 15.19081878662109 52.92020034790039 12.10417175292969 50.26930999755859 9.453269958496094 C 47.618408203125 6.802379608154297 44.53176116943359 4.721240997314453 41.09510040283203 3.267650604248047 C 37.53758239746094 1.762950897216797 33.75798034667969 1 29.86128997802734 1 M 29.86128997802734 0 C 46.35322952270508 0 59.72257995605469 13.36935043334961 59.72257995605469 29.86128997802734 C 59.72257995605469 46.35322952270508 46.35322952270508 59.72257995605469 29.86128997802734 59.72257995605469 C 13.36935043334961 59.72257995605469 0 46.35322952270508 0 29.86128997802734 C 0 13.36935043334961 13.36935043334961 0 29.86128997802734 0 Z" stroke="none" fill="#707070"/>
</g>
<path data-name="Icon ionic-ios-play-circle" d="M33.375,3.375a30,30,0,1,0,30,30A30,30,0,0,0,33.375,3.375ZM45.462,33.937,25.673,45.909a.642.642,0,0,1-.966-.563V21.4a.639.639,0,0,1,.966-.563L45.462,32.812A.661.661,0,0,1,45.462,33.937Z" transform="translate(913.625 1877.625)" fill="#fff"/>
</g>
</svg>
</div>
</div>
</div>
</div>
</div>
</div>
</div>