@keyframes myfirst {
  20%  { top: 100px;}
}
.cd-container{
	z-index:1000;
  position: relative; top: -75px;
  animation: myfirst 2s;
  animation-direction: alternate;
} 
.cd-box{
  border:1.5px solid #FFF; background-color:rgba(0,0,0,0.2);
  border-radius: 12px;
  backdrop-filter: blur(10px);
  margin-left: 25%;
  margin-right: 25%;
  box-shadow: 2px 2px 65px rgba(255,255,255,0.2);
}
.cd-header{
  font-size: 13px; margin-top: 5px;
}
.cd-title{
  font-size: 24px; font-weight: bolder; padding: 0px 0px 5px 0px;
  border-right: 1px solid rgba(255,255,255,0.5); margin-top: 5px;
}
.cd-subtitle{
  font-size: 16; font-weight:800; padding-bottom: 15px;
}
.cd-line{
  border-right: 1px solid rgba(255,255,255,0.3);
}

@media screen and (max-width: 768px) {
  .cd-container{
    position: relative; top: 0px; transition: transform .7s ease;
  } 
  .cd-title{
    font-size: 20px;  padding: 0px 0px 0px 0px;
    margin-top: 5px;
  }
  .cd-subtitle{
    font-size: 12px;  padding-bottom: 10px;
  }
  .cd-box{
    margin-left: 0%;
    margin-right: 0%;
  }
}