body {
  	background: #1f1520;


  	display:flex; 
  	flex-direction: column; 
  	align-items:center; 
  	justify-content:center; 
  	height:100vh; 
  	margin:0; 
  	color: rgba(255,255,255,1);
  	font-family: monospace;
  	font-size: 1.2rem;
  	line-height: 2rem;
  	position: relative;
  }

  .heart {
  	position: absolute;
  	display:flex; 
  	flex-direction: column; 
  	align-items:center; 
  	justify-content:center; 
  	text-align: center;
  	animation: 0.9s btmCoeur linear infinite;
    animation-delay: .2s;
    overflow: hidden;
  }


  canvas {
  	image-rendering:pixelated;
  	margin-bottom: 1rem;
    
  }
  h1 {
  	font-size: 3rem;
  	margin-bottom: 3rem;
  	color: rgba(255,255,255,.2);
  	font-weight: normal;
  }

  ul {
  	list-style: none;
  }

  li:nth-child(2n) {
  	padding-left: 2rem;
  }

  a {
  	text-decoration: none;
  	color: rgba(255, 255, 255, .2);
  }
  a:hover {
  	color: #fff;
  }

  @keyframes btmCoeur {
    from { color: #e95644;}  
    35% { color: rgba(75, 63, 77, 0.3)}  
    38% { color: #e93544}  
    53% { color: rgba(75, 63, 77, 0.3)}  
    to { color: rgba(75, 63, 77, 0.3)}
}