@font-face {
  font-family: "Raleway";
  src: url('Raleway-Regular.ttf');
}

* {
  --black: #3b2c2c;
  --white: #d8d8d8;
  --background: #e0be36;
  --blue-text: #6cbeed;
  --green-accent: #38686a;
  --red-accent: #d16666;
  --light-red: #e2b1b1;
}

body {
  background-color: var(--white);
  color: var(--black);
  font-family: Raleway;
}

.name-title {
  color: var(--blue-text);
}

.intro {
  width: calc(100% - 32px);
  padding-left: 16px;
  padding-right: 16px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
}

.welcome {
  flex: 1;
}

.properties {
  flex: 3;
  margin-right: 24px;
  min-width: 600px;
}

.header {
  color: var(--blue-text);
}

.token.template-var {
  color: var(--red-accent);
}