:root,:root.light {
    --dark-green : #718B4B;
    --dark-purple: #6E6290;
    --light-green: #AFD080;
    --light-purple : #9A90B8;
    --lightest-purple: #E0D4FF;
    --lightest-green : #E2EF9E;
    --lightest-yellow: #9E9C69;
    --main-background: #ECECE2;
    --main-text: #655C53;
    --main-border: #718B4B;
    --main-shadow: #756C63;
    --main-headline: var(--dark-purple);
    --receipt-headline : var(--dark-purple);
    --link-text: var(--dark-purple);
    --link-hover : #6E6290;
    --highlight-link-text: #009AD6;
    --highlight-link-hover : #009AD6;
    --highlight-background : yellow;
    --alt-background : white;
    --selection-background : var(--dark-purple);
    --selection-text : white;
    --messagebox-text: var(--main-text);
    --messagebox-background: var(--header-background);
    --messagebox-title : var(--main-text);
    --messagebox-border: var(--main-border);
    --messagebox-shadow: var(--main-shadow);
    --contrast-main: var(--dark-purple);
    --contrast-light : #FFC66D;
    --contrast-low : #565A5D;
    --contrast-opposite: #629755;
    --warning: #CC0000;
    --warning-background : white;
    --notification : var(--dark-green);
    --notification-background: var(--header-background);
    --required : var(--dark-purple);
    --error: #990000;
    --disabled : var(--main-text);
    --dark-border: #4A4A4A;
    --dark-shadow: #333333;
    --dark-background: #2B2B2B;
    --dark-text: #2B2B2B;
    --table-border : #AAAAAA;
    --table-background : white;
    --table-header-background: #DDDDDD;
    --table-cell-label : #EEEEEE;
    --table-cell-value : white;
    --table-hover: #DADEDF;
    --table-highlight: #F1F1F1;
    --input-placeholder: #6A6A6A;
    --input-background : white;
    --input-highlight: #718B4B;
    --button-text: white;
    --button-background: #6E6290;
    --button-hover-text: white;
    --button-hover-background: #718B4B;
    --button-okay: #007B47;
    --button-cancel: #CC0000;
    --button-disabled: #ECECE2;
    --header-background: white;
    --header-text: var(--main-text);
    --footer-background: white;
    --footer-text: var(--main-text);
    --image-viewer-border: #CCCCCC;
    --image-viewer-background: #AAAAAA;
    --detail-summary-text: #6E6290;
    --detail-button-text : white;
    --detail-button-background : var(--dark-purple);
    --detail-button-hover-text : white;
    --detail-button-hover-background : var(--light-purple);
    --basket-header-background : #AAAAAA;
    --basket-header-text : #333333;
    --basket-border: var(--dark-green);
    --offer-border : var(--main-border);
    --offer-background : #AAAAAA;
    --offer-headline : white;
    --offer-text : white;
    --theme-dark-icon: url('/images/lightbulb.png');
    --theme-light-icon : url('/images/lightbulb_off.png');
    --search-icon: url('/images/search_icon.png');
    --search-icon-hover: url('/images/search_icon_hover.png');
    --simple-search-label: black;
    --simple-search-label-background : white;
    --modal-close-button-color : white;
    --modal-background : black;
    --bounceEasing : cubic-bezier(0.51, 0.92, 0.24, 1.15);
    --focus-text : white;
    --focus-background : var(--dark-purple);
    --banner-border: var(--dark-green);
    --banner-background: var(--header-background);
}

:root.dark {
    --dark-green : #718B4B;
    --dark-purple: #6E6290;
    --light-green: #AFD080;
    --light-purple : #9A90B8;
    --lightest-purple: #E0D4FF;
    --lightest-green : #E2EF9E;
    --main-background: #3C3F41;
    --main-text: #A9B7C6;
    --main-border: #718B4B;
    --main-shadow: #756C63;
    --main-headline: var(--lightest-purple);
    --receipt-headline : var(--dark-purple);
    --link-text: #FFC66D;
    --link-hover : #FFC66D;
    --highlight-link-text: red;
    --highlight-link-hover : red;
    --highlight-text : var(--main-background);
    --highlight-background : yellow;
    --alt-background : var(--input-background);
    --selection-background : var(--dark-purple);
    --selection-text : white;
    --messagebox-text: var(--main-text);
    --messagebox-background: var(--header-background);
    --messagebox-title : var(--main-text);
    --messagebox-border: var(--main-border);
    --messagebox-shadow: var(--header-background);
    --contrast-main: var(--lightest-purple);
    --contrast-light : #FFC66D;
    --contrast-low : #565A5D;
    --contrast-opposite: #629755;
    --warning: #FF8E8E;
    --warning-background : var(--header-background);
    --notification : var(--dark-green);
    --notification-background: var(--header-background);
    --required : var(--lightest-green);
    --error: #990000;
    --disabled : var(--main-text);
    --dark-border: #4A4A4A;
    --dark-shadow: #333333;
    --dark-background: #2B2B2B;
    --dark-text: #2B2B2B;
    --table-border : #AAAAAA;
    --table-background : var(--header-background);
    --table-header-background: var(--main-background);
    --table-header-text: var(--main-text);
    --table-cell-label : var(--header-background);
    --table-cell-value : var(--main-background);
    --table-hover: #444444;
    --table-highlight: #F1F1F1;
    --input-placeholder: #6A6A6A;
    --input-background : #222222;
    --input-background-focus : #222222;
    --input-text : var(--main-text);
    --input-text-focus : var(--main-text);
    --input-border : #EEEEEE;
    --input-highlight: var(--link-text);
    --button-text: white;
    --button-background: var(--dark-purple);
    --button-hover-text: white;
    --button-hover-background: var(--light-purple);
    --button-okay: #007B47;
    --button-cancel: #CC0000;
    --button-disabled-background : transparent;
    --header-background: var(--input-background);
    --header-text: var(--main-text);
    --footer-background: var(--input-background);
    --footer-text: white;
    --image-viewer-border: var(--main-border);
    --image-viewer-background: var(--alt-background);
    --detail-summary-text: #6E6290;
    --detail-button-text : white;
    --detail-button-background : var(--dark-purple);
    --detail-button-hover-text : white;
    --detail-button-hover-background : var(--light-purple);
    --basket-header-background : #AAAAAA;
    --basket-header-text : #333333;
    --basket-border: var(--main-border);
    --offer-border : var(--main-border);
    --offer-background : #AAAAAA;
    --offer-headline : white;
    --offer-text : white;
    --theme-dark-icon: url('/images/lightbulb.png');
    --theme-light-icon : url('/images/lightbulb_off.png');
    --search-icon: url('/images/search_icon_dark.png');
    --search-icon-hover: url('/images/search_icon_dark_hover.png');
    --simple-search-label: white;
    --simple-search-label-background : black;
    --modal-close-button-color : white;
    --modal-background : black;
    --bounceEasing : cubic-bezier(0.51, 0.92, 0.24, 1.15);
    --focus-text : black;
    --focus-background : white;
    --banner-border: var(--dark-green);
    --banner-background: var(--header-background);
}

