div.slide-holder {
    padding:0px 0px 60px 0px;
    border-top:1px solid #181818;
}
div.slide-bg {
    overflow: hidden;
    position: absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background: url(../images/pattern-gray-inv-2.png);
}
div.slide-bg svg {
    transform: rotate(-10deg) scale(1.5);
    opacity:1;
}
div.slide-bg svg rect {
    transition:all .3s;
}
#slides div.text {
    font-size:18px;
}
#slides {
    margin: 0 auto;
    max-width:1700px;
}
#slides div.slide {
    transform-origin: 0 0;
    overflow: hidden;
}
#slides img {
    transition:filter .5s ease 0s, transform .5s ease 0s;
}
#slides div.slide:hover img {
    filter:brightness(70%);
   /* transform:scale(1.1);*/
}
#slides::after {
    position: absolute;
    content:'';
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    width:60px;
    height:60px;
    border-radius:5px;
    background-color: #fff;
    background-image: url(../images/preloader.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 40px 40px;
    transition:all.3s;
    opacity:0;
    z-index: 10;
    visibility: hidden;
}
#slides.pre::before {
    z-index: 11;
    content:'';
    position: absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}
#slides.pre::after {
    opacity:1;
    visibility: visible;
}
#slides a {
    position: absolute;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index: 3;
}
div.slide {
    width:1700px;
    height:729px;
}
div.slide img {
    z-index: 1;
}
div.slide div.text {
    position: absolute;
    z-index: 2;
}
div.slide div.text > div {
    display: inline-block;
    margin-bottom: 20px;
    backdrop-filter: blur(5px);
    user-select: none;
    white-space: nowrap;
}
div.slide div.text.LT { left:30px;top:30px; }
div.slide div.text.CT { left:50%;top:30px; transform:translateX(-50%); text-align: center; }
div.slide div.text.RT { right:30px;top:30px; text-align: right; }

div.slide div.text.LC { left:30px; top:50%; transform:translateY(-50%); }
div.slide div.text.CC { left:50%; top:50%; transform:translate(-50%, -50%); text-align: center; }
div.slide div.text.RC { right:30px; top:50%; transform:translateY(-50%); text-align: right; }

div.slide div.text.LB { left:30px; bottom:30px; }
div.slide div.text.CB { left:50%; bottom:30px; transform:translateX(-50%); text-align: center; }
div.slide div.text.RB { right:30px; bottom:30px; text-align: right; }

div.slide div.text.XX {
    width:100%;
    height:100%;
    top:0px;
    left:0px;
}
div.slide div.text.XX > div {
    position: absolute;
}
div.slide div.text.XX > div.subheading { top:30%; }
div.slide div.text.XX > div.descr { top:60%; }

div.slide div.text div.heading,
div.slide div.text div.subheading,
div.slide div.text div.descr {
    font-family: 'AvenirNext', Arial, Helvetica, sans-serif;
    padding:7px 20px;
    overflow: hidden;
}
div.slide div.text div.heading { font-weight:700; font-size:4em; }
div.slide div.text div.subheading { font-weight:700; font-size:3em; }
div.slide div.text div.descr { font-weight:600; font-size:2em; }

div.slide div.up {
    text-transform: uppercase;
}
div.slide div.lo {
    text-transform: lowercase;
}
div.slide div.ca {
    text-transform:capitalize;
}
div.slide div.sc::first-letter {
    text-transform: uppercase;
}


#slides-nav { position:absolute; z-index:1; bottom:10px; left:50%; transform:translateX(-50%); height:40px; text-align:center; z-index: 3; padding:10px 10px 0px 10px; background-color: #fff; border-radius:10px; }

#slides-nav a { display:inline-block; width:20px; height:20px; margin:0px 10px; background-color:#181818;border-radius:50%; opacity:.5;  }
#slides-nav a:not(.sel):hover { opacity:1; } 
#slides-nav a.sel { cursor:default; opacity:1; }

#timer-canvas {
	transition: opacity .3s;
}
#slides.pre + #slides-nav #timer-canvas {
	opacity: 0;
}

@media screen and (max-width: 500px), screen and (max-device-width: 500px), screen and (max-width: 500px) {
    #slides-nav { transform:scale(.75) translateX(-50%); }
}