/* CSS styles */
h1 {
font-family: Impact, sans-serif;
color: #CE5937;
}
body{
  margin:0;
  height:100vh;
  background:#0a0a0a;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  font-family:sans-serif;
}	  
.portal{
  width:200px;
  height:200px;
  border:3px solid #00f0ff;
  border-radius:50%;
  box-shadow:0 0 30px#00f0ff,inset 0 0 30px#00f0ff;
  position:relative;
  display:flex;
  justify-content:center;
  align-items:center;
  animation:pulse 3s infinite ease-in-out;
  
}
.shape{
  width:50px;
  height:50px;
  background:#ff0061;
  border-radius:50%;
  position:absolute;
  animation:teleport 3s  infinite ease-in-out;
  
}
@keyframespulse{
  0%,100%{transform: scale(1);opacity:0 6;}
  50% {transform:scale(1.2);opacity 1;}
}
@keyframes teleport{
  0%{transform:translateY(0)scale(1);border-radius:50%;}
  25%{transform:translateY(-150px)scale(1.2);border-radius:20%;}
  50%{transform:translateY(0)scale(1);border-radius:50%;}
  75%{transform:translateY(150px)scale(1.2);border-radius:20%;}
  100%{transform:translateY(0)scale(1);border-radius:50%;}
}