@font-face {
    font-family: 'Merriweather Sans';
    font-style: normal;
    font-weight: 300;
    src: url('fonts/merriweather-sans-v22-latin-ext_latin-300.eot');
    src: local(''),url('fonts/merriweather-sans-v22-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'), url('fonts/merriweather-sans-v22-latin-ext_latin-300.woff2') format('woff2'), url('fonts/merriweather-sans-v22-latin-ext_latin-300.woff') format('woff'), url('fonts/merriweather-sans-v22-latin-ext_latin-300.ttf') format('truetype'), url('fonts/merriweather-sans-v22-latin-ext_latin-300.svg#MerriweatherSans') format('svg');
}

@font-face {
    font-family : 'Merriweather';
    font-style: normal;
    font-weight : 400;
    src : url('fonts/merriweather-v19-latin-regular.eot');
    src : local('Merriweather Regular'), local('Merriweather-Regular'),url('fonts/merriweather-v19-latin-regular.eot?#iefix') format('embedded-opentype'),url('fonts/merriweather-v19-latin-regular.woff2') format('woff2'),url('fonts/merriweather-v19-latin-regular.woff') format('woff'),url('fonts/merriweather-v19-latin-regular.ttf') format('truetype'),url('fonts/merriweather-v19-latin-regular.svg#Merriweather') format('svg');
}

* {
    margin: 0;
    padding : 0;
    outline : none;
}

:focus-visible {
    color: var(--focus-text);
    background : var(--focus-background);
}

html#DOL {
    overflow-y : scroll;
}

body {
    background-color : var(--main-background);
    color: var(--main-text);
    font-family: 'Merriweather Sans', Verdana, sans-serif;
    font-size: 16px;
    line-height: 1.6;
    visibility : hidden;
}

h1, h2, h3 {
    font-family : 'Merriweather', serif;
    margin: 0 0 0.25em 0;
    font-weight : normal;
    line-height : 1.2;
    color : var(--main-headline);
    clear : left;
}

h1 {
    font-size : 240%;
}

h2 {
    font-size : 175%;
}

h3 {
    font-size : 125%;
}

h1.receipt-headline {
    color : var(--receipt-headline);
}

a {
    color : var(--link-text);
    text-decoration : none;
    outline : 0;
}

a:hover {
    color : var(--link-text);
    text-decoration : underline;
}

a.highlight {
    color : var(--highlight-link-text);
}

a.highlight:hover {
    color : var(--highlight-link-hover);
}

a.detail-link {
    font-size : 80%;
}

a.underline {
    text-decoration : underline;
}

a.underline:hover {
    color : var(--link-hover);
}

p {
    margin-bottom : 1em;
}

p.code,span.code {
    font-family : monospace, monospace;
    font-size : 90%;
}

p.code {
    white-space : pre;
    padding : 0.5em;
}

span.code {
    display : inline-block;
    padding : 0 0.25em;
}

.print-only {
    display : none;
}

ul, ol {
    margin-left : 2em;
    margin-bottom : 1em;
}

li {
    margin-bottom : 0.5em;
}

hr {
    margin : 2em 5em;
}

mark {
    background-color : transparent;
    color: var(--contrast-main);
    font-weight: bold;
}

pre {
    font-size : 15px !important;
}

div.tc-wrapper {
    counter-reset : section;
    margin-bottom : 2em;
}

div.tc-wrapper a {
    text-decoration : underline;
}

div.tc-wrapper h2.tc-section:before {
    counter-increment : section;
    content : counters(section, '.') '. ';
}

div.tc-wrapper ol {
    counter-reset : bonsai;
    list-style: none;
    margin-top: 1em;
}

div.tc-wrapper ol li {
    counter-increment : bonsai;
    display : block;
    margin-left : 1em;
}

