/* Color Code and vars*/
body {
  background: rgba(197, 219, 225, 1);
  margin: 0;
}
:root {
  /* Slate */
  --crazy-light-slate: #f9fbfb;
  --extra-light-slate: #dff4fa;
  --light-slate: #c5dbe1;
  --slate: #96b2ba;

  /* Blue */
  --super-light-blue: #f1fbfc;
  --extra-light-blue: #b1e9fd;
  --light-blue: #62dbff;
  --blue: #00c5ff;
  --extra-dark-blue: #2c6678;

  --bright-light-blue: #e5fdff;

  /* Green */
  --super-light-green: #d3fae0;
  --extra-light-green: #b5f4cb;
  --light-green: #6af6a3;
  --green: #00e85f;
  --dark-green: #54db8b;
  --extra-dark-green: #02a344;
  /* Orange */
  --super-light-orange: #fde5d1;
  --extra-light-orange: #ffd4b4;
  --light-orange: #ffb371;
  --orange: #ff9f4a;
  --extra-dark-orange: #d86804;
  /* Red */
  --super-light-red: #fbdbda;
  --extra-light-red: #fdb5b3;
  --light-red: #ff9090;
  --red: #fe7474;
  --extra-dark-red: #b82222;
  /* Misc */
  --toggle-transition-time: 0.5s;
  --av-medium: "AvenirNextProMedium";
  --av-demi: "AvenirNextProDemi";
  --av-bold: "AvenirNextProBold";

  --easing: cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.weight-600 {
  font-weight: 600;
}
.weight-700 {
  font-weight: 700;
}
.display-none {
  display: none;
}
.display-block {
  display: block;
}
.display-block-important {
  display: block !important;
}
.visible {
  visibility: visible;
}
.invisible {
  visibility: hidden;
}
.av-medium {
  font-family: var(--av-medium);
}
.av-bold {
  font-family: var(--av-bold);
}
.av-demi {
  font-family: var(--av-demi);
}
.extraDarkBlue {
  color: var(--extra-dark-blue);
}
.lightSlate {
  color: var(--light-slate);
}
.slate {
  color: var(--slate);
}
.extraLightGreen {
  background-color: var(--extra-light-green);
}
.superLightOrange {
  background-color: var(--super-light-orange);
}
.extraLightRed {
  background-color: var(--extra-light-red);
}
.extraLightBlue {
  background-color: var(--extra-light-blue);
}
.extraLightSlate {
  background-color: var(--extra-light-slate);
}
.crazyLightSlate {
  background-color: var(--crazy-light-slate);
}
.brightLightBlue {
  background-color: var(--crazy-light-slate);
}
.text-center {
  text-align: center;
}

.text-lightGreen {
  color: var(--light-green);
}
.text-green {
  color: var(--green);
}
.text-red {
  color: var(--red);
}
.text-light-blue {
  color: var(--light-blue);
}
.text-extra-light-blue {
  color: var(--extra-light-blue);
}
.background-green {
  background: var(--green);
}
.background-lightGreen {
  background: var(--light-green);
}
.background-lightSlate {
  background: #c5dbe1;
}
.background-red {
  background: var(--red);
}
.background-lightBlue {
  background: var(--light-blue);
}
.background-extraLightBlue {
  background: var(--extra-light-blue);
}
/* .text-sm {
    
    font-size: 1rem;
  }
  .text-md {
    
    font-size: 1.5rem;
  }
  .text-lg {
    
    font-size: 2rem;
  }
  .text-xl {
    font-size: 3rem;

  } */
input::placeholder {
  color: var(--light-slate);
  opacity: 1;
}

.fullWidth {
  width: 100%;
}

.container {
  display: flex;
  width: 100%;
}
.column {
  display: flex;
  margin-left: 16px;
  margin-right: 16px;
  flex: 1;
  flex-direction: column;
}
.flex-2 {
  flex: 2;
}

.col-1 {
  width: calc();
}

.justify-center {
  justify-content: center;
}

.shadow-responsify {
  box-shadow: 0px 5px 10px 5px rgba(154, 206, 222, 0.27);
}