@font-face { font-family: 'Gotham Rounded'; src: url('../fonts/GothamRounded.eot?#iefix') format('embedded-opentype'), url('../fonts/GothamRounded.otf') format('opentype'), url('../fonts/GothamRounded.woff') format('woff'), url('../fonts/GothamRounded.ttf') format('truetype'), url('../fonts/GothamRounded.svg#GothamRounded-Medium') format('svg'); font-weight: normal; font-style: normal; } body { height:100vh; width:100vw; max-width:100%; max-height:100%; padding:0; margin:0; font-family: Gotham Rounded, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .upload { height:100%; width:100%; padding:0; margin:0; background: #2dcb89; transition: background 0.3s; cursor: pointer; } .upload.dragover { background: #32f1a0; transition: background 0.3s; } .header { text-align: center; background: #29bb7e; } @media screen and (max-width: 768px) { html { font-size: 80%; } } @media screen and (max-width: 320px) { html { font-size: 60%; } } .header h1 { color: #1b7b53; font-size: 4rem; padding: 3rem 0 0; margin: 0 0 0; font-family: Gotham Rounded, sans-serif; } .header h2 { color: #1e8b5d; margin: 0; font-size: 2rem; padding: 0 1rem 3rem; } .desc { text-align: center; color: #fff; height: 60vh; } .desc h2 { font-size: 2rem; margin: 0; color: #176b48; padding: 3rem 3rem 0; } @media screen and (max-width: 490px) { .desc h2 a { font-size: 1rem; } .desc h2 i:hover { font-size: 1rem; } } .desc h2 a { color: #145a3d; } .desc h2 a:link { color: #145a3d; } .desc h2 i:hover { cursor: pointer; } .desc img { height: 25vh; max-width: 100%; max-height: 100%; margin: auto; padding: 5vh; } span.author { position: absolute; bottom: 0; right: 0; color: #1b7b53; font-size: 0.8em; padding:0.5em 0.8em; } span.author a { color: #1b7b53; }