:root {
  --vgray900: var(--beam-color-gray_900);
  --vgray800: var(--beam-color-gray_800);
  --vgray600: var(--beam-color-gray_600);
  --vgray300: var(--beam-color-gray_300);
  --vgray200: var(--beam-color-gray_200);
  --vgray100: var(--beam-color-gray_100);
  --vgreen: var(--beam-color-brand_300);
  --vblue: var(--beam-color-blue_600);
  --vblue600: var(--beam-color-blue_600);
  --vteal: var(--beam-color-teal_300);
  --default_text: var(--beam-color-white);
}

body,
html {
  font-family: sans-serif;
  background-color: var(--vgray800);
  height: 100%;
}

h1 {
  font-family: uni_neuebook;
  font-size: 32px;
  line-height: 1.3em;
  color: var(--vgray400);
}

h2 {
  font-family: source_sans_pro_light, sans-serif;
  font-size: 32px;
  line-height: 1.25em;
  color: var(--vgray100);
  /* margin-top: 1em; */
  margin-bottom: .5em;
}

h3 {
  font-family: source_sans_pro_light, sans-serif;
  font-size: 28px;
  line-height: 1.25em;
  color: var(--vgray100);
  /* margin-bottom: .5em; */
}

h4 {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 20px;
  line-height: 1.2em;
  color: white;
  margin-bottom: .5em;
  margin-top: 2em;
  text-transform: uppercase;
}

h5 {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 16px;
  line-height: 1.25em;
  color: white;
  margin-bottom: 1em;
}

h6 {
  font-family: "Source Sans Pro", sans-serif;
  font-size: 13px;
  color: white
}

.password-text {
  font-family: source_sans_pro_semibold, sans-serif;
  color: #7dbe00;
  font-size: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 30px;
}

.status-text {
  color: var(--beam-color-success_400);
  font-size: 20px;
  text-transform: uppercase;
}

.input-text {
  color: #7dbe00;
  font-size: 20px;
}

.loss-tolerance-text {
  font-size: 16px;
  line-height: 2em;
  color: white;
}

.overflow-text {
  width: 15em;
  white-space: nowrap;
  overflow: hidden;
}

.black-background-status-text {
  background: black;
  font-size: 15px;
  text-transform: uppercase;
}

.warning-text {
  color: #FFB029 !important;
  font-weight: bold;
}

.critical-text {
  color: var(--beam-color-alert_300);
  font-weight: bold;
}

.neutral-text {
  color: #FFFFFF;
  font-weight: bold;
}

p.note {
  font-family: source_sans_pro_light, sans-serif;
  color: white;
  font-size: 14px;
  text-transform: uppercase;

}

/*************** GRID ******************/

.nav_container {
  display: inline-block;
  border-right-style: solid;
  border-right-color: black;
  border-right-width: 2px;
}

.background_container {
  font-family: "Source Sans Pro";
  padding: 20px;
  display: inline-block;
}

.v-bg-dark {
  background-color: var(--vgray900);
  color: var(--vgray100);
}

/*************** NAVIGATION ******************/

nav ul {
  list-style-type: none;
  padding-inline-start: 20px;
}


nav a {
  text-decoration: none;
  color: var(--default_text);
}

nav a:hover {
  color: var(--default_text);
}

nav a:visited {
  color: var(--default_text);
  font-weight: bolder;
}

button.btn-link,
a.btn-link {
  padding: 1em;
  vertical-align: middle;
  text-transform: uppercase;
  font-size: 13px;
  border-style: none;
}

body a {
  text-decoration: none;
}

nav a:hover,
button.btn-link:hover {
  font-weight: bolder;
}

button.btn-link,
a.btn-link {
  padding: 1em;
  vertical-align: middle;
  text-transform: uppercase;
  font-size: 13px;
  border-style: none;
}

/*************** TABLES ******************/

table.han-form {
  color: var(--vgray100);
  font-family: source_sans_pro_light, sans-serif;
  font-size: 16px;
  width: 100%;
}

.han-form .han-form-lbl {
  font-family: source_sans_pro_light, sans-serif;
  /* padding-right: 80px; */
  padding: 10px 0px;
  /* width: 150px; */
  width: 45%;
  max-width: 150px;
}

.han-form .han-form-val {
  font-family: source_sans_pro_semibold, sans-serif;
  padding: 10px 0px;
}

b.status_indicator {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #8dc002;
  border-radius: 50%;
  vertical-align: middle;
  box-shadow: inset -2px -2px 4px rgba(0, 0, 0, .5);
  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 220, .2) 0%, transparent 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 220, .2) 0%, transparent 100%);
  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 220, .2) 0%, transparent 100%);
  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 220, .2) 0%, transparent 100%);
}

img.inline-icon {
  display: inline-block;
  margin-left: 10px;
  vertical-align: top;
}

.form-input {
  width: 100%;
  margin: 0px 0px 10px 0px;
}

tr.flex-row {
  display: flex;
}

tr.flex-wrap {
  flex-wrap: wrap;
}

td.split-block {
  flex: 1 1 auto;
  max-width: 33%;
}