* { padding:25; margin:25; } a { text-decoration: none; } a:link { color: red; } a:visited { color: hotpink; } a:hover { color: green; } a:active { color: blue; } mark { background-color: #900C3F; color: hotpink; } ul { list-style-position: inside; } .grid { display: grid; grid-template-columns: auto 800px auto; grid-template-rows: 25px 90px auto; grid-column-gap: 0px; grid-row-gap: 0px; } body { background-color: #e5c5d1; color: #900C3F; } .whitespace { grid-area: 1 / 1 / 2 / 4; } .blessfrey-logo { grid-area: 1 / 2 / 2 / 3; } .body-row { grid-area: 3 / 1 / 4 / 4; } .content { grid-area: 3 / 2 / 4 / 3; } .nav-row { grid-area: 2 / 1 / 3 / 4; } .nav-grid { grid-area: 2 / 2 / 3 / 3; display: flex; flex-direction:column; justify-content:flex-end; display: grid; grid-template-columns: auto repeat(4, 70px) auto; grid-template-rows: 90px; grid-column-gap: 17px; grid-row-gap: 0px; align-items: end; justify-items: center; } .nav-bar { grid-area: 1 / 1 / 2 / 7; background-image: url(../img/ele/navbar.png); height: 86px; width: 800px; } .nav-index { grid-area: 1 / 2 / 2 / 3; padding-bottom: 3px; position: relative; } .nav-game { grid-area: 1 / 3 / 2 / 4; padding-bottom: 3px; position: relative; } .nav-diary { grid-area: 1 / 4 / 2 / 5; padding-bottom: 3px; position: relative; } .nav-presskit { grid-area: 1 / 5 / 2 / 6; padding-bottom: 3px; position: relative; } .nav-link { position: absolute; top: 45%; left: 50%; transform: translate(-50%, -50%) } .nav-link a { font-size: 18px; } .nav-link a:link { color: #66C7F4; } .nav-link a:visited { color: #CB9CF2; } .nav-link a:hover { color: #F9B3D7; } .nav-link a:active { color: #f463ad; } table, th, td { border: 1px solid #330532; } th, td { padding: 5px; } .footer-content { padding-top: 5px; text-align: right; overflow: hidden; }