div.tc-wrapper ol li::before {
    content : counters(section, '.') '.' counters(bonsai, '.') ' ';
    font-weight : bold;
    float : left;
    padding-right : 1em;
    margin-left : -3em;
}

blockquote {
    quotes : "\201C" "\201D" "\201C" "\201D";
    position : relative;
    padding: 2em 2em 1em 3em;
    font-style : italic;
}

blockquote:before {
    content : open-quote;
    float : left;
    font-size : 3em;
    margin-left : -0.7em;
    margin-top: -0.4em;
}

img.rounded {
    border-radius : 5px;
}

.centred-text {
    text-align : center;
}

.warning,.content-warning {
    color : var(--warning);
}

.highlight {
    color: var(--highlight-text);
    background-color : var(--highlight-background);
    border-radius: 3px;
    padding-left : 2px;
    padding-right: 2px;
}

.required {
    color : var(--required) !important;
}

.disabled {
    color : var(--disabled) !important;
}

::selection {
    background-color : var(--selection-background);
    color: var(--selection-text);
}

.small-print {
    font-size : 90%;
}

div.warning {
    display: block;
    text-align : center;
    background-color : var(--warning-background);
    padding: 0.5em;
    border : 1px solid var(--warning);
    border-radius: 10px;
    margin : 0 auto 10px;
}

div.warning.left {
    text-align : left;
}

div.warning p:last-child {
    margin : 0;
}

div.notification {
    display: block;
    text-align : center;
    background-color : var(--notification-background);
    padding: 0.5em;
    border : 1px solid var(--notification);
    border-radius: 10px;
    margin : 0 auto 10px;
}

div.notification.left {
    text-align : left;
}

div.notification p:last-child {
    margin : 0.5em 0;
}

details {
    padding: 0.5em;
    margin-left: 2em;
    margin-right : 2em;
    transition : height 1s ease;
    clear: left;
}

details > summary {
    padding : .25em;
}

details > summary:hover {
    cursor : pointer;
    background-color : var(--table-hover);
}

details[open] {
    font-weight : normal;
    font-size : 100%;
    color : var(--main-text);
    height: fit-content;
}

div.listing-container details.listing[open] > summary > div.listing:hover {
    background-color : var(--main-background);
}

details[open] > summary {
    padding : .25em;
    border-radius : 10px;
    color : var(--main-headline);
}

div.detail-content.listing {
    border-top : none !important;
}

div.detail-content.listing {
    border-top: none !important;
    margin-bottom : 0 !important;
}

div.detail-content {
    background-color : var(--main-background);
    color: var(--main-text);
    border-radius: 10px;
    font-size: 100%;
    padding: 1em 1em 0.5em 1em;
}

div.detail-content a {
    text-decoration : underline;
    color : var(--main-headline);
}

details.button {
    margin-left : 0;
    border-radius : 10px;
}

details.button > summary.button {
    color: var(--detail-button-text);
    background-color : var(--detail-button-background);
    padding: .25em 0.5em;
    border-radius: 5px;
    width: fit-content;
    float: left;
    margin-bottom: 1em;
    transition : background-color 0.5s ease;
}

details.button > summary.button:hover {
    color: var(--detail-button-hover-text);
    background-color : var(--detail-button-hover-background);
    transition : background-color 0.5s ease;
}

details.button > summary::marker {
    content : '';
}

summary.listing {
    margin: 0 !important;
    padding : 0;
}

details.listing {
    margin: 0;
    padding : 0;
}

details.listing > summary {
    list-style: none;
    border-radius : 0;
    padding : 0;
}

details.listing [open] > summary.listing {
    border-radius : 0;
}

details.listing [open] > summary > div.listing {
    background: red;
    border-bottom : 1px solid var(--main-background) !important;
}

div.listing-container details.listing summary.listing div.listing {
    border-bottom : 1px solid var(--main-background);
    margin-bottom : 0 !important;
}

div.detail-content.listing {
    color : var(--main-text);
    border-radius : 0;
    font-size : 100%;
    padding : 0;
}

div.detail-content.listing:hover {
    background-color : var(--main-background);
}

div#header {
    position: fixed;
    top : 0;
    width : 100%;
    height: 90px;
    background: var(--header-background);
    z-index : 888;
    border-bottom : 3px solid var(--main-border);
    padding-top : 5px;
    overflow: hidden;
}

div#header h1,div#header h2 {
    text-align : center;
}

div#header span#site-banner {
    display : block;
    font-family : 'Merriweather', serif;
    text-align: center;
    font-size : 175%;
    margin: 20px 0 15px 0;
    color : var(--main-headline);
}

div#header-content {
    max-width : 750px;
    margin: 0 auto;
    overflow: auto;
}

div#header div#header-content img {
    display : block;
    margin: 10px auto;
}

div#header a,div#header a:hover {
    display : block;
    text-decoration : none;
    background: transparent;
    margin: 0;
    padding : 0;
    overflow: hidden;
}

div#header img.extra-logo {
    display : none;
}

div#header a img {
    position : fixed;
    left : 0;
    margin : 0;
    padding: 0;
    z-index: 1000;
}

div#header div.user-controls,div#header div.admin-feedback {
    display: block;
    float: right;
    padding: 0 0.25em 0.5em;
    margin-top : 0;
    text-align : right;
    clear: none;
}

@media only screen and (max-width : 400px) {
    div#header div.user-controls span {
        display : none;
    }
}

