/* css */
@media screen and (max-width: 2800px) {
  h3 {
    font-size: 40px;
        padding: 20px;
  }
}

@media screen and (max-width: 1200px) {
  h3 {
    font-size: 35px;
        padding: 15px;
  }
}

@media screen and (max-width: 1000px) {
  h3 {
    font-size: 27px;
        padding: 10px;
  }
}

@media screen and (max-width: 800px) {
  h3 {
    font-size: 23px;
        padding: 10px;
  }
}

@media screen and (max-width: 2800px) {
  h1 {
    font-size: 50px;
  }
}

@media screen and (max-width: 1200px) {
  h1 {
    font-size: 40px;
  }
}

@media screen and (max-width: 800px) {
  h1 {
    font-size: 30px;
  }
}

.title {
font-family: Bowlby One, cursive;
font-style: normal;
font-weight: normal;
text-align: center;
z-index: 2;
}

p {
  text-align: center;
  font-size: 20px;
  font-weight: lighter;
  font-family: Yaldevi Colombo, sans-serif;
}

.arrayData {
  text-align: center;
  font-size: 20px;
  font-weight: lighter;
  font-family: Yaldevi Colombo, sans-serif;
}

 .boxBackings {
    font-family: Sunflower, sans-serif;
    background-color: rgba(196, 196, 196, 1);
    margin: 0px;
    padding: 10px;
    text-align: center;
}

.desClass {
  font-family: Sunflower, sans-serif;
  text-align: center;
}

.intro {
  text-align: center;
  font-family: Sunflower, sans-serif;
}

/* BUTTONS */
a {
  padding: 15px 25px 15px 25px;
  border: 10px;
  font-family: Bowlby One, cursive;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #000000;
  background-color: #FFE5A3;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
  letter-spacing: 8px;
}

a:hover {
  background-color: #E0C377
  color: #FFFFFF;
  text-decoration: none;
}

a:active {
  background-color: #E0C377;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
  text-decoration: none;
}

.difButton {
  padding: 20px;
  font-size: 24px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #fff;
  background-color: #9AC6BB;
  border: none;
  border-radius: 15px;
  box-shadow: 0 9px #999;
}

.difButton:hover {background-color: #6F988E}

.difButton:active {
  background-color: #6F988E;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}


@media screen and (max-width: 2800px) {
  h5 {
    font-size: 20px;
  }
}

@media screen and (max-width: 1200px) {
  h5 {
    font-size: 15px;
  }
}

@media screen and (max-width: 800px) {
  h5 {
    font-size: 12px;
  }
}