html, body {
    border: 0;
    padding: 0;
    height: 100%;
    margin: 0;
    font-family: Arial, sans-serif;
    user-select: none;
}


select, input {
    padding: 5px 10px;
    background: #fff;
    border-radius: 6px;
    border: 2px solid #474747;
}
select {
    min-width: 300px;
}
input[type="text"], input[type="email"] {
    min-width: 500px;
}

#form > div > div > div {
    margin-bottom: 10px;
}
#form > div > div > div > label, #form [data-repeatable-bloc] > div > label {
    min-width: 175px;
    display: inline-block;
    text-align: right;
    padding-right: 10px;
    vertical-align: top;
    margin-top: 3px;
}

#form b.title {
    margin-left: 185px;
}

#form button.repeatable-remove, #form button.repeatable-add {
    display: block;
    margin-left: 185px;
}
#form button.repeatable-remove {
    background: #de3a45;
    color: #fff;
    border-color: #5b2125;
}
#form [data-repeatable-min] button.repeatable-remove {
    display: none;
}
#form [data-repeatable-max] button.repeatable-add {
    display: none;
}
#form button.repeatable-add {
    background: #3abb1f;
    color: #fff;
    border-color: #2b681f;
}

[data-editor] {
    display: inline-block;
    border: 2px solid #474747;
    border-radius: 6px;
    padding: 0px 10px;
    width: 525px;
}

#form ul[data-multi-select-custom-values] {
    padding-left: 85px;
}
#form ul[data-multi-select-custom-values] li {
    margin-top: 5px;
}

.verticalAlignedParent {
    height: 100%;
}
.verticalAlignedParent::before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.verticalAlignedParent > .verticalAligned {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
}

.page {
    position: absolute; top: 0; left: 0; bottom: 0; right: 0;
    overflow: auto;
    opacity: 0;
    transition: opacity .2s;
}
.page.pageVisible {
    z-index: 1;
    opacity: 1;
}

.button, #form button:not(.codex-editor *) {
    display: inline-block;
    border-radius: 6px;
    border: 2px solid #474747;
    padding: 4px 10px;
    background: #fff;
    cursor: pointer;
    color: #000;
    vertical-align: middle;
}
.button.big {
    padding: 8px 14px;
    font-size: 1.3em;
}
.button.disabled {
    border-color: #474747;
    border-color: #4747478c;
    color: #474747;
    color: #4747478c;
}

.page.flag {
    background: linear-gradient(126deg, #000091,#eaeaea, #d5d5d5, #e1000f);
}

.window {
    display: block;
    background: #fff;
    position: absolute;
    top: 50px;
    left: 50px;
    right: 50px;
    bottom: 50px;
    border-radius: 20px;
    overflow: hidden;
    max-width: 950px;
    margin: auto;
}
.window .header {
    display: block;
    background: #de3a45;
    color: #fff;
    font-weight: bold;
    height: 20px;
    padding: 10px 20px;
}
.window .content {
    position: absolute;
    top: 40px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
    padding: 5px 20px;
}

#menuPage {
    padding: 10px;
    text-align: center;
}
#menuPage .logo {
    border: 10px solid #fff;
    border-radius: 15px;
}
#menuPage button {
    display: block;
    margin: 10px auto;
}

.actions {
    margin-top: 25px;
    padding-left: 185px;
}