div#header div.user-controls a,div#header div.admin-feedback a {
    text-decoration : underline;
}

div#header-strap {
    position: fixed;
    top : 98px;
    width : 100%;
    background: var(--main-headline);
    text-align: center;
    border-bottom : 3px solid var(--main-border);
}

div#header-strap h2 {
    font-size : 24px;
    display : inline-block;
    margin: 5px;
    color : var(--main-background);
}

div#header a#light-theme-icon {
    display: none;
    width: 24px;
    height : 24px;
    float: right;
    margin-top : 5px;
    margin-right : 5px;
    background-image : var(--theme-light-icon);
    background-size: cover;
    overflow : hidden;
    text-indent: 9999px;
    cursor : pointer;
}

div#header a#dark-theme-icon {
    display: block;
    width: 24px;
    height : 24px;
    float: right;
    margin-top : 5px;
    margin-right : 5px;
    background-image : var(--theme-dark-icon);
    background-size: cover;
    overflow : hidden;
    text-indent: 9999px;
    cursor : pointer;
}

@media only screen and (max-width : 1440px) {
    div#header h1 {
        display : none;
    }

    div#header span#site-banner {
        display : none;
    }

    div#header div.user-controls {
        padding-right : 0.25em;
    }
}

div#footer {
    font-size: 80%;
    width: 100%;
    padding: 10px 0;
    margin-top : 1em;
    border-top : 1px solid var(--main-border);
    background-color : var(--footer-background);
    color: var(--footer-text);
}

div#footer.fixedfooter {
    position : fixed;
    bottom : 0;
}

div#footer p {
    clear: both;
    margin-bottom : 0;
}

div#footer p.footer-links {
    border: 1px solid red;
    margin-bottom : 1em;
}

div#footer ul {
    float: left;
    list-style: none;
    margin: 0.5em 4em;
}

.footer-feedback {
    font-size : 90%;
    text-align: center;
}

div#footer-container {
    display : grid;
    grid-template-columns : 1fr 1fr 1fr;
    column-gap: 1em;
    row-gap : 1em;
    margin-bottom : 1em;
}

div.footer-column {
    display: flex;
}

div.footer-column img#footer-logo {
    margin: 2em auto;
    width: 150px;
    height: 58px;
}

div.footer-column ul {
    margin-left: 0;
}

@media only screen and (max-width : 900px) {
    div.footer-container {
        grid-template-columns : 1fr 1fr;
    }

    div.footer-column.logo {
        display: none;
    }
}

@media only screen and (max-width : 600px) {
    div#feature-cards {
        grid-template-columns : 1fr 1fr;
    }
}

@media only screen and (max-width : 400px) {
    div#feature-cards {
        grid-template-columns : 1fr;
    }

    div#footer-container {
        grid-template-columns : 1fr ;
    }
}

div#content {
    max-width : 1000px;
    margin: 0 auto;
    overflow: auto;
    padding-top : 125px;
    min-height: calc(100vh - 356px);
}

@media only screen and (max-width : 1000px) {
    div#content {
        padding-left: 0.5em;
        padding-right : 0.5em;
    }
}

div#content.admin {
    min-height : calc(100vh - 198px);
}

#editor-content {
    max-width : 600px;
    margin: 0 auto;
    overflow: auto;
    padding : 2em;
}

div#page {
    max-width : 750px;
    margin: 0 auto;
    padding-top : 150px;
    overflow: auto;
}

div#wide {
    max-width : 1000px;
    margin: 0 auto;
    padding-top : 150px;
    overflow: auto;
}

div#messagebox {
    color: var(--messagebox-text);
    background-color : var(--messagebox-background);
    width: 30em;
    margin : 10% auto 2em;
    padding: 2em;
    border : 1px solid var(--messagebox-border);
    border-radius: 10px;
    text-align : left;
    box-shadow : 10px 10px 10px var(--messagebox-shadow);
}

div#messagebox h1 {
    color: var(--messagebox-title);
    text-align : left;
    font-size: 24px;
    border-bottom: 1px solid var(--messagebox-border);
    padding-bottom : 0.5em;
    margin-bottom: 0.5em;
    margin-top : 0;
}

div#messagebox p {
    font-size : 18px;
    margin-bottom : 20px;
}

div#messagebox form,div#messagebox button {
    margin : 0;
}

@media only screen and (max-width : 750px) {
    div#messagebox {
        width: 60%;
        margin : 50px auto;
    }
}

div.pagination-links {
    width : 100%;
    text-align: center;
    padding-top : 1em;
    margin-bottom : 1em;
}

div.pagination-links span.disabled-link,div.pagination-links a {
    display : inline-block;
    background: var(--button-background);
    padding : 5px 10px 5px 10px;
    margin: 6px 3px 0;
    border: 1px solid var(--button-background);
    color : var(--button-text) !important;
    text-shadow : none;
    border-radius : 3px;
}

div.pagination-links span.disabled-link {
    color: var(--main-text) !important;
    background : var(--button-disabled-background);
    border : 1px solid var(--button-background);
}

div.pagination-links a:hover,div.pagination-links a:focus-visible,div.pagination-links a:focus {
    background : var(--button-hover-background);
    border : 1px solid var(--button-hover-background);
    color: white;
    cursor : pointer;
}

div.pagination-links span.list-nav-feedback {
    display : block;
}

div.page-links {
    display : inline-block;
}

div.button-group {
    margin : 1em 0;
    clear: left;
}

