* {
   box-sizing: border-box;
}
html,
body {
   margin: 0;
   background: #101010;
   color: #eeeeee;
   font-family: Arial, sans-serif;
   font-size: 18px;
   line-height: 1.45;
   word-wrap: break-word;
}
main,
nav,
section {
   display: block;
}
.wrap {
   max-width: 740px;
   margin: 0 auto;
   padding: 12px;
}
h1 {
   font-size: 28px;
   margin: 0 0 12px;
}
h2 {
   font-size: 23px;
   margin: 0 0 12px;
}
p {
   margin: 10px 0;
}
a {
   color: #cce5ff;
   overflow-wrap: break-word;
   word-wrap: break-word;
}
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus {
   outline: 3px solid #ffdf80;
   outline-offset: 2px;
}
.card {
   padding: 14px;
   margin: 18px 0;
   border: 1px solid #666666;
   background: #191919;
}
.links {
   padding: 0;
   margin: 8px 0;
   list-style: none;
}
.links li {
   display: inline-block;
   width: 49%;
   vertical-align: top;
   padding: 3px;
}
.links a,
.back {
   display: block;
   min-height: 48px;
   padding: 11px 8px;
}
.links a {
   background: #292929;
   border: 1px solid #666666;
}
.back {
   margin-top: 8px;
}
label {
   display: block;
   margin: 12px 0 5px;
   font-weight: bold;
}
input,
select,
textarea,
button {
   font: inherit;
   border-radius: 3px;
   min-height: 48px;
}
input,
select,
textarea {
   width: 100%;
   padding: 10px;
   background: #ffffff;
   color: #111111;
   border: 1px solid #aaaaaa;
}
textarea {
   resize: vertical;
}
button {
   padding: 10px 14px;
   background: #eeeeee;
   color: #111111;
   border: 1px solid #aaaaaa;
   font-weight: bold;
   cursor: pointer;
}
button:disabled {
   color: #555555;
   cursor: default;
}
.search-row {
   width: 100%;
}
.search-row input {
   width: 100%;
}
.search-row button {
   margin-top: 6px;
}
.small {
   color: #cccccc;
   font-size: 15px;
}
#save-reading {
   margin-top: 10px;
}
@media (max-width: 360px) {
   .links li {
      width: 100%;
   }
}