.testwrap {
     margin-right: auto;
     margin-left: auto;
     width: 1200px;
     height: 100%;
     padding: 0;
}
 .testwrap .col-6 {
     padding: 0;
}
 .index-slider-content {
     z-index: 1000000000 !important;
     position: absolute;
     width: 1200px;
     top: 33%;
}
 .number-pagination {
     position: absolute;
     bottom: 30px;
     font-family: "roboto", sans-serif;
     font-weight: bold;
     right: 50px;
     display: none;
}
 .number-pagination span {
     font-size: 30px;
     color: var(--hellblau);
     color: #6894a8;
     letter-spacing: 4px;
}
 .number-pagination span:after {
     content: "/5";
     font-size: 16px;
     color: #fff;
}
 .slider, .slider > div {
    /* Images default to Center Center. Maybe try 'center top'? */
     background-position: center top;
     display: block;
     width: 100%;
    /*height: 100%;
    */
     height: 100vh;
    /* If you want fullscreen */
     position: relative;
     background-size: cover;
     background-repeat: no-repeat;
     background-color: #000;
     overflow: hidden;
     -o-transition: transform .4s;
     -webkit-transition: transform .4s;
     -webkit-transition: -webkit-transform .4s;
     transition: -webkit-transform .4s;
     transition: transform .4s;
     transition: transform .4s, -webkit-transform .4s;
     z-index: 0;
}

.swiper-slide {
    background-position: center top;
    display: block;
     width: 100%;
    /*height: 100%;
    */
     height: 100vh;
    /* If you want fullscreen */
     position: relative;
     background-size: cover;
     background-repeat: no-repeat;
     background-color: #000;
     overflow: hidden;
     -o-transition: transform .4s;
     -webkit-transition: transform .4s;
     -webkit-transition: -webkit-transform .4s;
     transition: -webkit-transform .4s;
     transition: transform .4s;
     transition: transform .4s, -webkit-transform .4s;
}

