body{
background: linear-gradient(180deg, rgba(38,38,38,1) 0%, rgba(0,0,0,1) 74%, rgba(2,0,77,1) 100%);
  background-attachment: fixed;
  /* display: flex; */
  font-family: 'Roboto', sans-serif; 
}

button {
  -webkit-tap-highlight-color: transparent;
  outline: none;
  border: none;
  color: white;
  padding: 10px 10px;
  border-radius: 8px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 6px #515050;
}

button:active {
  box-shadow: 0 3px #666;
  transform: translateY(3px);
}

.font {color: #DBDBDB;
  font: Helvetica;
}

a {color:white;
  -webkit-tap-highlight-color: transparent;
} 

.link {color: cyan;
  font: Helvetica;
}

.button {
  background-color: #DC0A0A; 
}

.button:active {
  background-color: #8D0101;
} 

.link2 {color: yellow;
  font: Helvetica;
}

.button2 {
  background-color: #C7B702; 
}

.button2:active {
  background-color: #796F02;
}

.link3 {color: #7400FF;
  font: Helvetica;
}

.button3 {
  background-color: #7400FF; 
}

.button3:active {
  background-color: #5004AA;
}

.link4 {color: #1AFF00;
  font: Helvetica;
}

.button4 {
  background-color: #16BF03; 
}

.button4:active {
  background-color: #118404;
}

.link5 {color: #FF00DC;
  font: Helvetica;
}

.button5 {
  background-color: #D501B8; 
} 

.button5:active {
  background-color: #8E027B;
}

.button6 {
  background-color: #00ADFF; 
} 

.button6:active {
  background-color: #0078B1;
}