﻿
.imagegallery.design6 { position:relative }

.imagegallery.design6 .descr {font-size:1.1em; text-align:center; margin:auto;color:#fff; background:none;padding:30px;position:absolute;bottom:50px;left:0;}
.imagegallery.design6 .descr h4 { font-weight:200;font-size:3.2em;line-height:140%}
.imagegallery.design6 .descr .pv{color:#fff;font-weight:bold;font-size:1.5em;line-height:100%;letter-spacing:0.02em}
.imagegallery.design6 .descr .d a{display:block;max-width:200px;margin:0 auto;padding:9px 15px;border:1px solid #188fc9;color:#fff;text-transform:uppercase;font-weight:bold}
.imagegallery.design6 .descr .d a:hover{background:#188fc9;}
.imagegallery.design6 .slick-dots{display:block;position:absolute;left:0;bottom:14px;top:auto;text-align:left;width:100%; padding-left:12px;}
.imagegallery.design6 .slick-dots li{display:inline-block}
.imagegallery.design6 .slick-dots button{background:#949494;border:none;width:20px;height:20px;position:relative}
.imagegallery.design6 .slick-dots button:hover { background:#188fc9}
.imagegallery.design6 .slick-dots li.slick-active button{background:#f0d15c}
.imagegallery.design6 .slick-dots li.slick-active button:before{content:' '}
.imagegallery.design6 .controls{z-index:900}
.imagegallery.design6 .controls .next{content:'>';display:block;width:34px;height:63px;position:absolute;left:67%;bottom:70px;z-index:990;cursor:pointer}
.imagegallery.design6 .Linksbuendig-Weiss .descr {animation:ride 1s 1 ease;animation-play-state:paused;animation-fill-mode:forwards;}
.in-view .imagegallery.design6 .Linksbuendig-Weiss .descr{animation-play-state:running;}

@keyframes ride{
    0%{transform: scale(0.8) translateX(-150px) translateY(-48px) translateZ(0);}
    100%{transform: scale(1) translateX(0px) translateY(0px) translateZ(0);}
}

#m1 #M .modul-it:first-child .imagegallery,
#m1 #M .newDiv + .modul-it .imagegallery { margin:-110px 0 80px 0; }
#m1 #M .modul-it:first-child .imagegallery .scrollEl,
#m1 #M .newDiv + .modul-it .imagegallery .scrollEl {max-height:750px; overflow:hidden;}
#m1 #M .modul-it:first-child .imagegallery .descr,
#m1 #M .newDiv + .modul-it .imagegallery .descr { background:rgba(255,255,255,.7); padding:0; line-height:100%; position:absolute; bottom:0; left:0;width:100%;}
#m1 #M .modul-it:first-child .imagegallery .descr .d,
#m1 #M .newDiv + .modul-it .imagegallery .descr .d {  
    display:inline-block; float:right; padding:15px 60px; line-height:100%; font-size:1.2em; z-index:5; position:relative;
    background: #f0d15c;
    background: -moz-linear-gradient(left, #f0d15c 0%, #e3ba50 25%, #edce62 66%, #dbae4f 100%);
    background: -webkit-linear-gradient(left, #f0d15c 0%,#e3ba50 25%,#edce62 66%,#dbae4f 100%);
    background: linear-gradient(to right, #f0d15c 0%,#e3ba50 25%,#edce62 66%,#dbae4f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0d15c', endColorstr='#dbae4f',GradientType=1 );}
#m1 #M .modul-it:first-child .imagegallery .descr:before,
#m1 #M .newDiv + .modul-it .imagegallery .desc:before { position:absolute; right:0; width:50%; display:block; height:100%; z-index:1; background:rgba(246, 239, 202, 0.85); content:'';}
.imagegallery img { transition:all 5000ms ease-in-out; -webkit-transition: all 5000ms ease-in-out;  -moz-transition:all 5000ms ease-in-out; -o-transition:all 5000ms ease-in-out;transform: translateZ(0);}
.imagegallery .scrollEl:hover img, .imagegallery a:hover img { transform:scale(1.05);}

.Boxen6 { position:relative; height:600px; overflow:hidden; margin-top: 60px; } 
.Boxen6 a { position:absolute; overflow:hidden; display:block; border:5px solid #fff;}
.Boxen6 a figure { height:100% }
.Boxen6 a img { width:100%; height:100%; object-fit:cover; object-position:center center;}
.Boxen6 a:first-child { left:0; top:0; height:100%; width:45%; }
.Boxen6 a:nth-child(2), .Boxen6 a:nth-child(3) { left:45%; top:0; height:30%; width:20%; }
.Boxen6 a:nth-child(3) { top:30%; height:70%;}
.Boxen6 a:nth-child(4) { left:65%; height:50%; width:35%;}
.Boxen6 a:nth-child(5) { left:65%; top:50%; width:17.5%;height:50%;}
.Boxen6 a:nth-child(6) { left:82.5%; top:50%; width:17.5%;height:50%;}
.Boxen6 a:before { content:attr(title); z-index:90; opacity:0; position:absolute; top:48%; left:3%; display:block; width:94%; text-align:center; color:#fff; font-size:1.4em; text-shadow:0 0 4px #000;}
.Boxen6 a:after { opacity:0; display:block; position:absolute; top:2%; left:2%; width:96%; height:94%; border:1px solid #f0d15c; content:''; border-spacing:20px;}
.Boxen6 a:before, .Boxen6 a:after {transition:all 400ms ease; -webkit-transition: all 400ms ease;  -moz-transition:all 400ms ease; -o-transition:all 400ms ease;transform: translateZ(0);}
.Boxen6 a:hover:before, .Boxen6 a:hover:after { opacity:1;}
.Boxen6 .text { display:none }

.Boxen3, .Boxen3 figure, .Boxen3 figure a { height:400px; overflow:hidden; display:block;}
.Boxen3, .Boxen3 .scrollEl { position:relative; vertical-align:top; outline:4px solid #fff; }
.Boxen3 figure img { width:100%; height:100%; object-fit:cover; object-position:center center}
.Boxen3 .descr { position:absolute; top:45%; left:0; width:100%; text-align:center; color:#fff; text-shadow:0 0 8px #000; display:block!important;transition:all 400ms ease; -webkit-transition: all 400ms ease;  -moz-transition:all 400ms ease; -o-transition:all 400ms ease;transform: translateZ(0);}
.Boxen3 .title { font-size:1.4em; text-shadow:0 0 4px #000; padding:0 2%; }
.Boxen3 .scrollEl:hover .descr { top:0; }

.nextto_small { margin:20px auto; max-width:1200px;}
.nextto_small .scrollEl { padding:20px; vertical-align:middle;}
.nextto_small .scrollEl figure { width:100%; height:220px; background:#f2eeee; padding:20px;}
.nextto_small .scrollEl img { height: 100%; width: auto; margin: 0 auto; object-fit: contain; }
.nextto_small .scrollEl figure .a1 { display:flex; align-items: center; width:100%; height:180px; padding:10px 20px; background:#fff; vertical-align:middle;}
.nextto_small .slick-dots { bottom:-10px!important; }


#m1 #M .big .imagegallery .scrollEl { max-height:800px!important; }
#m1 #M .big .imagegallery .descr { line-height:120%; left:50%!important; width:800px!important; background:rgba(0,0,0,.5)!important; padding:20px!important; margin-left:-400px!important; top:55%!important;bottom:auto!important;}
#m1 #M .big .imagegallery .descr h2 { color:#fff!important;}
#m1 #M .big .imagegallery .descr:before { display:none!important;}
#m1 #M .big .imagegallery .descr .d { background:none!important; float:none!important;}

#m1 #M .big2 .imagegallery .scrollEl { max-height:800px!important; background:#ffd254; }
#m1 #M .big2 .imagegallery .descr { line-height:120%; left:50%!important; width:1000px!important; background:transparent!important; padding:20px!important; margin-left:-450px!important; top:35%!important;bottom:auto!important;}
#m1 #M .big2 .imagegallery .descr h2 { color:#fff!important;}
#m1 #M .big2 .imagegallery .descr:before { display:none!important;}
#m1 #M .big2 .imagegallery .descr .d { background:none!important; float:none!important;}

.imagegallery .txtanim { left:calc(50% - 500px); position:absolute; animation:sp2 2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 1; max-width:1000px; }                         
.imagegallery .txtanim span { font-size:4em; display:inline-block; text-transform:uppercase; line-height:88%; vertical-align:baseline; margin:0 8px;}
.imagegallery .txtanim span:first-child { animation:sp1 1s ease 1 normal; animation-delay:3s; }
.imagegallery .txtanim span:nth-child(2) { font-size:6em; font-family:GothamM; animation:sp1 1s ease 1 normal; animation-delay:3.6s; }
.imagegallery .txtanim span:nth-child(3) { font-size:2.6em; font-family:Gotham; animation:sp1 1s ease 1 normal; animation-delay:4.2s; }
.imagegallery .txtanim span:nth-child(4) { font-size:4.9em; font-family:GothamM; animation:sp1 1s ease 1 normal; animation-delay:4.8s; }
.imagegallery .txtanim span:nth-child(5) { font-size:3.6em; font-family:Gotham; animation:sp1 1s ease 1 normal; animation-delay:5.4s; }
.imagegallery .txtanim span:last-child { font-size:7.6em; font-family:GothamM;animation:sp1 1s ease 1 normal; animation-delay:6s; }



@keyframes sp1{
    0%{transform: scale(1) translateZ(0);}
    50%{transform: scale(1.1) translateZ(0);}
    100%{transform: scale(1) translateZ(0);}
}


@keyframes sp2{
    0%{ left:-2000px; opacity:1;}
    50%{ left:-2000px; opacity:1;}
    100%{left:calc(50% - 500px);opacity:1;}
}
