examples.css

.txtlogee{
  text-align: center;
  text-transform: uppercase !important;
}

.playcax{
  text-align: center;
  margin: 15px 0px;
}

.buttonn {
  background: #444;
  border: solid #555;
  padding: 10px;
  border-radius: 0px;
  cursor: pointer;
  margin: 0.3rem;
  display: inline-block;
  text-transform: uppercase !important;
}

.buttonn:hover {
  filter: brightness(1.1);
}

.buttonn:active {
  transform: scale(0.9);
}

canvas {
  width: 100%;
  min-height: 0;
  max-height: 40vh;
}

input[type="range"] {
  width: 100%;
}

body {
  background: #111;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-height: 100vh;
  margin: 50px;
}

.example_content {
  width: 90%;
  background: #333;
  padding: 2em;
  margin: 1rem;
  /*border-radius: 1rem;*/
  box-shadow: black 0 0 15px;
  /*display: flex;*/
  flex-direction: column;
  align-items: center;
}