* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :root { --accent: #b1675d; --light-gray: #eee; --dark-gray: #c2c2c2; --white: #f8f9fa; --black: #2d2d2d; --border-width: 5px; } body {} h1, h2, h3, h4, h5, h6, label { color: var(--black); } .intro { text-align: center; } .tomato { max-width: 20em; } .icons a { text-decoration: none; } .icons svg { margin-left: 10px; margin-right: 10px; } .content { margin: auto; padding-top: 5em; } .readme { font-size: 12px; } .content h1,h2,h3,h4,h5,h6 { padding: .2em; } .center-splash { text-align: center; } .splash-image img { border-radius: 2em; } @media screen and (max-height: 600px) { .center-splash { padding-top: 10%; } } @media screen and (max-width: 900px) { .splash-image img { max-height: 250px; } } @media screen and (min-width: 900px) { .content { max-width: 75% ; } }