* { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: Inter, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; tab-size: 4; -moz-tab-size: 4; } #v1-banner { display: block; background: #5c92a4; color: #fff; text-align: center; padding: 10px 20px; font-size: 14px; text-decoration: none; } #v1-banner:hover { background: #457a8c; } .wrapper { max-width: 1400px; margin-left: auto; margin-right: auto; padding-left: 40px; padding-right: 40px; } .text-center { text-align: center; } a { color: #0694f1; text-decoration: none; } a:hover { color: #ff3f2c; } header { display: flex; justify-content: space-between; padding: 25px 0; } #logo { height: 40px; } header nav { text-align: right; line-height: 40px; } header nav > a { display: inline-block; padding-left: 10px; padding-right: 10px; text-decoration: none; color: inherit; } header nav > a:hover { color: #ff3f2c; } header nav > a.current { font-weight: bold; } /* Algolia search */ #search { border-radius: 5px; border: 1px solid rgba(0, 0, 0, .2); font-size: 14px; padding: 8px; background: none; width: 150px; max-width: 100%; margin-right: 20px; outline: none; } #search:focus { background: #fff; } /* End Algolia search */ header nav .button { margin: 0 0 0 10px; padding-top: 2px; padding-bottom: 2px; } .button { border-radius: 2em; padding: 10px 20px; margin: 15px 30px 15px 0; height: auto; transition: all .2s; text-decoration: none; display: inline-block; } .button:hover { transform: scale(1.05); } .button:active { transform: translateY(2px); } .button.red { background-color: #d9552b; color: white; } .button.red:hover { background-color: #fd511a; } .button.blue { background-color: #009ae6; color: white; } .button.blue:hover { background-color: #00aaff; } .button.gray { background-color: #4c6a79; color: white; } .button.gray:hover { background-color: #4f8098; } .button.big { font-size: 125%; text-transform: uppercase; font-weight: bold; padding: 20px 50px; margin-right: 20px; } p .button { font-size: 18px; padding: 12px 30px; } article a:hover { text-decoration: underline; } footer { display: flex; justify-content: space-between; margin-top: 100px; padding: 0 50px 100px; line-height: 125%; } footer > div { width: 50%; } #footer-logo { float: left; max-width: 175px; margin-right: 35px; vertical-align: middle; margin-top: -4px; } .copyright { text-align: right; font-size: 14px; color: #999; } @media (max-width: 900px) { footer { flex-direction: column; margin-top: 0; padding: 20px 0; } footer > div { width: initial; text-align: center; margin: 10px 0; } #footer-logo { float: none; display: block; margin: 0 auto 25px; } .copyright { text-align: center; } }