body {
  background-color: yellowgreen;
}
header{
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 999;
  background-color: lightgrey;
  box-shadow: 0px 4px 10px 6px rgba(0, 0, 0.596);
}

.image {

  margin: auto;
  overflow: hidden;
  border-radius: 0px;
  height: 400px;
  width: 500px;

}

.image_card {
  box-shadow: 0 4px 8px 0 gold;
  transition: 0.3s;
}
.image_card:hover{
  /* animation: spin; */
  animation: pulse 2s linear;

}
.image_description {
  padding: 2px 16px;
  font-size: 20px;
  font-family: cursive;
}

.images {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}



.bubble {
  position: fixed;
  left: calc(50% - 25px);
  top: calc(50% - 25px);

  width: 50px;
  height: 50px;
  border-radius: 100%;
  border: 2px solid blue;
  background-color: red;

  animation: grow 1s linear infinite;
}

@keyframes grow {
  0% {
    scale: 100%;
    opacity: 100%;
  }

  90% {
    scale: 1000%;
    opacity: 0%;
  } 
}

@keyframes pulse {
  0% {
    opacity: 100%;
  }

  50% {
    opacity: 2%;
  }
}
@keyframes spin {
  0% {
    transform: rotate(-45deg);
  }

  100% {
    transform: rotate(360deg);
  }
}