* {
  margin: 0;
  box-sizing: border-box;
}
body {
  font-family: monospace;
  font-size: 2em;
  padding-top: 1em;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  background: rgba(255, 0, 0, 0.279);
}
body div#allbtn {
  margin-top: 30px;
  margin-bottom: 5%;
}
.custom-btn {
  width: 130px;
  height: 40px;
  color: #fff;
  border-radius: 5px;
  padding: 10px 25px;
  font-family: "Lato", sans-serif;
  font-weight: 500;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  display: inline-block;
  box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5),
    7px 7px 20px 0px rgba(0, 0, 0, 0.1), 4px 4px 5px 0px rgba(0, 0, 0, 0.1);
  outline: none;
}
/* 5 */
.btn {
  width: 130px;
  height: 40px;
  line-height: 42px;
  padding: 0;
  border: none;
  background: rgb(255, 0, 0);
  background: linear-gradient(0deg, rgb(255, 0, 0) 0%, rgb(251, 2, 2) 100%);
}
.btn:hover {
  color: #f00909;
  background: transparent;
  box-shadow: none;
}
.btn:before,
.btn:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  height: 2px;
  width: 0;
  background: #f50505;
  box-shadow: -1px -1px 5px 0px #fff, 7px 7px 20px 0px #0003, 4px 4px 5px 0px #0002;
  transition: 1s ease all;
}
.btn:after {
  right: inherit;
  top: inherit;
  left: 0;
  bottom: 0;
}
.btn:hover:before,
.btn:hover:after {
  width: 100%;
  transition: 800ms ease all;
}
/* 15 */
.btn-15 {
  background: #881243;
  border: none;
  z-index: 1;
}
.btn-15:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #ff3d3d;
  border-radius: 5px;
  box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5),
    7px 7px 20px 0px rgba(0, 0, 0, 0.1), 4px 4px 5px 0px rgba(0, 0, 0, 0.1);
  transition: all 0.7s ease;
}
.btn-15:hover {
  color: #fff;
}
.btn-15:hover:after {
  left: 0;
  width: 100%;
}
.btn-15:active {
  top: 2px;
}

/* 16 */
.btn-16 {
  border: none;
  color: #000000;
  background-color: rgb(218, 218, 218);
}
.btn-16:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  left: 0;
  direction: rtl;
  z-index: -1;
  border-radius: 5px;
  box-shadow: -7px -7px 20px 0px #fff9, -4px -4px 7px 0px #fff9, 7px 7px 20px 0px #0002,
    4px 4px 5px 0px #0001;
  transition: all 0.3s ease;
}
.btn-16:hover {
  color: #000;
}
.btn-16:hover:after {
  left: auto;
  right: 0;
  width: 100%;
}
.btn-16:active {
  top: 2px;
}

.MDJAminDiv {
  z-index: 4444;
  position: fixed;
  bottom: 5%;
  left: 2%;
}

.MDJAmin {
  text-decoration: none;
  /* border-bottom: 1px dashed rgb(204, 204, 204); */
  /* border-top: 1px dashed rgb(204, 204, 204); */
  border-bottom: 1px dashed rgb(44, 44, 44);
  border-top: 1px dashed rgb(44, 44, 44);
  padding: 4px 0;
  color: rgba(44, 44, 44, 0.525);
  /* color: rgba(204, 204, 204, 0.414); */
  font-family: monospace;
  font-style: italic;
  font-size: 0.7em;
  transition: all 0.5s;
}

.MDJAmin:hover {
  color: #000000;
  /* color: white; */
}