* {
  box-sizing: border-box;
  overflow-wrap: break-word;
}

body, html {
  margin: auto;
  height: 100%;
  background: #e0e0e6;
}

#textContainer {
  font-family: 'Work Sans', sans-serif;
  font-weight: 700;
  font-size: 5rem;
  margin: 50px;
  color: #96fde6;
}

#ringContainer {
  display: flex;
  flex-direction: row;
}

.thirdRing:hover {
  cursor: pointer;
  color: #0c08cf;
  width: 100%;
}

.firstGreeting {
  margin-left: 750px;
}

.firstGreeting:hover {
  cursor: pointer;
  color: #eb46f1;
}

.secondGreeting {
  margin-left: 250px;
}

.secondGreeting:hover {
  cursor: pointer;
  color: yellow;
}

.thirdGreeting {
  margin-left: 500px;
}

.thirdGreeting:hover {
  cursor: pointer;
  color: #0c08cf;
}

.fourthGreeting {
  margin-left: 250px;
}

.fourthGreeting:hover {
  cursor: pointer;
  color: #fd3275;
}

.finalGreeting {
  /* background: pink; */
}