:root {
    --color-bg-alpha: rgba(255, 255, 255, 0.9);
    --color-bg-light: #E7E5E0;
    --color-bg-warm: #E8CC9F;
    --color-white: #fff;
    --color-black: #000;
    --color-brown-lighter: #C79C6E;
    --color-brown-light: #77583F;
    --color-brown-dark: #58382d;
    --color-brown-darker: #3D2913;
    --color-brown: #5F5045;
    --color-muted-dark: #ccc;
    --color-muted: #efefef;
    --color-red-alpha: rgba(153, 58, 66, 0.2);
    --color-red: #993A42;
    --color-shadow: rgba(0, 0, 0, 0.2);
    --color-text: #2B2B2A;
    --color-warm-alpha: rgba(232, 204, 159, 0.7);
}

@font-face {
    font-family: 'fontregular';
    src: url('../fonts/Akkurat.woff2') format('woff2'), url('../fonts/Akkurat.woff') format('woff'), url('../fonts/Akkurat.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face { font-family: 'fontbold'; src: url('../fonts/Akkurat-Bold.woff2') format('woff2'), url('../fonts/Akkurat-Bold.woff') format('woff'), url('../fonts/Akkurat-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; font-display: swap; }
@font-face { font-family: 'fontlight'; src: url('../fonts/Akkurat-Light.woff2') format('woff2'), url('../fonts/Akkurat-Light.woff') format('woff'), url('../fonts/Akkurat-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'fontmono'; src: url('../fonts/Akkurat-Mono.woff2') format('woff2'), url('../fonts/Akkurat-Mono.woff') format('woff'), url('../fonts/Akkurat-Mono.ttf') format('truetype'); font-weight: normal; font-style: normal; font-display: swap; }
* { margin: 0px; padding: 0px; box-sizing: border-box; }
ul.text, ol.text { padding-left: 1.2em; overflow: auto; }
html { width: 100%; height: 100%; }
body { font-family: fontlight, Arial, Helvetica, sans-serif; font-size: 16px; text-align: center; -webkit-font-smoothing: antialiased; color: var(--color-text); background-color: var(--color-white); }
hr { height: 1px; border: none; background-color: var(--color-text); margin-top: 2em; margin-bottom: 2em; }
.tbl { width: 100%; border: 0px; border-collapse: separate; border-spacing: 1px; margin-top: 1em; margin-bottom: 1em; }
.tbltitle { font-family: fontbold; font-size: 1em; line-height: 1.8em; font-weight: bold; text-align: left; color: var(--color-bg-light); background-color: var(--color-brown); border: 1px solid transparent; border-bottom: 0; padding-left: 3px; }
.tblsubtitle { font-family: fontregular; text-align: left; font-size: 1.1em; color: var(--color-text); background-color: var(--color-bg-warm); }
.tblcolumntitle { font-family: fontregular; text-align: left; font-size: 0.9em; font-weight: bold; color: var(--color-text); background-color: var(--color-bg-warm); border: 1px solid transparent; padding: 3px; white-space: nowrap; vertical-align: top; }
.tbltext { font-family: fontlight; font-size: 0.9em; line-height: 1.4em; color: var(--color-text); background-color: var(--color-bg-light); border: 1px solid transparent; padding: 3px; vertical-align: top; }
.tbltitle .helpicon { margin: 0.2em 0.3em 0px 0px; }
.tblul { margin-left: 2em; }
.tblul li { line-height: 1.5em; padding: 0.3em 0; }
.tblul li ul { padding-left: 2em; }
.default .error, .articles .error { border: unset; border-left: 1px solid transparent; border-right: 1px solid transparent; border-radius: 0; }
.title { font-family: fontlight; font-weight: normal; text-transform: uppercase; }
.subtitle { font-family: fontbold; font-weight: normal; }
.text { font-family: fontlight, Arial, Helvetica, sans-serif; font-weight: normal; }
.tag { display: inline-block; text-decoration: none; margin: 0 0.3em 0.5em 0; color: var(--color-muted); border-radius: 3px; border: 1px solid var(--color-brown); padding: 0 0.3rem; background-color: var(--color-brown); }
.link { color: var(--color-text); }
.form { font-family: fontlight, Arial, Helvetica, sans-serif; font-size: 1em; line-height: normal; color: var(--color-text); border: 1px solid var(--color-bg-light); background-color: var(--color-bg-light); margin-bottom: 1px; padding: 2px 1px 2px 1px; box-sizing: border-box; outline: none; }
.form:not(:last-child) { margin-right: 0.3em; }
.form optgroup { font-family: inherit; font-size: 1em; }
.form_input { font-size: 1em; padding: 0.22em; }
.form_input[type='text'], .form_textarea { -moz-appearance: none; -webkit-appearance: none; appearance: none; resize: none; }
.form_input:focus, .form_textarea:focus { outline: none; }
.form_input::placeholder { color: var(--color-text); opacity: 0.5; }
.form_select:not([multiple]) { padding: 0.3em 1.3em 0.3em 0.3em; font-size: 1em; overflow: hidden; background-color: var(--color-bg-light); border: 1px solid var(--color-bg-light); background-image: url("data:image/svg+xml; charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23333%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E"); background-repeat: no-repeat, repeat; background-position: calc(100% - 0.5em) center; background-size: 0.65em auto, 100%; -moz-appearance: none; -webkit-appearance: none; appearance: none; }
.form_select[multiple] { padding: 3px; font-size: 0.9em; border: 1px solid var(--color-bg-light); cursor: pointer; }
.form_radio { margin-right: 5px; border: 1px solid; width: 0.8em; height: 0.8em; border-radius: 2px; vertical-align: middle; }
.form_radio:checked, .form_checkbox:checked { background-color: #000; }
.form_spamprotect { background-position: 7em 1em; width: 14em; width: 100%; }
.form_checkbox { margin-right: 5px; vertical-align: middle; border: 1px solid; width: 0.8em; height: 0.8em; border-radius: 2px; }
.form_dropdown_parent { padding-left: 3px; }
.form_dropdown_child { padding-left: 3px; }
.form_fieldset { border: 1px solid var(--color-shadow); border-radius: 3px; padding: 0.6em; margin-bottom: 1em; }
.form_fieldset legend { margin: 0 0 0 0.6em; padding: 0px 0.3em 0px 0.3em; }
.form_btn { font-family: fontbold; display: inline-block; font-size: 1em; background-color: var(--color-brown); color: var(--color-bg-light); fill: var(--color-bg-light); border: 1px solid var(--color-brown); padding: 0.22em 1em; -moz-appearance: none; -webkit-appearance: none; appearance: none; cursor: pointer; border-radius: 0; }
.image_left { margin-right: 1em; margin-bottom: 1em; }
.image_right { margin-left: 1em; margin-bottom: 1em; }
.pagenavigator, .link_btn { font-family: fontbold; display: inline-block; white-space: nowrap; font-size: 1em; background-color: var(--color-brown); color: var(--color-muted); border: 1px solid var(--color-brown); padding: 0.22em 1em; text-decoration: none; }
.text>.pagenavigator, .text>.link_btn { margin-bottom: 0.5em; }
.pagenavigator:not(:last-of-type), .link_btn:not(:last-of-type) { margin-right: 0.3em; }
.form_btn:hover, .link_btn:hover { background-color: var(--color-bg-warm); color: var(--color-text); fill: var(--color-text); border-color: var(--color-bg-warm); }
.pagenavigator_active, .pagenavigator:hover { background-color: var(--color-bg-warm); color: var(--color-text); border: 1px solid var(--color-bg-warm); }
.bold { font-family: fontbold; }
.italic { font-style: italic; }
.underline { text-decoration: underline; }
.error { display: block; border: 3px solid var(--color-red); padding: 0.5em; background-image: linear-gradient(45deg, var(--color-red-alpha) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, var(--color-red-alpha) 50%, var(--color-red-alpha) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 100%); background-size: 2em 2em; }
.error ul { margin-left: 1em; list-style: none; }
.error ul li { color: var(--color-text); margin-bottom: 0.5em; line-height: 2.2em; }
.error ul li::before { font-family: IcoFont; content: "\f026"; font-size: 2em; color: var(--color-red); vertical-align: middle; }
.css-switch { appearance: none; position: absolute; opacity: 0; pointer-events: none; }
.calendar { border-collapse: separate; border-spacing: 1px; margin-bottom: 1em; width: 100%; }
.calendar.title { font-size: 1.8em; margin: 0; text-align: center; }
.calendar .tblcolumntitle { text-align: center; cursor: pointer; }
.calendar .row { height: 7em; }
.calendar .cell { background-color: var(--color-bg-light); background-position: top right; background-size: 2em 1.5em; border: 1px solid transparent; color: var(--color-text); vertical-align: top; width: 14.28%; }
.calendar .cell.inactive { background-color: var(--color-warm-alpha); }
.calendar .day { display: block; font-family: fontbold; }
.calendar .cell .editor { border: 1px solid var(--color-black); width: 0.8em; height: 0.8em; background-color: var(--color-bg); margin-right: 0.3em; vertical-align: baseline; }
.calendar .cell .editor:checked { border: 1px solid #888; background-color: #888; }
.calendar .category input:not(.editor) { display: none; }
.calendar_btn { border: 1px solid var(--color-muted); font-size: 0.9em; background-color: var(--color-brown-dark); color: var(--color-muted); padding: 3px 0.6em; }
.calendar .category { font-family: fontbold; position: relative; display: block; text-align: center; cursor: pointer; }
.calendar .category_0 { background-color: #000; background-image: url(../graphics/ico_error.gif); background-repeat: no-repeat; background-position: 0.3em center; background-size: auto 70%; color: rgba(255, 255, 255, .8); }
.calendar .category_1 { background-color: #BE1E2D; color: rgba(255, 255, 255, .8); }
.calendar .category_2 { background-color: #F9ED31; color: rgba(0, 0, 0, .8); }
.calendar .category_3 { background-color: #FBB03F; color: rgba(0, 0, 0, .8); }
.calendar .category_4 { background-color: #F15A29; color: rgba(255, 255, 255, .8); }
.calendar .category_5 { background-color: #2E3092; color: rgba(255, 255, 255, .8); }
.calendar .category_6 { background-color: #EE2B7B; color: rgba(255, 255, 255, .8); }
.calendar .category_7 { background-color: #00B050; color: rgba(255, 255, 255, .8); }
.calendar .category_8 { background-color: #00B0F0; color: rgba(255, 255, 255, .8); }
.calendar .category_9 { background-color: #C3C3C3; color: rgba(0, 0, 0, .8); }
.calendar .category_10 { background-color: #05EB20; color: rgba(0, 0, 0, .8); }
.calendar .category_11 { background-color: #0070C0; color: rgba(255, 255, 255, .8); }
.calendar .category_12 { background-color: #D06800; color: var(--color-muted); }
.calendar .category_13 { background-color: #CC00FF; color: var(--color-muted); }
.calendar .category_14 { background-color: #DADDFF; color: rgba(0, 0, 0, .8); }
.header { position: relative; display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 1em; }
.header>* { display: flex; flex-direction: row; }
.spacer { flex: 1 1 auto; }
.header .logo { display: block; background-repeat: no-repeat; background-size: contain; background-position: left center; }
.header .nuri { display: block; background-image: url(../graphics/logo_nuri.svg); background-size: 100%; background-position: center; background-repeat: no-repeat; }
.header .menu { position: relative; margin: auto; display: flex; }
.header .menu>div { position: relative; }
.header .menu a { font-family: fontlight; text-decoration: none; display: block; white-space: nowrap; color: var(--color-text); }
.header .menu a:hover, .header .submenu a:hover, .header .menu .active, .header .login:hover { color: var(--color-red); }
.header .menu>div:hover .submenu { visibility: visible; }
.header .menu>div:hover .submenu hr { animation: menu-line-in 0.2s linear forwards; }
.header .submenu { position: absolute; left: -1em; visibility: hidden; display: flex; flex-direction: column; padding-bottom: 1em; background-color: var(--color-bg-alpha); z-index: 1; }
.header .submenu hr { height: 1px; width: 0px; color: var(--color-text); border: var(--color-text); background-color: var(--color-text); }
.header .submenu a { display: block; font-family: fontlight; font-size: 1em; line-height: 2em; margin: 0 1em; color: var(--color-text); }
.header .login { position: relative; display: block; margin: auto 1em; text-decoration: none; text-align: center; color: var(--color-text); }
.header .login::before { position: absolute; top: -1em; left: 0.4em; font-family: IcoFont; font-size: 1.5em; content: "\ed05"; display: inline-block; }
.header .langselect { flex-direction: row; margin: auto; }
.header .langselect a { display: block; font-family: fontlight; text-transform: uppercase; text-decoration: none; padding: 0px 0.5em; color: var(--color-text); }
.header .langselect a:not(:last-child) { border-right: 2px solid; }
.header .search { margin: auto; }
.header .search>a { display: block; text-decoration: none; color: var(--color-black); }
.teasing { position: relative; }
.teasing .mobilevideo, .teasing .video { position: relative; display: block; width: 100%; object-fit: cover; }
.teasing .image { position: relative; width: 100%; height: 15em; background-repeat: no-repeat; background-size: cover; background-position: center; }
.teasing>div { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.teasing .news>div.active { animation: teasingnews-in 1s ease-in forwards; }
.teasing .news>div.inactive { animation: teasingnews-out 1s ease-in forwards 1s; }
.teasing .news>div { position: absolute; height: auto; background-color: var(--color-brown); }
.teasing .news .title { font-family: fontlight; font-weight: normal; text-transform: uppercase; color: var(--color-muted); margin: 0px; }
.teasing .news .description { font-family: fontlight; color: var(--color-muted); }
.teasing .news .link { display: block; color: var(--color-muted); margin-bottom: 1em; }
.teasing .news .link::after { font-family: IcoFont; font-size: 0.7em; content: "\ef1f"; margin-left: 0.3em; text-decoration: none; display: inline-block; }
.teasing .news .picture { width: 100%; background-size: cover; }
.teasing .nurissaclub { position: relative; display: block; background-color: var(--color-brown-light); }
.content .two_col .tbl { width: 100%; border-collapse: collapse; }
table.frm { width: 100%; }
.frmcolumntitle { display: flex; align-items: center; padding-bottom: 1em; padding-right: 1em; }
.frm .form_textarea, .frm .form_input { background-color: var(--color-bg-light); padding: 1em 3em; margin-bottom: 1em; outline: none; border: 1px solid transparent; border-radius: unset; }
.frm .form_input+#password_strength { position: absolute; line-height: 3.3em; transform: translateX(-100%); }
.frm .form_textarea::placeholder, .frm .form_input::placeholder { font-family: fontlight; color: var(--color-text); }
.frm .link_btn { border-radius: unset; border: 1px solid transparent; background-color: var(--color-bg-warm); color: var(--color-text); padding: 1em 3em; }
.frm .form_btn { border-radius: unset; border: 1px solid transparent; background-color: var(--color-brown); color: var(--color-bg-light); padding: 1em 3em; }
.frm .form_select { background-color: var(--color-bg-light); padding: 1em 3em; margin-bottom: 1em; outline: none; border: 1px solid transparent; border-radius: unset; width: 100%; }
.header, .content, .leftnav { text-align: left; }
.content .default:last-child, .content .bordered:last-child { padding-bottom: 6em; }
.partners, .footer { clear: both; }
.default+.box, .bordered+.box, .box+.default, .box+.bordered { margin-top: 4.5em; }
.content .bordered+.bordered { margin-bottom: 1em; }
.content .nurissaclub { position: relative; }
.content .nurissaclub.dark { background-color: var(--color-brown-darker); color: var(--color-muted-dark); }
.content .nurissaclub.light { background-color: var(--color-brown-lighter); color: var(--color-white); }
.content .nurissaclub.regular { background-color: var(--color-brown-light); color: var(--color-white); }
.content .nurissaclub .main .credits { font-size: 2.5em; }
.content .subtitle.tricolor>span:nth-child(1) { color: var(--color-bg-warm); }
.content .subtitle.tricolor>span:nth-child(2) { color: var(--color-brown-dark); }
.search-form .search-text { appearance: none; border: 1px solid var(--color-text); color: var(--color-text); width: 100%; font-size: 1.1em; padding: 0.2em 0.3em; }
#search:checked ~ .teasing .search-form { display: flex; visibility: visible; transform: translateY(0); }
.search-text { outline: none; width: 20em; }

/*
    Animations --------------------------------------------------------------------------------------------------------------------------------------
 */
@keyframes menu-line-in {
    0% { width: 0px; }
    100% { width: 40%; }
}
@keyframes mobilemenu-line-in {
    0% { width: 0px; }
    100% { width: 30%; }
}
@keyframes mobilesubmenu-in {
    0% { display: block; opacity: 0; }
    100% { display: block; opacity: 1; }
}
@keyframes webshop-in {
    0% { transform: scale(0); }
    80% { transform: scale(1.5); }
    100% { transform: scale(1); }
}
@keyframes teasingnews-in {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
@keyframes teasingnews-out {
    0% { opacity: 1; }
    100% { opacity: 0; }
}

/*
    Darkmode ----------------------------------------------------------------------------------------------------------------------------------------
 */
@media (prefers-color-scheme:light) { }
@media (prefers-color-scheme:dark) {
    :root {
        --color-bg-alpha: rgba(255, 255, 255, 0.9);
        --color-bg-light: #E7E5E0;
        --color-bg-warm: #E8CC9F;
        --color-white: #fff;
        --color-black: #000;
        --color-brown-dark: #58382d;
        --color-brown-darker: #3D2913;
        --color-brown: #5F5045;
        --color-muted-dark: #ccc;
        --color-muted: #efefef;
        --color-red-alpha: rgba(153, 58, 66, 0.2);
        --color-red: #993A42;
        --color-shadow: rgba(0, 0, 0, 0.2);
        --color-text: #2B2B2A;
        --color-warm-alpha: rgba(232, 204, 159, 0.7);
    }
}

/*
    Mobile devices ----------------------------------------------------------------------------------------------------------------------------------
 */
@media(min-width:300px) {
    html { scroll-padding-top: 4em; }
    body { background-image: none; }

    .title, .subtitle { hyphens: auto; -webkit-hyphens: auto; text-align: center; }
    .title { font-size: 1.9em; padding: 1em 0 1em 0; }
    .subtitle { font-size: 1.5em; padding: 0.7em 0 0.5em 0; }
    .text { font-size: 1em; line-height: 1.5em; padding: 0 0 0.5em 0; }

    .form_checkbox { width: 2em; height: 2em; }
    .main { width: 100%; }
    .header { position: sticky; top: 0; width: 100%; padding: 0.5em 1em 0.5em 1em; box-shadow: 0px 0px 4px var(--color-shadow); background-color: var(--color-white); z-index: 4; }
    .header .logo { height: 2.2em; flex: 0 0 8em; }
    .header .nuri { height: 2em; flex: 0 0 2em; margin-right: 1em; }
    .header .webshop { position: relative; display: block; flex: 0 0 2em; height: 2em; margin-right: 1em; background-image: url(../graphics/icon_shoppingcart.svg); background-position: center; background-size: 100%; background-repeat: no-repeat; }
    .header .webshop>span { position: absolute; left: 2em; bottom: -0.3em; border-radius: 0.6em; display: inline-block; background-color: #f00; color: var(--color-white); font-family: fontbold; font-size: 0.7em; padding: 0 0.3em; transform: scale(0); animation: webshop-in .5s ease-in forwards .5s; }
    .header .search { flex: 0 0 1%; margin-right: 1em; }
    .header .search>a { font-size: 1.5em; line-height: 2em; }
    .header .login, .header .langselect, .header .menu, .header .basemodules, .teasing .search-form, .content .leftnav .categories, .content .nurissaclub .usernav { display: none; }
    .mobilemenu { display: inline-block; flex: 0 0 2em; height: 2em; background-image: url(../graphics/icon_mobile_menu.svg); background-position: center; background-size: 2em 2em; background-repeat: no-repeat; }
    #mobilemenu+label { visibility: hidden; opacity: 0; }
    #mobilemenu:checked+label { visibility: visible; opacity: 1; }
    .teasing .image { height: 10em; }
    .teasing .video { display: none; }
    .teasing .mobilevideo { height: 60vw; }
    .teasing .news { position: relative; width: 77vw; height: 70vh; margin: -2em auto 0 auto; }
    .teasing .news>div { width: 100%; top: 0; }
    .teasing .news>div>div:nth-child(1) { border-top: 1em solid var(--color-brown); border-left: 3em solid var(--color-brown); border-right: 3em solid var(--color-brown); }
    .teasing .news .title { font-size: 1.4em; text-align: center; }
    .teasing .news .description { font-size: 0.9em; margin: 1em 0px; text-align: center; }
    .teasing .news .link { text-align: center; }
    .teasing .news .picture { height: 43vw; }
    .teasing .nurissaclub { width: 100vw; height: 20vh; }
    #menu { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; overflow: auto; background-color: var(--color-white); visibility: hidden; opacity: 0; transition: opacity 0.2s ease, visibility 0.2s ease; z-index: 1; text-align: left; font-size: 1em; padding: 5em 0 5em 0; }
    #menu hr { height: 1px; border: 0; background-color: var(--color-muted-dark); }
    #menu .group { margin: 0 1em 1.5em 1em; }
    #menu .item { display: flex; flex-direction: row; justify-content: space-between; gap: 2em; margin-bottom: 1em; }
    #menu .item a { flex: 1 0 auto; line-height: 2.2em; font-family: fontregular; text-decoration: none; color: var(--color-text); display: block; }
    #menu .item a.active { font-family: fontbold; }
    #menu .css-switch+.item+.submenu { display: none; margin: 0 0 1.2em 0; }
    #menu .css-switch+.item .arrow::before { display: inline-block; font-family: IcoFont; color: var(--color-text); font-size: 2em; content: "\eab8"; transition: transform 0.3s ease; }
    #menu .submenu.css-switch:checked+.item .arrow::before, #menu .submenu.subactive+.item .arrow::before { transform: rotate(90deg); }
    #menu .submenu.css-switch:checked+.item+.submenu, #menu .submenu.subactive+.item+.submenu { display: block; }
    #menu .submenu .item { line-height: 2.2em; font-family: fontregular; padding: 0 0.5em 0 0.5em; text-decoration: none; color: var(--color-text); }
    #menu .submenu .item .active { font-family: fontbold; }
    #menu .langselect .item { display: inline-block; font-family: fontregular; text-transform: uppercase; text-decoration: none; color: var(--color-text); margin: 0 0.5em 0 0.2em; }
    #menu .basemodules { display: flex; justify-content: space-between; }
    #menu .basemodules::before { content: "Basemodules"; font-family: fontregular; font-size: 1.2em; }
    #menu .basemodules::after { content: "\eef8"; font-family: IcoFont; font-size: 2.2em; }
    #menu .search-form { display: flex; gap: 0.3em; }
    #menu .search-form .search-text { width: 100%; }
    #menu .search-form .search-submit { appearance: none; font-family: IcoFont; font-size: 1.5em; border: 0; background-color: transparent; }
    .content .default, .content .bordered { margin-left: 1em; margin-right: 1em; }
    .content .leftnav { display: block; }
    .content .leftnav .articles { width: 100%; }
    .content .leftnav .articles>div { position: relative; margin: 0 1em; }
    .box { display: block; }
    .box>div { display: flex; flex-direction: column; align-items: stretch; }
    .box>div>div>div { margin: 2em 2em; }
    .box .col1>div:nth-child(1) { background-color: var(--color-bg-warm); color: var(--color-text); flex: 1 1 auto; }
    .box .col1>div:nth-child(2) { background-color: var(--color-bg-light); color: var(--color-text); }
    .box .col2>div:nth-child(1) { background-color: var(--color-brown); color: var(--color-muted-dark); }
    .box .col2>div:nth-child(2) { background-color: var(--color-text); color: var(--color-muted-dark); flex: 1 1 auto; }
    .box .title { font-size: 1.8em; text-transform: uppercase; text-align: center; }
    .box .light .link { color: var(--color-black); }
    .box .dark .link { color: var(--color-muted-dark); }
    .content .two_col .col1.light { background-color: var(--color-bg-warm); color: var(--color-text); padding: 2em; }
    .content .two_col .col1>div { margin: 1em 0px; }
    .content .two_col .col2.dark { background-color: var(--color-brown); color: var(--color-muted-dark); padding: 2em; }
    .content .two_col .col2.dark .link { color: var(--color-muted-dark); }
    .content .two_col .col2>div { margin: 1em 0px; }
    .content .two_col { margin-bottom: 2em; }
    .content .nurissaclub { display: block; }
    .content .nurissaclub.dark { background-image: url(../graphics/nurissaclub_beans_2.svg); background-size:350px 350px; background-repeat: no-repeat; background-position: 150px 70px; }
    .content .nurissaclub.dark::before { content:""; display: block; position: absolute; width: 100vw; height: 200px; transform: translateY(-195px); background-image: url(../graphics/nurissaclub_beans_1.svg), url(../graphics/nurissaclub_waves_dark.svg); background-size: 350px 350px, 100% auto; background-repeat: no-repeat; background-position: -100px -100px, center bottom; }
    .content .nurissaclub.light::before { content:""; display: block; position: absolute; width: 100vw; height: 200px; transform: translateY(-195px); background-image: url(../graphics/nurissaclub_waves_light.svg); background-size: 100% auto; background-repeat: no-repeat; background-position: center bottom; }
    .content .nurissaclub.regular::before { content:""; display: block; position: absolute; width: 100vw; height: 200px; transform: translateY(-195px); background-image: url(../graphics/nurissaclub_waves_regular.svg); background-size: 100% auto; background-repeat: no-repeat; background-position: center bottom; }
    .content .nurissaclub .main { transform: translateY(-120px); }
    .content .nurissaclub .gauge { width: calc(100vw - 2em); height: auto; max-width: 359px; }
    .default .title { text-align: center; }
    .timeline { position: relative; margin-left: 1em; margin-right: 1em; display: block; }
    .timeline .milestone { position: relative; display: flex; flex-direction: column; justify-content: center; }
    .timeline>.spacer { display: none; }
    .timeline .milestone { padding-left: 2rem; }
    .timeline .milestone .title { font-family: fontbold; margin: 0; hyphens: auto; -webkit-hyphens: auto; }
    .timeline .milestone.col1 .title { font-size: 2em; text-align: left; }
    .timeline .milestone.col2 .title { font-size: 1.2em; text-align: left; }
    .timeline>.col1:not(.milestone), .timeline>.col2:not(.milestone) { padding: 1rem 0 0 2rem; }
    .timeline .milestone.col1::before { content: ""; position: absolute; top: 0; left: 0; width: 2rem; height: 100%; background-repeat: no-repeat; background-size: 0.8rem; background-position: center; background-image: url("data:image/svg+xml; charset=UTF8,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20511%20511%22%20version%3D%221.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%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.5%3B%22%3E%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C-630.631%2C-40.0793%29%22%3E%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C293.079%2C91.7577%29%22%3E%3Ccircle%20cx%3D%22592.748%22%20cy%3D%22203.518%22%20r%3D%22192.696%22%20style%3D%22fill%3Anone%3Bstroke%3Ablack%3Bstroke-width%3A90px%3B%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }
    .timeline>div { position: relative; font-size: 0.8em; }
    .timeline>div:not(.milestone.col1)::before { position: absolute; content: ""; top: -0.4rem; left: 0; width: 2rem; height: calc(100% + 0.8rem + 1em); background-image: linear-gradient(0deg, #000 0%, #000 100%); background-size: 2px 100%; background-position: center; background-repeat: repeat-y; }
    .timeline>div:last-child::before { background-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 90%) !important; background-size: 2px 100%; }
    .timeline .image { position: relative; }
    .timeline .image::after { content: ""; position: absolute; display: block; top: 0; left: 0; width: 100%; height: 1em; background-color: #f00; }
    .calendar.title { font-size: 1.3em; }
    .calendar .cell { height: 4em; }
    .calendar .tblcolumntitle { font-size: 0.5em; }
    .calendar .day { font-size: 0.7em; }
    .calendar .category { font-size: 0.7em; padding: 0.2em; margin: 0 0.2em 0.2em 0.2em; }
    .calendar .tblcolumntitle>span:nth-child(2), .calendar .category>span:nth-child(3) { display: none; }
    .calendar .category>span:nth-child(3) { position: absolute; top: 1.5em; font-size: 1rem; background-color: var(--color-muted); border: 1px solid var(--color-black); border-radius: 0.3rem; color: var(--color-black); padding: 0.5rem; white-space: nowrap; z-index: +1; }
    .calendar .category.middle>span:nth-child(3) { transform: translateX(-50%); }
    .calendar .category.right>span:nth-child(3) { right: 0; }
    .calendar .category>input:not(.editor):checked~span:nth-child(3) { display: block; }
    .partners { background-color: var(--color-brown); }
    .partners, .socialmedia { padding: 2em 0; }
    .partners>div, .socialmedia>div { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; }
    .partners>div>a, .socialmedia>div>a { display: block; background-repeat: no-repeat; background-position: center; background-size: 80% 80%; flex: 0 0 33.33%; height: 5em; margin-bottom: 1.5em; }
    .socialmedia>div>a { flex: 0 0 16.66%; height: 3em; margin-bottom: unset; }
    .footer { font-size: 0.9em; padding: 2em 0px 4em 0px; }
    .footer>div:not(:first-child) { display: block; margin-bottom: 3em; }
    .footer>div>* { margin-bottom: 1em; }
    .footer>div>a { display: block; color: var(--color-black); }
}

/*
    Tablet devices ----------------------------------------------------------------------------------------------------------------------------------
 */
@media(min-width:900px) {
    html { scroll-padding-top: unset; }
    .title, .subtitle { hyphens: unset; -webkit-hyphens: unset; text-align: unset; }
    .title { font-size: 2.8em; }
    .subtitle { font-size: 1.4em;  }
    .text { font-size: 1em; line-height: 1.5em; padding-bottom: 1em; }
    .form_checkbox { width: 1em; height: 1em; }
    .header { position: relative; padding: 1em 2em; box-shadow: none; justify-content: stretch; }
    .header .logo { height: 3.5em; flex: 0 0 11em; }
    .header .nuri { height: 2em; flex: 0 0 2em; }
    .header .menu { display: flex; flex-direction: row; flex: 0 1 auto; justify-content: flex-end; }
    .header .menu a { font-size: 0.8em; margin-right: 1.5em; }
    .header .menu>div:last-child::before { position: absolute; top: -1em; left: 0.4em; font-family: IcoFont; font-size: 1.1em; content: "\ed05"; display: inline-block; }
    .header .menu>div:last-child:has(a:hover)::before { color: var(--color-red); }
    .header .submenu hr { margin: 1.2em 1em; }
    .header .login { display: block; font-size: 0.8em; }
    .header .langselect { display: flex; }
    .header .langselect a { font-size: 1em; }
    .header .search-icon { padding-left: 0.5em; font-size: 1em; line-height: normal; }
    .header .basemodules { display: block; }
    .header .basemodules>div { position: relative; flex: 0 0 1%; }
    .header .basemodules a:hover { color: var(--color-red); }
    .header .basemodules div:hover .submenu hr { animation: menu-line-in 0.2s linear forwards; }
    .header .basemodules>div>a { text-decoration: none; color: var(--color-black); font-size: 2.5em; }
    .header .basemodules:hover .submenu { visibility: visible; }
    .header .basemodules .submenu { left: auto; right: 0px; }
    .header .basemodules .submenu hr { display: inline-block; text-align: left; margin-left: auto; }
    .header .basemodules .submenu a { text-decoration: none; color: var(--color-black); white-space: nowrap; font-size: 0.8em; }
    .header .basemodules .submenu a:hover, .header .basemodules .submenu a.active { color: var(--color-red); }
    .teasing .search-form { flex-direction: column; justify-content: center; position: absolute; background-color: var(--color-white); top: 0; right: 2em; height: 3em; padding: 0 1em; transform: translateY(-3em); transition: transform 0.3s ease; }
    #menu, .header .webshop, .mobilemenu { display: none; }
    .teasing { padding: unset; position: relative; }
    .teasing>div { display: block; }
    .teasing .image { height: 15em; }
    .teasing .video { display: block; height: 35vw; }
    .teasing .mobilevideo { display: none; }
    .teasing .webshop { position: absolute; display: block; top: 4em; left: 6em; width: 3em; height: 3em; background-image: url(../graphics/icon_shoppingcart.svg); background-position: center; background-size: 100%; background-repeat: no-repeat; }
    .teasing .webshop>span { position: absolute; left: 2.5em; bottom: 0; border-radius: 0.6em; display: inline-block; background-color: #f00; color: var(--color-white); font-family: fontbold; font-size: 0.8em; padding: 0 0.3em; transform: scale(0); animation: webshop-in .5s ease-in forwards .5s; }
    .teasing .news { position: absolute; display: block; width: 27vw; max-width: 30%; flex-direction: unset; align-items: unset; bottom: 0px; right: 2em; margin: 0; }
    .teasing .news>div { width: 100%; top: unset; bottom: 0; margin: 0; }
    .teasing .news>div>div:nth-child(1) { border-top: 1.8em solid var(--color-brown); border-left: 1.8em solid var(--color-brown); border-right: 1.8em solid var(--color-brown); }
    .teasing .news .title { font-size: 1.2em; text-align: left; }
    .teasing .news .description { font-size: 0.8em; text-align: left; margin: 1em 0px; }
    .teasing .news .link { text-align: left; }
    .teasing .news .picture { height: 15vw; }
    .content .bordered, .content .default { margin-left: 2em; margin-right: 2em; }
    .content .leftnav { display: flex; flex-direction: row; }
    .content .leftnav .articles { flex: 0 0 75%; }
    .content .leftnav .articles>div { margin: 0 4em 0 2em; }
    .content .leftnav .submenu, .leftnav .articles .title { display: block; }
    .content .leftnav .categories ul { list-style: none; }
    .content .leftnav .categories ul li { margin-bottom: 1em; }
    .content .leftnav .categories ul>li>ul { margin-left: 2em; margin-top: 1em; }
    .content .leftnav .categories { display: block; flex: 0 0 25%; padding: 4em 1em 2em 4em; }
    .content .leftnav .categories a { display: inline-block; color: var(--color-text); text-decoration: none; transition: color ease-out .2s; hyphens: auto; -webkit-hyphens: auto; }
    .content .leftnav .categories a:hover { color: var(--color-red); }
    .content .leftnav .categories a.active { font-family: fontbold; color: var(--color-red); }
    .content .leftnav .categories hr { height: 1px; color: var(--color-text); border: var(--color-text); background-color: var(--color-text); width: 0px; animation: menu-line-in 0.5s linear forwards 0.5s; margin-top: 0.5em; margin-bottom: 0.5em; }
    .content .leftnav .submenu { flex: 0 0 25%; padding: 2em 1em 0 4em; }
    .content .leftnav .submenu ul { list-style: none; }
    .content .leftnav .submenu ul li a { display: block; color: var(--color-text); text-decoration: none; line-height: 2em; }
    .content .leftnav .submenu a:hover { color: var(--color-red); }
    .content .leftnav .submenu a.active { font-family: fontbold; color: var(--color-red); }
    .content .leftnav .default { flex: 1 1 auto; margin-left: unset; margin-right: unset; padding: 2em 4em 0 0; }
    .content .nurissaclub { display: flex; }
    .content .nurissaclub.dark { background-image: url(../graphics/nurissaclub_beans_3.svg), url(../graphics/nurissaclub_beans_4.svg); background-size:350px 350px, 350px 350px; background-repeat: no-repeat; background-position: 800px 0px, 0px 100px; }
    .content .nurissaclub.light { background-image: url(../graphics/nurissaclub_beans_1.svg), url(../graphics/nurissaclub_beans_2.svg); background-size:350px 350px, 350px 350px; background-repeat: no-repeat; background-position: 0px 0px, 780px 0px; }
    .content .nurissaclub .usernav { display: block; z-index: 999; }
    .content .nurissaclub .usernav { flex: 0 1 20%;  padding: 9em 1em 2em 1em; }
    .content .nurissaclub .usernav h2 { font-family: fontlight; font-size: 1.2em; margin-bottom: 1em; }
    .content .nurissaclub .usernav ul { list-style: none; }
    .content .nurissaclub .usernav ul li a { display: block; color: var(--color-muted-dark); margin-bottom: 0.5em; }
    .content .nurissaclub .usernav ul li a:hover { color: var(--color-white);  }
    .content .nurissaclub .main { flex: 0 1 80%; }
    .content .nurissaclub .gauge { width: 359px; height: auto; }

    .box { display: flex; flex-direction: row; }
    .box>div { flex: 0 0 50%; display: flex; flex-direction: column; align-items: stretch; }
    .box>div>div>div { margin: 3em 4.5em; }
    .box .col1>div:nth-child(1) { background-color: var(--color-bg-warm); color: var(--color-text); flex: 1; }
    .box .col1>div:nth-child(2) { background-color: var(--color-bg-light); color: var(--color-text); }
    .box .col2>div:nth-child(1) { background-color: var(--color-brown); color: var(--color-muted-dark); flex: 1; }
    .box .col2>div:nth-child(2) { background-color: var(--color-text); color: var(--color-muted-dark); }
    .box .title { font-size: 1.8em; text-transform: uppercase; text-align: left; }
    .box .subtitle { font-size: 1.2em; }
    .box .light .link { color: var(--color-black); }
    .box .dark .link { color: var(--color-muted-dark); }
    .content .two_col { display: flex; flex-direction: row; }
    .content .two_col>div { flex: 0 0 50%; }
    .content .two_col .col1>div { margin: 0; margin-right: 2em; }
    .content .two_col .col2>div { margin: 0; margin-left: 2em; }
    .content .two_col .col2.dark>div { margin: 0; }
    .content .default .title { text-align: left; }
    .content .bordered { margin-left: 4.5em; margin-right: 4.5em; }
    .timeline { margin-left: 10em; margin-right: 10em; display: flex; flex-direction: row; flex-wrap: wrap; margin-bottom: 1em; }
    .timeline>div { position: relative; flex: 0 0 47%; font-size: 0.9em; }
    .timeline>.spacer { position: relative; display: block; flex: 0 0 6%; }
    .timeline>.spacer:not(.milestone)::after { content: ""; position: absolute; top: -0.4rem; left: 0; width: 100%; height: calc(100% + 0.8rem); background-image: linear-gradient(0deg, #000 0%, #000 100%); background-size: 2px 100%; background-position: center; background-repeat: repeat-y; }
    .timeline>.spacer:last-of-type::after { background-image: linear-gradient(180deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 90%); background-size: 2px 100%; }
    .timeline .milestone .title { hyphens: unset; -webkit-hyphens: unset; }
    .timeline .milestone { padding: 0; }
    .timeline .milestone.col1 .title { font-size: 2em; text-align: right; }
    .timeline .milestone.col2 .title { font-size: 1.2em; }
    .timeline .milestone.spacer::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: 0.6rem; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml; charset=UTF8,%3Csvg%20width%3D%22100%25%22%20height%3D%22100%25%22%20viewBox%3D%220%200%20511%20511%22%20version%3D%221.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%20xml%3Aspace%3D%22preserve%22%20xmlns%3Aserif%3D%22http%3A%2F%2Fwww.serif.com%2F%22%20style%3D%22fill-rule%3Aevenodd%3Bclip-rule%3Aevenodd%3Bstroke-linecap%3Around%3Bstroke-linejoin%3Around%3Bstroke-miterlimit%3A1.5%3B%22%3E%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C-630.631%2C-40.0793%29%22%3E%3Cg%20transform%3D%22matrix%281%2C0%2C0%2C1%2C293.079%2C91.7577%29%22%3E%3Ccircle%20cx%3D%22592.748%22%20cy%3D%22203.518%22%20r%3D%22192.696%22%20style%3D%22fill%3Anone%3Bstroke%3Ablack%3Bstroke-width%3A90px%3B%22%2F%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E"); }
    .timeline>.col1:not(.milestone) .title, .timeline>.col2:not(.milestone) .title { font-size: 1.4em; }
    .timeline>.col1:not(.milestone) .subtitle, .timeline>.col2:not(.milestone) .subtitle { font-size: 1.2em; }
    .timeline>.col1:not(.milestone), .timeline>.col2:not(.milestone) { padding: 1rem 0; }
    .timeline .milestone.col1::before, .timeline>div:not(.milestone.col1)::before, .timeline>div:last-child::before { background-image: unset !important; }
    .calendar .cell { height: 8em; }
    .calendar .tblcolumntitle { font-size: 0.9em; }
    .calendar .day { font-size: 1em; }
    .calendar .category { padding: 0.5em 0; margin: 0 0.3em 0.3em 0.3em; font-size: 0.7em; }
    .calendar .category>span:nth-child(2) { display: none; }
    .calendar .tblcolumntitle>span:nth-child(2), .calendar .category>span:nth-child(3) { display: inline; }
    .calendar .category>span:nth-child(3) { position: unset; top: unset; font-size: unset; background-color: unset; border: none; border-radius: unset; color: unset; padding: unset; white-space: unset; z-index: initial; }
    .calendar .category.middle>span:nth-child(3) { transform: unset; }
    .calendar .category.right>span:nth-child(3) { right: unset; }
    .partners, .socialmedia { padding: 2em; }
    .partners>div>a, .socialmedia>div>a { display: block; background-repeat: no-repeat; background-position: center; flex: 0 0 20%; height: 6em; margin-bottom: 3em; }
    .socialmedia>div>a { flex: 0 0 10%; height: 4em; margin-bottom: unset; }
    .footer { display: flex; flex-direction: row; justify-content: center; text-align: left; }
    .footer>div { padding-right: 4em; }
    .footer>div:nth-child(3) { border-left: 1px solid; padding-left: 4em; }
}
@media(min-width:1300px) {
    .header .menu a { font-size: 0.9em; margin-right: 2em; }
    .header .login { font-size: 0.8em; }
    .header .langselect a { font-size: 1em; }
    .content .two_col .col1>div { margin: 0; margin-right: 4.5em; }
    .content .two_col .col2>div { margin: 0; margin-left: 4.5em; }
}

/*
    Desktop PC --------------------------------------------------------------------------------------------------------------------------------------
 */
@media(min-width:1800px) {
    .body { text-align: center; }
    .header { padding: 1.5em 4.5em; }
    .header .logo { height: 4em; flex: 0 0 15em; }
    .header .menu a { font-size: 1em; margin-right: 1.5em; }
    .header .submenu hr { margin: 1.5em 1em; }
    .header .login { font-size: 0.9em; }
    .header .langselect a { font-size: 1.1em; }
    .header .search a { font-size: 1.1em; }
    #search { background-color: var(--color-white); height: 3em; right: 4em; }
    .teasing .image { left: 0px; margin-left: unset; width: 100%; height: 20em; max-width: unset; }
    .teasing .video { height: 35vw; }
    .teasing .news { right: 4em; width: calc((100% - 8em) / 3.33); }
    .teasing .news>div>div:nth-child(1) { border-top: 2em solid var(--color-brown); border-left: 2em solid var(--color-brown); border-right: 2em solid var(--color-brown); }
    .teasing .news .title { font-size: 1.8em; }
    .teasing .news .description { font-size: 1em; margin: 1em 0px; }
    .teasing .news .picture { height: 15em; }
    .teasing .webshop { left: 10em; width: 4em; height: 4em; }
    .teasing .webshop>span { left: 3.5em; }
    .header { margin-left: auto; margin-right: auto; max-width: 1800px; }
    .timeline .milestone.col1::after { content: ""; position: absolute; top: 50%; margin-top: -0.4rem; right: -1.3rem; width: 0.8rem; height: 0.8rem; }
    .calendar .category { padding: 0.5em 0; margin: 0 0.3em 0.3em 0.3em; font-size: 0.9em; }
    .partners, .socialmedia { padding: 2em 4.5em; }
    .partners>div, .socialmedia>div { max-width: 1800px; margin-left: auto; margin-right: auto; }
    .content .default .title { max-width: 50%; }
    .content .bordered { margin-left: 15vw; margin-right: 15vw; }
}