html { background: #D7E2E2; font-family: 'Roboto'; color: #000F0F; } ::-webkit-scrollbar { display: none; } .recent { display: inline-block; left: 0; position: absolute; top: 0; width: 30%; text-align: center; } .event { font-size: 12pt; padding: 0 6pt 0 6pt; margin-left: 8pt; transition: 0.4s; width: 100%; } .event:hover { background: #226666; width: 105%; } .history-header { display: inline-block; background-color: #013A3A; color: #D7E2E2; margin: 0 0 8pt 0; padding: 10pt 0 10pt 0; text-align: center; font-size: 16pt; width: 100%; } .time { padding: 6pt 0 6pt 0; display: inline-block; width: 49%; text-align: left; } .name { padding: 6pt 0 6pt 0; display: inline-block; width: 49%; text-align: right; } .unknown_card { color: #E26B08; } .everything-else { display: inline-block; width: 69%; left: 30%; top: 0; position: absolute; text-align: center; } h1 { text-align: center; font-weight: 300; } .big-button { display: inline-block; background-color: #013A3A; color: #D7E2E2; text-align: center; font-size: 12pt; padding: 10pt; margin: 6pt 0 10pt 0; width: 120pt; border-radius: 2pt; transition: 0.2s; } .big-button:hover { background-color: #226666; } .button { width: 50%; background-color: #013A3A; color: #5E9292; padding: 6pt; text-align: center; font-size: 16pt; margin: 16pt 0 16pt 0; transition: 0.2s; } .separator { height: 10%; } .vertical-separator { height: 100%; width: 1px; background-color: #5E9292; position: absolute; top: 0; left: 33%; z-index: 100; } .shadow { background-color: black; display: none; height: 100%; left: 0; opacity: 0.0; position: absolute; top: 0; width: 100%; z-index: 200; } .overlay { background-color: #226666; color: #D7E2E2; display: none; height: 60%; left: 35%; padding: 8pt; position: absolute; /*Should probably be 'fixed' instead*/ top: -70%; width: 30%; z-index: 201; border-radius: 2pt; text-align: center; } .checkbox-wrapper { text-align: left; } .card-id { font-weight: 300; text-align: center; padding: 8pt; font-size: 24pt; } input[type=text] { font-size: 16pt; padding: 5pt 8pt 5pt 8pt; margin-top: 8pt; margin-bottom: 8pt; width: 90%; } input[type=text].search-bar { width: 75%; } input[type=text].duration-input { width: 25%; margin-left: 15pt; } .disable-lock { display: inline-block; border-radius: 3pt; background-color: #226666; margin: 5pt 30pt 5pt 30pt; } .button { background-color: #013A3A; color: #5E9292; border: none; text-align: center; font-size: 10pt; width: 45%; margin: 8pt; position: absolute; bottom: 0; } #save { right: 0; } #cancel { left: 0; } ul.navbar { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #5E9292; } ul.navbar li { float: left; } ul.navbar li a { display: block; color: #000F0F; text-align: center; padding: 14px 16px; width: 60pt; text-decoration: none; font-size: 12pt; } ul.navbar li a:hover { background-color: #226666; } ul.navbar li a.active { background-color: #226666; color: #D7E2E2; } h2 { font-size: 26pt; text-align: left; padding: 26pt 0 10pt 80pt; color: #013A3A; } p { font-size: 16pt; width: 60%; padding-left: 40pt; color: #013A3A; } .locked_till { color: #f48158; font-size: 10pt; padding: 0; text-align: center; width: 100%; } ul.mail-list { padding-left: 50pt; } ul.mail-list li { padding: 0 0 5pt 0; font-size: 16pt; color: #013A3A; } a.mail-link { text-decoration: none; font-weight: bold; color: #013A3A; }