@import url('https://fonts.googleapis.com/css2?family=Play&display=swap');

body, html {
  margin: 0;
  padding: 0;
  height: 100%;
  font-family: 'Play', sans-serif;
}

main {
  margin: 0;
  padding: 0;
  width: 100%;

  background: url("../../grafiken/hk_bg_purp.png");
}

.editfield {
  padding: 5px 5px;
  border-width: 2px;
  border-color: rgba(45, 45, 56, 1);
  border-style: solid;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.editfield:focus {
  outline: none;
}

.button {
  width: 80%;
  height: 50px;
  font-size: 18px;
  text-align: center;

  background: #2D2D38;
  border-style: solid;
  border-width: 2px;
  border-color: white;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  color: white;

  -webkit-transition: 250ms;
  -moz-transition: 250ms;
  -ms-transition: 250ms;
  -o-transition: 250ms;
  transition: 250ms;
}

.button:hover {
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  cursor: pointer;
}

.button:active {
  outline: none;
}

.button_invisible {
  border: none;
  background-color: transparent;
}

.button_invisible:focus {
  border: none;
  outline: none;
}

.button_blue:hover {
  border-color: #0E61A2;
  color: #0E61A2;
}
.button_green:hover {
  border-color: #17BB44;
  color: #17BB44;
}
.button_orange:hover {
  border-color: #ED8709;
  color: #ED8709;
}
.button_red:hover {
  border-color: #E62626;
  color: #E62626;
}

.error {
  color: #C10101;
}

h1, h2, h3, h4, h5 {
  margin: 10px 0 10px 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: white;
}

table {
  border-collapse: collapse;
  width: 100%;
  margin: 10px 0 10px 0;
}

td, th {
  border: 1px solid #ddd;
  padding: 8px;
  text-align: center;
}

tr:nth-child(even){
  background-color: rgba(45, 45, 56, 0.6);
}

tr:hover {
  background-color: rgba(45, 45, 56, 1);
}

th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: center;
  background-color: rgba(45, 45, 56, 1);
  color: white;
}

::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}

::-webkit-scrollbar-track {
  background: #888;
}

::-webkit-scrollbar-thumb {
  background: #555;
}

::-webkit-scrollbar-thumb:hover {
  background: #555;
}