@charset "UTF-8";
.icon.teal {
    color: #7c8080
}

.icon.white {
    color: #fff
}

.hallotoolbar [class*=" icon-"]:before, .hallotoolbar [class^=icon-], .hallotoolbar [class^=icon-]:before, .icon:after, .icon:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: wagtail;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    speak: none;
    text-decoration: none;
    width: 1.3em;
    line-height: 1em;
    text-align: left;
    vertical-align: middle;
    margin-right: .2em
}

.hallotoolbar [class^=icon-]:after, .icon:after {
    text-align: right
}

.hallotoolbar [class*=" icon-"]:before, .hallotoolbar [class^=icon-], .hallotoolbar [class^=icon-]:before {
    vertical-align: -10%;
    margin-right: 0
}

.icon-cogs:before {
    content: "a"
}

.icon-doc-empty-inverse:before {
    content: "b"
}

.icon-doc-empty:before {
    content: "c"
}

.icon-edit:before {
    content: "d"
}

.icon-arrow-up:before {
    content: "e"
}

.icon-arrow-down:before {
    content: "q"
}

.icon-search:before {
    content: "f"
}

.icon-cross:before {
    content: "g"
}

.icon-folder-open-1:before {
    content: "i"
}

.icon-folder-inverse:before {
    content: "j"
}

.icon-mail:before {
    content: "k"
}

.icon-arrows-up-down:before {
    content: "l"
}

.icon-locked:before {
    content: "m"
}

.icon-arrow-right:before {
    content: "n"
}

.icon-doc-full:before, .icon-file-text-alt:before {
    content: "h"
}

.icon-image:before, .icon-picture:before {
    content: "o"
}

.icon-unlocked:before {
    content: "p"
}

.icon-doc-full-inverse:before {
    content: "r"
}

.icon-folder:before {
    content: "s"
}

.icon-plus:before {
    content: "t"
}

.icon-tag:before {
    content: "u"
}

.icon-folder-open-inverse:before {
    content: "v"
}

.icon-cog:before {
    content: "w"
}

.icon-tick:before {
    content: "x"
}

.icon-user:before {
    content: "y"
}

.icon-arrow-left:before {
    content: "z"
}

.icon-tick-inverse:before {
    content: "A"
}

.icon-plus-inverse:before {
    content: "B"
}

.icon-snippet:before {
    content: "D"
}

.icon-wagtail:before {
    content: "V"
}

.icon-wagtail-inverse:before {
    content: "0"
}

.icon-bold:before {
    content: "C"
}

.icon-italic:before {
    content: "E"
}

.icon-undo:before {
    content: "H"
}

.icon-repeat:before {
    content: "I"
}

.icon-list-ol:before {
    content: "G"
}

.icon-list-ul:before {
    content: "F"
}

.icon-link:before, .url_field .input:before {
    content: "J"
}

.icon-radio-full:before {
    content: "K"
}

.icon-radio-empty:before {
    content: "L"
}

.icon-arrow-up-big:before {
    content: "M"
}

.icon-arrow-down-big:before {
    content: "N"
}

.icon-group:before {
    content: "O"
}

.icon-media:before {
    content: "P"
}

.icon-password:before {
    content: "Q"
}

.icon-download:before {
    content: "S"
}

.icon-order:before {
    content: "T"
}

.icon-grip:before {
    content: "U"
}

.icon-home:before {
    content: "W"
}

.icon-order-down:before {
    content: "X"
}

.icon-order-up:before {
    content: "Y"
}

.icon-bin:before {
    content: "Z"
}

.icon-spinner:before {
    content: "1"
}

.icon-pick:before {
    content: "2"
}

.icon-redirect:before {
    content: "3"
}

.icon-success:before {
    content: "9"
}

.icon-help:before {
    content: "?"
}

.icon-warning:before {
    content: "!"
}

.icon-form:before {
    content: "$"
}

.icon-site:before {
    content: "@"
}

.icon-placeholder:before {
    content: "{"
}

.icon-pilcrow:before {
    content: ""
}

.icon-title:before {
    content: ""
}

.icon-code:before {
    content: ""
}

.icon-openquote:before {
    content: "“"
}

.icon-horizontalrule:before {
    content: "—"
}

.icon-chain-broken:before {
    content: ""
}

.icon-table:before {
    content: ""
}

.icon-logout:before {
    content: ""
}

.icon-arrow-down-after:after {
    content: "q"
}

.icon-arrow-up-after:after {
    content: "e"
}

.icon-arrow-right-after:after {
    content: "n"
}

.icon-no-view:before, .icon-view:before {
    vertical-align: -3.5px;
    font-size: 1.1rem
}

.icon-view:before {
    content: "4"
}

.icon-no-view:before {
    content: "^"
}

.icon-collapse-down:before {
    content: "5"
}

.icon-collapse-up:before {
    content: "6"
}

.date_field .input:before, .date_time_field .input:before, .icon-date:before {
    content: "7"
}

.icon-time:before, .time_field .input:before {
    content: "8"
}

.icon-spinner:after, .icon-spinner:before {
    width: 1em;
    animation: a .5s infinite linear;
    display: inline-block
}

.icon-horizontalrule:before {
    font-family: Open Sans, Arial, sans-serif
}

.icon-larger:before {
    font-size: 1.5em
}

.icon.text-replace {
    font-size: 0;
    line-height: 0;
    overflow: hidden
}

.icon.text-replace:before {
    margin-right: 0;
    font-size: 1rem;
    display: inline-block;
    width: 100%;
    line-height: 1.2em;
    text-align: center;
    vertical-align: middle
}

@keyframes a {
    0% {
        transform: rotate(0deg)
    }
    to {
        transform: rotate(1turn)
    }
}

.icon-spinner:after {
    display: inline-block;
    line-height: 1
}

.icon-help-inverse:before {
    content: "?";
    display: inline-block;
    width: 15px;
    height: 15px;
    line-height: 15px;
    font-size: 1.1em;
    text-align: center;
    border-radius: 100%;
    color: #666;
    border: 1px solid currentColor
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 400
}

h1 {
    line-height: 1.3em;
    font-size: 1.5em;
    text-transform: uppercase;
    color: #333;
    font-weight: 600
}

h1 span {
    font-weight: 300
}

.homepage h1, h1 span {
    text-transform: none
}

h2 {
    text-transform: uppercase;
    font-size: 1.3em;
    font-family: Open Sans;
    font-weight: 600;
    color: #666
}

.page-explorer h2 {
    text-transform: none
}

p {
    margin-top: 0
}

a {
    outline: none;
    color: #334259;
    text-decoration: none
}

a:hover {
    color: #3a3838
}

a.underlined {
    border-bottom: 1px solid currentColor
}

code {
    box-shadow: inset 0 0 4px 0 rgba(0, 0, 0, .2);
    background-color: #fafafa;
    padding: 2px 5px
}

kbd {
    border-radius: 3px;
    font-family: Open Sans, Arial, sans-serif;
    border: 1px solid #666;
    border-color: rgba(0, 0, 0, .2);
    padding: .3em .5em
}

dd, dl, dt {
    padding: 0;
    margin: 0
}

dl {
    margin-top: 1em
}

dt {
    color: #b3b3b3;
    text-transform: uppercase;
    font-size: .9em
}

dd {
    margin-bottom: 1em
}

.unbold {
    font-weight: 400
}

.help-block {
    padding: 1em;
    margin: 1em 0;
    clear: both;
    color: #666
}

.help-block p {
    margin-top: 0
}

.help-block p:last-child {
    margin-bottom: 0
}

.help-block a {
    color: #7c8080
}

.help-critical, .help-info, .help-warning {
    border-radius: 3px;
    padding-left: 3.5em;
    position: relative
}

.help-critical:before, .help-info:before, .help-warning:before {
    font-family: wagtail;
    position: absolute;
    left: 1em;
    top: .7em;
    content: "?";
    font-size: 1.4em
}

.help-info {
    background-color: #e6f2f8
}

.help-info:before {
    color: #71b2d4
}

.help-warning {
    background-color: #faecd5
}

.help-warning:before {
    color: #e9b04d;
    content: "!"
}

.help-critical {
    background-color: #f5d6d7
}

.help-critical:before {
    color: #cd3238;
    content: "!"
}

.u-para {
    margin-bottom: 1rem
}

.tab-nav {
    box-sizing: border-box;
    display: block;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    padding: 0;
    background: #e6e6e6
}

.tab-nav:after, .tab-nav:before {
    content: " ";
    display: table
}

.tab-nav:after {
    clear: both
}

.tab-nav li {
    list-style-type: none;
    width: 33%;
    float: left;
    padding: 0;
    position: relative;
    margin-right: 1px
}

.tab-nav li:first-of-type {
    padding-left: 1.2em
}

.tab-nav a {
    background-color: #585a5a;
    outline: none;
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.2em;
    text-decoration: none;
    display: block;
    padding: .7em;
    color: #fff;
    border-top: .3em solid #585a5a;
    max-height: 1.2em;
    overflow: hidden
}

body.ready .tab-nav a {
    transition: border-color .2s ease
}

.tab-nav a:hover {
    color: #fff;
    border-top-color: #3a3838
}

.tab-nav a.errors:after {
    border-radius: 50px;
    box-shadow: 1px 2px 2px rgba(0, 0, 0, .1);
    position: absolute;
    right: -.5em;
    top: -.5em;
    z-index: 5;
    min-width: .9em;
    color: #fff;
    background: #cd3238;
    content: attr(data-count);
    padding: 0 .3em;
    line-height: 1.4em;
    text-align: center;
    font-size: .8em
}

.tab-nav li.active a {
    box-shadow: none;
    color: #333;
    background-color: #fff;
    border-top: .3em solid #333
}

.tab-nav li.settings a:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: wagtail;
    vertical-align: middle;
    text-transform: none;
    content: "w";
    margin-right: .5em;
    font-size: 1.2em;
    font-weight: 400
}

.tab-nav.merged {
    margin-top: 0;
    background-color: #7c8080
}

.tab-content section {
    display: none;
    padding-top: 1em
}

.tab-content section.active {
    display: block
}

@media screen and (min-width: 50em) {
    .tab-nav.merged {
        background-color: #7c8080
    }

    .tab-nav li {
        width: auto;
        padding: 0;
        margin-left: .7em
    }

    .tab-nav a {
        padding-left: 40px;
        padding-right: 40px
    }

    .tab-nav li.settings a {
        padding-left: 2em;
        padding-right: 2em
    }

    .modal-content .tab-nav li {
        padding: 0;
        min-width: 0
    }

    .modal-content .tab-nav li:first-of-type {
        padding-left: 2.5em
    }
}

@media screen and (max-width: 50em) {
    .tab-nav li:first-of-type {
        padding-left: 1.6em
    }

    .tab-nav li {
        width: 25%
    }
}

.dropdown {
    position: relative
}

.dropdown:after, .dropdown:before {
    content: " ";
    display: table
}

.dropdown:after {
    clear: both
}

.dropdown .button, .dropdown button, .dropdown input[type=button], .dropdown input[type=reset], .dropdown input[type=submit] {
    padding: 0;
    display: block;
    width: 100%;
    height: 3em;
    line-height: 3em;
    text-align: left;
    padding-left: 1em;
    float: left
}

.dropdown button, .dropdown input[type=button], .dropdown input[type=reset], .dropdown input[type=submit] {
    line-height: inherit
}

.dropdown ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    background-color: #7c8080;
    position: absolute;
    overflow: hidden;
    top: 100%;
    left: -2000px;
    z-index: 500;
    opacity: 0
}

.dropdown ul, .dropdown ul li {
    list-style-type: none;
    font-style: normal
}

.dropdown ul li {
    float: none;
    border-color: hsla(0, 0%, 100%, .2);
    border-style: solid;
    border-width: 1px 0 0;
    overflow: hidden
}

.dropdown ul a {
    box-sizing: border-box;
    white-space: nowrap;
    position: relative;
    text-decoration: none;
    text-transform: uppercase;
    display: block;
    color: #fff;
    padding: 1em;
    font-weight: 400
}

.dropdown ul a:hover {
    background-color: #4a4e4e
}

.dropdown ul a.icon {
    padding-right: 5em
}

.dropdown ul a.icon:after, .dropdown ul a.icon:before {
    right: 1em
}

.dropdown ul a.shortcut {
    padding-right: 7em
}

