styles.css

/*
 * Styling for RC-to-BC calculator
 */

html {
  background-color: black;
}

body {
  color: white;
  font-family: 'Roboto Condensed', sans-serif;
}

h1 {
  text-align: center;
}

fieldset {
  border: 0;
  padding: 0;
  margin: 0;
}

a:link {
  color: #4287f5;
}

.icon {
  width: 50px;
  height: 50px;
}

.amt-form {
  width: 65px;
}

.hidden {
  display: none !important;
}

.red {
  color: red;
}

.yellow {
  color: #fcf003;
}

.light-green {
  color: #99eb34;
}

.green {
  color: #34eb6e;
}

.underline {
  text-decoration: underline;
  text-decoration-thickness: 5%;
}

.item * {
  display: flex;
  align-items: center;
  margin: 5px;
}

#option-select {
  display: flex;
  flex-wrap: wrap;
}

#options-container {
  align-items: flex-start;
  height: 0%;
}

#option-boxes {
  flex-direction: column;
  align-items: flex-start;
}

#option-select > * {
  flex: 50%;
}

#option-select > fieldset {
  width: 50%;
}

#item-select > legend {
  margin: 10px;
}

#results-container {
  flex-direction: column;
}

#reference-val {
  flex-direction: column;
}

#options-container > *, #rc-amount *, #option-boxes *{
  display: flex;
  margin: 5px;
}

#results-container > *, #reference-val > * {
  margin: 5px;
}

#options-container > :nth-child(1) {
  align-items: center;
}