<template>
   <v-card class="mb-2 one-fo-tab">
      <v-layout justify-center >
      <div class="btn-group">
     <button class="button active">Button</button>
     <button class="button">Button</button>
     <button class="button">Button</button>
     <button class="button">Button</button>
     </div>
      </v-layout>
   </v-card>

</template>

<style scoped>
.btn-group .button {

 border: none;
 color: black;
 padding: 29px 51px;
 text-align: center;
 text-decoration: none;
 display: inline-block;
 font-size: 16px;
 cursor: pointer;
 float: left;
}

.btn-group .button:hover {
 background-color: #E0F7FA;
border-bottom: 5px solid red;

}

.btn-group .button.active {
  border-bottom: 5px solid red;
}


</style>

<script>
module.exports = {

}
</script>
