.carousel-wrapper {
    position: relative;
    margin-bottom: 15px;
}
.carousel-wrapper .carousel-item {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 25px 5px;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.carousel-wrapper .carousel-item .arrow {
    position: absolute;
    top: -190px;
    display: block;
    width: 50px;
    height: 100%;
    -webkit-tap-highlight-color: transparent;
    background: url("images/carousel-arrow-dark.png") 50% 50%/20px no-repeat;
}
.carousel-wrapper .carousel-item .arrow.arrow-prev {
    left: 0;
}
.carousel-wrapper .carousel-item .arrow.arrow-next {
    right: 0;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
.carousel-wrapper .carousel-item.light {
    color: white;
}
.carousel-wrapper .carousel-item.light .arrow {
    background: url("images/carousel-arrow-light.png") 50% 50%/20px no-repeat;
}
@media screen and (max-width: 767px) {
    .carousel-wrapper .carousel-item .arrow, .carousel-wrapper .carousel-item.light .arrow {
    background-size: 10px;    
    background-position: 10px 50%}
}
@media screen and (max-width: 767px) {
    #carousel-footer{
        position:relative;
        bottom:-550px;}
}
@media screen and (max-width: 979px) {
    .carousel-wrapper{
        height:550px;
    }
    .carousel-wrapper .carousel-item .arrow {
        position:absolute;
        top:-240px;
    }
}

.carousel-wrapper [id^="target-item"] {
    display: none;
}
.carousel-wrapper .item-1 {
    z-index: 2;
    opacity: 1;
}
.carousel-wrapper *:target ~ .item-1 {
    opacity: 0;
}
.carousel-wrapper #target-item-1:target ~ .item-1 {
    opacity: 1;
}
.carousel-wrapper #target-item-2:target ~ .item-2, .carousel-wrapper #target-item-3:target ~ .item-3 {
    z-index: 3;
    opacity: 1;
}

.carousel-wrapper #target-item-4:target ~ .item-4, .carousel-wrapper #target-item-5:target ~ .item-5 {
    z-index: 3;
    opacity: 1;
}

.carousel-wrapper #target-item-6:target ~ .item-6, .carousel-wrapper #target-item-7:target ~ .item-7 {
    z-index: 3;
    opacity: 1;
}
.carousel-wrapper #target-item-8:target ~ .item-8, .carousel-wrapper #target-item-9:target ~ .item-9 {
    z-index: 3;
    opacity: 1;
}