html  {
    background: #f1efed;
}

body {
    scroll-behavior: smooth;
    background: white;
    display:flex;
    flex-direction: column;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.1);
}

.content {
    overflow: hidden;
    /*background: white;*/
}

/* Nav */

nav {
    text-align:center;
}

nav a:hover {
    opacity: 0.8;
}

nav ul {
    margin:0;
    padding:0;
    line-height: 1;
}

nav li {
    list-style:none;
    display:inline-block;
    padding: 15px 0 0 0;
}

nav .pages li {
    display: block;
    padding: 15px;
    line-height: 1;
}

nav .pages .department {
    /*color: #808080;*/
    text-transform: uppercase;
    color: #009865;
    border-radius: 5px;
    font-family: Arial,FreeSans,sans-serif;
    max-width: 260px;
    width: 100%;
    box-sizing: border-box;
    display: inline-block;
    margin: 15px 0;
    border: 2px solid #009865;
    font-weight: lighter;
}

nav .pages .active {
    background: #009865;
    color: white;
}

nav .pages a {
    font-size: 20px;
    color: #14855e;
}

/* Burger */

.burger {
    width: 34px;
    height: 26px;
    position: absolute;
    left: 50%;
    margin-left: -15px;
    cursor: pointer;
    z-index: 100;
    transition: opacity .25s ease, top 0.5s ease;
    background: #efefef;
    border-radius:2px;
}

.burger span {
    background: #009865;
    border: none;
    height: 2px;
    width: 26px;
    position: absolute;
    top: 0;
    left: 0;
    transition: all .35s ease;
    cursor: pointer;
    margin-left:4px;
    border-radius:1px;
}

.burger:hover span {
    opacity: 0.8;
}

.burger .t {
    top: 10px;
}

.burger .b {
    top: 18px;
}

/* Header */

header {
    padding: 15px;
    text-align: center;
}

header img {
    /*
    width: 260px;
    height: 66.7333px;
    */
    max-width:260px;
    width:100%;
    vertical-align: bottom;
    margin: 15px 0;
}

a {
    text-decoration: none;
    outline: none;
    font-weight:bold;
    color: gray;
    transition: .4s ease;
    position: relative;
}

.content p a {
    display: inline;
    color: #444;
    font-weight: normal;
    border-bottom: .12rem solid #555;
}

a.orange, a.orange:active, a.orange:focus, a.orange:visited, a.orange:hover {
    display: inline;
    color: orange;
    font-weight: bold;
    border-bottom: .12rem solid orange;
}

a:hover {
    color: #14855e;
}

:not(.widget) a:active {
    top: 1px;
}

.content p a:hover {
    color: #444;
    border-bottom: .12rem solid #14855e;
}

header strong {
    /*display: block;*/
    letter-spacing: 0.05em;
    font-weight: bold;
}

.openinghours {
    line-height: 1;
}

.box .openinghours {
    display: inline-block;
}

.closed {
    color: #b91109;
}

.pause {
    color: orange;
}

.opened {
    /*color: #168750;*/
    color:black;
}

/* Languages */

.languages a {
    display: inline-block;
    position: relative;
}

nav .languages a {
    font-weight: normal;   
}

nav .languages a:after {
    content: attr(data-abbr);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background :#eee;
    display: block;
}

h2.hero {
    text-align: left;
}

section h2 {
    /*margin:0;*/
    margin: 20px 0 0 0;
    text-align: center;
}

section h3 {
    text-align: center;
}

/* Footer */

footer {
    padding: 30px 0;
    margin: 30px 0 0 0;
    text-align: center;
    /*border-top: 1px solid #efefef;*/
}

footer a {
    font-weight: normal;
    color: #444;
}

footer a:hover {
    opacity: 0.8;
    color: #444;
}

