@viewport { width: device-width; zoom: 1; } body{ position: relative; min-height: 100vh; margin: 0; } .core { font-family: 'Roboto', sans-serif; max-width: 900px; margin: auto; padding: 5px; padding-top:50px; text-align: center; padding-bottom: 85px; } @media (min-width: 370px) { .core { padding-bottom: 65px; } } @media (min-width: 600px) { .core { padding-bottom: 45px; } } h1 { font-size: 38; } .dragndrop { margin-top: 5%; margin-bottom: 3%; background-color: #a3a3a3; padding: 1px; padding-top: 5%; height:40%; font-size: 20px; border: 6px dashed #444444; border-radius: 20px; min-height: 250px; } .dragndrop .button { cursor: pointer; min-height: 30px; min-width: 120px; } .dragover { background-color: #888888; } .infobox { text-align: left; background: #eeeeee; border-radius: 20px; border: 4px solid #a3a3a3; padding: 10px; } footer { position: absolute; padding-top: 10px; padding-bottom: 10px; bottom: 0; width: 100%; text-align: center; background-color: #eeeeee; } footer a { color: #555; font-weight: bold; text-decoration: none; }