.slider .fifth-slide {
    background-repeat: no-repeat;
    background-image:url(../img/5.jpg);
    background-position: right 15%;
}
 .slider > div {
     position: absolute;
}
 .slider > i {
     color: #5bbd72;
     position: absolute;
     font-size: 60px;
     margin: 20px;
     top: 40%;
     text-shadow: 0 10px 2px #223422;
     -webkit-transition: .3s;
     -o-transition: .3s;
     transition: .3s;
     width: 30px;
     padding: 10px 13px;
     background: #fff;
     background: rgba(255, 255, 255, .3);
     cursor: pointer;
     line-height: 0;
     -webkit-box-sizing: content-box;
     box-sizing: content-box;
     border-radius: 3px;
     z-index: 4;
}
 .slider > i svg {
     margin-top: 3px;
}
 .slider > .left {
     left: -100px;
}
 .slider > .right {
     right: -100px;
}
 .slider:hover > .left {
     left: 0;
}
 .slider:hover > .right {
     right: 0;
}
 .slider > i:hover {
     background: #fff;
     background: rgba(255, 255, 255, .8);
     -webkit-transform: translateX(-2px);
     -ms-transform: translateX(-2px);
     transform: translateX(-2px);
}
 .slider > i.right:hover {
     -webkit-transform: translateX(2px);
     -ms-transform: translateX(2px);
     transform: translateX(2px);
}
 .slider > i.right:active, .slider > i.left:active {
     -webkit-transform: translateY(1px);
     -ms-transform: translateY(1px);
     transform: translateY(1px);
}
 .slider:hover > div {
     -webkit-transform: scale(1.01);
     -ms-transform: scale(1.01);
     transform: scale(1.01);
}
 .hoverZoomOff:hover > div {
     -webkit-transform: scale(1);
     -ms-transform: scale(1);
     transform: scale(1);
}
 .slider > ul {
     position: absolute;
     bottom: 3em;
    /*left: 200px;
    */
     left: 50%;
     z-index: 4;
     padding: 0;
     margin: 0;
     margin-left: -34px;
     -webkit-transform: translateX(-50%);
     -ms-transform: translateX(-50%);
     transform: translateX(-50%);
}
 .slider > ul > li {
     padding: 0;
     width: 14px;
     height: 14px;
     border-radius: 50%;
     list-style: none;
     float: left;
     margin: 10px 10px 0;
     cursor: pointer;
     border: 1px solid #fff;
     -o-transition: .3s;
     -webkit-transition: .3s;
     transition: .3s;
     background: #fff;
}
 .slider > ul > .showli {
     background-color: #7EC03D;
     -webkit-animation: boing .5s forwards;
     animation: boing .5s forwards;
     border: 2px solid #6894a8;
     background: transparent;
}
 .slider > ul > li:hover {
     background-color: #b7596d;
}
 .slider > .show {
     z-index: 1;
}
 .hideDots > ul {
     display: none;
}
 .showArrows > .left {
     left: 0;
}
 .showArrows > .right {
     right: 0;
}
 .slider > div span {
     display: block;
     background: rgba(0, 0, 0, .5);
     position: absolute;
     bottom: 0;
     color: #fff;
     text-align: center;
     padding: 0;
     width: 100%;
}
 @-webkit-keyframes boing {
     0% {
         -webkit-transform: scale(1.2);
         transform: scale(1.2);
    }
     40% {
         -webkit-transform: scale(.6);
         transform: scale(.6);
    }
     60% {
         -webkit-transform: scale(1.2);
         transform: scale(1.2);
    }
     80% {
         -webkit-transform: scale(.8);
         transform: scale(.8);
    }
     100% {
         -webkit-transform: scale(1);
         transform: scale(1);
    }
}
 @keyframes boing {
     0% {
         -webkit-transform: scale(1.2);
         transform: scale(1.2);
    }
     40% {
         -webkit-transform: scale(.6);
         transform: scale(.6);
    }
     60% {
         -webkit-transform: scale(1.2);
         transform: scale(1.2);
    }
     80% {
         -webkit-transform: scale(.8);
         transform: scale(.8);
    }
     100% {
         -webkit-transform: scale(1);
         transform: scale(1);
    }
}
/* -------------------------------------- */
 #slider2 {
     max-width: 30%;
     margin-right: 20px;
}
 .row2Wrap {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
}
 html {
     height: 100vh;
     margin: 0;
     padding: 0;
}
 body {
     background: -webkit-radial-gradient(#121212, #000);
     background: -o-radial-gradient(#121212, #000);
     background: radial-gradient(#121212, #000);
     height: 100vh;
     color: #aaa;
     margin: 0;
     padding: 0;
}
/* Responsive */
 .row-expertise .col-6 {
     padding: 0;
}
 @media only screen and (max-width: 1280px) {
     .index-slider-content {
         top: 33%;
    }
     .testwrap {
         margin-right: auto;
         margin-left: auto;
         width: 100%;
         padding-right: 40px;
         padding-left: 40px;
    }
     .testwrap .col-6 {
         padding: 0;
    }
     .row-expertise .col-6 {
         width: 50%;
    }
     .slider-pagination {
         left: 30px;
         margin-left: 0;
    }
     .number-pagination {
         margin-right: 0;
         z-index: 10000 !important;
    }
}
 @media only screen and (max-width: 1080px) {
     .row-expertise {
         height: 50%;
    }
}
 @media only screen and (max-width: 768px) {

     .index-slider-content {
         top: 50%;
         width: 90%;
    }
     .row-expertise .col-6 {
         width: 80%;
    }
    .slider > div, .swiper-slide{
        background-position: 65% 30%;
    }
    .slider .fifth-slide, .swiper-slide .fifth-slide {
        background-repeat: no-repeat;
        background-position: 85% 0;
    }
}
 @media only screen and (max-width: 600px) {

.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {
left: 15px;
}


.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {

  margin-bottom: 108%;

}

.swiper-pagination-fraction,
.swiper-pagination-custom,
.swiper-container-horizontal > .swiper-pagination-bullets {
  bottom: 10px;
  width: 100%;
  margin-left: auto;
  text-align: left;

}

     .index-slider-content {
         top: 45%;
         padding-left: 0;
         padding-right: 0;
         height: 100%;
         background-color: var(--dunkelblau);
         margin-left: -40px;
         width: 100%;
    }
     .index-slider .col-6 {
         width: 100%;
    }
     .row-expertise {
         padding-top: 1em;
         margin: 0;
         padding: 10px 20px 0 20px;
    }
     .row-expertise .col-6 {
         width: 100%;
    }
     .slider-pagination {
         left: 10px;
         margin-left: 0;
         display: none;
    }
     .number-pagination {
         right: 20px;
         margin-right: 0;
         z-index: 10000 !important;
         bottom: 25px;
         display: none;
    }
     .slider > div {
        /* Images default to Center Center. Maybe try 'center top'? */
         display: block;
         width: 100%;
         height: 100%;
        /* height: 100vh;
         */
        /* If you want fullscreen */
         position: relative;
         background-size: cover;
         background-repeat: no-repeat;
         background-color: #000;
         overflow: hidden;
         -o-transition: transform .4s;
         -webkit-transition: transform .4s;
         -webkit-transition: -webkit-transform .4s;
         transition: -webkit-transform .4s;
         transition: transform .4s;
         transition: transform .4s, -webkit-transform .4s;
         background-color: black;
         z-index: 0;
         background-position: center top;
    }
     ul {
         display: none;
    }
     .button-slide {
         color: #fff;
         margin-top: -30px;
    }
}