#letter {
    position: relative;
    scale: 0%;
    top: 20%;
    right: 120%;
}


.closeimg {
  -webkit-transition: all 2s ease;  
  -moz-transition: all 2s ease;  
  -o-transition: all 2s ease;  
  -ms-transition: all 2s ease;  
  transition: all 2s ease;
  transform: 0;
  scale: 0;
  -webkit-animation: closeimg 3s !important;
}

.openimg {
  -webkit-transform: translateY(5vw) translateZ(1vh) translateY(-6vw) translateZ(5vh);
  transform: translateY(5vw) translateZ(1vh) translateY(-6vw) translateZ(5vh);
  scale: 110% !important;
  -webkit-animation: openimg 5s;
}
  
@keyframes openimg {
  0%   { -webkit-transform: scale(0%, 0%); z-index: -1; }
  50% {-webkit-transform: scale(0%, 0%) translateY(-80vh); z-index: -1;}
  100% { -webkit-transform: scale(100%, 100%) translateY(-2vw) translateZ(8vh); z-index: 0; }
}

@keyframes closeimg {
  0%  { -webkit-transform: scale(100%, 100%) translateY(-2vw) translateZ(8vh); z-index: 0; }
  50% {-webkit-transform: scale(0%, 0%) translateY(-80vh) ; z-index: -1;}
  100%   { -webkit-transform: scale(0%, 0%) translateY(0vw); z-index: -1; }
}