html { height: 100%; } body { min-height: 100%; background-color: #444444; } .page-title { text-align: center; font-family: concertone, cursive; color: #eeeeee; padding-top: 65px; padding-bottom: 10px; width: 95%; overflow: hidden; margin: auto; margin-bottom: 20px; } .error-title { font-family: silkscreenregular, 'Courier New', Courier, monospace; } .title-image img { max-width: 30%; padding-top: 30px; padding-bottom: 30px; margin-left: 35%; margin-right: 35%; } .page-main-content { text-align: center; font-family: sans-serif; color: #f0f0f0f0; width: 95%; overflow: hidden; margin: auto; } .page-main-content h2 { padding-top: 45px; } .social-links img { max-width: 58px; padding: 10px; } a.download-link { text-decoration: none; color: #242121; background-color: #d1caca; padding: 10px; border-radius: 10px; text-align: center; margin: 7px; } footer { background-color: rgb(61, 61, 61); color: #eeeeee; font-family: monospace; text-align: center; width: 100%; position: fixed; bottom: 0; left: 0; } /* The sidebar menu */ .sidebar { height: 100%; width: 0; /* Hidden by default */ position: fixed; z-index: 1; top: 0; right: 0; background-color: #111; overflow-x: hidden; /* Disable horizontal scroll */ padding-top: 60px; /* Place content 60px from the top */ transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */ } /* The sidebar links */ .sidebar a { padding: 8px 8px 8px 32px; font-family: concertone, Arial, Helvetica, sans-serif; text-decoration: none; text-align: right; font-size: 25px; color: #818181; display: block; transition: 0.3s; } /* When you mouse over the navigation links, change their color */ .sidebar a:hover { color: #f1f1f1; } /* Position and style the close button (top right corner) */ .sidebar .close { position: absolute; top: 0; right: 25px; font-size: 36px; margin-left: 50px; } /* Position the div containing the open button */ .inflate { position: absolute; top: 10px; right: 10px; } /* The button used to open the sidebar */ .open { font-size: 20px; cursor: pointer; background-color: rgba(0, 0, 0, 0); color: white; padding: 10px 15px; border: none; } .open:hover { background-color: #444; } /* Screens Wider than 600px */ @media screen and (min-width: 600px) { /*Hide sidebar open/close buttons*/ .inflate {display: none;} .sidebar .close {display: none;} /*Change Menu Dimensions*/ .sidebar { width: 100%; height: 10px; padding-top: 5px; padding-bottom: 40px; padding-left: 50px; } /* Float links */ .sidebar a { float: left; padding-top: 10px; } .sidebar a:first-child { margin-left: 30px; } /*Provice space for top menu*/ .page-title {padding-top: 100px} /*Increase social link image size*/ .social-links img {max-width: 75px;} }