/* General */

body {
    margin: 0;
    display: flex;
    min-height: 100vh;
    background-color:darkslategrey;
}

main {
    width: 80vw;
    display: flex;
    flex-direction: column;
    padding: 1em 0 1em 0;
    margin: 0 auto 0 auto;
}

table, th, td {
  border: 1px solid white;
  border-collapse: collapse;
}

th,td {
    text-align: left;
    padding:0.375em;
    max-width: 15em;
}

th {
    background-color: #122323;
}

/* Classes */

.center {
    display: flex;
    justify-content: center;
    align-items: center;
    margin:auto;
}

.column {
    display: flex;
    flex-direction: column;
}

.row {
    display: flex;
    flex-direction: row;
}

.loginform {
    display: flex;
    flex-direction: column;
}

.loginform > input {
    margin:1em;
    border-radius: 6px;
}

.film-catalog-top {
    display: flex;
    width:100%;
    flex-direction: row;
}

.film-catalog-top-sep {
    display: flex;
    flex-direction: row;
}

.film-catalog-top-left {
    justify-content:start;
}

.film-catalog-top-right {
    justify-content: end;
}

.films-navigation {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width:100%;
}

.films-navigation a.current {
    font-weight: bold;
    font-size: 1.25em;
    color:white;
}

.films-navigation p {
    margin: 1em 0.5em 0 0.5em;
}

/* Selectize */

.selectize-input {
    max-width:14em;
    min-width: 10em;
    border-radius: 4px;
}

.selectize-input.dropdown-active {
    border-radius: 4px 4px 0 0;
}

.selectize-dropdown {
    border-radius: 0 0 4px 4px;
}

/* Text */

* {
    font-family: Helvetica, sans-serif;
}

main {
    color: white;
}

.username {
    color: pink;
    border-bottom:2px solid pink;
}

a {
    color: #a8b7fb;
    text-decoration: none;
}

a:hover, a:active, a:focus {
    border-bottom:1px solid #a8b7fb;
}

.newfilmcell > input, .newfilmcell select[multiple] {
    font-size: 1em;
}

.newfilmcell > label, .newfilmcell p {
    font-size: 1.25em;
    margin:0.5em 0 0.5em 0;
}

.film-catalog-top-left p {
    margin: 0em 1em 0.5em 0;
}

.film-catalog-top-right p {
    margin: 0em 0 0.5em 1em;
}