.ei {
  width: 100%;
}

.bu {
  width: 18%;
  height: 2.5em;
  border: none;
  background-color: #80bff5;
  color: black;
  font-size: 12px;
  font-weight: bolder;
  cursor: pointer;
  text-align: center;
  border-radius: 10px;
  margin-bottom: 5px;
}

.bu2 {
  width: 19%;
  height: 2.5em;
  border: none;
  background-color: #8080f5;
  color: #2a3132;
  font-size: 12px;
  font-weight: bolder;
  cursor: pointer;
  text-align: center;
  border-radius: 10px;
  margin-bottom: 5px;
}

.ti {
  width: 100%;
  height: 2.5em;
  border: none;
  background-color: #3858bc;
  color: #d0e0f0;
  font-size: 16px;
  font-weight: bolder;
  cursor: pointer;
  text-align: center;
  border-radius: 10px;
  margin: auto;
}

.d1 {
  text-align: center;
}

.d2 {
  text-align:center;
  color: #d0e0f0;
  background-color: #3858bc; /* 3858bc */
  border-radius: 5px;
  font-weight: bolder;
}

img {
  width: 100%;
}

textarea {
  width: 100%;
  color: #d0e0f0;
  background-color: #2a3132;
  resize: vertical;
  lines: "15";
  font-size: 12px;
  font-weight: bolder;
}

.ui3 {
  width: 100%;
  color: #d0e0f0;
  background-color: #3858bc;
  resize: vertical;
  lines: "15";
}

p {
  height: 0.5em;
  font-weight: bolder;
  color: #d0e0f0;
  font-size: 12px;
}

body {
  background-color: #2a3132;
  color: #ffffff;
}

h1 {
  color: #d0e0f0;
}

h2 {
  color: #d0e0f0;
}

h3 {
  color: #d0e0f0;
}

a {
  color: #d0e0f0;
}

input::file-selector-button {
  width: 20%;
  height: 2.5em;
  border: none;
  background-color: #ffffff;
  color: #2a3132;
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  text-align: center;
  border-radius: 6px;

}

canvas {
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    display: block;
    width: 100%;
}