.buttons {

display: flex !important;
flex-direction: row !important;
flex-wrap: wrap !important;
justify-content: left !important;
align-items: center !important;

}

.btn-small {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 60px !important;
min-height: 30px !important;
border-radius: 3px !important;
padding: 5px !important;

}

.btn-large {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 100px !important;
min-height: 60px !important;
border-radius: 3px !important;
padding: 5px !important;

}

.button {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: none !important;
padding: 5px !important;
margin: 2px !important;
color: #212529;
background-color: #ffffff;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.button.s-default:hover {

background-color: #d4d4d4 !important;

}

.button.s-primary:hover {

background-color: #1aa9c9 !important;

}

.button.s-danger:hover {

background-color: #b71d25 !important;

}

.button.s-warning:hover {

background-color: #dab10d !important;

}

.button.s-success:hover {

background-color: #29b765 !important;

}

.button.s-info:hover {

background-color: #2472a4 !important;

}

.button.s-purple:hover {

background-color: #8f4bab !important;

}

.outlined-button {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #e1e1e1 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #e1e1e1 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button:hover {

background-color: #e1e1e1 !important;
color: #ffffff !important;

}

.outlined-button-white {

min-width: 80px;
max-width: 130px !important;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #ffffff !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #ffffff !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-white:hover {

background-color: #ffffff !important;
color: #21D4FD !important;

}

.outlined-button-primary {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #1dbce0 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #1dbce0 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-primary:hover {

background-color: #1dbce0 !important;
color: #ffffff !important;

}

.outlined-button-danger {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #cd2029 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #cd2029 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-danger:hover {

background-color: #cd2029 !important;
color: #ffffff !important;

}

.outlined-button-warning {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #f1c40f !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #f1c40f !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-warning:hover {

background-color: #f1c40f !important;
color: #ffffff !important;

}

.outlined-button-success {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #2ecc71 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #2ecc71 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-success:hover {

background-color: #2ecc71 !important;
color: #ffffff !important;

}

.outlined-button-info {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #2980b9 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #2980b9 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-info:hover {

background-color: #2980b9 !important;
color: #ffffff !important;

}

.outlined-button-purple {

display: flex;
align-items: center !important;
justify-content: center !important;
min-width: 80px;
min-height: 40px;
border-radius: 3px !important;
border: 1px solid #9b59b6 !important;
padding: 5px !important;
margin: 2px !important;
background-color: transparent !important;
color: #9b59b6 !important;
-webkit-transition: 0.3s ease-in-out !important;
transition: 0.3s ease-in-out !important;

}

.outlined-button-purple:hover {

background-color: #9b59b6 !important;
color: #ffffff !important;

}