.footer { /* position: fixed; */ /* left: 0; bottom: 0; */ width: 100%; text-align: center; background-color: white; /* height: 10%; */ } .header { margin-bottom: 10px; margin-top: 0px; /* position: fixed; */ /* left: 0; top: 0; */ height: 10%; background-color: white; } .main { margin-top: 60px; margin-bottom: 60px; overflow-x: auto; overflow-y: hidden; height: 80%; } .centered { /* position: absolute; */ /* top: 100; bottom: 100;*/ left: 0; right: 0; height: 70%; margin: auto; } .row:after { content: ""; display: table; clear: both; } /* html, body { min-height: 80%; } body { height: 85vh; } */ .column { float: left; width: 25%; padding: 0px; /* Should be removed. Only for demonstration */ } * { box-sizing: border-box; } a:link { color: black; background-color: transparent; text-decoration: none; } a:visited { color: black; background-color: transparent; text-decoration: none; } a:hover { color: black; background-color: transparent; text-decoration: underline; } a:active { color: grey; background-color: transparent; /* text-decoration: underline; */ } /* @media Stuff */ @media only screen and (max-width: 740px) { h2 { font-family: 'ApfelGrotezk_regular'; font-size: 20px; color: black; padding-left: 1em; padding-right: 1em; } h3 { font-family: 'ApfelGrotezk_regular'; font-size: 35px; color: black; padding-left: 1em; padding-right: 1em; } h1 { font-family: 'ApfelGrotezk_fett'; font-size: 40px; color: black; } } @media only screen and (max-width: 465px) { h2 { font-family: 'ApfelGrotezk_regular'; font-size: 15px; color: black; padding-left: 1em; padding-right: 1em; } h3 { font-family: 'ApfelGrotezk_regular'; font-size: 30px; color: black; padding-left: 1em; padding-right: 1em; } h1 { font-family: 'ApfelGrotezk_fett'; font-size: 30px; color: black; } }