:root {
    --color-light: #e5decb;

    --color-link: #900;
    --color-1: #fff;
    --color-20: #fbf4df;
    --color-30: #e5decb;
    --color-40: #cec7b6;
    --color-5: #000;

    --color-21: #d4ad71;
    --color-31: #c19e67;
    --color-41: #ad8e5c;

    --color-22: #f3e2c7;
    --color-32: #bf9f93;
    --color-42: #c19e67;
}

html, body {
    font-size: 100%;
    max-width: 100%;
    width: 100%;
}
body.light {
    background-color: var(--color-light);
    font-family: Roboto, sans-serif;
    margin: 0;
    padding: 2em 0 3.5em;
}

/* ::after sert pour le preload */
.light .bouton-annuler::after { content: ""; width:0; height:0; opacity:0; }

.light a {
    color: var(--color-link);
}
.light a.beta {
    text-align: right;
}
.light a.beta::before {
    color: var(--color-link);
    font-size: smaller;
    font-style: italic;
    font-weight: normal;
    content: '[beta] ';
    opacity: .7;
}
.light a.obsolete {
    text-align: right;
}
.light a.obsolete::before {
    color: var(--color-link);
    font-size: smaller;
    font-style: italic;
    font-weight: normal;
    content: '[obsolète] ';
    opacity: .7;
}

.light button[type=submit],
.light#login button#loginbutton[type=button],
.light#login button#viewbutton[type=button],
.light a.submit {
    background: var(--color-22) linear-gradient(var(--color-22), var(--color-42));
    border: 1px solid var(--color-32);
    border-radius: .3125em;
    color: var(--color-dark);
    display: flex;
    font-weight: bold;
    justify-content: center;
    padding: .7em 1em;
    margin: .2em;
    text-decoration: none;
    text-shadow: 0 1px 1px var(--color-link-hover);
}

.light input[type=range] {
    accent-color: var(--color-42);
}

.light .buttons,
.light .buttons form {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 5px;
}
.light .buttons button {
    flex-grow: 1;
}
.light .buttons form {
    width: 100%;
}

.light .retry .ui-btn { white-space: normal; }

.light .collapsible-wrap .lbl-toggle {
    background: var(--color-22) linear-gradient(var(--color-22), var(--color-42));
    border: 1px solid var(--color-32);
    cursor: pointer;
    display: block;
    font-size: 1.1rem;
    font-weight: bold;
    margin: 0;
    padding: .7rem;
    transition: all 0.25s ease-out;
}
.light .collapsible-wrap .toggle:checked + .lbl-toggle {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.light .collapsible-wrap .lbl-toggle::before {
    content: " ";
    display: inline-block;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid currentColor;
    margin-left: .7rem;
    margin-right: .7rem;
    transform: translateY(-.2rem);
    transition: transform .2s ease-out;
}
.light .collapsible-wrap .toggle:checked + .lbl-toggle::before {
    transform: rotate(90deg) translateX(-3px);
}
.light .collapsible-wrap .toggle:checked + .lbl-toggle + .collapsible-content {
    border: 1px solid var(--color-42);
}
.light .collapsible-wrap .collapsible-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height .25s ease-in-out;
}

.light .edito,
.light#login .edito {
    border: none;
}
.light .edito h3 { padding: 0; }
.light .edito .ui-collapsible-content { margin: 0; padding: 10px }

.light .ellipsable { text-overflow: ellipsis; }

.light .form-control:focus {
    border-color: var(--color-42);
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(193, 158, 103, .6);
}

.light#login #loginform {
    border: 2px solid var(--color-42);
    width: 100%;
}
.light#login #loginform legend {
    display: none;
}

.light main {
    padding: 1em;
}
.light nav {
    position: relative;
    max-width: 100%;
}
.light nav .level1 {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2;
}
.light nav ul.level1 li,
.light nav ul.level2 li.active,
.light nav ul.level3 li.active,
.light footer
{
    background: var(--color-31) linear-gradient(var(--color-21), var(--color-41));
}
.light nav ul.level2 li,
.light footer a {
    background: var(--color-22) linear-gradient(var(--color-22), var(--color-42));
}
.light nav ul.level3 li {
    background: #fff linear-gradient(#fff, #f1f1f1);;
}
.light footer {
    position: fixed;
    bottom: 0;
    min-height: 2em;
    left: 0;
    width: 100%;
    z-index: 2;
}
.light nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.light nav ul {
    display: flex;
    flex-wrap: wrap;
}
.light nav ul li {
    flex-grow: 1;
}
.light nav.compact ul li {
    padding: .5em 1em;
}

