body {
  margin: 0;
  background: #020202;
  cursor: crosshair;
  overflow-x: hidden;
}

*{
  box-sizing: border-box;
  padding: 0;
}

h1 {
/*   position: absolute;
  top: 20%;
  left: 50%; */
/*   transform: translate(-50%, -50%); */
  color: #fff;
  font-family: "Source Sans Pro";
  font-size: 3em;
  font-weight: 900;
  -webkit-user-select: none;
  user-select: none;
}

.main-container{
  position: absolute;
  width:100%;
  display: flex;
  justify-content: center;
  align-items:center;
  background: transparent;
  color:white;
  padding: 20px;
}

canvas {
  display: block;
}

.glassmorphism-effect {
    background: rgba( 255, 255, 255, 0.10 );
    box-shadow: 08px32px0rgba( 31, 38, 135, 0.37 );
    -webkit-backdrop-filter: blur( 4px );
            backdrop-filter: blur( 4px );
    border-radius: 16px;
    border: 1px solid rgba( 255, 255, 255, 0.18 );
}

.birthday-card {
  max-width: 600px;
  padding: 20px
/*   height: 80%; */
}

.birthday-card > div:first-child {
  display:flex;
  justify-content: center;
  align-items: center;
}

.birthday-card >div:first-child img {
  width: 400px;
  height:400px;
  border-radius:50%;
}