@font-face { font-family: 'Consolas'; src: url("/fonts/consolas.eot"); src: url("/fonts/consolas.eot?#iefix") format("embedded-opentype"), url("/fonts/consolas.otf") format("opentype"), url("/fonts/consolas.svg") format("svg"), url("/fonts/consolas.ttf") format("truetype"), url("/fonts/consolas.woff") format("woff"), url("/fonts/consolas.woff2") format("woff2"); } @font-face { font-family: 'Segoe MDL2 Assets'; src: url("/fonts/segoeMLD2assets.eot"); src: url("/fonts/segoeMLD2assets.eot?#iefix") format("embedded-opentype"), url("/fonts/segoeMLD2assets.otf") format("opentype"), url("/fonts/segoeMLD2assets.svg") format("svg"), url("/fonts/segoeMLD2assets.ttf") format("truetype"), url("/fonts/segoeMLD2assets.woff") format("woff"), url("/fonts/segoeMLD2assets.woff2") format("woff2"); } /*Header styles*/ .navbar { display: grid; grid-template-columns: auto 1fr auto auto; grid-column-gap: 10px; grid-template-rows: auto auto; background-color: #343434; position: sticky; z-index: 10; padding: 10px; font-size: 26px; } .navbar a { text-decoration: none; color: white; } .navbar a:hover { color: gray; } .main-menu { margin: 0px; } .main-menu li { display: inline-block; font-size: 20px; margin-right: 20px; } .language-switch { grid-column: 3; display: none; user-select: none } .menu-toggle { grid-column: 4; display: none; cursor: pointer; user-select: none; } #compact-menu { grid-row: 2; list-style: none; } #compact-menu li { font-size: 20px; margin-top: 10px; } /*Footer styles*/ footer { padding: 10px; display: grid; align-items: center; grid-template-columns: 1fr auto auto auto; grid-column-gap: 10px; } footer a { text-decoration: none; color: black; } footer a:hover { color: orangered; } /*Body styles*/ body { margin: 0px; font-family: Consolas, 'Segoe MDL2 Assets'; } main { min-height: calc(100vh - 115px); /*Page height minus footer requred space*/ } header a { text-decoration: none; color: black; } header a:hover { text-decoration: underline; } article, header { margin: 0px 50px; } article a:visited, article a:link { color: blue; } .comment, .comment:visited { color: #57a64a; } /*Adaptive code*/ @media only screen and (max-width: 1000px) { .main-menu { display: none; } .menu-toggle { display: initial; } }