/* =====================================
   Goldschmiede Vogelsang Carousel
   ===================================== */


.carousel-modern {

    position:relative;

    width:100%;

    overflow:hidden;

}


/* Bildbereich */

.carousel-image {

    display:block;

    width:100%;

    height:auto;

    opacity:1;

    transition:opacity .6s ease-in-out;

}



/* =====================================
   Pfeile
   ===================================== */


.carousel-modern .prev,
.carousel-modern .next {

    position:absolute;

    top:50%;

    transform:translateY(-50%);

    z-index:10;


    width:48px;

    height:48px;


    border:none;

    border-radius:50%;


    background:rgba(255,255,255,.75);

    color:#555;


    font-size:28px;

    line-height:1;


    cursor:pointer;


    transition:.3s;

}


.carousel-modern .prev:hover,
.carousel-modern .next:hover {

    background:rgba(255,255,255,.95);

}


.carousel-modern .prev {

    left:20px;

}


.carousel-modern .next {

    right:20px;

}



/* =====================================
   Bildpunkte
   ===================================== */


.carousel-modern .dots {

    position:absolute;

    bottom:20px;

    left:0;

    right:0;

    text-align:center;

    z-index:10;

}


.carousel-modern .dot {

    display:inline-block;

    width:12px;

    height:12px;

    margin:0 5px;


    padding:0;


    border:none;

    border-radius:50%;


    background:white;

    opacity:.5;


    cursor:pointer;

}


.carousel-modern .dot.active {

    opacity:1;

    background:#b08a3e;

}



/* =====================================
   Mobile
   ===================================== */


@media(max-width:992px){

    .carousel-modern .prev,
    .carousel-modern .next {

        width:40px;

        height:40px;

        font-size:22px;

    }


}