@font-face { font-family: "PRegular"; src: url("8bitOperatorPlus8-Regular.ttf"); } @font-face { font-family: "PBold"; src: url("8bitOperatorPlus8-Bold.ttf"); /* see /license.txt */ } ::selection { background-color: beige; text-shadow: 1px 1px beige; color: black; } body { display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; position: fixed; margin: 0px; background-color: black; color: beige; text-shadow: 1px 1px black; font-family: PRegular; } a { color: beige; } a:hover { background-color: beige; color: midnightblue; } a:focus-visible { background-color: beige; color: midnightblue; outline: none; } .content { display: flex; flex-direction: column; padding: 20px 50px; margin-left: auto; margin-right: auto; width: 400px; background-color: midnightblue; border: 5px solid beige; } .address { text-align: center; margin: 0px; text-shadow: 3px 3px black; font-family: PBold; align-self: center; } .address-desc { text-align: center; text-shadow: 2px 2px black; font-size: 24px; align-self: center; } .links { width: 100%; margin: auto; margin-top: 10px; display: flex; flex-wrap: wrap; font-size: 24px; justify-content: space-between; } .links > a { margin: 10px; } @media only screen and (max-width: 768px) { .content { width: 60vw; } .address { font-size: 160%; } .address-desc { font-size: 140%; } .links { margin-top: 10px; font-size: 140%; } }