body {
  background: linear-gradient(145deg, #1c1c1c, #333);
}

.button {
  border: none;
  color: white;
  padding: 16px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
}

.button1 {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.button1:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.button1 {width: 100%;}

.button2 {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.button2:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.button2 {width: 100%;}

.button3 {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.button3:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.button3 {width: 100%;}

.button4 {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.button4:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.button4 {width: 100%;}

.button5 {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.button5:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.button5 {width: 100%;}

.footer {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    color: white;
    text-align: center;
}

.button0 {
    background-color: black;
    color: white;
    border-radius: 25px;
    padding: 20px;
    float: left;
}
.buttonp {
    background-color: black;
    color: white;
    border-radius: 25px;
    padding: 20px;
    float: right;
}




.button6{
  background: linear-gradient(145deg,#333,#1c1c1c);
  color: #00ffff;
  border: 2px solid #00ffff;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
  position: fixed;
  right: 0;
  bottom: 55;
  width: 5%;
  height: 58px;
  text-align: center;
}

#textbox1{
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
  border: 2px solid #00ffff;
  border-radius: 5px;
  cursor: text;
  position: fixed;
  left: 0;
  bottom: 60;
  width: 95%;
  height: 58px;
}

.ouput{
  width: 100%;
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
  border: 2px solid #00ffff;
  border-radius: 5px;
  cursor: text;
}
.buttonfor {
  background: linear-gradient(145deg, #1c1c1c, #333);
  color: #00ffff;
  padding: 1rem 1.2rem;
  font-size: 1.1rem;
  border: 2px solid #00ffff;
  border-radius: 20px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 6px 16px rgba(0, 255, 255, 0.2);
}

.buttonfor:hover {
  background: #2ec5c5;
  color: rgb(0, 0, 0);
}

.buttonfor {width: 100%;}