.light ul.collapsible-content-inner {
    margin: 0;
    padding: 0;
}
.light ul.collapsible-content-inner li {
    display: block;
    position: relative;
}
.light ul.collapsible-content-inner li a {
    border: 1px solid #ccc;
    background: #fff linear-gradient(#fff, #f1f1f1);
    margin: 0 0 .5em;
    text-decoration: none;
}
.light ul.collapsible-content-inner li a {
    color: var(--color-5);
    display: block;
    font-weight: bold;
    padding: .5em 1.1em;
    text-align: left;
    text-shadow: 0 1px 0 #eee;
}
.light ul.collapsible-content-inner li a:hover {
    border: 1px solid var(--color-31)
}
.light ul.collapsible-content-inner li a.disabled {
    opacity: .3;
}
.light ul.collapsible-content-inner li:last-child a {
    margin-bottom: 0;
}
.light ul.collapsible-content-inner li a.favorite-off,
.light ul.collapsible-content-inner li a.favorite-on {
    color: transparent;
    height: 32px;
    padding: 0;
    position: absolute;
    right: 0;
    text-shadow: none;
    top: 1px;
    width: 32px;
}
.light ul.collapsible-content-inner li a.favorite-off::after,
.light ul.collapsible-content-inner li a.favorite-off::after {
    content: none;
}
.light ul.collapsible-content-inner li a.favorite-on,
.light ul.collapsible-content-inner li a.favorite-on:hover {
    background: url(/mountyhall/Images/star-2-32.png) center center no-repeat;
}
.light ul.collapsible-content-inner li a.favorite-off,
.light ul.collapsible-content-inner li a.favorite-off:hover {
    background: url(/mountyhall/Images/star-5-32.png) center center no-repeat;
}

.light div.collapsible-wrap ul.collapsible-content-inner li a.favorite-with {
    padding-right: 35px;
}
.light div:not(.actions) div.collapsible-wrap ul.collapsible-content-inner li a:not(.favorite-off):not(.favorite-on):not(.favorite-with)::after {
    background-color: #666;
    background-color: rgba(0, 0, 0, .3);
    background-image: url(data:image/svg+xml;charset=US-ASCII,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22iso-8859-1%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20version%3D%221.1%22%20id%3D%22Layer_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20%20width%3D%2214px%22%20height%3D%2214px%22%20viewBox%3D%220%200%2014%2014%22%20style%3D%22enable-background%3Anew%200%200%2014%2014%3B%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20style%3D%22fill%3A%23FFFFFF%3B%22%20points%3D%223.404%2C2.051%208.354%2C7%203.404%2C11.95%205.525%2C14.07%2012.596%2C7%205.525%2C-0.071%20%22%2F%3E%3C%2Fsvg%3E);
    background-position: center center;
    background-repeat: no-repeat;
    border-radius: 1em;
    content: "";
    display: block; width: 22px; height: 22px;
    margin-top: -11px;
    position: absolute; top: 50%; right: .5em;
}
.light nav ul li,
.light footer
{
    font-size: 1.2rem;
    font-weight: bold;
    display: inline-block;
    padding: .7em 0;
    text-align: center;
}
.light nav ul li
{
    border: 1px solid var(--color-31);
}
.light footer a {
    border: 1px solid var(--color-32);
    margin: .446em;
    padding: .7em 1em;
}
.light nav ul li a,
.light footer a {
    display: block;
    color: var(--color-dark);
    font-weight: bold;
    text-decoration: none;
    text-shadow: 0 1px 1px var(--color-link-hover);
}
.light nav ul.level1 li a:hover,
.light nav ul.level2 li.active a,
.light nav ul.level3 li.active a {
    color: var(--color-link-hover);
    text-shadow: 0 1px 1px var(--color-dark);
}
.light footer a.left,
.light footer a.right {
    position: absolute;
    top: .24em;
}
.light footer a.left {
    left: .4em;
}
.light footer a.right {
    right: .4em;
}

.light .poll h3 {
    padding: 10px;
}

.light .radio-toolbar .ui-btn-icon-left::after { left: 0; }


.light .message .badge {
    top: -7px;
    display: inline-flex;
}

.light table.mh_tdborder caption {
    background-color: inherit;
    background-image: none;
    border-width: 0 0 1px;
}
.light table.mh_tdborder th,
.light table.mh_tdborder td {
    border: none;
    padding: .3em;
}

.light .talent-baroufle div {
    width: auto;
}
.light .talent-baroufle div label,
.light .talent-baroufle div select {
    display: block;
    float:none;
}