.preset-button {
    /* margin-top: 0.8rem; */
    /* margin-bottom: 0.8rem; */
    margin: 0px!important;
    height: 25px;
    width: 25px;
	padding: 0px;
}
.connect-button {
    margin-right: 30px;
}
.round-preset-button {
    padding: 5px;
    line-height: 20px;
    border-radius: 50%;
}
.hex {
  aspect-ratio: 1/cos(30deg);
  clip-path: polygon(50% -50%,100% 50%,50% 150%,0 50%);
}
.loop-button {
    /*margin: 3px;*/
	margin-right: 0px!important;
    margin-left: 1px!important;
	margin-bottom: 15px!important;
	padding: 5px;
    line-height: 20px;
	height: 50px;
    width: 50px;
}
.vol-button {
    /*margin: 3px;*/
	margin-right: 0px!important;
    margin-left: 1px!important;
	margin-bottom: 15px!important;
	padding: 5px;
    line-height: 20px;
	height: 50px;
    width: 50px;
	display: block; /* Make the buttons appear below each other */
}
.setting-button {
    /* margin-top: 0.8rem; */
    /* margin-bottom: 0.8rem; */
	padding: 1px;
    margin: 7px!important;
    height: 50px;
    width: 50px;
}
.phase-button {
    /* margin-top: 0.8rem; */
    /* margin-bottom: 0.8rem; */
	padding: 1px;
    margin: 7px!important;
    height: 50px;
    width: 70px;
}
th, td {
    white-space: nowrap;
}

.first-col {
    position: absolute;
    width: 5em;
    margin-left: -5em;
}

.table-wrapper {
    overflow-x: scroll;
    width: 600px;
    margin: 0 auto;
}
.preset-name {
	padding: 0px;
	border: 0px;
}
.clicknav {
	 cursor: pointer;
}
.banktitle {
	margin-bottom: 5px!important;
	margin-top: 5px!important;
}
.input-grey {
    background-color: rgb(255 255 255 / 50%);
    border: 0;
}

.input-stomp {
    background-color: rgb(255 255 102);
    border: 0;
}

.bankbox {
	width: 50px;
    height: 40px;
    padding: 5px;
}