@font-face { font-family: "Vegur Regular"; src: url("fonts/Vegur-Regular.otf"); } @font-face { font-family: "Vegur Light"; src: url("fonts/Vegur-Light.otf"); } html { background-color: #9200e5; background-image: url("img/iris.jpg"); background-repeat: no-repeat; background-position: center; background-size: 100%; background-attachment: fixed; font-size: 16px; @media (max-width: 1000px) { font-size: calc(12px + .4vw); } } body { text-align: center; max-width: 800px; margin: 0 auto; font-size: 1.5rem; font-family: "Vegur Regular", sans-serif; color: #ffffff; } .box { display: flex; flex: 1 1 auto; flex-direction: column; text-align: center; align-items: center; justify-content: center; height: 12rem; } h1 { font-size: 6rem; letter-spacing: -0.2rem; line-height: 5rem; } h2 { font-size: 3rem; font-family: "Vegur Light"; letter-spacing: -0.1rem; } header p { font-size: 2rem; } header p.italic { font-style: italic; } main p { line-height: 3rem; } .blink { animation: blinker 1s step-end infinite; } @keyframes blinker { 50% { opacity: 0; } }