body {
  color: white;
  overflow: hidden !important;
}

.mymain {
  height: 90vh;
  background-color: #19172e;
}

.myFooter {
  height: 10vh !important;
  background-color: #19172e !important;
  border-color: #19172e !important;
}

#display-image {
  height: 600px;
  width: 600px;
  border: 1px solid black;
  background-position: center;
  background-size: contain;

  background-color: white;
}

.myprev {
  display: flex;
  justify-content: center;
  text-align: center;
  align-items: center;
  margin-left: 0px !important;
}

.portfolio-block {
  padding-top: 50px !important;
}

.mysilderDiv {
  display: flex;
  flex-direction: row !important;
}

.myrange {
  max-width: 30vw !important;
}

.myLabel {
  min-width: 100px;
  display: flex;
  text-align: start;
}

.input {
  width: 100%;
  margin: 0px !important;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: center;
  min-width: 400px;
}

.myDiv {
  display: flex;
  flex-direction: row-reverse;
}


@media screen and (width<700px) {
  #display-image {
    width: 300px;
    height: 300px;
  }

  .myDiv {
    display: flex;
    flex-direction: column;
  }

  .mymain {
    height: 110vh;
  }

}

input {
  color: white !important;
}

a {
  color: #0ea0ff !important;
}

.heartbeat {
  -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
  animation: heartbeat 1.5s ease-in-out infinite both;
}

@-webkit-keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}

@keyframes heartbeat {
  from {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  10% {
    -webkit-transform: scale(0.91);
    transform: scale(0.91);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  17% {
    -webkit-transform: scale(0.98);
    transform: scale(0.98);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  33% {
    -webkit-transform: scale(0.87);
    transform: scale(0.87);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  45% {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }
}