html {font-size:16px;line-height:1.4;font-family:"gill-sans-nova", sans-serif;font-weight:400;font-style:normal;position:relative;min-height:100.1%;}
body {font-size:150%;margin:0;border:0;padding:0;/*background-color:#bed439;*/}

* {ooutline:1px solid #eeeeee;}

h1 {font-size:0.833em;font-weight:400;font-style:normal;text-transform:uppercase;letter-spacing:1px;text-align:center;margin:3em 0 0 0;}
h2 {font-size:2em;font-weight:600;font-style:normal;text-align:center;margin:0 0 1em 0;}
body.home h1 {margin:2em 0;}
p {text-align:center;margin:0 0 1em 0;}
strong {font-weight:600;}

@media screen and (min-width:1024px) {
	
}


a {color:inherit;text-decoration:none;border-bottom:1px solid #000000;transition:color 0.25s ease;}
a:focus-visible {outline:2px dashed #000000;}

figure {margin:0;padding:0;}
img {display:block;margin:0;border:0;padding:0;width:auto;max-width:100%;height:auto;}

iframe {margin:0 auto 5em auto;width:2000px;max-width:100%;filter:grayscale(1);}


@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}
@keyframes imageChange {
    0% {
        opacity: 1;
    }
    38% {
        opacity: 0;
    }
    62% {
        opacity: 0;
    }
     100% {
        opacity: 1;
    }
}


.invisible {display:block;position:absolute;top:-3000px;left:-3000px;}

.flexslider {border:0;background:none;}
.spalte .content-text {clear:both;text-align:left;}


/* Navigation */
.mod_navigation {padding:3em 0 0 0;width:100%;text-align:right;}
.nav-burger {margin-left:auto;margin-right:1em;}
.nav-burger .icon-line, .nav-burger .icon-line:after, .nav-burger .icon-line:before {background:#000000;}
.nav-burger.is-active .icon-line:after, .nav-burger.is-active .icon-line:before {background:#ffffff;}


/* Navigation .nav-is-mobile */
body.nav-is-mobile .nav-wrapper {position:absolute;z-index:50;text-align:left;}
body.nav-is-mobile .navigation-main {background:#bed439;padding:0 5%;width:90%;color:#000000;}
body.nav-is-mobile .navigation-main li.active {background:none;}
body.nav-is-mobile .navigation-main a {padding:12px 0px;color:#000000 !important;}
body.nav-is-mobile .navigation-main a:hover {color:#ffffff !important;}
body.nav-is-mobile .navigation-main strong {padding:12px 0px;color:#ffffff !important;}

/* Navigation .nav-is-desktop */
body.nav-is-desktop .nav-wrapper {z-index:50;}
body.nav-is-desktop .navigation-main {background:none;color:#AAABB8;font-size:1em;margin:0 0 0 auto;}
body.nav-is-desktop .navigation-main a {padding:12px 0px;color:#AAABB8 !important;font-weight:500;}
body.nav-is-desktop .navigation-main a:hover {color:#FFFFFF !important;}
body.nav-is-desktop .navigation-main strong {padding:12px 0px;color:#FFFFFF !important;font-weight:500;}
body.nav-is-desktop .navigation-main .level_1 ul {background:#25274D;}
body.nav-is-desktop .navigation-main .level_2:not(.bounds-left):not(.bounds-right) {left:0;transform:translateX(0);}
body.nav-is-desktop .navigation-main .level_2:not(.bounds-left):not(.bounds-right):before {display:none;}
body.nav-is-desktop .btn-toggle-submenu {top:20px;}
body.nav-is-desktop .btn-toggle-submenu::after {background: var(--nav-mobile-icon) no-repeat center;}

@media screen and (min-width:1024px) {
	.mod_navigation {margin:0 auto;padding:0;width:90%;max-width:1200px;background:none;}
}

.logo {position:fixed;top:1em;right:0;z-index:10000;}
.home .logo {z-index:0;}
.logo img {width:auto;height:4em;}

@media screen and (min-width:1024px) {
    .logo img {width:auto;height:5em;}

	/*.logo {position:fixed;top:50%;right:0;}
    .logo img {width:64px;transform:translateX(0) translateY(-50%);}*/
}

/*body {background:#bed439 url('../../files/design/img/dezero.svg') no-repeat left top;background-size:contain;}*/

body.home {background:url('../../files/design/img/dezero-optik-und-akustik-geschaeft-rotkreuz.jpg') no-repeat bottom center;background-size:cover;}
body.home .mod_article {text-align:center;}
body.home .willkommen {opacity:0;animation:fadeIn 1s forwards;-webkit-animation:fadeIn 2s forwards;animation-delay:0.25s;}
body.home .logo {position:absolute;top:50%;left:50%;right:auto;opacity:0;animation:fadeIn 1s forwards;-webkit-animation:fadeIn 2s forwards;animation-delay:0.5s;}
body.home .logo img {width:256px;transform:translateX(-50%) translateY(-50%);}

.mod_article {margin:0 auto;width:90%;}

.dreispaltig ul {margin:0 0 1em 0;padding:0;list-style-type:none;}
.dreispaltig li {text-align:center;}

.content-gallery ul {margin:0;padding:0;list-style-type:none;text-align:center;}
.content-gallery li {float:left;margin:0;padding:1%;width:31.333%;height:auto;}
.content-gallery figure {width:100%;height:auto;background-color:#12120d;border-radius:1em 0 0 1em;overflow:hidden;}
.content-gallery figure img {width:100%;height:auto;opacity:1;transition:opacity 1s ease;}
.content-gallery figure img:hover {opacity:0.38;}


/*.content-text li {margin:0 auto;border-bottom:1px solid #ffffff;padding:0.5em 0;width:80%;}
.content-text li:first-child {border-top:1px solid #ffffff;}*/

.spalte .content-text p {text-align:left;}

.dreispaltig > div {position:relative;}
.dreispaltig h2 {text-transform:uppercase;font-weight:400;font-size:2em;color:#ffffff;display:block;margin:0;padding:0.5em;/*background-color:#000000;*//*position:absolute;top:0;left:50%;transform:translateX(-50%);*/border-radius:0 0 0.75em 0.75em;}
.dreispaltig div {background-color:#bed439;/*padding-top:3.5em;*/}
.dreispaltig ul {padding-bottom:1em;}
/*.dreispaltig div:nth-child(3) {align-self:flex-end;}*/

.zeile {display:block;}
.zeile .spalte {display:block;}

.team .zeile {margin-bottom:1em;}
.team .spalte {position:relative;margin-bottom:1em;}
.team .spalte .content-text {position:relative;padding:0.25em 0;width:100%;height:auto;}
.team .spalte .content-text figure {border-radius:1.5em 0 0 1.5em;overflow:hidden;}
.team .spalte .content-text .rte {color:#ffffff;position:absolute;bottom:-0.5em;right:0;z-index:10;padding:0.5em 0;width:62%;height:auto;background-color:#12120d;border-radius:0.75em 0 0 0.75em;}
.team .spalte .content-text p {margin-bottom:0;text-align:center;line-height:1.2;}
.team .spalte .content-text p:last-child {font-size:0.833em;}


.team .zeile:nth-child(2) .spalte:nth-child(1) figure {background:url('../../files/design/img/portrait-marco-hoch-hover.jpg') no-repeat bottom center;background-size:cover;}
.team .zeile:nth-child(2) .spalte:nth-child(2) figure {background:url('../../files/design/img/portrait-remo-seiler-hover.jpg') no-repeat bottom center;background-size:cover;}
.team .zeile:nth-child(3) .spalte:nth-child(1) figure {background:url('../../files/design/img/portrait-lorena-studer-hover.jpg') no-repeat bottom center;background-size:cover;}
.team .zeile:nth-child(3) .spalte:nth-child(2) figure {background:url('../../files/design/img/portrait-lernende-hover.jpg') no-repeat bottom center;background-size:cover;}

.team .zeile:nth-child(2) .spalte:nth-child(1) figure img {animation:imageChange 1s none;-webkit-animation:imageChange 6s none;animation-delay:6s;}
.team .zeile:nth-child(2) .spalte:nth-child(2) figure img {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s none;animation-delay:9s;}
.team .zeile:nth-child(3) .spalte:nth-child(1) figure img {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s none;animation-delay:12s;}
.team .zeile:nth-child(3) .spalte:nth-child(2) figure img {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s none;animation-delay:15s;}
/*
.team .zeile:nth-child(2) .spalte:nth-child(1) figure img:hover {opacity:0;transition:opacity 1s ease;}
.team .zeile:nth-child(2) .spalte:nth-child(2) figure img:hover {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s forwards;}
.team .zeile:nth-child(3) .spalte:nth-child(1) figure img:hover {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s forwards;}
.team .zeile:nth-child(3) .spalte:nth-child(2) figure img:hover {animation:imageChange 1s forwards;-webkit-animation:imageChange 6s forwards;}
*/

#oeffnungszeiten {margin:5em 0;padding:10em 0;width:100%;background:#12120d url('../../files/design/img/20210401-DSC_6844_grau.jpg') no-repeat center/*url('../../files/inhalt/galerie/20210401-DSC_6917.jpg') no-repeat center*/;background-size:/*968px auto*/cover;}
#oeffnungszeiten .content-text {margin:0 auto;padding:2.5em 0;width:100%;height:auto;}
#oeffnungszeiten .content-text .rte {margin:0;padding:0;width:auto;height:auto;background-color:#ffffff;/*background-color:#bed439;background:linear-gradient(5deg,#bed439,#dff65b);*/border-radius:1.5em 0 0 1.5em;/*box-shadow:0 0 3em #000000;*/}
#oeffnungszeiten .content-text h2 {margin:0 0 1em 0;color:#000000;}
#oeffnungszeiten .content-text p {color:#000000;}


.dienstleistungen .content-text {margin-bottom:3em;}

/*.dienstleistungen .zeile {background-color:#bed439;}*/
.dienstleistungen .zeile ul {margin:1em 0;padding:0;background-repeat:no-repeat;background-position:left center;background-size:calc(50% - 8px) auto;overflow:hidden;list-style-type:none;}
.dienstleistungen ul li {/*border-bottom:1px solid #9cb217;*/padding:0.5em 1em 0.5em 1em;background:linear-gradient(5deg,#bed439,#dff65b);/*background-repeat:no-repeat;background-position:1em center;background-size:1.5em;*/text-align:center;}
.dienstleistungen ul li:last-child {border-bottom:0;}

/*
.dienstleistungen .content-text:first-child ul li:nth-child(1) {background-image:url('../../files/inhalt/icons/icon-brillen.svg');}
.dienstleistungen .content-text:first-child ul li:nth-child(2) {background-image:url('../../files/inhalt/icons/icon-brillen.svg');}
.dienstleistungen .content-text:first-child ul li:nth-child(3) {background-image:url('../../files/inhalt/icons/icon-kontaktlinsen.svg');}
.dienstleistungen .content-text:first-child ul li:nth-child(4) {background-image:url('../../files/inhalt/icons/icon-sehtests.svg');}
.dienstleistungen .content-text:first-child ul li:nth-child(5) {background-image:url('../../files/inhalt/icons/icon-sehtests.svg');}
.dienstleistungen .content-text:first-child ul li:nth-child(6) {background-image:url('../../files/inhalt/icons/icon-optik-optometrie.svg');}

.dienstleistungen .content-text:last-child ul li:nth-child(1) {background-image:url('../../files/inhalt/icons/icon-hoergeraete.svg');}
.dienstleistungen .content-text:last-child ul li:nth-child(2) {background-image:url('../../files/inhalt/icons/icon-hoertests.svg');}
.dienstleistungen .content-text:last-child ul li:nth-child(3) {background-image:url('../../files/inhalt/icons/icon-gehoerschutz.svg');}
.dienstleistungen .content-text:last-child ul li:nth-child(4) {background-image:url('../../files/inhalt/icons/icon-akustik-audiologie.svg');}


.dienstleistungen .content-text:first-child ul li {background-image:url('../../files/inhalt/icons/icon-optik-optometrie.svg');}
.dienstleistungen .content-text:last-child ul li {background-image:url('../../files/inhalt/icons/icon-akustik-audiologie.svg');}
*/

.dienstleistungen .zeile {display:flex;margin:0 auto;}
.dienstleistungen .zeile .content-text {flex:1;text-align:left;}

.dienstleistungen .zeile .content-text.media figure {height:4em;overflow:hidden;}
.dienstleistungen .zeile .content-text img {border-radius:1em 0 0 1em;}

@media screen and (min-width:1024px) {
    /*.dreispaltig {display:flex;gap:1em;align-items:stretch;}
    /*.dreispaltig > div {flex:33.333%;}*/
    .zeile {display:flex;gap:1em;}
    .zeile .spalte {flex:1;}
    #oeffnungszeiten .content-text {width:62%;}
    #oeffnungszeiten .content-text .rte {margin:0 2.5em;padding:2.5em;width:auto;border-radius:1.5em 0 0 1.5em;}
}


footer {position:relative;clear:both;padding:5em 0 2.5em 0;width:100%;height:auto;/*min-height:5em;*/}
footer p {font-size:0.833em;text-align:center;margin:0 auto;width:90%;}
footer p .trenner {margin-left:0.25em;margin-right:0.25em;}

