.logo {
    font-family: 'Mountains of Christmas', cursive;
    font-size: 25px;
  }
.logo_sm {
    font-family: 'Mountains of Christmas', cursive;
    font-size: 16px;
  }

.message {
  font-family: 'Space Mono', monospace;
}

.roboto {
  font-family: 'Roboto Slab', serif;
}

.roboto-lg {
  font-family: 'Roboto Slab', serif;
  font-size: 20px;
}

.doris {
  font-family: 'Dosis', sans-serif;
  font-size: 18px;
}

  .dot {
    height: 40px;
    width: 40px;
    background-color: rgb(168, 196, 231);
    border-radius: 50%;
    border: 2px solid rgb(81, 184, 40);
    display: inline-block;
    text-align: center;
    font-size: 20px;
    color: rgb(121, 112, 112);

  }

  .dot:hover {
    border: 2px solid rgb(255, 166, 166);
  }

  .dot2 {
    height: 40px;
    width: 40px;
    background-color: rgb(221, 160, 132);
    border-radius: 50%;
    border: 2px solid rgb(167, 163, 163);
    display: inline-block;
    text-align: center;
    font-size: 20px;
    color: rgb(121, 112, 112);

  }

  .dot2:hover {
    border: 2px solid rgb(81, 184, 40);
    background-color: rgb(214, 214, 214);

  }


  .dot3 {
    height: 25px;
    width: 25px;
    background-color: rgb(235, 176, 176);
    border-radius: 50%;
    border: 2px solid rgb(245, 164, 88);
    display: inline-block;
    text-align: center;
    font-size: 13px;
    color: rgb(121, 112, 112);

  }

  .dot3:hover {
    border: 2px solid rgb(81, 184, 40);
  }

  .full {
    border: 2px solid rgb(140, 212, 179);
  }

  .signUp {
    background-color: rgb(176, 236, 179);
  }

  a.home {
    color: rgb(90, 161, 241);
  }

  a.home:hover {
    color: rgb(223, 142, 105);
  }

  div.card.bg-light.text-dark.table_shadow {
    -webkit-box-shadow: -7px 9px 9px -2px rgba(0,0,0,0.54);
    -moz-box-shadow: -7px 9px 9px -2px rgba(0,0,0,0.54);
    box-shadow: -7px 9px 9px -2px rgba(0,0,0,0.54);
  }

  #panel {
    display: none;
  }

  #test {
    color: rgb(55, 0, 255);
  }

.requiredField {
    color:hsl(14, 100%, 68%);
}

.center {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }

.person {
    background-color: rgba(145, 91, 91, 0.911);
}

.image {
  width: 100%;
  display: block;
}

div.polaroid {
  background-color: rgba(230, 230, 230, 0.842);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  margin:25px;
  border-radius: 5px;
}

.middle {
  text-align: center;
  padding: 10px 10px;
}

.card_bg {
    background-color: rgba(141, 133, 121, 0.973);
}

.flex-container {
    display: flex;
  }
 
.flex-container > div {
    margin: 5px;
    padding: 5px;
  }