div.button-group.centred {
    text-align : center;
}

@media screen and (max-width : 575px) {
    div.page-links {
        display : none;
    }

    div.pagination-links .first,div.pagination-links .last {
    }
}

div.listing-container {
    border-top : 1px solid var(--main-border);
    margin-bottom: 1em;
    background-color : var(--messagebox-background);
}

div.listing-container p {
    text-align : center;
    margin : 0.5em auto 0.5em;
}

div.listing {
    position : relative;
    border-top : 1px solid var(--main-border);
    margin : 0 auto;
    padding: 0.75em 1em 0.5em;
    overflow : auto;
    background-color : var(--main-background);
    break-inside : avoid;
    color: var(--main-text) !important;
}

div.listing p {
    text-align : left;
}

div.listing:hover {
    background-color : var(--table-hover);
}

div.listing h3 {
    margin-top: 0;
    margin-bottom : 0;
    font-size : 140%;
    color : var(--main-text);
}

div.listing span.listing-header {
    margin-top: 0;
    margin-bottom : 0;
    font-size : 140%;
    color : var(--main-text);
}

div.listing a:hover span.listing-header {
    color : var(--link-hover);
}

div.listing a:hover h3 {
    color : var(--link-hover);
}

div.listing a {
    color: var(--main-text);
    overflow : auto;
}

div.listing a.admin-action {
    display : block;
    float : right;
}

div.listing a:hover {
    color : var(--link-hover) !important;
}

div.listing div.detail {
    width : 35%;
    float : right;
    color : var(--main-text);
}

div.listing div.detail a:hover {
    color : var(--link-hover);
}

@media only screen and (max-width : 550px) {
    div.listing div.detail {
        width : 50%;
        overflow-wrap : break-word;
    }

    div.listing-container p {
        font-size : 80%;
    }
}

div.listing div.detail span,div.listing div.detail a {
    display : block;
    margin-left : 1em;
}

div.listing div.detail span.disabled {
    font-size : 100%;
    display : inline;
}

p.legal {
    width: 90%;
    margin-left: auto;
    margin-right : auto;
}

div#scan-container {
    width: 90%;
    height : 60vh;
    border : 1px solid var(--image-viewer-border);
    margin : 0 auto 1em;
    background-color : var(--image-viewer-background);
    overflow : hidden;
}

table {
    width : 100%;
    border-color: var(--table-border);
    border-collapse : collapse;
    margin-bottom : 1em;
    margin-left : auto;
    margin-right: auto;
}

table tr:hover {
    background : var(--table-hover);
}

td, th {
    vertical-align : top;
    border-bottom: 1px solid var(--table-border);
    padding: 0.5em;
    font-weight: normal;
}

th {
    background-color : var(--table-header-background);
    border-color : var(--table-border);
}

div.half-column table {
    width : 100%;
}

td.number-cell {
    text-align : right;
}

table.grouped #tooltip {
    position : relative;
    color: #66CCFF;
    border-color : var(--table-border);
}

table.grouped {
    border-top: 0;
    border-left : 0;
    border-right: 0;
    border-color: var(--table-border);
    border-bottom : 1px solid var(--table-border);
}

table.grouped td {
    border-right: 1px solid var(--table-border);
    border-left : 1px solid var(--table-border);
    border-top: none;
    border-bottom : none;
}

table.grouped td.group-first {
    border-top: 1px solid var(--table-border);
    border-bottom : none;
}

table.grouped td.group-member {
    color : transparent;
}

table td.group-member:hover {
    background : transparent;
}

table.grouped td.group-leaf {
    border-bottom : 1px solid var(--table-border);
}

table.grouped td#tooltip {
    position : relative;
    color: red;
}

table.debug tr:hover,table.embedded tr:hover {
    background : transparent;
}

table.embedded {
    width: 100%;
    border : none;
    margin : 0;
}

td.embedded {
    padding : 0;
}

table.embedded td {
    border : none;
}

table.debug td:first-child,table.embedded td:first-child {
    width : 20%;
}

table.embedded tr:first-child td {
    border-top : none;
}

div#news-delete {
    background-color : white;
    padding: 1em;
}

div.news-item {
    background-color : var(--alt-background);
    padding: 1em;
    margin-bottom: 1em;
}

div.news-item a {
    font-weight : bold;
    text-decoration : underline;
}

div#page-delete {
    background-color : white;
    padding: 1em;
}

div.page-body {
    padding : 1em;
    margin-bottom : 1em;
}

div.page-body a {
    font-weight : bold;
    text-decoration : underline;
}

div.image-wrapper img {
    width : 100%;
}

div.image-wrapper.full {
    width : 100%;
}

div.image-wrapper.left,div.image-wrapper.right {
    width : 50%;
}

div.image-wrapper.left {
    float: left;
    margin-right : 2em;
}

div.image-wrapper.right {
    float : right;
    margin-left : 2em;
}

div.image-wrapper p.image-caption {
    font-size: 80%;
    font-style : italic;
    float: left;
}

div.image-wrapper p.image-copyright {
    font-size: 80%;
    font-style : italic;
    float: right;
}

div.authority-description {
    margin : 1em 0 2em;
}

div.authority-description a {
    text-decoration : underline;
    font-weight : bold;
    color : var(--link-text);
}

table.admin {
    background-color : var(--table-background);
    border : none;
}

table.admin th {
    color: var(--table-header-text);
    font-weight: bold;
    text-align : left;
    background-color : var(--table-header-background);
    border : none;
    border-bottom: 3px solid var(--button-background);
}

