:root {
  --ts-primary-color: rgba(20, 2, 75, 0.992);
  --ts-secondary-color: rgb(160, 26, 221);
  --ts-dark-color: rgba(0, 0, 0);
  --ts-light-color: rgb(255, 255, 255);
}

html,
body {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
}

.content {
  flex: 1 0 auto;
  margin-top: 5rem;
}

footer {
  flex-shrink: 0;
}

.footer {
  background: var(--ts-secondary-color);
  color: var(--ts-light-color);
}

.social-icons {
  color: var(--ts-light-color);
}

#mainNav {
  background-color: var(--ts-secondary-color) !important;
}

.checkList {
  list-style-type: none;
}

/* Looking for li in checklist and then locate the icon */
.checkList > li i {
  color: var(--ts-secondary-color);
  padding-right: 0.5rem;
}

.devIcons {
  font-size: 4rem;
}

.appLogo {
  max-width: 500px;
  border-radius: 50%;
}

.fizz {
  color: rgb(230, 88, 12);
}

.buzz {
  color: var(--ts-secondary-color) !important;
}

.fizzBuzz {
  color: blue !important;
}