.content hr.bottomline {
    background: linear-gradient(90deg,#807e7c 25%,rgba(128,126,124,0) 0) 0 100%/4px 1px repeat-x;
    margin: 30px 30px 0 30px;
    display: block;
}

.no-border {
    border-top: none;
}

/* Thumbnails */

.thumb {
    text-align: center;
    padding: 30px;
    box-sizing: border-box;
}

.thumb a {
    height: 100%;
    font-weight: lighter;
}

.thumb img {
    max-height: 320px;
    max-width: 480px;
    width: 100%;
    /*vertical-align:middle;*/
    vertical-align: bottom;
}

.thumb .icon {
    font-size:50px;
    display: block;
    margin: 25px 0;
}

.thumb h2 {
    text-align: center;
    color: gray;
    font-weight: lighter;
}

.thumb:hover h2 {
    color: #14855e;
}

/* HR */

hr {
    /*height: 0;*/
    margin: 0;
    padding: 0;
    /*
    border: 1px solid #ccc;
    border-width: 1px 0 0 0;
    */
    border:0;
    height: 1px;
    /*background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(204,204,204,1) 50%, rgba(255,255,255,0) 100%);*/
}

hr.grad {
    border: 0;
    height: 2px;
    background: linear-gradient(90deg, rgba(51,51,51,1) 0%, #efefef 50%);
    margin: 0 0 15px 0;
}

hr.light {
    border: 0;
    height: 2px;
    /*background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,0) 50%);*/
    /*background: linear-gradient(90deg,#807e7c 25%,rgba(128,126,124,0) 0) 0 100%/4px 1px repeat-x;*/
    margin-top: 5px;
}

hr.vr {
    border:0;
    width: 1px;
    height: auto;
    order: 2;
    background: linear-gradient(0deg, rgba(204,204,204,1) 0%, rgba(255,255,255,0) 100%);
    margin: 0;
}

hr.vr-solo {
    background: linear-gradient(0deg, rgba(255,255,255,0) 0%, rgba(204,204,204,1) 50%, rgba(255,255,255,0) 100%);
}

/* Hero */

.hero a svg rect {
    fill-opacity: 0;
}

.hero {
    margin-top: 30px;
}

/* Well */
    
.well, section.well {
    /*background: #009865;*/
    /*background: #ebebeb;*/
    /*background: #efefef;*/
    background: #f1efed;
    margin: 30px 0;
    /*color: white;*/
    /*color: #9d9d9d;*/
    
    padding: 30px;
}

.subheading h2 {
    margin: 0 0 30px 0;
    padding: 0;
}

/* Gallery */

.gal {
    padding: 0;
    /*padding-right: 0;*/
}

.gal .descr {
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 15px 30px;
    color: gray;
}

/* Tables */

.content table tr > :not(:nth-child(1)):not(:nth-child(2)) {
    display: none;
}

.hide-screen {
    display: none;
}

p:first-child {
    margin-top: 0;
}

p:last-child {
    margin-bottom: 0;
}

/* Lightbox */

.gal lightbox [data-lb-default] {
    display: block;
}

.theater, .gal lightbox .theater {
    margin: -30px 0;
}

/* Responsiveness */

@media only screen and (min-width: 641px) {
    .content {
        display: flex;
        flex-wrap: wrap;
    }
    
    .content-splash {
        flex-grow: 1;
        justify-content: center;
        align-content: space-around;
    }
    
    .content-splash-v {
        flex-direction: column;
    }
    
    h2 {
        text-align: left;
        font-size: 1.75em;
    }
    .text-col-2 {
        column-count: 2;
        column-gap: 60px;
    }
    .col-m1 {
        width: 50%;
    }
    .flex-m {
        margin-left:15px;
    }
    .languages a {
        /*
        max-width: none;
        text-transform: none;
        font-family: inherit;
        overflow:initial;
        */
    }
    nav .languages a:after {
        display: none;
    }
    nav .pages li {
        display: inline-block;
        padding: 15px 30px;
    }
    nav .languages li {
        padding: 15px 15px 0 15px;
    }
    .show-medium {
        display: block;
    }
    
    .hide-medium {
        display: none;
    }
    
    .content table tr > :not(:nth-child(1)):not(:nth-child(2)) {
        display: table-cell;
    }
    
    .content .table-5 th {
        width: 20%;
    }
    
    .theater, .gal lightbox .theater {
        margin: 0 0 -30px 0;
    }
    
    .content hr.bottomline {
        width: 100%;
    }
}

@media only screen and (max-width: 640px) {
    nav .pages li {
        display: inline-block;
        width: 50%;
        box-sizing: border-box;
    }
    .aspect-ratio {
        min-height: 100px;
    }
    .well {
        /* Prevent collapsing borders < 640px */
        display: inline-block;
        margin-bottom: 6px;
    }
    .flex-m {
        width: 100%;
    }
    .burger {
        display: block;
    }
    .mobmenu {
        max-height: 0;
        transition: max-height 0.5s ease-out;
    }
    
    /* Burger active */

    #menustate:checked ~ nav .burger .t {
        transform: translateY(0) translateX(0) rotate(45deg);
    }
    
    /*
    #menustate:checked ~ nav .burger .m {
        opacity: 0;
    }
    */
    
    #menustate:checked ~ nav .burger .b {
        transform: translateY(-8px) translateX(0) rotate(-45deg);
    }
    
    #menustate:checked ~ nav .mobmenu {
        max-height: 600px;
        transition: max-height 0.5s ease-in;
    }

    header {
        background: #efefef;
        margin-bottom: 30px;
    }
    
    .mobmenu {
        overflow: hidden;
    }
    
    .hide-small {
        display: none !important;
    }
}

