:root {
     --easing: cubic-bezier(0.4, 0.28, 0.03, 1);
     --speed: 4s;
 }

 * {
     padding: 0;
     margin: 0;
 }

 body {
     min-height: 100vh;
     font-family: monospace;
     /* background-image: linear-gradient(to bottom, #3f52cd, #151c38); */
     background-color: black;
     overflow: hidden;
 }

 .main {
	 transition: color 10s ease-in-out, left 5s var(--easing), line-height 6s var(--easing), 6s letter-spacing var(--easing), font-size 5s var(--easing);
     /* transition: all var(--speed) var(--easing); */
     left: calc(50% - 150vw);
     top: calc(50% + 400vw);
     transform: translate(-50%, -50%);
     /* color: #fb5; */
     color: #5fb;
     border: 250vw solid black;
     position: absolute;
     line-height: 750vw;
     letter-spacing: 250vw;
     font-size: 500vw;
     background: black;
     position: absolute;
 }

 .mainMerge {
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     color: white;
     border: 0.75vw solid black;
     font-size: 1.25vw;
     line-height: 1.4vw;
     letter-spacing: 0vw;
 }

 .menu {
     z-index: 2;
     position: absolute;
     top:0;
     left: 0;
     width: 100%;
     background: black;
     padding: .5rem;
     font-size: 1rem;
     text-align: center;
 }

 a {
     color: white;
     text-decoration: none;
     margin-left: 3rem;
     margin-right: 3rem;
 }

 a:hover {
     text-decoration: underline;
 }