table.admin tr {
    border-bottom : 1px solid var(--table-hover);
}

table.admin tr:hover {
    background-color : var(--table-hover);
}

table.admin td {
    border : none;
}

th.label-cell,td.label-cell {
    width: 25%;
    background : #F1F1F1;
    text-align : right;
}

th.label-cell {
    width : 30%;
}

td.main-cell {
    width : 55%;
}

td.action-cell {
    width: 7%;
    text-align : center;
}

td.action-cell a {
    text-decoration : underline;
}

td.icon, th.icon {
    width: 20px;
    text-align : center;
}

div.menu-left-column,div.menu-centre-column {
    float: left;
    width: 30%;
    margin-right : 3%;
}

div.menu-right-column {
    float: left;
    width: 30%;
    margin-right : 0;
}

@media only screen and (max-width : 700px) {
    div.menu-left-column,div.menu-centre-column,div.menu-right-column {
        float: none;
        width: 90%;
        margin-right : 0;
    }
}

ul.menu-link-list {
    list-style : none;
    margin-top : 0;
}

ul.menu-link-list li {
    display : block;
    width : 100%;
}

ul.menu-link-list li a {
    display : block;
    text-decoration : none;
    padding : 0.5em;
}

ul.menu-link-list li a:hover {
    color: var(--main-background);
    background-color : var(--link-hover);
}

h3.menu-title {
    margin-top: 1em;
    margin-bottom : 0.5em;
}

div.log-list {
    border-top: 1px solid #CCCCCC;
    margin-bottom : 1em;
}

div.log-entry {
    border-bottom: 1px solid #CCCCCC;
    margin : 0 auto;
    padding: 0.5em 1em 0.25em;
    overflow : auto;
    background-color : var(--main-background);
}

div.log-entry p {
    text-align: left;
    margin-bottom : 0.5em;
}

div.log-entry p.admin-name,div.log-entry p.detail-link {
    display : block;
    float : right;
}

div.layout-grid {
    display : grid;
    grid-template-columns : 1fr 3fr;
    grid-gap: 1px;
    width : 90%;
    background-color: var(--table-border);
    border: 1px solid var(--table-border);
    margin: 0 auto 2em;
}

div.layout-grid-heading {
    margin : 0 auto;
    background-color : var(--table-cell-label);
    padding: 0.5em 0;
    border-top : 1px solid var(--table-border);
    border-left: 1px solid var(--table-border);
    border-right : 1px solid var(--table-border);
    width: 90%;
    font-weight: bold;
    font-size: 110%;
    text-align : center;
}

div.layout-grid div {
    padding : 0.5em;
}

div.grid-value > div.layout-grid {
    padding : 0;
    border: none;
}

div.layout-grid div.grid-label {
    text-align : right;
    padding-right: 1em;
    background-color : var(--table-cell-label);
}

div.layout-grid div.grid-value {
    background-color : var(--table-cell-value);
    padding-left : 1em;
}

div.layout-grid div.grid-value div.layout-grid {
    width : 100%;
    margin-bottom : 0;
}

div.layout-grid div.grid-value.embedded {
    padding : 0;
}

div.chart-container {
    background-color : white;
    margin-bottom: 1em;
}

div.pass-wrapper {
    background: var(--input-background);
    display : inline-block;
    border: 1px solid var(--main-border);
    padding : 0;
    width : 70%;
    margin-bottom : 2%;
}

div.pass-wrapper a.eye,div.pass-wrapper a.eye-slash {
    display : block;
    float : right;
    width : 24px;
    height: 24px;
    text-indent : -9999px;
    margin: 2px 4px;
}

div.pass-wrapper a.eye {
    background : url(images/eye.svg) center center no-repeat var(--input-background);
}

div.pass-wrapper a.eye-slash {
    background : url(images/eye-slash.svg) center center no-repeat var(--input-background);
}

div.pass-wrapper a.eye:hover {
    background : url(images/eye.svg) center center no-repeat var(--input-background);
    cursor : pointer;
}

div.pass-wrapper a.eye-slash:hover {
    background : url(images/eye-slash.svg) center center no-repeat var(--input-background);
    cursor : pointer;
}

div.pass-wrapper input {
    display : block;
    float : left;
    border: none !important;
    margin: 0 0 0 0 !important;
    padding : 5px;
}

@media screen and (max-width : 750px) {
    div.pass-wrapper {
        width : 91%;
    }

    div.pass-wrapper input {
        width : 80%;
    }
}

@media screen and (max-width : 520px) {
    div.pass-wrapper {
        width : 91%;
        margin-left : 1em;
    }

    div.pass-wrapper input[type="text"],div.pass-wrapper input[type="password"] {
        width : 80%;
    }
}

input::-ms-reveal {
    display : none;
}

div.pass-wrapper input:focus {
    box-shadow : none;
    border : none;
}

div#receipt-wrapper {
    overflow: auto;
    background: white;
    color : #333333;
    padding : 2em;
    border-radius : 10px;
}

div.receipt-header {
    float : right;
    clear : right;
    width : 50%;
}

div#receipt-detail,div#receipt-detail-header {
    clear : both;
    padding : 0 1em 0 1em;
    display : grid;
    grid-template-columns : 50% 17% 17% 18%;
    border-bottom : 3px solid #AAAAAA;
}

