Audio & Video

Audio Style

                            
<section class="audio-video">
    <div class="container">
        <div class="audio-video-block">
            <h2>Audio Title</h2>
            <audio controls="">
                <source src="../themes/custom/creative_pro/assets/theme/audio/welcome.mp3" type="audio/mpeg">
            </audio>
        </div>
    </div>    
</section>          
                            
                        
                        

Video Style 1

We design brand, digital experience that engage the right customers

Get Quote
                                
<section class="audio-video">
    <div class="container-fliud">
        <div class="audio-video-block">
            <h2 class="container">Video Style 1</h2>
            <div class="video1" style="background-image: url(../themes/custom/creative_pro/assets/theme/img/elements/audio-video/protfolio-img04.jpg);background-position: center;background-repeat: no-repeat;background-size: cover;">
                <div class="container">
                    <div class="video-block">
                        <div class="content-wrapper">
                            <h2>We design brand, digital experience that engage the right customers</h2>
                            <a class="btn btn-primary" href="#" title="Get Quote">Get Quote 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
                                    <path data-name="Icon ionic-ios-arrow-dropright-circle" d="M3.375,53.375a50,50,0,1,0,50-50A49.992,49.992,0,0,0,3.375,53.375Zm58.774,0L42.462,33.88a4.64,4.64,0,1,1,6.562-6.562l22.933,23a4.634,4.634,0,0,1,.144,6.394L49.5,79.385a4.632,4.632,0,1,1-6.563-6.538Z" transform="translate(-3.375 -3.375)" fill="#16161b"></path>
                                </svg>
                            </a>
                        </div>
                        <a class="svg-wrapper video-popup" href="https://www.youtube.com/watch?v=h1D5IFsUEFc">
                            <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
                                <g data-name="Group 40175" transform="translate(17955.531 7322)">
                                    <path data-name="Path 39479" d="M134,14a50,50,0,1,0,50,50A50.045,50.045,0,0,0,134,14Zm0,95.789A45.789,45.789,0,1,1,179.789,64,45.822,45.822,0,0,1,134,109.789Z" transform="translate(-18039.531 -7336)" fill="#16161b"/>
                                    <path data-name="Path 39480" d="M309.449,181.39l-29.426-18.338a4.025,4.025,0,0,0-6.184,3.412v36.782a4.025,4.025,0,0,0,6.184,3.412l29.426-18.338a4.088,4.088,0,0,0,0-6.93Z" transform="translate(-18193.963 -7456.804)" fill="#16161b"/>
                                </g>
                            </svg>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>   
</section>                                            
                                
                            
                            

Video Style 2

                            
<section class="audio-video">
    <div class="container">
        <div class="audio-video-block">
            <h2>Video Title</h2>
            <a class="video2 video-popup" href="https://www.youtube.com/watch?v=h1D5IFsUEFc" style="background-image: url(../themes/custom/creative_pro/assets/theme/img/elements/audio-video/protfolio-img03.png);background-position: center;background-repeat: no-repeat;background-size: cover;">
                <div class="svg-wrapper">
                    <svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100">
                        <g data-name="Group 40175" transform="translate(17955.531 7322)">
                            <path data-name="Path 39479" d="M134,14a50,50,0,1,0,50,50A50.045,50.045,0,0,0,134,14Zm0,95.789A45.789,45.789,0,1,1,179.789,64,45.822,45.822,0,0,1,134,109.789Z" transform="translate(-18039.531 -7336)" fill="#16161b"/>
                            <path data-name="Path 39480" d="M309.449,181.39l-29.426-18.338a4.025,4.025,0,0,0-6.184,3.412v36.782a4.025,4.025,0,0,0,6.184,3.412l29.426-18.338a4.088,4.088,0,0,0,0-6.93Z" transform="translate(-18193.963 -7456.804)" fill="#16161b"/>
                        </g>
                    </svg>
                </div>
            </a>
        </div>
    </div>
</section>          
                            
                        
                        
HEADER STYLE
Sticky Menu
COLOR SKINS
COLOR SCHEMES