.dropdown ul .button, .dropdown ul a, .dropdown ul button, .dropdown ul input[type=button], .dropdown ul input[type=reset], .dropdown ul input[type=submit] {
    border-radius: 0;
    font-size: .95em;
    -webkit-font-smoothing: auto
}

.dropdown ul label {
    padding: 1.3em
}

.dropdown ul .kbd {
    position: absolute;
    right: 1em;
    font-weight: 600;
    font-size: .8em;
    color: rgba(0, 0, 0, .3)
}

.dropdown.open ul {
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, .2);
    opacity: 1;
    left: 0;
    display: block
}

.dropdown.match-width ul {
    width: 100%;
    min-width: 110px
}

.dropdown.match-width ul li {
    white-space: nowrap
}

.dropdown.dropup ul {
    box-shadow: 0 -3px 3px 0 rgba(0, 0, 0, .2);
    top: auto;
    bottom: 100%
}

.dropdown.dropup ul li {
    border-width: 0 0 1px
}

.dropdown .dropdown-toggle {
    color: #fff;
    text-transform: uppercase;
    background-color: #7c8080;
    line-height: 2.8em;
    cursor: pointer;
    height: 100%;
    border-left: 1px solid hsla(0, 0%, 100%, .2);
    position: absolute;
    right: 0;
    padding: 0 .5em;
    text-align: center
}

.dropdown .dropdown-toggle:after, .dropdown .dropdown-toggle:before {
    margin: 0
}

.dropdown .dropdown-toggle:before {
    width: 1em;
    font-size: 1.2rem
}

.dropdown .dropdown-toggle:hover, .dropdown.open .dropdown-toggle {
    background-color: #4a4e4e
}

.dropdown.dropdown-button .dropdown-toggle {
    border-radius: 0 3px 3px 0
}

.dropdown.dropdown-button.open > .button, .dropdown.dropdown-button.open > button, .dropdown.dropdown-button.open > input[type=button], .dropdown.dropdown-button.open > input[type=submit] {
    border-radius: 3px 3px 0 0
}

.dropdown.dropdown-button.open .dropdown-toggle {
    border-radius: 0 3px 0 0
}

.dropdown.dropup.dropdown-button.open > .button, .dropdown.dropup.dropdown-button.open > button, .dropdown.dropup.dropdown-button.open > input[type=button], .dropdown.dropup.dropdown-button.open > input[type=submit] {
    border-radius: 0 0 3px 3px
}

.dropdown.dropup.dropdown-button.open .dropdown-toggle {
    border-radius: 0 0 3px
}

.dropdown.white ul {
    background-color: #fff
}

.dropdown.white ul li {
    border-top: 1px solid rgba(0, 0, 0, .1)
}

.dropdown.white ul a {
    color: #666
}

.dropdown.white ul a:hover {
    background-color: #d9d9d9
}

.dropdown.warning .dropdown-toggle, .dropdown.warning ul {
    background-color: #e9b04d
}

.dropdown.warning .dropdown-toggle:hover {
    background-color: #b97e17
}

body.ready .dropdown ul {
    transition: opacity .2s linear
}

.o-icon {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    margin-top: -.25rem
}

