/*
 * jQuery FlexSlider v2.7.2
 * https://www.woocommerce.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 and later license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 *
 */
/* ====================================================================================================================
 * FONT-FACE
 * ====================================================================================================================*/
@font-face {
  font-family: 'flexslider-icon';
  src: url('../../files/design/js/fonts/flexslider-icon.eot');
  src: url('../../files/design/js/fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('../../files/design/js/fonts/flexslider-icon.woff') format('woff'), url('../../files/design/js/fonts/flexslider-icon.ttf') format('truetype'), url('../../files/design/js/fonts/flexslider-icon.svg#flexslider-icon') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* ====================================================================================================================
 * RESETS
 * ====================================================================================================================*/
.flex-container a:hover,
.flex-slider a:hover {
  outline: none;
}
.slides,
.slides > li,
.flex-control-nav,
.flex-direction-nav {
  margin: 0;
  padding: 0;
  list-style: none;
}
.flex-pauseplay span {
  text-transform: capitalize;
}
/* ====================================================================================================================
 * BASE STYLES
 * ====================================================================================================================*/
.flexslider {
  margin: 0;
  padding: 0;
}
.flexslider .slides > li {
  display: none;
  -webkit-backface-visibility: hidden;
}
.flexslider .slides img {
  width: 100%;
  display: block;
}
.flexslider .slides:after {
  content: "\0020";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
html[xmlns] .flexslider .slides {
  display: block;
}
* html .flexslider .slides {
  height: 1%;
}
.no-js .flexslider .slides > li:first-child {
  display: block;
}
/* ====================================================================================================================
 * DEFAULT THEME
 * ====================================================================================================================*/
.flexslider {
  margin: 0 0 60px;
  background: #fff;
  border: 4px solid #fff;
  position: relative;
  zoom: 1;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
  -o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
  box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
}
.flexslider .slides {
  zoom: 1;
}
.flexslider .slides img {
  height: auto;
  -moz-user-select: none;
}
.flex-viewport {
  max-height: 2000px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}
.loading .flex-viewport {
  max-height: 300px;
}
@-moz-document url-prefix() {
  .loading .flex-viewport {
    max-height: none;
  }
}
.carousel li {
  margin-right: 5px;
}
.flex-direction-nav {
  *height: 0;
}
.flex-direction-nav a {
  text-decoration: none;
  display: block;
  width: 40px;
  height: 40px;
  margin: -20px 0 0;
  position: absolute;
  top: 50%;
  z-index: 10;
  overflow: hidden;
  opacity: 0;
  cursor: pointer;
  color: rgba(0, 0, 0, 0.8);
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -ms-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
}
.flex-direction-nav a:before {
  font-family: "flexslider-icon";
  font-size: 40px;
  display: inline-block;
  content: '\f001';
  color: rgba(0, 0, 0, 0.8);
  text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
}
.flex-direction-nav a.flex-next:before {
  content: '\f002';
}
.flex-direction-nav .flex-prev {
  left: -50px;
}
.flex-direction-nav .flex-next {
  right: -50px;
  text-align: right;
}
.flexslider:hover .flex-direction-nav .flex-prev {
  opacity: 0.7;
  left: 10px;
}
.flexslider:hover .flex-direction-nav .flex-prev:hover {
  opacity: 1;
}
.flexslider:hover .flex-direction-nav .flex-next {
  opacity: 0.7;
  right: 10px;
}
.flexslider:hover .flex-direction-nav .flex-next:hover {
  opacity: 1;
}
.flex-direction-nav .flex-disabled {
  opacity: 0!important;
  filter: alpha(opacity=0);
  cursor: default;
  z-index: -1;
}
.flex-pauseplay a {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  bottom: 5px;
  left: 10px;
  opacity: 0.8;
  z-index: 10;
  overflow: hidden;
  cursor: pointer;
  color: #000;
}
.flex-pauseplay a:before {
  font-family: "flexslider-icon";
  font-size: 20px;
  display: inline-block;
  content: '\f004';
}
.flex-pauseplay a:hover {
  opacity: 1;
}
.flex-pauseplay a.flex-play:before {
  content: '\f003';
}
.flex-control-nav {
  width: 100%;
  position: absolute;
  bottom: -40px;
  text-align: center;
}
.flex-control-nav li {
  margin: 0 6px;
  display: inline-block;
  zoom: 1;
  *display: inline;
}
.flex-control-paging li a {
  width: 11px;
  height: 11px;
  display: block;
  background: #666;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
  text-indent: -9999px;
  -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  border-radius: 20px;
}
.flex-control-paging li a:hover {
  background: #333;
  background: rgba(0, 0, 0, 0.7);
}
.flex-control-paging li a.flex-active {
  background: #000;
  background: rgba(0, 0, 0, 0.9);
  cursor: default;
}
.flex-control-thumbs {
  margin: 5px 0 0;
  position: static;
  overflow: hidden;
}
.flex-control-thumbs li {
  width: 25%;
  float: left;
  margin: 0;
}
.flex-control-thumbs img {
  width: 100%;
  height: auto;
  display: block;
  opacity: .7;
  cursor: pointer;
  -moz-user-select: none;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition: all 1s ease;
}
.flex-control-thumbs img:hover {
  opacity: 1;
}
.flex-control-thumbs .flex-active {
  opacity: 1;
  cursor: default;
}
/* ====================================================================================================================
 * RESPONSIVE
 * ====================================================================================================================*/
@media screen and (max-width: 860px) {
  .flex-direction-nav .flex-prev {
    opacity: 1;
    left: 10px;
  }
  .flex-direction-nav .flex-next {
    opacity: 1;
    right: 10px;
  }
}

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;}