h1, h2, h3, h4, h5, h6 { font-family: 'Montserrat', sans-serif; } h2 { font-size: 24px; } .intro-lead { font-family: 'Montserrat', sans-serif; font-size: 20px; } .select-from { font-size: 16px; } code { word-break: break-all; word-wrap: break-word; } dd { padding-left: 24px; } dt { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; } img { display: block; margin-left: auto; margin-right: auto; width: 100%; } .sample-image { margin-bottom: 18px; } h1 { letter-spacing: 8px; font-size: 86px; line-height: 120px; } div { font-family: 'Merriweather', serif; color: white; } .btn { margin: 8px; display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; position: relative; padding-left: 2.5em; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; } .btn:before { content: "💫"; position: absolute; left: 1em; padding: 0 1px; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-property: transform; transition-property: transform; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } .btn:hover:before, .btn:focus:before, .btn:active:before { -webkit-transform: scale(1.3) translateZ(0); transform: scale(1.3) translateZ(0); } .contents-list { color: black; } .contents-list:hover { color: #2a9fd6; } .contents-list:before { content: "📼" } .codeblock { font-family: monospace padding: 2px 4px; font-size: 90%; color: #c7254e; background-color: #f9f2f4; border-radius: 4px; } .beware { font-size: 150%; } .footnote { font-size: 90%; } @media only screen and (min-width: 576px) { img { max-width: 60%; } } @media only screen and (min-width: 992px) { img { width: 100%; } }