div#receipt-detail-header {
    font-weight: bold;
    border-bottom: 3px solid #AAAAAA;
    padding-bottom : 0;
}

div#receipt-detail div {
    border-bottom : 1px solid #AAAAAA;
}

div#receipt-detail div:nth-last-child(-n+4) {
    border : none;
    padding-bottom : 0;
}

div#receipt-wrapper div.value {
    text-align : right;
}

ul.grave-ref-terms {
    list-style-type : none;
}

div.basket-container {
    margin : 0 auto 2em;
    width: 90%;
    overflow : auto;
}

div.basket-container div {
    float : left;
}

div.basket-container div.product-listing,div.basket-container div.product-listing-header {
    width : 100%;
    clear : left;
    border-bottom : 1px solid var(--basket-border);
}

div.basket-container div.product-listing-header {
    border-bottom : 3px solid var(--basket-border);
}

div.basket-container div.product-listing-totals {
    width : 100%;
    clear : left;
}

div.basket-container div.icon {
    padding : 0.25em 1em 0 0;
    width : 50px;
}

div.basket-container div.description {
    padding : .25em;
    width : 45%;
}

div.basket-container div.money {
    padding: .25em;
    float: right;
    text-align : right;
    width: 90px;
}

div.product-listing-totals div.money {
    float : right;
    border-bottom : 1px solid var(--basket-border);
}

div.product-listing-header {
    font-weight : bold;
}

div.memorial-listing {
    border-top : 1px solid var(--main-border);
    overflow : auto;
    padding: 1em;
}

div.memorial-listing div.inscription {
    width : 75%;
    float : left;
    line-height : 1.75;
}

div.memorial-listing div.link {
    width: 15%;
    float: right;
    text-align : right;
}

div.listing-container div.listing:last-of-type,div.listing-container details:last-of-type {
    border-bottom : 1px solid var(--main-border);
    margin-bottom : 2em;
}

div.memorial-listing:last-of-type {
    border-bottom : 1px solid var(--main-border);
    margin-bottom : 1em;
}

div.offer {
    padding: 1em 1em 0 1em;
    border : 3px solid var(--offer-border);
    border-radius: 0.5em;
    margin-bottom: 1em;
    color: var(--offer-text);
    background-color : var(--offer-background);
}

div.offer h2 {
    color : var(--offer-headline);
}

div#voucher-form {
    width : 90%;
    overflow: auto;
    border-bottom : 1px solid var(--main-border);
    margin: 0 auto 1em;
}

div#voucher-form div.form-row {
}

div#voucher-form div.form-row.header h3 {
    margin-bottom : 0;
}

div#voucher-form button {
    margin: 3px 0 5px 0;
    font-size : 90%;
}

div#voucher-form div.form-row form {
    border-top : 1px solid var(--main-border);
    overflow : auto;
    padding: 3px 0 0 0;
    margin : 0;
}

div#voucher-form div.product-name {
    width : 50%;
    float : left;
    padding : 5px;
}

div#voucher-form div.product-price {
    width: 20%;
    text-align : right;
    float: left;
    padding: 5px;
}

div#voucher-form div.product-button {
    width: 110px;
    text-align : right;
    float: right;
    padding: 0;
}

div.address-display p {
    padding-left : 3em;
}

div.mail-display {
    width: 80%;
    margin : 1em auto 2em;
    padding: 1em;
    color: black;
    background-color : white;
    box-shadow : 10px 10px 5px black;
}

div.mail-display a {
    color : blue;
}

div.mail-display h3 {
    color : black;
    margin-bottom : 0.5em;
}

div.mail-display hr {
    margin : 0.5em 0;
}

div.mail-display p.header {
    margin : 0;
}

div.mail-display p.header strong {
    display : inline-block;
    width : 15%;
    margin: 0;
}

div.mail-display span {
    color : red;
}

div#header span#collection-trigger {
    display: block;
    width: 16px;
    height : 16px;
    float: right;
    margin-right : 5px;
    background-image : var(--modal-trigger-icon);
    overflow : hidden;
    text-indent: -9999px;
    cursor : pointer;
}

#modal-background {
    position : fixed;
    top: 0;
    left : 0;
    right: 0;
    bottom : 0;
    background : var(--modal-background);
    transition : all 0.5s var(--bounceEasing);
    cursor : pointer;
    visibility : hidden;
    opacity: 0;
    z-index: 1099;
}

.modal-dialog {
    position: fixed;
    top : 125px;
    left: 50%;
    transform : translate(-50%);
    margin: 0 auto;
    min-width : 300px;
    max-width : 400px;
    max-height: 80vh;
    border-radius : 5px;
    background: var(--main-background);
    transition: all 0.5s var(--bounceEasing);
    overflow: auto;
    cursor: default;
    border: 3px solid var(--main-border);
    opacity : 0;
    z-index : 1100;
    visibility: hidden;
    display : none;
}

.modal-dialog > * {
    padding : 1rem;
}

.modal-header,.modal-footer {
    background : var(--header-background);
}

.modal-header {
    display : flex;
    align-items : center;
    justify-content : space-between;
    padding : 0;
}

.modal-footer {
    text-align : center;
    font-size: 80%;
}

.modal-header h2 {
    font-size : 140%;
    margin-left : 1em;
}

button.close-modal {
    font-size : 1.5rem;
    font-weight : bold;
    padding : 0.25em 0.5em;
    margin: 0.5em;
    color : var(--modal-close-button-color);
}

