Buttons

Buttons Style 1

                            
<section class="buttons">
    <div class="container">
        <div class="buttons-block">
            <h2>Buttons Title</h2>
            <div class="buttons1">
                <div class="row">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom">Button 
                                <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>
                    </div>
                </div>
            </div>
        </div>
    </div>    
</section>         
                            
                        
                        

Buttons Style 2

                            
<section class="buttons">
    <div class="container">
        <div class="buttons-block">
            <h2>Buttons Title</h2>
            <div class="buttons2">
                <div class="row">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom btn-br1">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom btn-br1">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom btn-br1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom btn-br1">Button 
                                <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>
                    </div>
                </div>
            </div>
        </div>
    </div>    
</section>      
                            
                        
                        

Buttons Style 3

                            
<section class="buttons">
    <div class="container">
        <div class="buttons-block">
            <h2>Buttons Title</h2>
            <div class="buttons3">
                <div class="row">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom btn-br2">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom btn-br2">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom btn-br2">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom btn-br2">Button 
                                <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>
                    </div>
                </div>
            </div>
        </div>
    </div>    
</section>
                            
                        
                        

Buttons Style 4

                            
<section class="buttons">
    <div class="container">
        <div class="buttons-block">
            <h2>Buttons Title</h2>
            <div class="buttons4">
                <div class="row">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-primary btn-sm btn-custom1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom1">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-secondary btn-sm btn-custom1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-secondary btn-md btn-custom1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-secondary btn-lg btn-custom1">Button 
                                <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>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block1">
                            <a title="Button-small" href="#" class="btn btn-dark btn-sm btn-custom1">Button 
                                <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>
                            <a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom1">Button 
                                <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>
                            <a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom1">Button 
                                <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>
                    </div>
                </div>
            </div>
        </div>
    </div>    
</section>
                            
                        
                        

Buttons Style 5

                            
<section class="buttons">
    <div class="container">
        <div class="buttons-block">
            <h2>Buttons Title</h2>
            <div class="buttons5">
                <div class="row">
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read primary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read primary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read primary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read secondary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read secondary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read secondary btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                        </div>
                    </div>
                    <div class="col-md-4 col-sm-6">
                        <div class="button-block2">
                            <a class="read dark btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read dark btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                            <a class="read dark btn-custom2" title="Blog Details" href="#">Read More 
                                <svg xmlns="http://www.w3.org/2000/svg" width="100" height="66" viewBox="0 0 100 66">
                                    <path data-name="Icon ionic-ios-arrow-round-forward" d="M63.772,1.264a4.458,4.458,0,0,0-.035,6.325L84.856,28.521H4.481a4.468,4.468,0,1,0,0,8.937h80.34L63.7,58.391a4.484,4.484,0,0,0,6.391,6.29L98.715,36.152h0a5.014,5.014,0,0,0,.938-1.409A4.226,4.226,0,0,0,100,33.024,4.456,4.456,0,0,0,98.715,29.9L70.094,1.367A4.457,4.457,0,0,0,63.772,1.264Z" fill="#16161b"></path>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>    
</section> 
                            
                        
                        
HEADER STYLE
Sticky Menu
COLOR SKINS
COLOR SCHEMES