.container { position: relative; width: 80vw; height: 90vh; margin-top: 5vh; margin-left: auto; margin-right: auto; display: grid; grid-template-columns: 1.5fr 4fr 2fr auto; grid-template-rows: 1fr 1.5em 5fr auto 1fr; grid-auto-rows: 1fr; grid-auto-flow: row; grid-template-areas: "name name pets pets" "quotes quotes quotes quotes" "cbox main main navigation" "cbox main main sitecount" "blinker blinker blinker blinker"; grid-gap: 10px; } .container>* { background-color: #222; color: white; text-shadow: 2px 2px 5px white; border: 2px black solid; overflow: scroll; box-shadow: 0px 0px 20px -5px black; } .container a { color: white; } .main { grid-area: main; } #cbox { grid-area: cbox; height: 100%; } .navigation { grid-area: navigation; padding: 5px; } .sitecount { grid-area: sitecount; } #blinkerscroll { grid-area: blinker; background-color: transparent; border: transparent; image-rendering: pixelated; box-shadow: initial; } .quotes { grid-area: quotes; background-color: black; color: white; } .name { display: inline; grid-area: name; background: linear-gradient(90deg, red, blue) !important; font-size: 5em; vertical-align: middle; } .pets { grid-area: pets; } #statuscafe, #statuscafe a { color: black; }