@media only screen and (min-width: 1024px) {
    .heading {
        padding: 0 30px;
    }
    notification {
        text-align: right;
        padding: 0;
        position: absolute;
        top: 0;
        right: 0;
    }
    nav {
        /*float:right;*/
        position: relative;
        display: block;
    }
    nav .pages {
        position: absolute;
        bottom: 0;
        right: 0;
        width: 50%;
        box-sizing: border-box;
        height: 100%;
        padding-left: 30px;
    }
    .devider {
        border-left: 2px solid #009865;
    }
    nav .pages ul {
        display: flex;
        position: absolute;
        bottom: 0;
        left: 0;
        justify-content: space-between;
        width: 100%;
        box-sizing: border-box;
    }
    nav .pages ul {
        padding-left: 30px;
    }
    nav .devider ul {
        padding-left: 60px;
    }
    nav .pages li {
        /*padding: 0 0 0 60px;*/
        padding: 0;
    }
    nav .box {
        position: absolute;
        top: 0;
        right: 0;
        /*float: right;*/
        text-align: right;
        z-index: 2;
    }
    nav .languages li {
        padding: 10px 0 0 30px;
    }
    #switch {
        display: block;
    }
    header {
        text-align:left;
        padding: 50px 30px;
    }
    header img {
        width: auto;
        max-width: none;
        height: 90px;
        margin: 0;
    }
    nav, .content {
        text-align: left;
    }
    .subheading {
        /*text-align: justify;*/
        font-size: 1.125em;
    }
    .text-col-2, .text-justify {
        text-align: justify;
    }
    .col-l1 {
        width: 25%;
    }
    .col-l2 {
        width: 50%;
    }
    .col-rel-l3 {
        width: 33.33%;
    }
    nav .pages .department {
        font-size: 1.6em;
        line-height: 1.2;
        margin: 0 0 0 30px;
        padding: 5px 25px;
        display: inline-block;
        width: auto;
    }
    
    /* Overlay */

    .overlay {
        position: absolute;
        /*background-color: rgba(255,255,255,0.8);*/
        background-color:#14855e11;
        overflow: hidden;
        transition: .4s ease;
        opacity: 0;
    }

    /* Default overlay */

    .content .overlay {
        width: 100%;
        height: 100%;
        opacity: 0;
        top: 0;
        left:0;
    }
    
    .content .overlay .button:hover {
        opacity:1;
    }

   .content a:hover .overlay {
      opacity: 1;
    }
    
    .content .text {
      /*font-size: 20px;*/
      position: absolute;
      overflow: hidden;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
    }
    
    .content a {
        position: relative;
        display: inline-block;
    }
    
    .show-large {
        display: block;
    }
    
    .hide-large {
        display: none;
    }
    
    /* Lightbox */
    
    .gal {
        display: flex;
        /*padding: 0 30px;*/
    }
    
    .gal preview {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        /*width: 20%;*/
        width: 25%;
        order: 3;
        /*border-left: 1px solid #ccc;*/
        padding: 0 30px;
        box-sizing: border-box;
    }
    
    .gal preview a {
        flex-basis: 100%;
    }
    
    .gal [data-lb-target] {
        transition: .4s ease;
    }
    
    .gal lightbox [data-lb-target] {
        vertical-align: bottom;
    }
    
    .gal lightbox [data-lb-default], .gal lightbox [data-lb-target] {
        border-radius:3px;
    }
    
    /*
    .gal lightbox iframe {
        padding: 0 30px;
        box-sizing: border-box;
    }
    */
    
    .gal lightbox {
        /*width: 60%;*/
        position: relative;
        /*flex-grow: 1;*/
        width: 75%;
        padding: 0 30px;
        /*margin: 0 30px;*/
        order: 1;
        box-sizing: border-box;
        /*justify-content: center;*/
        /*text-align:center;*/
    }
    
    .gal lightbox [data-lb-target] {
        position: absolute;
        top: 0;
        right: 0;
        opacity: 0;
        padding: 0 30px;
        max-height: 100%;
        display: flex;
    }
    
    /*
    #lb-1,
    #lb-2,
    #lb-3,
    #lb-4 {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
    }
    */
    
    .gal preview img {
        opacity: .4;
    }
    
    .gal preview [data-lb-default] {
        display: none;
    }
    
    .theater, .gal lightbox .theater {
        margin: 0;
    }
    
    /* Show lightbox image on active :target */
    #lb-0:target ~ .gal lightbox [data-lb-target="lb-0"],
    #lb-1:target ~ .gal lightbox [data-lb-target="lb-1"],
    #lb-2:target ~ .gal lightbox [data-lb-target="lb-2"],
    #lb-3:target ~ .gal lightbox [data-lb-target="lb-3"] {
        opacity: 1;
    }
    
    /* Eventually highlight preview image on active :target */
    #lb-0:target ~ .gal preview img[data-lb-target="lb-0"],
    #lb-1:target ~ .gal preview img[data-lb-target="lb-1"],
    #lb-2:target ~ .gal preview img[data-lb-target="lb-2"],
    #lb-3:target ~ .gal preview img[data-lb-target="lb-3"] {
        opacity: 1;
    }
    
    /* Eventually hide preview image on active :target */
    #lb-0:target ~ .gal preview a[data-lb-target="lb-0"],
    #lb-1:target ~ .gal preview a[data-lb-target="lb-1"],
    #lb-2:target ~ .gal preview a[data-lb-target="lb-2"],
    #lb-3:target ~ .gal preview a[data-lb-target="lb-3"] {
        display: none;
    }
    
    /* Show default preview image on active :target */
    [id^="lb-"]:target ~ .gal preview [data-lb-default] {
        display: inline-block;
    }
    
    :target ~ .gal lightbox [data-lb-default] {
        opacity: 0;
    }
    
    /* In case #lb-1 is default image, too */
    .gal lightbox [data-lb-default] {
        opacity: 1;
    }
    
    .gal preview a:hover > img {
        opacity: 1;
    }
    
    /* Hero */

    .hero {
        /*width: 90px;/*
        /*background: #009865;*/
        
        /*position: relative;*/
        
        /*order: 1;*/
        /*border-radius: 2px;*/
        /*text-align: center;*/
        
        margin: 0;
        
        margin-top:-72px;
        
        padding: 15px 0;
        /*background: #ebebeb;*/
        
        /*background: linear-gradient(90deg, rgba(0,152,101,1) 10%, rgba(255,255,255,0) 50%);*/
        
        position: relative;
        /*border-bottom: 2px solid #333;*/
    }
    
    .hero-base {
        margin-top: 0;
        padding: 30px 0;
    }
    
    .hero a {
        /*
        position: absolute;
        bottom: 0;
        top: inherit;
        left: 24px;
        transform: rotate(-90deg);
        transform-origin: 0 0;
        */
        /*line-height: 77px*/
        
        color: #14855e;
        
        
    }
    
    .content .fig figure:first-child {
        margin-right: 30px;
    }
    
    .content .fig figure:last-child {
        margin-left: 30px;
    }
    
    .content .fig figure:first-child img {
        border-top-right-radius: 2px;
        border-bottom-right-radius: 2px;
    }
    
    .content .fig figure:last-child img {
        border-top-left-radius: 2px;
        border-bottom-left-radius: 2px;
    }
    
    hr {
        display: block;
    }
    
    .thumb a {
        box-shadow: 0 4px 10px 0 rgba(0,0,0,0.11);
        padding: 15px;
        display: block;
    }
    
    /*
    .hero a svg .title,  .hero a:hover svg .title,  .hero a:visited svg .title,  .hero a:active svg .title {
        fill: white;
    }
    */
    
    section.well {
        margin: 0 30px 15px 30px;
        border-bottom-left-radius: 2px;
        border-bottom-right-radius: 2px;
        padding: 30px;
    }
    
    .no-hspace {
        margin-left: 0;
        margin-right: 0;
        border-radius: none;
    }
    
    footer br {
        display: none;
    }
    
    .button-promo {
        font-size:2em;
    }
    
    footer {
        margin: 30px 30px 0 30px;
    }
    
    .well, section.well {
        width: auto;
    }
}

