﻿:root {
  --ButtonBaseTopColor: #707070ff;
  --ButtonBaseBottomColor: #484848ff;
  --ButtonHoverTopColor: #a888c8ff;
  --ButtonHoverBottomColor: #684888ff;
  --ButtonPushTopColor: #e0e0e0ff;
  --ButtonPushBottomColor: #b8b8b8ff;
  --ButtonLockTopColor: #686868ff;
  --ButtonLockBottomColor: #404040ff;
  --ButtonTransparentTopColor: #8060a000;
  --ButtonTransparentBottomColor: #58387800;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  background: #f0f0f0;
  font-family: sans-serif;
  font-size: 16px;
}

.vm_button {
  background: linear-gradient(var(--ButtonBaseTopColor), var(--ButtonBaseBottomColor));
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  color: white;
  padding: 8px 16px;
  margin: 2px 0;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  width: fit-content;
  transition: all 0.1s ease;
  user-select: none;
  font-size: 1rem;
}

.vm_button:hover {
  background: linear-gradient(var(--ButtonHoverTopColor), var(--ButtonHoverBottomColor));
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.vm_button:active {
  background: linear-gradient(var(--ButtonPushTopColor), var(--ButtonPushBottomColor));
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}

.top-level-container {
  width: 960px;
  margin: 0 auto;
}

.shadow-box {
  width: 960px;
  margin: 0 auto;
  box-shadow: 0 0 8px 0 black;
  background: white;
}