.c-dropdown__button {
    box-sizing: border-box;
    padding-left: .5rem;
    padding-right: .25rem;
    line-height: 1.85;
    border: 1px solid transparent;
    border-radius: 2px;
    font-size: .95em;
    cursor: pointer;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.c-dropdown__button, .c-dropdown__toggle {
    display: inline-block
}

.c-dropdown__menu.c-dropdown__menu {
    margin-top: .75rem;
    padding: .75rem 1rem;
    min-width: 8rem;
    text-transform: none;
    position: absolute;
    z-index: 1;
    animation: b .1s ease-out backwards;
    list-style: none
}

.c-dropdown__item {
    margin-bottom: .375rem
}

.c-dropdown__item:hover .c-dropdown__indicator {
    opacity: .6
}

.c-dropdown__item:last-child {
    margin-bottom: 0
}

.c-dropdown__divider {
    border-color: #555;
    border-style: dotted;
    margin-top: 12px;
    margin-bottom: 12px
}

.u-arrow:before {
    content: "";
    border: .35rem solid transparent;
    display: block;
    position: absolute
}

.u-arrow--tl:before {
    bottom: 100%;
    left: 1rem
}

.t-default .u-btn-current {
    border-color: rgba(0, 0, 0, .15);
    color: #7c8080
}

.t-default .u-btn-current:hover {
    background: #7c8080;
    color: #fff;
    border-color: #7c8080
}

.t-default .u-btn-current:active {
    background: #333;
    color: #fff;
    border-color: #333
}

.t-inverted .u-btn-current {
    border-color: rgba(0, 0, 0, .25);
    color: #fff
}

.t-inverted .u-btn-current:hover {
    background-color: #4a4e4e;
    border-color: #4a4e4e
}

.t-inverted .u-btn-current:active {
    border-color: rgba(0, 0, 0, .25);
    background: #333;
    color: #fff
}

.t-dark .u-link {
    color: #fff
}

.t-dark .u-link:hover {
    color: #aaa
}

.t-dark .u-background {
    background: #333
}

.t-dark .u-arrow:before {
    border-bottom-color: #333
}

@keyframes b {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.t-light .u-link {
    color: #333
}

.t-light .u-link:hover {
    color: #aaa
}

.t-light .u-background {
    background: #fff;
    border-color: #ccc
}

.t-light .u-arrow:before {
    border-bottom-color: #fff
}

.u-toggle {
    display: none
}

.is-open .u-toggle {
    display: block
}

.fade {
    opacity: 0
}

body.ready .fade {
    transition: opacity .15s linear
}

.fade.in {
    opacity: 1
}

.modal-open {
    overflow: hidden
}

.modal-open .content-wrapper {
    transform: none
}

.modal {
    display: none;
    overflow: auto;
    overflow-y: scroll;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 500
}

.modal, .modal-dialog {
    box-sizing: border-box
}

.modal-dialog {
    margin-left: auto;
    margin-right: auto;
    padding: 0;
    z-index: 510;
    height: 90%;
    width: 85%
}

.modal-dialog:before {
    content: "";
    height: 100%;
    margin-right: -.25em
}

.modal-content, .modal-dialog:before {
    display: inline-block;
    vertical-align: middle
}

.modal-content {
    box-sizing: border-box;
    border-radius: 3px;
    width: 98.7%;
    position: relative;
    background-color: #fff;
    outline: none;
    margin-top: 2em;
    padding-bottom: 3em;
    overflow: hidden
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 490;
    background-color: #000
}

.modal-backdrop.fade {
    opacity: 0
}

.modal-backdrop.in {
    opacity: .5
}

.modal .close {
    padding: 0;
    position: absolute;
    width: 50px;
    height: 50px;
    top: 10px;
    right: 10px;
    z-index: 1
}

.modal-body {
    position: relative;
    padding-bottom: 2em
}

.modal-body header {
    padding-left: 2em;
    padding-right: 100px
}

.modal-body .header-title {
    padding-left: 0 !important;
    margin-left: -36px
}

@media screen and (min-width: 50em) {
    .modal-dialog {
        padding: 0 0 2em 180px
    }
}

@media screen and (min-width: 100em) {
    .modal-dialog {
        max-width: 100em;
        padding: 0 0 2em
    }
}

form li, form ul {
    list-style-type: none
}

form ul {
    margin: 0;
    padding: 0
}

fieldset {
    border: 0;
    padding: 0 0 2em;
    margin: 0
}

legend {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

legend:active, legend:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.label, label {
    text-transform: none;
    font-weight: 700;
    color: #333;
    font-size: 1.1em;
    display: block;
    padding: 0 0 .8em;
    margin: 0;
    line-height: 1.3em
}

.checkbox .label, .checkbox label, .radio .label, .radio label {
    display: inline
}

.plain-checkbox-label {
    float: none;
    color: inherit;
    font-weight: inherit;
    font-size: inherit
}

.halloeditor, .tagit, input, select, textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    box-sizing: border-box;
    border-radius: 6px;
    width: 100%;
    font-family: Open Sans, Arial, sans-serif;
    border: 1px solid #e6e6e6;
    padding: .9em 1.2em;
    background-color: #fafafa;
    color: #333;
    font-size: 1.2em;
    font-weight: 300;
    outline: none
}

.halloeditor:hover, .tagit:hover, input:hover, select:hover, textarea:hover {
    background-color: #fff
}

.halloeditor:focus, .tagit:focus, input:focus, select:focus, textarea:focus {
    background-color: #f4fcfc;
    border-color: #54d0d0;
    outline: none
}

.halloeditor:disabled, .halloeditor:disabled:hover, .halloeditor[disabled], .halloeditor[disabled]:hover, .tagit:disabled, .tagit:disabled:hover, .tagit[disabled], .tagit[disabled]:hover, input:disabled, input:disabled:hover, input[disabled], input[disabled]:hover, select:disabled, select:disabled:hover, select[disabled], select[disabled]:hover, textarea:disabled, textarea:disabled:hover, textarea[disabled], textarea[disabled]:hover {
    background-color: inherit;
    cursor: default;
    color: #e6e6e6
}

select::-ms-expand {
    display: none
}

.choice_field .input, .model_choice_field .input, .typed_choice_field .input {
    position: relative
}

.choice_field .input select, .model_choice_field .input select, .typed_choice_field .input select {
    outline: none
}

.choice_field .input select ~ span:after, .model_choice_field .input select ~ span:after, .typed_choice_field .input select ~ span:after {
    border-radius: 0 6px 6px 0;
    z-index: 0;
    position: absolute;
    right: 0;
    top: 1px;
    bottom: 0;
    width: 1.5em;
    font-family: wagtail;
    content: "q";
    border: 1px solid #e6e6e6;
    border-width: 0 0 0 1px;
    text-align: center;
    line-height: 1.4em;
    font-size: 3em;
    pointer-events: none;
    color: #d9d9d9;
    margin: 0 1px 1px 0
}

.ie .choice_field .input select ~ span:after, .ie .model_choice_field .input select ~ span:after, .ie .typed_choice_field .input select ~ span:after {
    display: none
}

input[type=checkbox], input[type=radio] {
    border-radius: 0;
    cursor: pointer;
    border: 0
}

input[type=radio] {
    -webkit-appearance: radio;
    width: auto;
    position: relative;
    margin-right: 15px
}

input[type=radio]:before {
    border-radius: 100%;
    font-family: wagtail;
    font-style: normal;
    text-align: center;
    position: absolute;
    top: -5px;
    left: -2px;
    cursor: pointer;
    display: block;
    content: "K";
    width: 1em;
    height: 1em;
    line-height: 1.1em;
    padding: 4px;
    background-color: #fff;
    color: #e6e6e6;
    border: 1px solid #e6e6e6
}

input[type=radio]:checked:before {
    content: "K";
    color: #7c8080
}

input[type=checkbox] {
    -webkit-appearance: checkbox;
    width: auto;
    position: relative;
    margin-right: 15px
}

input[type=checkbox]:before {
    font-family: wagtail;
    font-style: normal;
    text-align: center;
    position: absolute;
    top: -5px;
    cursor: pointer;
    display: block;
    content: "x";
    line-height: 20px;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    color: #fff
}

input[type=checkbox]:checked:before {
    color: #7c8080
}

.button {
    border-radius: 3px;
    font-family: Open Sans, Arial, sans-serif;
    width: auto;
    height: 2.4em;
    padding: 0 1em;
    font-size: .9em;
    font-weight: 400;
    vertical-align: middle;
    display: inline-block;
    background-color: #7c8080;
    border: 1px solid #7c8080;
    color: #fff;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    outline: none;
    box-sizing: border-box;
    -webkit-font-smoothing: auto;
    -moz-appearance: none
}

.button:hover {
    color: #7c8080
}

.button.yes {
    background-color: #189370;
    border: 1px solid #189370
}

.button.yes.button-secondary {
    border: 1px solid #189370;
    color: #189370;
    background-color: transparent
}

.button.yes:hover {
    color: #fff;
    border-color: transparent;
    background-color: #127055
}

.button.yes.button-nobg:hover {
    color: #189370;
    background-color: transparent
}

.button.warning {
    background-color: #e9b04d;
    border: 1px solid #e9b04d
}

.button.warning.button-secondary {
    border: 1px solid #e9b04d;
    color: #e9b04d;
    background-color: transparent
}

.button.warning:hover {
    color: #fff;
    border-color: transparent;
    background-color: #b97e17
}

.button.warning.button-nobg:hover {
    color: #e9b04d;
    background-color: transparent
}

.button.no, .button.serious {
    background-color: #cd3238;
    border: 1px solid #cd3238
}

.button.no.button-secondary, .button.serious.button-secondary {
    border: 1px solid #cd3238;
    color: #cd3238;
    background-color: transparent
}

.button.no:hover, .button.serious:hover {
    color: #fff;
    border-color: transparent;
    background-color: #7b1e22
}

.button.no.button-nobg:hover, .button.serious.button-nobg:hover {
    color: #cd3238;
    background-color: transparent
}

.button.button-nobg {
    border: 0;
    background-color: transparent
}

.button.bicolor {
    border: 0;
    padding-left: 3.5em
}

.button.bicolor:before {
    font-size: 1rem;
    position: absolute;
    left: 0;
    top: 0;
    width: 2em;
    line-height: 1.85em;
    height: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, .2);
    display: block;
    border-top-left-radius: inherit;
    border-bottom-left-radius: inherit
}

.button.button-small.bicolor {
    padding-left: 3.5em
}

.button.button-small.bicolor:before {
    width: 2em;
    font-size: .9rem;
    line-height: 1.65em
}

.button + .button {
    margin-left: 1em
}

.button.unbutton {
    border-radius: 0;
    width: auto;
    height: auto;
    padding: 0;
    font-size: inherit;
    font-weight: 400;
    vertical-align: middle;
    display: inline;
    background-color: transparent;
    border: 0;
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    outline: none;
    box-sizing: border-box;
    -webkit-font-smoothing: auto;
    -moz-appearance: none
}

.button:hover {
    background-color: #4a4e4e;
    color: #fff;
    border-color: transparent
}

.button:hover.hover-no {
    background-color: #cd3238
}

.button.button-longrunning span {
    transform: scale(.9);
    display: inline-block;
    height: .9em;
    position: relative;
    opacity: 0;
    width: 0;
    visibility: hidden;
    text-align: center;
    padding-right: 0
}

body.ready .button.button-longrunning span {
    transition: all .3s ease
}

.button.button-longrunning em {
    font-style: normal
}

.button.button-longrunning.button-longrunning-active span {
    transform: scale(1);
    visibility: visible;
    width: 1em;
    opacity: .8;
    padding-right: .5em
}

.button.button-longrunning .icon-spinner:after {
    text-align: center;
    position: absolute;
    left: 0;
    margin: 0;
    line-height: 1em;
    display: inline-block;
    font-size: 1em
}

.button.disabled, .button:disabled, .button[disabled] {
    background-color: #d9d9d9;
    border-color: #d9d9d9;
    color: #8c8c8c;
    cursor: default
}

.button.button-secondary.disabled, .button.button-secondary:disabled, .button.button-secondary[disabled] {
    background-color: #fff;
    border-color: #d9d9d9;
    color: #d9d9d9
}

.button.button-nostroke {
    border: 0
}

.stream-menu .stream-menu-inner button:focus,
.stream-menu .stream-menu-inner button:hover {
    background-color: #334259;
    color: #fff;
}

@media screen and (min-width: 50em) {
    .button {
        font-size: .95em;
        padding: 0 1.4em;
        height: 3em
    }

    .button.icon.text-replace {
        width: 2.2rem;
        height: 2.2rem
    }

    .button.icon.text-replace:before {
        line-height: 2.1em
    }

    .button.button-small.icon.text-replace {
        height: 1.8rem;
        width: 1.8rem
    }

    .button.button-small.icon.text-replace:before {
        line-height: 1.7em
    }

    .button.bicolor {
        padding-left: 3.7em
    }

    .button.bicolor:before {
        width: 2em;
        line-height: 2.2em;
        font-size: 1.1rem
    }

    .button.button-small.bicolor {
        padding-left: 3em
    }

    .button.button-small.bicolor:before {
        width: 1.8em;
        line-height: 1.65em
    }
}

.button-small {
    padding: 0 .8em;
    height: 2em;
    font-size: .95em
}

.button-secondary {
    color: #7c8080;
    background-color: transparent
}

.button.icon.text-replace {
    font-size: 0;
    width: 1.8rem;
    height: 1.8rem
}

.button.icon.text-replace:before {
    line-height: 1.7em
}

.button-neutral {
    color: #666
}

.button-neutral:hover {
    color: #7c8080
}

.yes {
    background-color: #189370;
    border: 1px solid #189370
}

.yes.button-secondary {
    border: 1px solid #189370;
    color: #189370;
    background-color: transparent
}

.yes:hover {
    color: #fff;
    border-color: transparent;
    background-color: #127055
}

.yes.button-nobg:hover {
    color: #189370;
    background-color: transparent
}

.no, .serious {
    background-color: #cd3238;
    border: 1px solid #cd3238
}

.no.button-secondary, .serious.button-secondary {
    border: 1px solid #cd3238;
    color: #cd3238;
    background-color: transparent
}

.no:hover, .serious:hover {
    color: #fff;
    border-color: transparent;
    background-color: #7b1e22
}

.no.button-nobg:hover, .serious.button-nobg:hover {
    color: #cd3238;
    background-color: transparent
}

.button-nobg {
    border: 0;
    background-color: transparent
}

.bicolor {
    border: 0;
    padding-left: 3.5em
}

.bicolor:before {
    font-size: 1rem;
    position: absolute;
    left: 0;
    top: 0;
    width: 2em;
    line-height: 1.85em;
    height: 100%;
    text-align: center;
    background-color: rgba(0, 0, 0, .2);
    display: block
}

.button-small.bicolor {
    padding-left: 3.5em
}

.button-small.bicolor:before {
    width: 2em;
    font-size: .8rem;
    line-height: 1.65em
}

a.button {
    line-height: 2.4em;
    height: auto
}

a.button.button-small {
    line-height: 1.85em
}

@media screen and (min-width: 50em) {
    a.button {
        line-height: 2.9em
    }
}

button, input[type=button], input[type=reset], input[type=submit] {
    padding: 0 1em
}

@media screen and (min-width: 50em) {
    button.button-small, input[type=button].button-small, input[type=reset].button-small, input[type=submit].button-small {
        height: 2em
    }
}

.button-group:after, .button-group:before {
    content: " ";
    display: table
}

.button-group:after {
    clear: both
}

.button-group .button, .button-group button, .button-group input[type=button], .button-group input[type=reset], .button-group input[type=submit] {
    border-radius: 0;
    float: left;
    margin-right: 1px;
    margin-left: 0
}

.button-group .button:only-child, .button-group button:only-child, .button-group input[type=button]:only-child, .button-group input[type=reset]:only-child, .button-group input[type=submit]:only-child {
    border-radius: 3px
}

.button-group .button:first-child, .button-group button:first-child, .button-group input[type=button]:first-child, .button-group input[type=reset]:first-child, .button-group input[type=submit]:first-child {
    border-radius: 3px 0 0 3px
}

.button-group .button:last-child, .button-group button:last-child, .button-group input[type=button]:last-child, .button-group input[type=reset]:last-child, .button-group input[type=submit]:last-child {
    border-radius: 0 3px 3px 0;
    margin-right: 0
}

.button-group.button-group-square, .button-group.button-group-square .button, .button-group.button-group-square button, .button-group.button-group-square input[type=button], .button-group.button-group-square input[type=reset], .button-group.button-group-square input[type=submit] {
    border-radius: 0
}

.multiple {
    padding: 0;
    max-width: 974px;
    overflow: hidden
}

.multiple > li {
    box-sizing: border-box;
    display: block;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    padding: 1em 10em 1em 1.5em;
    margin-bottom: 1em;
    border: 1px solid #eee
}

.multiple > li:after, .multiple > li:before {
    content: " ";
    display: table
}

.multiple > li:after {
    clear: both
}

.multiple.moving {
    position: relative
}

.multiple li.moving {
    position: absolute;
    width: 100%
}

.multiple fieldset {
    padding-top: 0;
    padding-bottom: 0
}

.multiple .controls {
    position: absolute;
    z-index: 1;
    right: 1em;
    top: 1em;
    color: #fff
}

.multiple .controls li {
    float: left;
    margin-right: 1px
}

.multiple .controls li:last-child {
    margin-right: 0
}

.multiple .controls .disabled {
    display: none;
    visibility: hidden
}

.add {
    font-weight: 700;
    cursor: pointer;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 1em;
    padding-bottom: 2em;
    clear: both
}

.error-message, .help {
    font-size: .85em;
    font-weight: 400;
    margin: .5em 0 0
}

.error-message {
    color: #cd3238
}

.help {
    color: #666
}

.field.focused + .help, .field:focus + .help, .field:hover + .help, fieldset:hover > .help, li.focused > .help {
    opacity: 1
}

.required .field > label:after {
    content: "*";
    color: #cd3238;
    font-weight: 700;
    display: inline-block;
    margin-left: .5em;
    line-height: 1em;
    font-size: 13px
}

.error .tagit, .error input, .error select, .error textarea {
    border-color: #cd3238;
    background-color: #feedee
}

.boolean_field .help, .radio .help {
    opacity: 1
}

.date_field .input, .date_time_field .input, .iconfield .input, .time_field .input, .url_field .input {
    position: relative
}

.date_field .input:after, .date_field .input:before, .date_time_field .input:after, .date_time_field .input:before, .iconfield .input:after, .iconfield .input:before, .time_field .input:after, .time_field .input:before, .url_field .input:after, .url_field .input:before {
    font-family: wagtail;
    position: absolute;
    top: .5em;
    line-height: 100%;
    font-size: 2em;
    color: #d9d9d9
}

.date_field .input:before, .date_time_field .input:before, .iconfield .input:before, .time_field .input:before, .url_field .input:before {
    left: .3em
}

.date_field .input:after, .date_time_field .input:after, .iconfield .input:after, .time_field .input:after, .url_field .input:after {
    right: .5em
}

.date_field input:not([type=button]), .date_field input:not([type=checkbox]), .date_field input:not([type=radio]), .date_field input:not([type=submit]), .date_time_field input:not([type=button]), .date_time_field input:not([type=checkbox]), .date_time_field input:not([type=radio]), .date_time_field input:not([type=submit]), .iconfield input:not([type=button]), .iconfield input:not([type=checkbox]), .iconfield input:not([type=radio]), .iconfield input:not([type=submit]), .time_field input:not([type=button]), .time_field input:not([type=checkbox]), .time_field input:not([type=radio]), .time_field input:not([type=submit]), .url_field input:not([type=button]), .url_field input:not([type=checkbox]), .url_field input:not([type=radio]), .url_field input:not([type=submit]) {
    padding-left: 2.5em
}

.date_field.field-small .input:after, .date_field.field-small .input:before, .date_time_field.field-small .input:after, .date_time_field.field-small .input:before, .iconfield.field-small .input:after, .iconfield.field-small .input:before, .time_field.field-small .input:after, .time_field.field-small .input:before, .url_field.field-small .input:after, .url_field.field-small .input:before {
    font-size: 1.3rem;
    top: .3em
}

.date_field.field-small .input:before, .date_time_field.field-small .input:before, .iconfield.field-small .input:before, .time_field.field-small .input:before, .url_field.field-small .input:before {
    left: .5em
}

.date_field.field-small .input:after, .date_time_field.field-small .input:after, .iconfield.field-small .input:after, .time_field.field-small .input:after, .url_field.field-small .input:after {
    right: .5em
}

.date_field.icon-spinner:after, .date_time_field.icon-spinner:after, .iconfield.icon-spinner:after, .time_field.icon-spinner:after, .url_field.icon-spinner:after {
    color: #7c8080;
    opacity: .8;
    text-align: center;
    top: .3em
}

.choice_field .input li label, .model_multiple_choice_field .input li label {
    display: block;
    width: auto;
    float: none;
    padding-top: 0
}

.field-col, .fields > li {
    padding-top: .5em;
    padding-bottom: 1.2em
}

.field-col:after, .field-col:before, .fields > li:after, .fields > li:before {
    content: " ";
    display: table
}

.field-col:after, .fields > li:after {
    clear: both
}

.field-row {
    margin-bottom: -1.2em
}

.field-row:after, .field-row:before {
    content: " ";
    display: table
}

.field-row:after, .input {
    clear: both
}

.field-small .halloeditor, .field-small .tagit, .field-small input, .field-small select, .field-small textarea {
    border-radius: 3px;
    padding: .4em 1em
}

.field.col1, .field.col2, .field.col3, .field.col4, .field.col5, .field.col6, .field.col7, .field.col8, .field.col9, .field.col10, .field.col11, .field.col12 {
    clear: both
}

li.inline .field.col1, li.inline .field.col2, li.inline .field.col3, li.inline .field.col4, li.inline .field.col5, li.inline .field.col6, li.inline .field.col7, li.inline .field.col8, li.inline .field.col9, li.inline .field.col10, li.inline .field.col11, li.inline .field.col12 {
    clear: none
}

li.inline:first-child, ul.inline li:first-child {
    margin-left: -1.5%
}

.chooser:after, .chooser:before {
    content: " ";
    display: table
}

.chooser:after {
    clear: both
}

.chooser input[type=text] {
    float: left;
    width: 50%;
    margin-right: 1em
}

.chooser .chosen {
    display: block
}

.chooser .chosen, .chooser .unchosen {
    position: relative
}

.chooser .chosen:before, .chooser .unchosen:before {
    vertical-align: middle;
    font-family: wagtail;
    content: "";
    display: inline-block;
    color: #d9d9d9;
    line-height: 1em;
    font-size: 2.5em;
    margin-right: .3em
}

.chooser .unchosen {
    display: none
}

.chooser .actions {
    overflow: hidden
}

.chooser .actions:after, .chooser .actions:before {
    content: " ";
    display: table
}

.chooser .actions:after {
    clear: both
}

.chooser .actions li {
    float: left;
    margin: .3em
}

.chooser.blank .chosen {
    display: none
}

.chooser.blank .unchosen {
    display: block
}

.document-chooser .chosen .title, .page-chooser .chosen .title, .snippet-chooser .chosen .title {
    color: #333;
    padding-left: 1em;
    display: inline-block
}

.document-chooser .chosen .actions, .page-chooser .chosen .actions, .snippet-chooser .chosen .actions {
    clear: both;
    padding-top: .6em
}

.page-chooser .chosen:before, .page-chooser .unchosen:before {
    content: "b"
}

.snippet-chooser .chosen:before, .snippet-chooser .unchosen:before {
    content: "D"
}

.document-chooser .chosen:before, .document-chooser .unchosen:before {
    content: "r"
}

.image-chooser .chosen:before, .image-chooser .unchosen:before {
    content: "o"
}

.image-chooser .chosen {
    padding-left: 130px
}

.image-chooser .chosen:before {
    content: ""
}

.image-chooser .chosen .preview-image {
    float: left;
    margin-left: -130px;
    margin-right: 1em;
    max-width: 130px
}

.image-chooser .chosen .preview-image img {
    max-width: 130px;
    max-height: 130px;
    height: auto;
    width: auto
}

.tagit {
    padding: .6em 1.2em
}

.tagit .tagit-choice {
    border: 0
}

.admin_tag_widget ul.tagit input[type=text] {
    padding: .2em .5em
}

.admin_tag_widget ul.tagit li.tagit-choice-editable {
    padding: 0 23px 0 0
}

.ui-front {
    z-index: 1000
}

.tagit-close .ui-icon-close {
    margin-left: 1em;
    text-indent: 0;
    background: none
}

.tagit-close .ui-icon-close:before {
    font-family: wagtail;
    display: block;
    color: #d9d9d9;
    content: "g"
}

.tagit-close .ui-icon-close:hover:before {
    color: #cd3238
}

.search-bar .required .field > label:after {
    display: none
}

.search-bar .button-filter {
    height: 2.71em;
    border-color: transparent
}

.drop-zone {
    border-radius: 5px;
    border: 2px dashed #e6e6e6;
    padding: 20px;
    background-color: #fafafa;
    margin-bottom: 1em;
    text-align: center
}

.drop-zone .drop-zone-help {
    border: 0
}

.drop-zone.hovered {
    border-color: #7c8080;
    background-color: #f4fcfc
}

body.ready fieldset, body.ready input, body.ready select, body.ready textarea {
    transition: background-color .2s ease
}

body.ready .help {
    transition: opacity .2s ease
}

@media screen and (min-width: 50em) {
    label {
        box-sizing: border-box;
        display: inline;
        float: left;
        width: 16.66667%;
        padding-right: 1.5%;
        padding-left: 1.5%;
        padding-top: 1.2em;
        padding-left: 0
    }

    .boolean_field label, .image_field label, .model_choice_field label, .model_multiple_choice_field label, .radio_select label {
        padding-top: 0
    }

    .model_choice_field.select label {
        padding-top: 1.2em
    }

    .help {
        opacity: 1
    }

    .fields {
        max-width: 800px
    }

    .field {
        box-sizing: border-box;
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-right: 0;
        padding-left: 0
    }

    .field:after, .field:before {
        content: " ";
        display: table
    }

    .field:after {
        clear: both
    }

    .field-content {
        box-sizing: border-box;
        display: inline;
        width: 83.33333%;
        padding-right: 0
    }

    .field-col, .field-content {
        float: left;
        padding-left: 0
    }

    .field-col.col4 label {
        padding-right: 0;
        padding-left: 0
    }

    .field-col.col4 .field-content, .field-col.col4 label {
        box-sizing: border-box;
        display: inline;
        float: left;
        width: 50%
    }

    .field-col.col4 .field-content {
        padding-right: 1.5%;
        padding-left: 1.5%;
        padding-left: 0
    }

    .field-col.col6 label {
        box-sizing: border-box;
        display: inline;
        float: left;
        width: 33.33333%;
        padding-right: 0;
        padding-left: 0
    }

    .field-col.col6 .field-content {
        box-sizing: border-box;
        display: inline;
        float: left;
        width: 66.66667%;
        padding-right: 1.5%;
        padding-left: 1.5%;
        padding-left: 0
    }

    .label-above .field > .field-content, .label-above .field > label {
        display: block;
        padding: 0 0 .8em;
        float: none;
        width: auto
    }
}

ul.listing {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

ul.listing, ul.listing li {
    list-style-type: none;
    font-style: normal
}

.listing {
    margin-bottom: 2em;
    color: gray;
    font-size: .95em
}

.listing ul {
    list-style-type: none;
    padding-left: 0
}

.listing > li {
    padding: 1em 0;
    border-bottom: 1px dashed #e6e6e6
}

.listing h3 {
    margin: 0;
    font-size: 1em
}

.listing td, .listing th {
    padding: 1.2em 1em
}

.listing td.no-padding, .listing th.no-padding {
    padding: 0
}

.listing.small td, .listing th {
    padding: .6em 1em
}

.listing thead {
    font-size: 1.1em;
    color: #666;
    border-bottom: 1px solid #e6e6e6
}

.listing thead th {
    font-size: .85em;
    text-align: left;
    font-weight: 400;
    white-space: nowrap;
    text-transform: uppercase
}

.listing thead th.children {
    border: 0
}

.listing thead th a {
    text-decoration: none;
    color: inherit;
    position: relative
}

.listing thead th a.icon:after {
    opacity: .5;
    right: 0
}

.listing.full-width td:first-child, .listing.full-width th:first-child {
    padding-left: 20px
}

.listing.full-width {
    margin-bottom: -3em
}

.listing.full-width th {
    background-color: #fafafa
}

.listing .table-headers {
    border-bottom: 1px solid #e6e6e6
}

.listing tbody {
    border-bottom: 1px dashed #e6e6e6
}

.listing tbody tr, .listing tbody tr:first-child {
    border-top: 1px dashed #e6e6e6
}

.listing tbody tr:hover {
    background-color: #fcfcfc
}

.listing.full-width tbody {
    border: 0
}

.listing.chooser tbody .title a {
    display: block
}

body.ready .listing.chooser tbody .title a {
    transition: none
}

.listing.chooser tbody tr:hover {
    background-color: #7c8080;
    color: #fff
}

.listing.chooser tbody tr:hover .title a, .listing.chooser tbody tr:hover .title a:hover {
    color: #fff
}

.listing.chooser tbody tr:hover .parent a {
    color: #3a3838
}

.listing.chooser tbody tr:hover .status-tag {
    border-color: #fff
}

.listing.chooser tbody tr.disabled td {
    opacity: .25
}

.listing.chooser tbody tr.disabled td.children {
    opacity: 1
}

.listing.chooser tbody tr.disabled:hover {
    background-color: inherit;
    color: inherit
}

.listing.chooser tbody tr.disabled:hover .title {
    cursor: not-allowed
}

.listing.chooser tbody tr.disabled:hover .status-tag {
    border-color: inherit
}

.listing.small tbody tr {
    font-size: 1em
}

.listing.full-width .divider td {
    padding-left: 20px
}

.listing .bulk {
    padding-right: 0
}

.listing .bulk label {
    font-size: 1em;
    display: block;
    width: 100%;
    position: relative
}

.listing .bulk label span {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.listing .bulk label span:active, .listing .bulk label span:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.listing .bulk input {
    margin-top: 3px
}

.listing .title {
    color: #4d4d4d
}

.listing .title h2 {
    text-transform: none;
    margin: 0;
    font-size: 1.15em;
    font-weight: 600;
    color: inherit;
    line-height: 1.5em
}

.listing .title h2 a {
    color: inherit;
    text-decoration: none
}

.listing .title h2 a:hover {
    color: #7c8080
}

.listing .actions {
    margin-top: .8em;
    text-transform: uppercase;
    margin-bottom: -.5em;
    font-size: .8rem
}

.listing .actions:after, .listing .actions:before {
    content: " ";
    display: table
}

.listing .actions:after {
    clear: both
}

.listing .actions a {
    text-decoration: none
}

.listing .actions > li {
    float: left;
    padding: 0 .5em 0 0;
    margin: 0 0 .5em
}

.listing .button-secondary {
    border-color: #d9d9d9;
    background: #fff
}

.listing .button-secondary:hover {
    border-color: #7c8080;
    background-color: #7c8080
}

.listing .button-secondary {
    background-color: #fff
}

.listing .moderate-actions form {
    float: left;
    margin: 0 1em 1em 0
}

.listing .children, .listing .no-children {
    padding: 0
}

.listing .children:hover, .listing .no-children:hover {
    background-color: #fafafa
}

.listing .children a, .listing .no-children a {
    display: block;
    padding: 2em 0
}

.listing .children a {
    color: #7c8080;
    display: block
}

.listing .children a:before {
    font-size: 3rem
}

.listing .no-children a {
    color: #d9d9d9;
    display: block
}

.listing .no-children a:before {
    font-size: 1.5rem
}

.listing .no-children a:hover {
    color: #7c8080
}

.listing.small .children a:before {
    font-size: 30px
}

.listing.full-width th:first-child.ord, .listing th.ord {
    padding-left: 25px
}

.listing th.ord a:before {
    width: 1em;
    font-size: 15px
}

.listing th.ord a:hover:before {
    color: #7c8080
}

.listing .handle {
    cursor: move;
    width: 20px
}

.listing .handle:before {
    font-size: 20px;
    color: #d9d9d9;
    width: 1em
}

.listing .handle:hover:before {
    color: #666
}

.listing .ui-sortable-helper {
    border: 1px dashed #e6e6e6;
    border-width: 1px 0
}

.listing .ui-sortable-helper td {
    display: none
}

.listing .ui-sortable-helper .ord, .listing .ui-sortable-helper .title {
    display: table-cell
}

.listing .dropzone {
    height: 80px
}

.listing .dropzone, .listing .dropzone:hover {
    background-color: #333
}

.listing .dropzone td {
    padding: 0
}

.listing table .no-results-message {
    padding-left: 20px
}

.listing .unpublished h2 {
    opacity: .7
}

.listing .index {
    background-color: #e6e6e6
}

.listing .index .title h2 {
    font-size: 1.2em;
    opacity: 1
}

body.ready .listing .index .title h2 a {
    transition: opacity .2s ease
}

.listing .index .title h2 a:hover {
    opacity: .7
}

.listing .index .actions {
    margin-top: 1em
}

.listing .index .button {
    background-color: #fff;
    color: #7c8080;
    border-color: #7c8080
}

.listing .index .button:hover {
    color: #fff;
    background: #4a4e4e;
    border-color: #4a4e4e
}

.listing .index .button:active {
    color: #fff;
    background: #333;
    border-color: #333
}

.listing .index .button.bicolor {
    background: #4a4e4e;
    border: 1px solid #276766
}

.listing .index .button.bicolor:active {
    color: #fff;
    background: #484848;
    border-color: #333
}

.listing .indicator {
    margin-right: 0;
    font-size: 1em;
    opacity: .7
}

.listing.images img {
    border: 3px solid #fff
}

body.ready .listing.images img {
    transition: border-color .2s ease
}

.image-choice {
    color: inherit;
    overflow-wrap: break-word;
    word-wrap: break-word
}

ul.listing {
    border-top: 1px dashed #e6e6e6;
    margin-bottom: 2em
}

table.listing {
    width: 100%
}

.page-explorer .listing {
    position: relative
}

.page-explorer .listing .index {
    color: #fff;
    background-color: #7c8080
}

.page-explorer .listing .index td {
    padding-top: 1.5em;
    padding-bottom: 1.5em
}

.page-explorer .listing .index .privacy-indicator {
    font-size: 1em;
    opacity: 1;
    position: absolute;
    right: 10%;
    top: 2em
}

.page-explorer .listing .index .locked-indicator {
    font-size: .8em
}

.page-explorer .listing .index .title h2 {
    color: #fff;
    font-size: 1.8em;
    font-weight: 500
}

.page-explorer .listing .index .title h2 a:hover {
    color: #fff
}

.page-explorer .listing .index .button {
    background-color: transparent;
    color: #fff;
    border-color: #4a4e4e
}

.page-explorer .listing .index .button:hover {
    color: #fff;
    background: #4a4e4e
}

.page-explorer .listing .index .button.bicolor {
    background: #4a4e4e
}

.page-explorer .listing .table-headers .ord {
    padding-right: 0
}

.page-explorer .listing .table-headers .title, .page-explorer .listing tbody .title {
    padding-left: 0
}

.pagination {
    text-align: center
}

.pagination p {
    margin: 0
}

.pagination ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

.pagination ul, .pagination ul li {
    list-style-type: none;
    font-style: normal
}

.pagination ul {
    margin-top: -1.7em
}

.pagination li {
    line-height: 1em
}

.pagination .prev {
    float: left
}

.pagination .next {
    float: right
}

.listing.full-width + .pagination {
    margin-top: 3em;
    border-top: 1px dashed #d9d9d9;
    padding: 2em 50px 0
}

.listing-filter {
    background-color: #fafafa;
    border-width: 1px 0;
    margin: 3em 0
}

.listing-filter:after, .listing-filter:before {
    content: " ";
    display: table
}

.listing-filter:after {
    clear: both
}

.filter-title {
    float: left;
    text-transform: uppercase;
    font-size: .95em;
    padding: 1em;
    margin: 0 1em 0 0;
    background-color: #e6e6e6
}

.filter-options {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    overflow: hidden
}

.filter-options, .filter-options li {
    list-style-type: none;
    font-style: normal
}

.filter-options:after, .filter-options:before {
    content: " ";
    display: table
}

.filter-options:after {
    clear: both
}

.filter-options li {
    padding: .8em;
    float: left
}

@media screen and (min-width: 50em) {
    .listing.horiz > li {
        float: left
    }

    .listing.images {
        border: 1px solid #e6e6e6;
        border-width: 0 0 0 1px
    }

    .listing.images:after, .listing.images:before {
        content: " ";
        display: table
    }

    .listing.images:after {
        clear: both
    }

    .listing.images > li {
        padding: 1.3em;
        width: 200px;
        height: 220px;
        text-align: center;
        margin-top: -1px;
        border: 1px solid #e6e6e6;
        border-width: 1px 1px 1px 0
    }

    .listing.images > li .image {
        text-align: center;
        height: 180px
    }

    .listing.images > li .image:before {
        content: "";
        height: 100%;
        margin-right: -.25em
    }

    .listing.images > li .image:before, .listing.images > li .image img {
        display: inline-block;
        vertical-align: middle
    }

    .listing.images > li:hover {
        background-color: #fdfdfd
    }

    .listing.images > li:hover img {
        border-color: #7c8080
    }

    .listing .actions {
        visibility: hidden
    }

    .listing .index .actions, .listing td:hover .actions {
        visibility: visible
    }

    .listing .no-children {
        border-color: transparent
    }

    .listing .no-children a {
        opacity: 0
    }

    .listing tr:hover .no-children a {
        opacity: 1
    }

    .listing tr:hover .children {
        background-color: #7c8080
    }

    .listing tr:hover .children a:before {
        color: #fff
    }

    .listing td.children:hover {
        background-color: #4a4e4e
    }

    .listing table .no-results-message {
        padding-left: 50px
    }

    .listing.full-width td:first-child, .listing.full-width th:first-child {
        padding-left: 25px
    }

    .listing.full-width .divider td {
        padding-left: 50px
    }
}

.listing__item--active > .actions {
    visibility: visible
}

body.ready .listing thead .dropdown ul {
    transition: none
}

body.ready .listing .children, body.ready .listing .no-children {
    transition: background-color .2s ease
}

body.ready .listing .children a, body.ready .listing .no-children a {
    transition: all .2s ease
}

td.ord .handle {
    margin-top: -28px
}

table.listing th.ordered {
    color: #7c8080
}

table.listing th.ordered.ascending:before {
    content: "\25B2";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

table.listing th.ordered.descending:before {
    content: "\25BC";
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.messages {
    position: relative;
    z-index: 5;
    background-color: #333
}

.messages .buttons {
    margin-left: 1em
}

.messages > ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    position: relative;
    top: -100px;
    opacity: 0
}

.messages > ul, .messages > ul > li {
    list-style-type: none;
    font-style: normal
}

.messages > ul > li {
    padding: 1.6em 3em 1.6em 1.6em;
    color: #fff
}

.messages > ul > li:before {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin-right: .5em;
    font-size: 1.5em;
    vertical-align: middle
}

.messages .error {
    background-color: #cd3238
}

.messages .error:before {
    font-family: wagtail;
    content: "!"
}

.messages .warning {
    background-color: #e9b04d
}

.messages .warning:before {
    font-family: wagtail;
    content: "!"
}

.messages .success {
    background-color: #189370
}

.messages .success:before {
    font-family: wagtail;
    content: "9"
}

.messages .success .button:hover {
    background-color: #3a3838
}

.messages .button-secondary {
    border-color: hsla(0, 0%, 100%, .5);
    color: hsla(0, 0%, 100%, .8)
}

.messages .button-secondary:hover {
    border-color: transparent;
    color: #fff
}

.messages .errorlist {
    margin: .5em 0 0 1em
}

.messages.new > ul {
    transition: none;
    top: -100px
}

.messages.appear > ul, .ready .messages > ul {
    transition: top .5s ease, opacity .5s ease, max-height 1.2s ease;
    opacity: 1;
    top: 0
}

@media screen and (min-width: 50em) {
    .messages > ul > li {
        padding-left: 1.6em;
        padding-right: 3em
    }
}

.avatar {
    border-radius: 100%;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    overflow: hidden;
    width: 50px;
    height: 50px
}

.avatar img {
    border-radius: 100%;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    border: 0
}

.avatar.small {
    vertical-align: middle;
    margin: 0 .5em;
    width: 25px;
    height: 25px
}

.avatar.square, .avatar.square:before, .avatar.square img {
    border-radius: 0
}

.media-placeholder {
    width: 600px;
    height: 400px;
    background-color: #ccc;
    padding: 5px
}

.media-placeholder h3, .media-placeholder p {
    margin: 0
}

.media-placeholder img {
    max-width: 350px;
    max-height: 350px;
    margin: 20px
}

.human-readable-date {
    overflow: hidden;
    display: block;
    position: relative
}

.human-readable-date:before {
    position: absolute;
    display: none;
    content: attr(title)
}

.human-readable-date:hover {
    visibility: hidden
}

.human-readable-date:hover:before {
    visibility: visible;
    display: block
}

.nolink {
    color: #666
}

.nolink:hover {
    color: #7c8080
}

.status-tag {
    border-radius: 2px;
    text-align: center;
    display: inline-block;
    text-transform: uppercase;
    padding: 0 .5em;
    border: 1px solid #b3b3b3;
    color: #b3b3b3;
    -webkit-font-smoothing: auto;
    line-height: 19px;
    font-size: .8em;
    margin: 0 .5em .5em;
    background: #fff url(../../wagtailadmin/images/bg-dark-diag.svg)
}

.status-tag.primary {
    color: #666;
    border: 1px solid #666;
    background: #fff
}

.status-tag.disabled {
    pointer-events: none
}

a.status-tag.primary:hover, a.status-tag:hover, button.status-tag:hover {
    border-color: #7c8080;
    color: #7c8080
}

button.status-tag:hover {
    border-color: #3a3838;
    background-color: #4a4e4e;
    color: #fff
}

.privacy-indicator .label-private:before, .privacy-indicator .label-public:before {
    font-size: 1.5em;
    color: #7c8080
}

.privacy-indicator.private .label-public, .privacy-indicator.public .label-private {
    display: none
}

.tag {
    border-radius: 2px;
    background-color: #7c8080;
    padding-right: .5em;
    padding: .2em .5em;
    color: #fff;
    line-height: 2em;
    white-space: nowrap
}

.tag:before {
    font-family: wagtail;
    display: inline-block;
    color: #fff;
    content: "u";
    padding-right: .5em
}

.taglist .tag {
    margin-right: .8em
}

a.tag:hover {
    background-color: #4a4e4e;
    color: #fff
}

.taglist {
    font-size: .9em;
    line-height: 2.4em
}

.taglist h3 {
    display: inline;
    margin-right: 1em
}

.loading-mask.loading {
    position: relative
}

.loading-mask.loading:after, .loading-mask.loading:before {
    position: absolute;
    display: block
}

.loading-mask.loading:before {
    content: "";
    top: -5px;
    left: -5px;
    bottom: -5px;
    right: -5px;
    z-index: 1;
    background-color: hsla(0, 0%, 100%, .5)
}

.loading-mask.loading:after {
    font-size: 30px;
    width: 30px;
    line-height: 30px;
    left: 50%;
    top: 50%;
    margin: -15px 0 0 -15px;
    font-family: wagtail;
    animation: a .5s infinite linear;
    content: "1";
    z-index: 2;
    color: #7c8080
}

hr {
    border: 1px solid #e6e6e6;
    border-width: 1px 0 0;
    margin: 1.5em 0
}

img {
    max-width: 100%;
    height: auto
}

.show-transparency {
    background: url(../../wagtailadmin/images/transparency.svg)
}

.inline {
    display: inline
}

.inline-block {
    display: inline-block
}

.block {
    display: block
}

.unlist {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

.unlist, .unlist li {
    list-style-type: none;
    font-style: normal
}

.overflow {
    overflow: auto
}

.status-msg.success {
    color: #189370
}

.status-msg.failure {
    color: #cd3238
}

header {
    padding-top: 1em;
    padding-bottom: 1em;
    background-color: #7c8080;
    margin-bottom: 2em
}

header, header a {
    color: #fff
}

header h1, header h2 {
    margin: 0;
    color: #fff
}

header h1 {
    padding: .2em 0
}

header h1.icon:before {
    width: 1em;
    display: none;
    margin-right: .4em;
    font-size: 1.5em
}

header .col {
    float: left;
    margin-right: 2em
}

header .left {
    float: left
}

.hasform header .left:first-child {
    padding-bottom: .5em;
    float: none
}

header .right {
    text-align: right;
    float: right
}

header.merged {
    margin-bottom: 0
}

header.no-border, header.tab-merged {
    border: 0
}

@media screen and (max-width: 50em) {
    header.no-border, header.tab-merged {
        padding-left: 50px;
        padding-top: 11px
    }
}

header.merged.no-border {
    padding-bottom: 0
}

header.no-v-padding {
    padding-top: 0;
    padding-bottom: 0
}

header .button {
    background-color: #4a4e4e
}

header .button:hover {
    background-color: #3a3838
}

header label {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

header label:active, header label:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

header input[type=text], header select {
    border-width: 0
}

header input[type=text]:focus, header select:focus {
    background-color: #fff
}

header .fields {
    margin-top: -.5em
}

header .fields li {
    padding-bottom: 0
}

header .fields .field {
    padding: 0
}

header .field-content {
    width: auto;
    padding: 0
}

@media screen and (min-width: 50em) {
    header {
        padding-top: 1.5em;
        padding-bottom: 1.5em
    }

    header .left {
        float: left;
        margin-right: 0
    }

    header .left:first-child {
        padding-bottom: 0;
        float: left
    }

    header .second {
        clear: none
    }

    header .second .left, header .second .right {
        float: right
    }

    header h1.icon:before {
        display: inline-block
    }

    header .col3 {
        box-sizing: border-box;
        display: inline;
        float: left;
        width: 25%;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    header .col3.addbutton {
        width: auto
    }

    header .col6 {
        width: 50%
    }

    header .col6, header .col9 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    header .col9 {
        width: 75%
    }
}

@media screen and (max-width: 50em) {
    .header-title {
        padding-left: 50px
    }
}

.progress {
    border-radius: 1.2em;
    background-color: #3a3838;
    border: 1px solid #7c8080;
    opacity: 0
}

.progress.active {
    opacity: 1
}

body.ready .progress.active {
    transition: opacity .3s ease
}

.progress .bar {
    border-radius: 1.5em;
    overflow: hidden;
    box-sizing: border-box;
    text-align: right;
    line-height: 1.2em;
    color: #fff;
    font-size: .85em;
    background-color: #7c8080;
    height: 1.2em;
    padding-right: 1em
}

body.ready .progress .bar {
    transition: width .3s ease
}

.xdsoft_datetimepicker {
    box-shadow: 0 5px 10px -5px rgba(0, 0, 0, .4);
    background: #fff;
    border: 1px solid #54d0d0;
    padding: 8px;
    padding-left: 0;
    padding-top: 2px;
    position: absolute;
    z-index: 5;
    box-sizing: border-box;
    display: none
}

.xdsoft_datetimepicker * {
    box-sizing: border-box;
    padding: 0;
    margin: 0
}

.xdsoft_datetimepicker iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 75px;
    height: 210px;
    background: transparent;
    border: 0
}

.xdsoft_datetimepicker .xdsoft_datepicker, .xdsoft_datetimepicker .xdsoft_timepicker {
    display: none
}

.xdsoft_datetimepicker .xdsoft_datepicker.active, .xdsoft_datetimepicker .xdsoft_timepicker.active {
    display: block
}

.xdsoft_datetimepicker .xdsoft_datepicker {
    float: left;
    margin-left: 8px
}

.xdsoft_datetimepicker .xdsoft_datepicker.active + .xdsoft_timepicker {
    margin-top: 8px;
    margin-bottom: 3px
}

.xdsoft_datetimepicker .xdsoft_mounthpicker {
    position: relative;
    text-align: center
}

.xdsoft_datetimepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_prev, .xdsoft_datetimepicker .xdsoft_today_button {
    background-color: transparent;
    cursor: pointer;
    display: block;
    border: 0;
    overflow: hidden;
    padding: 5px 0;
    position: relative;
    white-space: nowrap;
    width: 2em;
    color: #7c8080;
    text-transform: none;
    text-align: center
}

.xdsoft_datetimepicker .xdsoft_next:before, .xdsoft_datetimepicker .xdsoft_prev:before, .xdsoft_datetimepicker .xdsoft_today_button:before {
    font-size: 1.5em;
    font-family: wagtail;
    width: 1em;
    line-height: 1.3em;
    text-align: center;
    margin: 0
}

.xdsoft_datetimepicker .xdsoft_next:hover, .xdsoft_datetimepicker .xdsoft_prev:hover, .xdsoft_datetimepicker .xdsoft_today_button:hover {
    color: #4a4e4e
}

.xdsoft_datetimepicker .xdsoft_prev {
    float: left
}

.xdsoft_datetimepicker .xdsoft_prev:before {
    content: "z"
}

.xdsoft_datetimepicker .xdsoft_today_button {
    float: left;
    margin-left: 5px
}

.xdsoft_datetimepicker .xdsoft_today_button:before {
    content: "W"
}

.xdsoft_datetimepicker .xdsoft_next {
    float: right
}

.xdsoft_datetimepicker .xdsoft_next:before {
    content: "n"
}

.xdsoft_datetimepicker .xdsoft_timepicker {
    width: 70px;
    float: left;
    text-align: center;
    margin-left: 8px;
    margin-top: 0
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev {
    float: none;
    height: 1.5em;
    display: block;
    text-align: center;
    width: 100%;
    padding: 0
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next:before, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev:before {
    width: 100%
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_prev:before {
    content: "e"
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_next:before {
    content: "q"
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box {
    position: relative;
    border: 1px solid #ccc;
    height: 170px;
    overflow: hidden;
    border-bottom: 1px solid #ddd
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div {
    background: #f5f5f5;
    border-top: 1px solid #ddd;
    color: #666;
    font-size: 1em;
    text-align: center;
    border-collapse: collapse;
    cursor: pointer;
    border-bottom-width: 0;
    height: 2.3em;
    line-height: 2.3em
}

.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:first-child {
    border-top-width: 0
}

.xdsoft_datetimepicker .xdsoft_label {
    display: inline;
    position: relative;
    z-index: 9999;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 700;
    background-color: #fff;
    float: left;
    width: 182px;
    text-align: center;
    cursor: pointer
}

.xdsoft_datetimepicker .xdsoft_label:hover {
    text-decoration: underline
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select {
    border: 1px solid #ccc;
    position: absolute;
    right: 0;
    top: 30px;
    z-index: 101;
    display: none;
    background: #fff;
    max-height: 160px;
    overflow-y: hidden
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_monthselect {
    right: -7px
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select.xdsoft_yearselect {
    right: 2px
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover {
    color: #fff;
    background: #ff8000
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option {
    padding: 2px 15px 2px 5px
}

.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {
    background: #3af;
    color: #fff;
    font-weight: 700
}

.xdsoft_datetimepicker .xdsoft_month {
    width: 90px;
    text-align: right
}

.xdsoft_datetimepicker .xdsoft_year {
    width: 56px
}

.xdsoft_datetimepicker .xdsoft_calendar {
    clear: both
}

.xdsoft_datetimepicker .xdsoft_calendar table {
    border-collapse: collapse
}

.xdsoft_datetimepicker .xdsoft_calendar td > div {
    padding-right: 5px
}

.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th {
    width: 14.285%;
    border: 1px solid #ddd;
    color: #666;
    font-size: 12px;
    text-align: right;
    padding: 5px 7px;
    border-collapse: collapse;
    cursor: pointer;
    height: 25px
}

.xdsoft_datetimepicker .xdsoft_calendar td {
    background-color: #fff
}

.xdsoft_datetimepicker .xdsoft_calendar th {
    background: #f1f1f1;
    font-weight: 700;
    font-size: .85em;
    text-align: center;
    cursor: default
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div.xdsoft_current {
    background: #f37e77;
    color: #fff;
    font-weight: 700
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_disabled, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month, .xdsoft_datetimepicker .xdsoft_time_box > div > div.xdsoft_disabled {
    opacity: .5;
    background: #d9d9d9
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_other_month.xdsoft_disabled {
    opacity: .2
}

.xdsoft_datetimepicker .xdsoft_calendar td:hover, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box > div > div:hover {
    color: #fff;
    background: #7c8080
}

.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today {
    font-weight: 700
}

.xdsoft_noselect {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.xdsoft_noselect::-moz-selection {
    background: transparent
}

.xdsoft_noselect::selection {
    background: transparent
}

.xdsoft_noselect::-moz-selection {
    background: transparent
}

.xdsoft_datetimepicker.xdsoft_inline {
    display: inline-block;
    position: static;
    box-shadow: none
}

.xdsoft_scroller_box {
    position: relative
}

.xdsoft_scrollbar {
    position: absolute;
    width: 7px;
    right: 0;
    top: 0;
    bottom: 0;
    cursor: pointer
}

.xdsoft_scrollbar > .xdsoft_scroller {
    background: #ccc !important;
    height: 20px;
    border-radius: 3px
}

.nav-wrapper {
    position: relative;
    margin-left: -180px;
    width: 180px;
    float: left;
    display: flex;
    flex-direction: column;
    height: 100%
}

.nav-wrapper, .nav-wrapper .inner {
    background: #333
}

.nav-toggle.icon {
    position: absolute;
    padding-left: 20px;
    cursor: pointer
}

.nav-toggle.icon:before {
    position: relative;
    top: 3px;
    font-size: 40px;
    color: #fff;
    line-height: 40px;
    content: "\2261"
}

.nav-main li, .nav-main ul {
    margin: 0;
    padding: 0;
    list-style-type: none
}

.nav-main li {
    position: relative
}

body.ready .nav-main li {
    transition: border-color .2s ease
}

.nav-main a {
    -webkit-font-smoothing: auto;
    text-decoration: none;
    display: block;
    color: #cacaca;
    padding: .8em 1.7em;
    font-size: 1em;
    font-weight: 400
}

body.ready .nav-main a {
    transition: border-color .2s ease
}

.nav-main a:focus, .nav-main a:hover {
    outline: none;
    background-color: hsla(0, 0%, 39%, .15);
    color: #fff;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, .3)
}

.nav-main .menu-item a {
    position: relative;
    white-space: nowrap;
    border-left: 3px solid transparent
}

.nav-main .menu-item a:before {
    font-size: 1rem;
    vertical-align: -20%;
    margin-right: .5em
}

.nav-main .menu-item a:after {
    font-size: 1.5em;
    margin: 0;
    position: absolute;
    right: .5em;
    top: .5em;
    margin-top: 0
}

.nav-main .menu-active {
    background: #1a1a1a;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, .3)
}

.nav-main .menu-active > a {
    border-left-color: #f37e77;
    color: #fff
}

.nav-main .footer-submenu a {
    border-left: 3px solid transparent;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.nav-main .footer-submenu a:before {
    font-size: 1rem;
    margin-right: .5em;
    vertical-align: -10%
}

.nav-main .account {
    display: none
}

@media only screen and (min-width: 50em) {
    .submenu-trigger:after {
        content: "n";
        width: auto
    }

    body.ready .submenu-trigger:after {
        transition: transform .3s ease
    }

    .submenu-active > .submenu-trigger:after {
        transform-origin: 50% 50%;
        transform: rotate(180deg)
    }
}

.nav-submenu {
    background: #262626
}

.nav-submenu h2 {
    display: none
}

.nav-submenu .menu-item a {
    white-space: normal;
    padding: .9em 1.7em .9em 4.5em
}

.nav-submenu .menu-item a:before {
    margin-left: -1.5em
}

.nav-submenu .menu-item a:hover {
    background-color: hsla(0, 0%, 39%, .2)
}

.nav-submenu li {
    border: 0
}

.nav-submenu .wagtail-version {
    padding: 1.2em 1.7em;
    text-align: center
}

.nav-search {
    position: relative;
    padding: 0 1em 1em;
    margin: 0;
    width: 100%;
    box-sizing: border-box
}

.nav-search label {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.nav-search label:active, .nav-search label:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.nav-search button, .nav-search input {
    border-radius: 0;
    font-size: 1em;
    border: 0
}

.nav-search input {
    cursor: pointer;
    border: 1px solid #999;
    background-color: #333;
    color: #ccc;
    padding: .8em 2.5em .8em 1em;
    font-weight: 600
}

.nav-search input:hover {
    background-color: hsla(0, 0%, 39%, .15)
}

.nav-search input:active, .nav-search input:focus {
    background-color: hsla(0, 0%, 39%, .15);
    color: #fff
}

.nav-search input:-ms-input-placeholder {
    color: #ccc
}

.nav-search input::-ms-input-placeholder {
    color: #ccc
}

.nav-search input::placeholder {
    color: #ccc
}

.nav-search button {
    background-color: transparent;
    position: absolute;
    top: 0;
    right: 1em;
    bottom: 0;
    padding: 0;
    width: 3em
}

.nav-search button:hover {
    background-color: hsla(0, 0%, 39%, .15)
}

.nav-search button:active {
    background-color: #1a1a1a
}

.nav-search button:before {
    font-family: wagtail;
    font-weight: 200;
    text-transform: none;
    content: "f";
    display: block;
    height: 100%;
    line-height: 3.3em;
    padding: 0 1em
}

body.nav-open .wrapper {
    transform: translate3d(180px, 0, 0)
}

body.nav-open .content-wrapper {
    position: fixed
}

body.nav-open footer {
    bottom: 1px
}

body.explorer-open .wrapper {
    transform: translate3d(320px, 0, 0)
}

body.explorer-open .nav-wrapper {
    margin-left: -320px;
    width: 320px
}

body.explorer-open .nav-main {
    display: none
}

@media screen and (min-width: 50em) {
    .wrapper, body.nav-open .wrapper {
        transform: none;
        padding-left: 180px
    }

    .nav-wrapper {
        position: absolute;
        left: 0;
        height: 100%;
        margin-left: 0
    }

    .nav-wrapper .inner {
        height: 100%;
        position: fixed;
        width: 180px;
        z-index: 26
    }

    .nav-toggle {
        display: none
    }

    .nav-main {
        position: absolute;
        top: 175px;
        bottom: 0;
        margin-bottom: 127px;
        width: 100%;
        overflow: auto
    }

    .nav-main .footer {
        position: fixed;
        width: 180px;
        bottom: 0
    }

    .nav-main .footer-open .footer-submenu {
        max-height: 127px
    }

    .nav-main .footer-submenu {
        background-color: #262626;
        overflow: hidden;
    }

    body.ready .nav-main .footer-submenu {
        transition: max-height .2s ease
    }

    .nav-main .account {
        background: #1a1a1a;
        color: #cacaca;
        text-transform: uppercase;
        display: block;
        cursor: pointer
    }

    .nav-main .account:after, .nav-main .account:before {
        content: " ";
        display: table
    }

    .nav-main .account:after {
        clear: both
    }

    .nav-main .account:hover {
        outline: none;
        background-color: hsla(0, 0%, 39%, .15);
        color: #fff;
        text-shadow: -1px -1px 0 rgba(0, 0, 0, .3)
    }

    .nav-main .account .avatar {
        float: left;
        margin-right: .9em
    }

    .nav-main .account .avatar:before {
        color: inherit;
        border-color: inherit
    }

    .nav-main .account em {
        box-sizing: border-box;
        padding-right: 1.8em;
        margin-top: 1.2em;
        font-style: normal;
        font-weight: 700;
        width: 110px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        float: left
    }

    .nav-main .account em:after {
        font-size: 1.5em;
        position: absolute;
        right: .25em
    }

    .nav-submenu {
        transform: translateZ(0);
        position: fixed;
        height: 100%;
        width: 0;
        padding: 0;
        top: 0;
        left: 180px;
        overflow: auto;
        max-height: 100%
    }

    .nav-submenu h2, .nav-submenu ul {
        float: right;
        width: 180px
    }

    .nav-submenu h2 {
        display: block;
        padding: .2em 0;
        font-size: 1.2em;
        font-weight: 500;
        text-transform: none;
        text-align: center;
        color: #cacaca
    }

    .nav-submenu h2:before {
        font-size: 4em;
        display: block;
        text-align: center;
        margin: 0 0 .2em;
        width: 100%;
        opacity: .15
    }

    .nav-submenu .footer {
        position: absolute
    }

    li.submenu-active {
        background: #262626
    }

    li.submenu-active > a {
        text-shadow: -1px -1px 0 rgba(0, 0, 0, .3)
    }

    li.submenu-active > a:hover {
        background-color: transparent
    }

    li.submenu-active .nav-submenu {
        box-shadow: 2px 0 2px rgba(0, 0, 0, .35);
        width: 180px;
        padding: 0 0 1.5em
    }

    body.ready li.submenu-active .nav-submenu {
        transition: width .2s ease
    }

    li.submenu-active .nav-submenu a {
        padding-left: 3.5em
    }

    body.nav-open .content-wrapper {
        position: relative
    }

    body.explorer-open {
        overflow: hidden
    }

    body.explorer-open:after {
        opacity: 1;
        visibility: visible
    }

    body.explorer-open .wrapper {
        transform: none
    }

    body.explorer-open .nav-wrapper {
        margin-left: 0;
        width: 180px
    }

    body.explorer-open .nav-main {
        display: block
    }
}

@media (-ms-high-contrast: none), all and (-ms-high-contrast: active) {
    .wrapper {
        left: 0
    }

    body.ready .wrapper {
        transition: left .2s ease
    }

    body.nav-open .wrapper {
        transform: none;
        left: 180px;
        position: relative
    }

    body.explorer-open .wrapper {
        transform: none;
        left: 320px
    }

    body.explorer-open .nav-wrapper {
        width: 320px
    }
}

@media (min-width: 50em) and (-ms-high-contrast: none), all and (min-width: 50em) and (-ms-high-contrast: active) {
    body.explorer-open .wrapper {
        left: 0
    }

    body.explorer-open .nav-wrapper {
        width: 180px
    }
}

.c-indicator {
    display: inline-block;
    border-radius: 50rem;
    width: .625em;
    height: .625em;
    margin-top: -.125rem;
    margin-right: .25rem;
    font-size: 1rem;
    vertical-align: middle
}

.is-absent .c-indicator {
    background: #ff8f11
}

.is-live .c-indicator {
    background: #59b524
}

.is-draft .c-indicator {
    background: gray
}

.is-live\+draft .c-indicator {
    background: gray;
    position: relative
}

.is-live\+draft .c-indicator:before {
    content: "";
    width: .3125em;
    height: .625em;
    position: absolute;
    top: 0;
    left: 0;
    border-bottom-left-radius: 50rem;
    border-top-left-radius: 50rem;
    background: #59b524;
    transform: rotate(45deg);
    transform-origin: 100% 50%
}

.tooltip {
    position: absolute;
    z-index: 1030;
    display: block;
    font-size: 12px;
    line-height: 1.4;
    opacity: 0;
    visibility: visible
}

.tooltip.in {
    opacity: .9
}

.tooltip.top {
    padding: 5px 0
}

.tooltip.right {
    padding: 0 5px
}

.tooltip.bottom {
    padding: 5px 0
}

.tooltip.left {
    padding: 0 5px
}

.tooltip-inner {
    max-width: 200px;
    padding: 3px 8px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    background-color: #000;
    border-radius: 4px
}

.tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid
}

.tooltip.top .tooltip-arrow {
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.top-left .tooltip-arrow {
    bottom: 0;
    left: 5px;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.top-right .tooltip-arrow {
    right: 5px;
    bottom: 0;
    border-top-color: #000;
    border-width: 5px 5px 0
}

.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-right-color: #000;
    border-width: 5px 5px 5px 0
}

.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-left-color: #000;
    border-width: 5px 0 5px 5px
}

.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

.tooltip.bottom-left .tooltip-arrow {
    top: 0;
    left: 5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

.tooltip.bottom-right .tooltip-arrow {
    top: 0;
    right: 5px;
    border-bottom-color: #000;
    border-width: 0 5px 5px
}

@keyframes c {
    0% {
        transform: rotate(2deg)
    }
    to {
        transform: rotate(8deg)
    }
}

@keyframes d {
    0% {
        transform: rotate(-3deg)
    }
    to {
        transform: rotate(7deg)
    }
}

.logo {
    display: block;
    text-align: left;
    text-decoration: none;
    color: #aaa;
    padding: .9em 1.2em;
    margin: 0;
    -webkit-font-smoothing: auto
}

@media screen and (min-width: 50em) {
    .logo {
        margin: 1em auto;
        text-align: center
    }
}

.wagtail-logo-container__mobile .wagtail-logo {
    width: 20px;
    float: left;
    border: 0;
    margin-right: 1em
}

.wagtail-logo-container__mobile:hover {
    color: #fff
}

.wagtail-logo-container__desktop {
    display: block;
    margin: auto;
    width: 60px;
    height: 75px;
    position: relative;
    transition: all .25s cubic-bezier(.28, .15, 0, 2.1)
}

.wagtail-logo-container__desktop .wagtail-logo {
    display: block;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    transition: inherit
}

.wagtail-logo-container__desktop .wagtail-logo.wagtail-logo__eye--open {
    display: inline !important
}

.wagtail-logo-container__desktop .wagtail-logo.wagtail-logo__eye--closed {
    display: none !important
}

.wagtail-logo-container__desktop.logo-serious:hover {
    transform: rotate(4deg)
}

.wagtail-logo-container__desktop.logo-playful:hover {
    animation: c 1.2s forwards
}

.wagtail-logo-container__desktop.logo-playful:hover .wagtail-logo.wagtail-logo__tail {
    animation: d .09s alternate;
    animation-iteration-count: infinite
}

.wagtail-logo-container__desktop.logo-playful:hover .wagtail-logo.wagtail-logo__eye--open {
    display: none !important
}

.wagtail-logo-container__desktop.logo-playful:hover .wagtail-logo.wagtail-logo__eye--closed {
    display: inline !important
}

@font-face {
    font-family: Open Sans;
    src: url(../../wagtailadmin/fonts/opensans-light.woff2) format("woff2"), url(../../wagtailadmin/fonts/opensans-light.woff) format("woff"), url(../../wagtailadmin/fonts/opensans-light.ttf) format("truetype");
    font-weight: 300;
    font-style: normal
}

@font-face {
    font-family: Open Sans;
    src: url(../../wagtailadmin/fonts/opensans-regular.woff2) format("woff2"), url(../../wagtailadmin/fonts/opensans-regular.woff) format("woff"), url(../../wagtailadmin/fonts/opensans-regular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Open Sans;
    src: url(../../wagtailadmin/fonts/opensans-semibold.woff2) format("woff2"), url(../../wagtailadmin/fonts/opensans-semibold.woff) format("woff"), url(../../wagtailadmin/fonts/opensans-semibold.ttf) format("truetype");
    font-weight: 600;
    font-style: normal
}

@font-face {
    font-family: Open Sans;
    src: url(../../wagtailadmin/fonts/opensans-bold.woff2) format("woff2"), url(../../wagtailadmin/fonts/opensans-bold.woff) format("woff"), url(../../wagtailadmin/fonts/opensans-bold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: Roboto Slab;
    src: url(../../wagtailadmin/fonts/robotoslab-regular.woff2) format("woff2"), url(../../wagtailadmin/fonts/robotoslab-regular.woff) format("woff"), url(../../wagtailadmin/fonts/robotoslab-regular.ttf) format("truetype");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: Roboto Slab;
    src: url(../../wagtailadmin/fonts/robotoslab-bold.woff2) format("woff2"), url(../../wagtailadmin/fonts/robotoslab-bold.woff) format("woff"), url(../../wagtailadmin/fonts/robotoslab-bold.ttf) format("truetype");
    font-weight: 700;
    font-style: normal
}

@font-face {
    font-family: wagtail;
    src: url(../../wagtailadmin/fonts/wagtail.woff) format("woff");
    font-weight: 400;
    font-style: normal
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    @font-face {
        font-family: wagtail;
        src: url(../../wagtailadmin/fonts/wagtail.svg#wagtail) format("svg")
    }
}

.o-pill {
    display: inline-block;
    padding: .2em .5em;
    border-radius: .25em;
    vertical-align: middle;
    line-height: 1.5
}

.c-transition-group {
    position: absolute;
    width: 100%;
    top: 0
}

.c-transition-push-enter {
    transform: translateX(100%);
    transition: transform .2s ease, opacity .2s linear;
    opacity: 0
}

.c-transition-push-enter-active, .c-transition-push-leave {
    transform: translateX(0);
    opacity: 1
}

.c-transition-push-leave {
    transition: transform .2s ease, opacity .2s linear
}

.c-transition-pop-enter, .c-transition-push-leave-active {
    transform: translateX(-100%);
    opacity: 0
}

.c-transition-pop-enter {
    transition: transform .2s ease, opacity .2s linear
}

.c-transition-pop-enter-active, .c-transition-pop-leave {
    transform: translateX(0);
    opacity: 1
}

.c-transition-pop-leave {
    transition: transform .2s ease, opacity .2s linear
}

.c-transition-pop-leave-active {
    transform: translateX(100%);
    opacity: 0
}

.c-spinner:after {
    display: inline-block;
    animation: a .5s infinite linear;
    line-height: 1
}

.c-status {
    background: #333;
    text-transform: uppercase;
    letter-spacing: .03rem;
    font-size: 10px
}

.c-explorer__item {
    display: flex;
    flex-flow: row nowrap;
    border-bottom: 1px solid #333
}

.c-explorer__item__link {
    display: inline-flex;
    align-items: center;
    flex-grow: 1;
    padding: 1.45em 1em;
    cursor: pointer
}

.c-explorer__item__link:focus {
    background: rgba(0, 0, 0, .425);
    color: #fff;
    outline: none
}

.c-explorer__item__link:hover {
    color: #fff
}

.no-touch .c-explorer__item__link:hover {
    background: rgba(0, 0, 0, .425)
}

@media only screen and (min-width: 50em) {
    .c-explorer__item__link {
        padding: 1.45em 1.75em
    }
}

.c-explorer__item__link .icon {
    font-size: 2em;
    color: #a5a5a5;
    margin-right: .5rem
}

.c-explorer__item__title {
    margin: 0;
    color: #fff;
    display: inline-block
}

.c-explorer__item__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 50px;
    padding: 0 .5em;
    line-height: 1;
    font-size: 2em;
    cursor: pointer;
    color: #a5a5a5;
    border: 0;
    border-left: 1px solid #333
}

.c-explorer__item__action:focus {
    background: rgba(0, 0, 0, .425);
    color: #fff;
    outline: none
}

.c-explorer__item__action:hover {
    color: #a5a5a5
}

.no-touch .c-explorer__item__action:hover {
    background: rgba(0, 0, 0, .425);
    color: #fff
}

.c-explorer__item__action .icon:before {
    margin-right: 0
}

.c-explorer__item__action--small {
    font-size: 1.2em
}

.c-explorer__meta {
    margin-left: .5rem;
    color: #a5a5a5;
    font-size: 12px
}

.explorer__wrapper, .explorer__wrapper * {
    box-sizing: border-box
}

.explorer__wrapper {
    display: flex;
    flex: 1
}

.explorer {
    width: 100%;
    display: flex;
    flex-direction: column
}

@media only screen and (min-width: 50em) {
    .explorer {
        width: 485px;
        height: 100vh;
        position: fixed;
        z-index: 500;
        left: 180px
    }
}

.c-explorer {
    flex: 1;
    position: relative;
    overflow: hidden;
    background: #4c4e4d
}

@media only screen and (min-width: 50em) {
    .c-explorer {
        box-shadow: 2px 2px 5px rgba(0, 0, 0, .425)
    }
}

.c-explorer > .c-transition-group {
    display: flex;
    flex-direction: column;
    height: 100%;
    z-index: 150
}

.c-explorer__close {
    padding: 1em;
    color: #a5a5a5;
    border-bottom: 1px solid hsla(0, 0%, 78%, .1);
    cursor: pointer
}

.c-explorer__close:focus {
    background-color: rgba(0, 0, 0, .425);
    color: #fff;
    outline: none
}

.c-explorer__close:hover {
    color: #a5a5a5
}

@media only screen and (max-width: 49.9375em) {
    .explorer-open .c-explorer__close {
        display: block
    }
}

.c-explorer__drawer {
    flex: 1;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch
}

.c-explorer__header {
    display: block;
    background-color: #333;
    border-bottom: 1px solid #333;
    color: #fff
}

.c-explorer__header:focus {
    background-color: rgba(0, 0, 0, .425);
    color: #fff;
    outline: none
}

.c-explorer__header:hover {
    color: #fff
}

.no-touch .c-explorer__header:hover {
    background-color: rgba(0, 0, 0, .425)
}

.c-explorer__header__inner {
    padding: 1em .75em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.c-explorer__header__inner .icon {
    color: #a5a5a5;
    margin-right: .25rem;
    font-size: 1rem
}

@media only screen and (min-width: 50em) {
    .c-explorer__header__inner {
        padding: 1em 1.5em
    }
}

.c-explorer__placeholder {
    padding: 1em;
    color: #fff
}

@media only screen and (min-width: 50em) {
    .c-explorer__placeholder {
        padding: 1em 1.75em
    }
}

.c-explorer__see-more {
    display: block;
    padding: 1em;
    background: rgba(0, 0, 0, .3);
    color: #fff
}

.c-explorer__see-more:focus {
    color: #a5a5a5;
    background: rgba(0, 0, 0, .425);
    outline: none
}

.c-explorer__see-more:hover {
    color: #fff
}

.no-touch .c-explorer__see-more:hover {
    background: rgba(0, 0, 0, .425)
}

@media only screen and (min-width: 50em) {
    .c-explorer__see-more {
        padding: 1em 1.75em;
        height: 50px
    }
}

.u-hidden {
    display: none !important
}

@media only screen and (min-width: 50em) {
    .u-hidden\@medium {
        display: none !important
    }
}

@media only screen and (max-width: 49.9375em) {
    .u-hidden\@small {
        display: none !important
    }
}

@media only screen and (min-width: 50em) {
    .u-inline\@medium {
        display: inline !important
    }
}

@media only screen and (max-width: 49.9375em) {
    .u-inline\@small {
        display: inline !important
    }
}

@media only screen and (min-width: 50em) {
    .u-block\@medium {
        display: block !important
    }
}

@media only screen and (max-width: 49.9375em) {
    .u-block\@small {
        display: block !important
    }
}

html {
    background: #e6e6e6;
    height: 100%
}

body {
    -webkit-font-smoothing: antialiased;
    font-family: Open Sans, Arial, sans-serif;
    font-size: 80%;
    line-height: 1.5em;
    color: #666;
    overflow-x: hidden;
    position: relative
}

body.reordering {
    overflow: visible
}

body:after {
    content: "";
    position: fixed;
    transition: visibility 0s linear 0s, opacity .2s ease-out;
    background: hsla(0, 0%, 100%, .5);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 5;
    opacity: 0;
    visibility: hidden
}

.visuallyvisible {
    clip: none;
    height: auto;
    width: auto;
    margin: auto;
    overflow: visible;
    position: static
}

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.visuallyhidden:active, .visuallyhidden:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto
}

.capabilitymessage {
    display: block;
    background-color: #cd3238;
    color: #fff;
    padding: 1em 2em;
    margin: 0;
    position: relative;
    text-align: center
}

.capabilitymessage a {
    color: #fff;
    text-decoration: underline
}

.wrapper {
    height: 100vh;
    transition: transform .2s ease
}

.wrapper:after, .wrapper:before {
    content: " ";
    display: table
}

.wrapper:after {
    clear: both
}

.content-wrapper {
    width: 100%;
    height: 100%;
    float: left;
    background-color: #e6e6e6;
    border-bottom: 1px solid #d9d9d9
}

.content, .content-wrapper {
    box-sizing: border-box;
    position: relative
}

.content {
    display: block;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    background: #fff;
    border-top: 0 solid #fafafa;
    min-height: 100%;
    padding-bottom: 4em
}

.content:after, .content:before {
    content: " ";
    display: table
}

.content:after {
    clear: both
}

.page-locked .tab-content {
    cursor: not-allowed;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.page-locked .tab-content > * {
    pointer-events: none
}

footer {
    box-sizing: border-box;
    display: block;
    margin-right: auto;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
    border-radius: 3px 3px 0 0;
    box-shadow: 0 0 2px hsla(0, 0%, 100%, .5);
    background: #333;
    position: fixed;
    bottom: 0;
    padding: .5em;
    width: 90%;
    margin: 0 5%;
    color: #fff
}

body.ready footer {
    transition: bottom .5s ease 1s
}

footer:after, footer:before {
    content: " ";
    display: table
}

footer:after {
    clear: both
}

footer ul {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0
}

footer ul, footer ul li {
    list-style-type: none;
    font-style: normal
}

footer li {
    float: left
}

footer .actions {
    width: 250px;
    margin-right: 1.5%
}

footer .preview .dropdown {
    width: 250px
}

footer .meta {
    float: right;
    text-align: right;
    padding: 7px 1.5%;
    font-size: .85em
}

footer .meta p {
    margin: 0;
    margin-right: 3%;
    white-space: nowrap
}

footer .meta a {
    color: inherit
}

footer .meta a:hover {
    color: #7c8080
}

@media screen and (max-width: 50em) {
    footer .actions, footer .preview, footer .preview .dropdown {
        width: 100%
    }

    footer .meta p {
        white-space: normal;
        width: 100%
    }

    footer .meta .avatar {
        left: auto
    }
}

@media screen and (min-width: 90em) {
    footer {
        width: 90em
    }
}

.breadcrumb {
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    overflow: hidden;
    padding-top: 1.4em;
    font-size: .85em
}

.breadcrumb, .breadcrumb li {
    list-style-type: none;
    font-style: normal
}

.breadcrumb:after, .breadcrumb:before {
    content: " ";
    display: table
}

.breadcrumb:after {
    clear: both
}

.breadcrumb li {
    display: block;
    float: left;
    padding: .5em 1.3em;
    position: relative;
    text-decoration: none;
    color: #fff;
    white-space: nowrap;
    line-height: 1.5em
}

.breadcrumb li a, .breadcrumb li span {
    color: #d2eeee;
    display: block;
    max-width: 12em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 1.6em;
    padding-right: 1em
}

.breadcrumb li a:after, .breadcrumb li span:after {
    right: 0;
    position: absolute;
    font-family: wagtail;
    content: "n";
    padding-left: 20px;
    font-size: 2em;
    color: #4a4e4e;
    line-height: .9em
}

.breadcrumb li:hover {
    background: #3a3838
}

.breadcrumb li:hover a {
    color: #fff
}

.breadcrumb li:hover:after {
    border-left-color: #3a3838
}

.breadcrumb li.home a {
    padding-right: 0;
    text-align: center;
    width: 3em;
    font-size: 1em;
    text-overflow: clip
}

.breadcrumb li.home a:before {
    font-size: 1.15rem;
    line-height: .85em;
    padding-top: .1em
}

.breadcrumb li.home a:after {
    right: -.3em
}

header .breadcrumb li:before {
    border-left: 1em solid #fff;
    position: absolute;
    left: 0;
    top: 0
}

.breadcrumb.single li a {
    white-space: nowrap;
    text-overflow: inherit;
    max-width: 100%
}

.clearfix:after, .clearfix:before {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

.row:after, .row:before {
    content: " ";
    display: table
}

.row:after {
    clear: both
}

.nice-padding {
    padding-left: 20px;
    padding-right: 20px
}

.nav-toggle {
    z-index: 5
}

.nav-wrapper {
    z-index: 2
}

.nav-submenu {
    z-index: 6
}

.logo, footer {
    z-index: 100
}

@media screen and (min-width: 50em) {
    .col1 {
        width: 8.33333%
    }

    .col1, .col2 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col2 {
        width: 16.66667%
    }

    .col3 {
        width: 25%
    }

    .col3, .col4 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col4 {
        width: 33.33333%
    }

    .col5 {
        width: 41.66667%
    }

    .col5, .col6 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col6 {
        width: 50%
    }

    .col7 {
        width: 58.33333%
    }

    .col7, .col8 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col8 {
        width: 66.66667%
    }

    .col9 {
        width: 75%
    }

    .col9, .col10 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col10 {
        width: 83.33333%
    }

    .col11 {
        width: 91.66667%
    }

    .col11, .col12 {
        box-sizing: border-box;
        display: inline;
        float: left;
        padding-right: 1.5%;
        padding-left: 1.5%
    }

    .col12 {
        width: 100%
    }

    .divider-before {
        border-left: 1px solid #e6e6e6
    }

    .divider-after {
        border-right: 1px solid #e6e6e6
    }

    .row {
        box-sizing: border-box;
        display: block;
        margin-right: auto;
        margin-left: auto;
        padding-right: 0;
        padding-left: 0
    }

    .row:after, .row:before {
        content: " ";
        display: table
    }

    .row:after {
        clear: both
    }

    .row-flush {
        margin-left: -1.5%;
        margin-right: -1.5%
    }

    .nice-padding {
        padding-left: 50px;
        padding-right: 50px
    }

    .browsermessage {
        margin: 0 0 0 -150px
    }

    .content-wrapper {
        border-bottom-right-radius: 5px
    }

    footer {
        margin-left: 50px;
        margin-right: 50px;
        width: calc(100% - 180px - 100px)
    }

    .content {
        border-top: 0;
        background-color: none;
        padding-top: 0
    }

    .breadcrumb {
        padding-top: 0;
        background: #4a4e4e;
        margin-left: -50px;
        margin-right: -50px
    }

    .breadcrumb li a:after, .breadcrumb li span:after {
        color: #7c8080
    }

    .nav-main .footer {
        z-index: 2
    }

    .nav-submenu {
        z-index: 500
    }

    .nav-wrapper {
        z-index: auto
    }

    .nav-wrapper.submenu-active {
        z-index: 200
    }
}