/* Root elements */
html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    background-color: #f4f4f4;
    font-family: 'PT Sans', 'Segoe UI', 'Helvetica', Arial, sans-serif;
    font-size: 16px;
    line-height: 150%;
    background-color: #f4f4f4;
}
/* Block elements */
h1,
h2,
h3,
h4,
h5,
h6,
p,
pre,
ul,
ol,
dl,
table {
    padding: 4px;
    margin: 8px 0;
}
/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: bold;
    font-family: "Cuprum", sans-serif;
    line-height: 120%;
    padding: 8px 4px;
}
h1 {
    font-size: 2rem;
}
h2 {
    font-size: 1.75rem;
}
h3 {
    font-size: 1.5rem;
}
h4 {
    font-size: 1.25rem;
}
h5 {
    font-size: 1rem;
}
h6 {
    font-size: 1rem;
    font-style: italic;
}
/* Text */
/* Lists */
dt:after {
    content: ":";
}
dd {
    margin: 0;
    padding-left: 1.5em;
}
ol,
ul {
    list-style-position: outside;
    padding-left: 1.5em;
}
ul {
    list-style-type: disc;
}
ol {
    list-style-type: decimal;
}
/* */
hr {
    border: 1px solid #ddd;
    margin: 4px 0;
}
/* Tables */
table {
    width: 100%;
    border-collapse: collapse;
}
table caption {
    font-style: italic;
    padding:4px;
}
thead th,
tfoot th {
    background-color: #ddd;
    text-align: left;
}
table tr {
    background-color: #f8f8f8;
}
tbody tr:hover {
    color: #c9343f;
    background-color: #e8e8e8;
}
tbody tr:nth-child(even) {
    background-color: #f2f2f2;
}
tbody tr:nth-child(even):hover {
    background-color: #e2e2e2;
}
th,
td {
    padding: 4px;
}



/* Links */
a,
.link {
    text-decoration-style: dotted;
    color: #000;
}
a:active,
.link:active,
a:hover,
.link:hover,
a:focus,
.link:focus {
    text-decoration-style: solid;
    color: #c9343f;
}
/* Forms */
button,
input,
select,
textarea {
    padding: 3px;
    border: 1px solid #ccc;
    box-sizing: border-box;
    line-height: 1.5em;
    font-family: inherit;
    width: 200px;
    max-width: 100%;
}
button.small,
input.small,
select.small,
textarea.small {
    width: 100px;
}
button.max,
input.max,
select.max,
textarea.max {
    width: 100%;
}
input:focus,
select:focus,
textarea:focus {
    border-color: #33c;
    background-color: #eef;
    outline: none;
    box-shadow: none;
}
button {
    cursor: pointer;
    padding: 3px 6px;
    width: auto;
    max-width: none;
}
button:hover,
button:focus {
    color: #c9343f;
    border-color: #c9343f;
}
[readonly],
[disabled] {
    color: #6d6d6d;
    background-color: #eee;
}
input:invalid:not(:focus),
textarea:invalid:not(:focus) {
    border-color: #c66;
    background-color: #fee;
    outline: none;
    box-shadow: none;
}
/* Special input */
input[type="checkbox"],
input[type="radio"] {
    width: auto;
}
input[type="color"],
input[type="range"] {
    height: 32px;
}
input[type="range"] {
    border: none;
}
input[type="image"] {
    border: none;
    padding: 0;
}
input[type="file"] {
    width: auto;
    border: 0;
    padding: 4px;
}
/* Labels */
label {
    min-width: 150px;
    display: inline-block;
    padding: 4px;
}
fieldset {
    border: 1px solid #ccc;
    padding: 4px;
}
fieldset > legend {
    padding: 0 4px;
}
/* Misc */
.hidden {
    display: none !important;
    height: 0 !important;
    width: 0 !important;
    overflow: hidden !important;
}