.header-img { max-width: 70%; height: auto; } /* header { background-color: #424242; text-align: center; padding-top: 10px; box-shadow: 1px 1px 10px rgba(215, 77, 0, 0.5); } */ body { background-color: #575757; } .side-bar { grid-area: side; background-color: #424242; height: 200px; } .side-bar p { color: #E0E0E0; text-align: left; padding-left:25px; font-family: Arial; font-size: 20px; } .page-title{ font-family: segoe print; } .main-content { padding-left:5px; grid-area: main-content; text-align: left; background-color: #424242; } .main-content p { color: #E0E0E0; padding-left: 5px; text-indent: 5%; font-family: Arial; font-size: 20px; line-height: 150%; } .main-content ol { color: #609A21; text-indent: 5%; font-family: Arial; font-size: 20px; line-height: 150%; } .main-content ul { color: #E0E0E0; } .main-content del { color: rgb(215, 77, 0); } .clay { grid-area: clay; } main { padding-top: 10px; display: grid; grid-template-columns: 15% 1% 84%; grid-template-areas: "side clay main-content"; height: auto; margin-bottom: 50px; } footer { background-color: #424242; position: fixed; bottom: 0; left: 0; width:100%; height: 7%; } footer p { padding-left: 15px; padding-top: 10px; padding-bottom: 10px; color: #E0E0E0; font-family: Arial; font-size: 15px; } h1 { text-align: center; color: #609A21; font-family: Arial; font-size: 25px; } a { font-style: normal; color: #E0E0E0; font-family: Arial; font-size: 20px; text-decoration: none; transition: 0.2s linear; } a:hover { color: #D74D00; } h2 { text-align: center; color: #E0E0E0; font-family: Arial; font-size: 20px; } h3 { text-align: center; color: #E0E0E0; font-family: Arial; font-size: 20px; } .zomboid { width: 50%; } .image-content { text-align: center; } .image-content img { border-radius: 10%; } .header-nav p { visibility: hidden; width: 100%; display: grid; grid-template-columns: 25% 25% 25% 25%; grid-template-areas: "one two three four"; padding-bottom: 10px; } .header-nav a { border: 1px; border-color: #FFFFFF; background-color: #505050; margin-left: 5px; margin-right: 0px; padding-top: 3px; } .one { grid-area: one; } .two { grid-area: two; } .three { grid-area: three; } .four { grid-area: four; } .fixed { position: fixed; bottom: 1; left: 0; right: 0; top: 0; width:100%; height: 17%; background-color: #424242; text-align: center; padding-top: 10px; box-shadow: 1px 1px 10px rgba(215, 77, 0, 0.5); } .fixed nav p { visibility: visible; width: 100%; display: grid; grid-template-columns: 25% 25% 25% 25%; grid-template-areas: "one two three four"; padding-bottom: 10px; } .fixed nav a { background-color: #505050; margin-left: 5px; margin-right: 0px; padding-top: 3px; margin-bottom: 10px; } .default { background-color: #424242; text-align: center; padding-top: 10px; box-shadow: 1px 1px 10px rgba(215, 77, 0, 0.5); height: 100px; } .minecraft-vanilla { width: 50%; border-radius: 10%; } .fixed nav a:hover { color: #E0E0E0; background-color: #609A21; } .default nav a:hover { color: #E0E0E0; background-color: #609A21; } .text-link { color: #FFFFFF; } .mychat-cred { margin-left: 30px; font-size: 15px; }