h1{ margin-top: 30px; } body{ font-size: 20px; font-family: serif; color: #333; font-weight: 300; text-align: center; background-color: #f8f6f0; } ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #111; position: fixed; top: 0; width: 100%; } li { float: left; display: inline; } li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } .active { background-color: #279; color: #279; } li a:hover { background-color: #279; } html, body, #container { width: 100%; height: 100%; margin: 0; padding: 0; background-color: #f8f6f0; } h1{ font-weight: 300; padding-bottom: 2px; padding-top: 25px; font-size: 20px; background-color: #444; color: #fff; } .question{ font-size: 30px; margin-bottom: 10px; } .answers { margin-bottom: 20px; text-align: left; display: inline-block; } .answers label{ display: block; margin-bottom: 10px; } button{ font-family: 'Work Sans', sans-serif; font-size: 22px; background-color: #279; color: #fff; border: 0px; border-radius: 3px; padding: 20px; cursor: pointer; margin-bottom: 20px; } button:hover{ background-color: #38a; } .slide{ position: absolute; left: 0px; top: 0px; width: 100%; z-index: 1; opacity: 0; transition: opacity 0.5s; } .active-slide{ opacity: 1; z-index: 2; } .quiz-container{ position: relative; height: 200px; margin-top: 40px; } body { font-family: 'Open Sans', sans-serif; font-weight: 300; text-align: center; color: #7f7e7e; background-color: #ececec; margin: 0; padding: 0; } h2 { margin: 35px; font-weight: 300; } a{ text-decoration: none; color: #a8a8a8; } footer { display: flex; position: bottom; left: 0; bottom: 0; width: 100%; text-align: center; justify-content: center; padding: 5px; background-color: #111; color: #ffffff; }