:root {
  --mod-height: 36px;
}

html {
  /* im not gonna write a preprocessor for the css so i'm refrencing an element here */
  background: #333 var(--trame); 
  background-size: 4px;
  background-repeat: repeat;
}

.mod {
  display: flex;
  padding: 1px;
  box-sizing: content-box;
  height: var(--mod-height)
}

.mod .info {
  border-right: 1px solid #666;
  flex: 1;
  align-self: center;
  margin: 2px 0 2px 5px;
}

.info h4 {
  font-size: 16px;
  margin: 0
}

.mod .button {
  width: var(--mod-height);
  height: var(--mod-height);
  box-sizing: content-box;
  background-image: var(--xash3d-play);
  background-size: 20px 20px;
  background-repeat: no-repeat;
  background-position: center;
}

.button:before {
  content: " ";
  float: left;
  padding-top: 100%;
}

.mod .button:active {
  opacity: .6;
}

.version-info {
  color: #555;
  text-align: center;
  height: 16px;
}