@media only screen and (max-width: 1024px) {
    /*
    .button::after {
        content: "\25B8";
        margin-left: 5px;
    }
    */
    .gal .descr {
        display: none;
    }
}

@media only screen and (max-width: 480px) {
    footer {
        font-size: small;
    }
}

@media only screen and (min-width: 1440px) {
    body {
        width: 100%;
        max-width: 1500px;
    }
    body > * {
        max-width: 1440px;
        margin: 0 auto;
        box-sizing: border-box;
        width: 100%;
    }
    /*
    .gal {
        display: flex;
        padding: 0 30px;
    }
    */
    .no-vspace {
        border-top-right-radius: none;
        border-top-left-radius: none;
    }
    
    .no-hspace {
        margin-right: 30px;
        margin-left: 30px;
    }
    
    nav .languages a:after {
        background :#fff;
    }
    .theater, .gal lightbox .theater {
        max-width: 100%;
        padding: 0;
    }
    .theater {
        max-width: 100%;
        padding: 0;
        margin-bottom: -30px;
    }
    footer {
        padding: 30px;
    }
}

@media only screen and (min-width: 1921px) {
    header img {
        /*width: 452px;*/
        height: 115.4999px;
    }
        
    /* Hero */

    /*
    .hero {
        width: 112px;
    }
    
    .hero a {
        left: 35px;
    }
    */
}