button.close-modal:hover {
    background-color : red;
}

.modal p + p {
    margin-top : 1rem;
}

#modal-background.is-visible {
    visibility : visible;
    opacity: 0.75;
}

.modal-dialog.is-visible {
    display: block;
    visibility : visible;
    opacity: 1;
}

div.modal-content form {
    margin : 0;
}

div.modal-content label {
}

div.modal-content input[type="text"] {
    width : 97%;
}

div.modal-content select {
    padding : 0.5em;
    width : 100%;
}

@media only screen and (max-width : 520px) {
    div.modal-content input[type="text"] {
        margin-left : 0;
    }

    div.modal-content select {
        margin-left : 0;
    }
}

div.modal-content h3 {
    width: 100%;
    text-align : center;
}

div.modal-content p {
    margin : 0;
}

div.modal-content button {
    display : block;
    margin: 0.5em auto 0;
}

.spinner {
    width : 234px;
    height: 90px;
    background: var(--main-background) url(images/new_logo_trans_v3.png) no-repeat center center;
    margin: 0 auto;
    -webkit-animation : sk-rotateplane 2s infinite ease-in-out;
    animation : sk-rotateplane 2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
    0% {
        -webkit-transform : perspective(120px)
    }

    50% {
        -webkit-transform : perspective(120px) rotateX(360deg)
    }
}

@keyframes sk-rotateplane {
    0% {
        transform : perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform : perspective(120px) rotateX(0deg) rotateY(0deg)
    }

    50% {
        transform : perspective(120px) rotateX(360deg) rotateY(0deg);
        -webkit-transform : perspective(120px) rotateX(360deg) rotateY(0deg)
    }
}

div.map-wrapper {
    width: 600px;
    margin : 1em auto;
}

img.map {
    display: block;
    margin-left: auto;
    margin-right : auto;
    max-width: 95%;
}

div.loc-result {
    border-bottom : 1px solid var(--table-border);
}

div.loc-row {
    display : flex;
    width : 100%;
}

div.loc-row > * {
    width : calc(100% / 3);
    padding : 0.5em;
}

div.cell-county {
    border-left : 1px solid var(--table-border);
}

div.cell-county.start {
    border-top : 1px solid var(--table-border);
}

div.cell-authority {
    border-left: 1px solid var(--table-border);
    border-right : 1px solid var(--table-border);
}

div.cell-authority.start {
    border-top : 1px solid var(--table-border);
}

div.cell-site {
    border-top : 1px solid var(--table-border);
    border-right : 1px solid var(--table-border);
}

@media only screen and (max-width : 650px) {
    div.loc-row {
        flex-wrap : wrap;
    }

    div.cell-county {
        display : none;
        width : 100%;
        text-align: center;
        font-weight : bold;
        font-size : 110%;
    }

    div.cell-county.start {
        display: block;
        border-left: none;
        background-color : var(--table-cell-label);
    }

    div.cell-authority,div.cell-site {
        width: calc((100% / 2) - 1em);
        border-left: none;
        border-right : none;
    }

    div.cell-site {
        border-right : none;
    }
}

div.etl-log {
    padding-bottom : 1em;
}

div.etl-log h2 {
    margin-bottom : 1em;
}

div.etl-log p {
    margin-left : 3em;
}

a.banner-link {
    text-decoration : none;
}

div.dol-ab {
    background-color : var(--banner-background);
    border : 5px solid var(--banner-border);
    border-radius: 12px;
    padding: 1em 1em 0;
    margin-bottom: 2em;
    text-align : center;
    overflow : auto;
}

div.dol-ab a.button {
    margin-bottom : 0;
    float : right;
}

div#homepage-hero {
    border: 1px solid var(--banner-border);
    border-radius: 5px;
    min-height: 320px;
    padding : 2em 2em 1em;
    margin-bottom : 1em;
    text-align: left;
    text-transform: uppercase;
    background-image: url("/images/homepicnew2.jpg");
    background-position : 0 0;
    background-size : cover;
}

div#homepage-hero h2, div#homepage-hero h3, div.feature-card h3 {
    font-family : 'Merriweather Sans', Verdana, sans-serif;
    color : white;
    opacity : 100;
    text-shadow: #000 0 0 5px;
}

div#homepage-hero h2 {
    font-size : 44px;
    font-weight : bold;
    margin-bottom : 1.5em;
}

div#homepage-hero h3 {
    font-size: 24px;
    margin-top : 1em;
}

a.button.hero {
    font-weight : bold;
    font-size : 125% !important;
    padding : 0.5em 1em;
    border: 2px solid white;
    margin: 0 auto;
    box-shadow: #000 0 0 5px;
}

.bold {
    font-weight : bold;
    color : var(--required);
}

@media only screen and (max-width : 600px) {
    div#homepage-hero h2 {
        font-size : 36px;
        margin-bottom : 1em;
    }

    div#homepage-hero h3 {
        font-size : 18px;
        margin-bottom : 1em;
    }
}

div#feature-cards {
    display : grid;
    grid-template-columns : 1fr 1fr 1fr;
    column-gap: 1em;
    row-gap : 1em;
    margin-bottom : 1em;
}

div.feature-card {
    background-color : var(--dark-purple);
    color: white;
    border-radius: 10px;
    padding: 1em 1em 0.5em 1em;
}

div.feature-card h3 {
    text-transform : uppercase;
}

div.button-strip {
    width: 100%;
    text-align: center;
    margin-bottom: 1em;
}