html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

table {
    border-collapse: collapse;
    border: 1px solid;
    letter-spacing: 1px;
    text-align: center;
}

td,
th {
    border: 1px solid;
    padding: 0.5px 2px;
}
thead {
    font-weight: bold;
}

.ul_grid {
    display: grid;
    grid-template-rows: repeat(10, min-content);
    grid-auto-flow: column;
}

.nav-tabs > li > .nav-link {
    border-color: darkgrey darkgrey black darkgrey;
}

.nav-tabs > li > .nav-link.active {
    border-color: black black white black;
}

/***********************************************/

.responsive-image {
    max-width: 100%;
    height: auto;
}

.start-listening {
    background-color: lawngreen;
    color: black;
}

.stop-listening {
    background-color: red;
    color: white;
}