Button Style 1
<section class="buttons elements">
<div class="container">
<div class="buttons-block">
<h2>Button Style 1</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
</a>
<a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom">Button
</a>
<a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom">Button
</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
</a>
<a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom">Button
</a>
<a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom">Button
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block">
<a title="Button-small" href="#" class="btn btn-success btn-sm btn-custom">Button
</a>
<a title="Button-medium" href="#" class="btn btn-success btn-md btn-custom">Button
</a>
<a title="Button-large" href="#" class="btn btn-success btn-lg btn-custom">Button
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Button Style 2
<section class="buttons elements">
<div class="container">
<div class="buttons-block">
<h2>Button Style 3</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-br1">Button
</a>
<a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom btn-br1">Button
</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
</a>
<a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom btn-br1">Button
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block">
<a title="Button-small" href="#" class="btn btn-success btn-sm btn-custom btn-br1">Button
</a>
<a title="Button-medium" href="#" class="btn btn-success btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-success btn-lg btn-custom btn-br1">Button
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Button Style 3
<section class="buttons elements">
<div class="container">
<div class="buttons-block">
<h2>Button Style 2</h2>
<div class="buttons2">
<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
</a>
<a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom1">Button
</a>
<a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom1">Button
</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
</a>
<a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom1">Button
</a>
<a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom1">Button
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block1">
<a title="Button-small" href="#" class="btn btn-success btn-sm btn-custom1">Button
</a>
<a title="Button-medium" href="#" class="btn btn-success btn-md btn-custom1">Button
</a>
<a title="Button-large" href="#" class="btn btn-success btn-lg btn-custom1">Button
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Button Style 4
<section class="buttons elements">
<div class="container">
<div class="buttons-block">
<div class="buttons4">
<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
</a>
<a title="Button-medium" href="#" class="btn btn-primary btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-primary btn-lg btn-custom btn-br1">Button
</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
</a>
<a title="Button-medium" href="#" class="btn btn-dark btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-dark btn-lg btn-custom btn-br1">Button
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block">
<a title="Button-small" href="#" class="btn btn-success btn-sm btn-custom btn-br1">Button
</a>
<a title="Button-medium" href="#" class="btn btn-success btn-md btn-custom btn-br1">Button
</a>
<a title="Button-large" href="#" class="btn btn-success btn-lg btn-custom btn-br1">Button
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
Button Style 5
<section class="buttons elements dt-section">
<div class="container">
<div class="buttons-block">
<h2>Button Style 5</h2>
<div class="buttons5">
<div class="row">
<div class="col-md-4 col-sm-6">
<div class="button-block2">
<a class="read-sm primary btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-md primary btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-lg primary btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block2">
<a class="read-sm dark btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-md dark btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-lg dark btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="button-block2">
<a class="read-sm success btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-md success btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
<a class="read-lg success btn-custom2" title="Blog Details" href="#">Read More
<svg xmlns="http://www.w3.org/2000/svg" width="562" height="150" viewBox="0 0 562 150">
<path data-name="Path 40909" d="M629.706,230.08l91.556,67.552L630.685,380.08l-.979-66.555H159.262v-23.84H629.706Z" transform="translate(-159.262 -230.08)" fill="#1a1a1a" fill-rule="evenodd"/>
</svg>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</section>