/* ____________________________________ Allgemein ____________________________________ */
html {
-webkit-hyphenate-character: '-';
}

html, body{
width:100%;
height:100%;
-webkit-text-size-adjust: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
-webkit-font-variant-ligatures: no-common-ligatures;
}

/* ____________________________________ Navigation ____________________________________ */
nav li{
margin-left: 25px;
}

nav li:first-child{
margin-left: 0px;
}

nav li a:after{
content: '';
width: 100%;
height: 1px;
position: absolute;
left: 0px;
bottom: -3px;
transform: scaleX(0);
transition: all 0.3s ease-in-out 0s;
}

nav li a.white:after{
background-color:var(--color_white);
}

nav li a:hover:after{
transform: scaleX(1);
}

/* ____________________________________ Navigation responsive ____________________________________ */
.nav_button{
width: 30px;
height: 30px;
padding-top: 11px;
cursor: pointer; 
box-sizing: border-box;
display: none;
}

.nav_button .nav_button_stroke{
width: 100%;
height: 1px;
}

.nav_button .nav_button_stroke:nth-child(2){
margin: 6px 0px;
}

.nav_rep.dis_fle{
display: none;
box-shadow: -10px 0 10px 0 rgba(86,70,70,0.1);
}

.nav_rep.r0{
opacity: 0;
right: -210px;
}

.nav_rep.open.r0{
opacity: 1;
right: 0px;
}

.nav_rep nav{
padding: 0px 50px;
}

.nav_rep nav li{
margin-left: 0px;
margin-bottom: 25px;	
}

/* ____________________________________ Video ____________________________________ */
.video_overlay{
background-image: url(../videos/kolbe_optik_augengesundheit_poster.jpg);    
}

.video{
height: 0%;
padding-bottom: 56.251%;
}

.play_button{
width: 140px;
height: 140px;
cursor: pointer;
border-radius: 50%;
background-position: center center;
background-repeat: no-repeat;
background: url(../images/allgemein/play_button.svg), var(--color_white);
}

/* ____________________________________ Slider ____________________________________ */
.swiper-container .swiper-slide{
padding-bottom: 80px;    
}

.swiper-pagination-bullet{
width: 11px;
height: 11px;
opacity: 0.35;
background: var(--color_brown);
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet{
margin: 0 7px;
}

.swiper-pagination-bullet-active {
opacity: 1;
}

/* ____________________________________ Accordion ____________________________________ */
.acc .acc_head{
padding-right: 40px;
cursor: pointer;
position: relative;
}

.acc.white .acc_head{
border-bottom: 1px solid var(--color_white);
}

.acc.brown .acc_head{
border-bottom: 1px solid var(--color_brown);
}

.ui-icon.iconOpen, .ui-icon.iconClosed{
background-repeat: no-repeat;    
position: absolute;
top: 50%;
transform: translateY(-50%);    
}

.ui-icon.iconOpen{
background-image:url(../images/allgemein/accordion_open.png);
background-size:8px 15px;
width:8px;
height:15px;
right:14px;
}

.ui-icon.iconClosed{
background-image:url(../images/allgemein/accordion_close.png);
background-size:15px 8px;
width:15px;
height:8px;
right:12px;
}

#brillen picture{
border-radius: 50%;
}

/* ____________________________________ Brillen ____________________________________ */
#brillen .w100.dis_fle{
gap: 4vh 0vw;
}