body {
    margin: 0;
    padding: 0;
}

.slotWrapper{
    width: 100%;
    height: 100%;
    transition: 0.5s;
    overflow: hidden;
    display:inline-block;
    position: relative;
}

.slotWrapper-01{
    width: 100%;
    height: 100%;
    transition: 0.5s;
    overflow: hidden;
    display:block;
    position: relative;
    margin-top: -767px;
}

.slotWrapper-02{
    width: 100%;
    height: 100%;
    transition: 0.5s;
    overflow: hidden;
    display:block;
    position: relative;
    margin-top: -763px;
}

.slotWrapper-03{
    width: 100%;
    height: 100%;
    transition: 0.5s;
    overflow: hidden;
    display:block;
    position: relative;
    margin-top: -763px;
}

.imageBox1{
    background-color: yellow;
}

.imageBox2{
    background-color: blue;
}

.imageBox3{
    background-color: red;
}

.slotSlider1 {
    width: 100%;
    height: 100%;
    transition: 0.5s;
    display: block;
}
.slotSlider2 {
    width: 100%;
    height: 100%;
    transition: 0.5s;
    display: block;
}

.slotSlider3 {
    width: 100%;
    height: 100%;
    transition: 0.5s;
    display: block;
}
.slotSlider4 {
    width: 100%;
    height: 100%;
    transition: 0.5s;
    display: block;
}

.activeSlot {
    opacity: 1 !important;
    transition: 0.5s;
}

.upAll {
    position:absolute;
    top:41%;
    left:33%;
        width: 90px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll {
    position:absolute;
    bottom:14%;
    left: 9%;
width: 100px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-01 {
    position:absolute;
    top:42%;
    right:44%;
        width: 90px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-01 {
    position:absolute;
    bottom:11%;
    left: 24%;
width: 100px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-02 {
    position:absolute;
    top:44%;
    right:26%;
        width: 90px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-02 {
    position:absolute;
    bottom:8%;
    left: 44%;
width: 100px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-03 {
    position:absolute;
    top:59%;
    right:10%;
        width: 90px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-03 {
    position:absolute;
    bottom:4%;
    left: 65%;
width: 100px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.wrapperAll {
    width: 100%;
    background-image: url('../images/Vallentuna-bkg-a.jpg');
    background-size: contain;
    max-width: 1060px;
}

/*  -o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+- MEDIA FOR TABLETS -o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+- */

@media screen and (max-width: 858px) {
    .upAll {
    position:absolute;
    top:41%;
    left:33%;
    width: 60px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll {
    position:absolute;
    bottom:9%;
    left: 9%;
width: 70px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-01 {
    position:absolute;
    top:42%;
    right:44%;
        width: 60px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-01 {
    position:absolute;
    bottom:6%;
    left: 24%;
width: 70px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-02 {
    position:absolute;
    top:44%;
    right:26%;
        width: 60px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-02 {
    position:absolute;
    bottom:3%;
    left: 44%;
width: 70px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-03 {
    position:absolute;
    top:59%;
    right:10%;
        width: 60px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-03 {
    position:absolute;
    bottom:0%;
    left: 65%;
width: 70px;
    height: 68px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}
}

/*  -o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+- MEDIA FOR PHONES -o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+-o+- */

@media screen and (max-width: 564px) {
    .upAll {
    position:absolute;
    top:41%;
    left:33%;
    width: 40px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll {
    position:absolute;
    bottom:7%;
    left: 9%;
width: 50px;
    height: 50px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-01 {
    position:absolute;
    top:42%;
    right:44%;
        width: 40px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-01 {
    position:absolute;
    bottom:4%;
    left: 24%;
width: 50px;
    height: 50px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-02 {
    position:absolute;
    top:44%;
    right:26%;
        width: 40px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-02 {
    position:absolute;
    bottom:1%;
    left: 44%;
width: 50px;
    height: 50px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.upAll-03 {
    position:absolute;
    top:59%;
    right:10%;
        width: 40px;
    height: 47px;
    z-index: 9999;
    background-image: url(../images/arrow-up.png);
    background-size: contain;
    background-repeat: no-repeat;
}

.downAll-03 {
    position:absolute;
    bottom:-2%;
    left: 65%;
width: 50px;
    height: 50px;
    z-index: 9999;
    background-image: url(../images/arrow-down.png);
    background-size: contain;
    background-repeat: no-repeat;
}
}