:root {
}

* {
    box-sizing: border-box;
}

body {
    background: #FFF;
}

body, p, div, h1, h2, h3, h4, td, input, select, button {
    font-family: Poppins
}

.toolbar {
    margin: 0.5em;
}

button {
    background: #ff2496;
    color: #ffffff;
    border-radius: 10px;
    padding: 0.25em 0.5em;
    border: none;
    outline: none;
}

.calendar .day-events.mde > div > div.em,
.event-edit .group.em {
    background: #ffd7ef;
}

.calendar .day-events.mde > div > div.rob,
.event-edit .group.rob {
    background: #d7dcff;
}

.calendar .day-events.mde > div > div.joint,
.event-edit .group.joint {
    background: #efd7ff;
}

.event-edit .group > div:not(:last-child) {
    margin-right: 20px;
}

.event-edit .group {
    display: flex;
    flex-wrap: wrap;
    padding: 0.5em;
}

.event-edit h3 {
    width: 100%;
    margin-bottom: 0;
}

.event-edit textarea, .event-edit select {
    height: 48px;
}

.event-edit select,
.event-edit input,
.event-edit textarea {
    margin: 0 !important;
}

.group.morning {
    border-left: 15px solid #fdffea;
}

.group.daytime {
    border-left: 15px solid #e8ffff;
}

.group.evening {
    border-left: 15px solid #fff5f0;
}

header {
    position: absolute;
    right: 0;
    padding: 0;
    margin: 0.5em;
}

button.logout {
    color: #ff2496 !important;
    border: 1px solid #ff2496;
    background: #ffffff;
    width: 2em;
    height: 26px;
    border-radius: 10px;
    top: 0;
}

.logout:hover {
    background: #ffffff;
    color: #ff2496;
}

.login-component {
    max-width: 400px;
    padding: 1em;
    margin: 1em;
    background: #f0f8ff;
}

.login-component button {
    font-size: 1.25em;
}

.login-component .controls,
.login-component .login-option {
    margin-top: 1em;
}

.login-component .username input,
.login-component .password input {
    font-size: 1em;
    width: 100%;
    padding: 0.25em;
}

.login-component .password input {
    width: calc(100% - 4em);
}

.login-component .password {
    margin-top: 0.5em;
}

.login-component .password i.pwd {
    padding-left: 0.5em;
    font-style: normal;
}

nav {
    background: none !important;
    padding: 0 !important;
}

.event-edit .group > div {
    max-width: 50%;
}