* {
    font-family: 'Titillium Web', sans-serif;
    font-size: 16px;
}

a:link, a:visited, a:active, a:hover {
    color: #ab3b8b;
    text-decoration: none;
}

a:hover {
    color: #812567;
}

th {
    text-align: right;
    vertical-align: top
}

th, td {
    padding: 5px;
}

table {
    width: 100%;
}

.wrapper {
    margin:0 auto 60px;
    max-width:800px
}

.header {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px 0;
}

.header-navigation {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

.header-navigation-logout {
    text-align: right;
    flex: 1;
}

.error,
.success {
    padding: 20px;
    border: 2px solid #FFF;
    margin-bottom: 20px;
}

.error {
    color: darkred;
    border-color: darkred;
    background-color: #fbb2b2;
}

.success {
    color: #2dcc1e;
    border-color: #2dcc1e;
    background-color: #cdfddc;
}


.loginlist td, th {
    text-align: left !important;
    padding: 8px;
    border-bottom: 2px solid #999;
}

textarea {
    font-size: 110%;
}

#urlaub_time_from {
    width: 16em;
}

#urlaub_time_to {
    width: 16em;
}

.email {
    width: 20em;
}

.mailtext {
    width: 99%;
    height: 400px;
}

#immer_copy_mail {
    width: 28em;
}

.start {
    width: 4em;
    margin-right: 4px;
}

.end {
    width: 4em;
    margin-left: 4px;
}

code {
    background: transparent;
    font-family: monospace;
    font-size: 110%;
}

.copy-to-input {
    cursor: pointer;
    color: #ab3b8b;
}

.weekday {
    display: none;
}

#urlaub {
    display: none;
}

label {
    font-size: 110%;
    font-weight: bold;
    color: #ab3b8b;
    cursor: pointer
}

table.settings {
    margin-left: 23px
}

h1 {
    margin-top: 0;
    line-height: 1;
}
h2, h3 {
    margin-bottom: 0px
}

input:required:invalid,
input:focus:invalid,
textarea:required:invalid,
textarea:focus:invalid {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAT1JREFUeNpi/P//PwMpgImBRMACY/x7/uDX39sXt/67cMoDyOVgMjBjYFbV/8kkqcCBrIER5KS/967s+rmkXxzI5wJiRSBm/v8P7NTfHHFFl5mVdIzhGv4+u///x+xmuAlcdXPB9KeqeLgYd3bDU2ZpRRmwH4DOeAI07QXIRKipYPD35184/nn17CO4p/+cOfjl76+/X4GYAYThGn7/g+Mfh/ZZwjUA/aABpJVhpv6+dQUjZP78Z0YEK7OezS2gwltg64GmfTu6i+HL+mUMP34wgvGvL78ZOEysf8M1sGgZvQIqfA1SDAL8iUUMPIFRQLf+AmMQ4DQ0vYYSrL9vXDz2sq9LFsiX4dLRA0t8OX0SHKzi5bXf2HUMBVA0gN356N7p7xdOS3w5fAgcfNxWtn+BJi9gVVBOQfYPQIABABvRq3BwGT3OAAAAAElFTkSuQmCC");
    background-position: right top;
    background-repeat: no-repeat;
    box-shadow: none;
}

input:required:valid,
textarea:required:valid {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAZZJREFUeNpi/P//PwMpgImBRMAy58QshrNPTzP8+vOLIUInisFQyYjhz98/DB9/fmT48/+35v7H+8KNhE2+WclZd+G0gZmJmYGThUNz1fUVMZtvbWT59eUXG9wGZIWMUPj993eJ5VeWxuy8veM/CzPL3yfvH/9H0QBSBDYZyOVm4mGYfn6q4cory5lYmFh+MrEwM/76/YsR7mk2ZjbWP///WP37/y8cqIDhx58fjvtu7XV6//ndT34G/v8FasUsDjKO/+A2PP3wpGLd+TVsfOz8XH6KAT+nHpokcu7h6d9q/BoMxToVbBYqlt9///+1GO4/WVdpXqY/zMqXn13/+vTjI9mj94/y//v9/3e9ZRObvYbDT0Y2xnm///x+wsfHB3GSGLf41jb3rv0O8nbcR66d+HPvxf2/+YZFTHaqjl8YWBnm/vv37yly5LL8+vuLgYuVa3uf/4T/Kd8SnSTZpb6FGUXwcvJxbAPKP2VkZESNOBDx8+9PBm4OwR1TwmYwcfzjsBUQFLjOxs52A2YyKysrXANAgAEA7buhysQuIREAAAAASUVORK5CYII=");
    background-position: right top;
    background-repeat: no-repeat;
}

.btn {
    font-family: 'Tillium Web', sans-serif;
    text-transform: uppercase;
    border: 0;
    cursor: pointer;
    color: #ffffff;
    font-size: 20px;
    padding: 18px;
    margin-top: 20px;
    margin-bottom: 30px;
    font-weight: bold;
    display: inline-block;
    background: #ab3b8b;
    text-decoration: none;
}
.btn:not(.btn-link):hover {
    background: #812567;
    text-decoration: none;
}
.btn.btn-small {
    font-size: 16px;
    padding: 10px;
    font-weight: normal;
    margin: 0;
    text-transform: none;
    color: #FFF;
}

.btn.btn-link {
    font-weight: normal;
    background: transparent;
    font-size: 16px;
    color: #ab3b8b;
    padding: 0;
    margin: 0;
    display: inline;
    text-transform: none;
}
.btn.btn-link:hover {
    color: #812567;
}

#speichern {
    margin-left: 23px;
    width: 527px;
}



.data-form input {
    padding: 5px 10px;
    font-size: 16px;
    width: 200px;
}

.overtime-minus {
    color: red;
}