/* https://google-webfonts-helper.herokuapp.com/fonts/open-sans?subsets=latin */ @font-face { font-family: 'Open Sans'; font-style: normal; font-weight: 400; src: local(''), url('../fonts/open-sans-v29-latin-regular.woff2') format('woff2'), url('../fonts/open-sans-v29-latin-regular.woff') format('woff'); } body { background-color: #202225; margin: 0; font-family: Whitney, "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; color: #b9bbbe; } #logo { position: relative; left: 24px; top: 24px; } #avatars { text-align: center; } #content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 280px; max-width: 400px; min-height: 400px; background-color: #18191c; border-radius: 5px; box-shadow: 0 8px 16px rgba(0, 0, 0, 0.24); padding: 32px 16px 24px; } #scopes { list-style-type: none; padding: 0; } #scopes li { margin: 8px; font-size: 14px; } .fa-custom-circle { border-radius: 20px; width: 24px; height: 24px; text-align: center; line-height: 22px; font-size: 20px; float: left; margin-right: 12px; margin-top: 6px; } .fa-check { background-color: green; } .fa-times { background-color: grey; } h1 { font-size: 20px; text-align: center; color: white; } h2 { font-size: 16px; text-align: center; } h3 { text-transform: uppercase; font-size: 13px; } hr { color:rgba(79, 84, 92, 0.48); margin: 24px 0; }