/* IE Sliders */

::-ms-fill-lower {
    background: none;
}

::-ms-fill-upper {
    background: none;
}

::-ms-thumb {
    background: green;
    border: 2px solid green;
}

::-ms-track {
    border: none;
}

::-ms-tooltip {
    display: none;
}

/* Chevron */

.chevron {
    display: inline-block;
    transform: rotate(45deg);
    border-right: 2px solid gray;
    border-bottom: 2px solid gray;
    content: "";
    width: 8px;
    height: 8px;
}

.chevron-left {
    transform: rotate(135deg);
}

.chevron-right {
    transform: rotate(-45deg);
}

a:hover .chevron {
    border-color:#14855e;
}

.active .chevron {
    transform: rotate(-135deg);
}

/* Sub Navigation */

.title {
    display:flex;
    justify-content: space-between;
    flex-flow: wrap;
}

.nav-sub-container {
    margin-top: 30px;
}

.nav-sub, .content p .nav-sub {
    padding: 6px 10px;
    border-radius:4px;
    background: #009865;
    color: white;
    font-weight: lighter;
}

.content .nav-sub:hover {
    color: white;
    opacity: 0.8;
}

.nav-sub .chevron {
    border-color: white;
    width: 10px;
    height: 10px;
}

.nav-sub:hover .chevron {
    border-color: white;
}

/* Boxes */

.content .col-box ul, .content .col-box > img {
    box-shadow: rgba(0, 0, 0, 0.3) 0px 25px 20px -20px;
}

/* Dark Mode */
/*
@media (prefers-color-scheme: dark) {
    html {
        background: #181818;
    }
    body, .content {
        background: #202020;
    }
    img {
        opacity: .75;
        transition: opacity .5s ease-in-out;
    }
    img:hover {
        opacity: 1;
    }
}
*/
