Meetups/NCTU Formosa/try
/**
* * */
html, body {
padding: 0; margin: 0; height: 100%; font-size: 16px; background: #ed5565; color: #fff; font-family: 'Source Sans Pro'; }
h1 {
font-size: 2.8em; font-weight: 700; letter-spacing: -1px; margin: 0.6rem 0; } h1 > span { font-weight: 300; }
h2 {
font-size: 1.15em; font-weight: 300; margin: 0.3rem 0; }
main {
width: 95%; max-width: 1000px; margin: 4em auto; opacity: 0; } main.loaded { transition: opacity .25s linear; opacity: 1; } main header { width: 100%; } main header > div { width: 50%; } main header > .left, main header > .right { height: 100%; } main .loaders { width: 100%; box-sizing: border-box; display: flex; flex: 0 1 auto; flex-direction: row; flex-wrap: wrap; } main .loaders .loader { box-sizing: border-box; display: flex; flex: 0 1 auto; flex-direction: column; flex-grow: 1; flex-shrink: 0; flex-basis: 25%; max-width: 25%; height: 200px; align-items: center; justify-content: center; }
/**
* Util classes */
.left {
float: left; }
.right {
float: right; }
.cf, main header {
content: ""; display: table; clear: both; }
/**
* Buttons */
.btn {
color: #fff; padding: .75rem 1.25rem; border: 2px solid #fff; border-radius: 4px; text-decoration: none; transition: transform .1s ease-out, border .1s ease-out, background-color .15s ease-out, color .1s ease-out; margin: 2rem 0; } .btn:hover { transform: scale(1.01562); background-color: #fff; color: #ed5565; }