body {
  font-family: funnel display, roboto, arial;
  background-image: url("/assets/img/pink-bg-1.webp");
  background-repeat: no-repeat;
  background-size: cover;
  color: #4e56c0;
  height: 100%;
}

.wrapper {
  display: flex;
  flex-direction: column;
  height: 100vh;
}

main {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  flex: 1;
  
}

.main {
  display: flex;
  justify-content: space-evenly;
  flex-direction: column;
  align-items: center;
  height: 100%;
}




.affirmation-sentence {
  font-family: pacifico, funnel display, roboto, arial;
  font-size: 32px;
  text-align: center;
  text-decoration: underline;
  font-weight: bold;
  margin: 0;
  flex-grow: 0.3;
  padding: 8px;
  
}

.words-of-affirmation-btn {
  font-size: 12px;
  padding: 12px;
  border: 5px solid #4e56c0;
  border-radius: 10px;
  background-color: #9b5de0;
  color:  #fdcffa;
  font-weight: bold;
}

.words-of-affirmation-btn:hover {
  background-color: #b27dee77;
  color: #786079;
  border: 5px solid #4e56c077;
  cursor: pointer;
}

.words-of-affirmation-btn:active {
  border: 5px solid #ffbb00;
  font-size: 11px;
}

 @media (max-width: 600px) {

  .affirmation-sentence {
    font-size: 36px;
  }

  .words-of-affirmation-btn {
    font-size: 18px;
  }

  .words-of-affirmation-btn:hover {
    border: 5px solid #4e56c0;
    background-color: #9b5de0;
    color:  #fdcffa;
  }

  .words-of-affirmation-btn:active {
  border: 5px solid #ffbb00;
  font-size: 17px;
  }

 }