/* override position and transform in 3.3.x */

@font-face {
    font-family: 'Open Sans Regular';
    src: url("/fonts/opensans-regular.ttf");
}
/* vyrovnání výšky */
.carousel-item {height: 0;}    
.carousel-item.active {height: auto;}

.carousel-inner .item { 
    background-color: white;
}
.carousel-caption div {
    font-family: 'Open Sans Regular', sans-serif;
    color: #000000;
    width: 100%;
    text-align: left;
    font-size: 2vh;
    padding: 2.2vh;
    /*
    color: #b09a62;
    text-shadow: 0.1vh 0.1vh 0.1vh #000000;
    background-color: #dddddd; 
    opacity: 0.9;
    font-weight: bold;
    */
}
.carousel-caption {
    left: 88%;
    right: 0;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}
@media (min-width: 768px) {

    .carousel-inner .item.left.active {
        transform: translateX(-33%);
    }
    .carousel-inner .item.right.active {
        transform: translateX(33%);
    }

    .carousel-inner .item.next {
        transform: translateX(33%)
    }
    .carousel-inner .item.prev {
        transform: translateX(-33%)
    }

    .carousel-inner .item.right,
    .carousel-inner .item.left { 
        transform: translateX(0);
    }
}

@media (max-width: 768px) {
    .carousel-inner .carousel-item>div {
        display: none;
    }

    .carousel-inner .carousel-item>div:first-child {
        display: block;
    }
    .carousel-caption div {
        font-size: 1.4vh;
        padding: 0.2vh 2.5vh;
    }
}



/*********************************************************************/
/* Bootstrap 4 Multiple Item Carousel */
/*********************************************************************/
/* vyrovnání výšky 
.carousel-item {height: 0;}    
.carousel-item.active {height: auto;}

/* medium - display 2  
@media (min-width: 768px) {

    .carousel-inner .carousel-item-right.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(50%);
    }

    .carousel-inner .carousel-item-left.active,
    .carousel-inner .carousel-item-prev {
        transform: translateX(-50%);
    }
}

/* large - display 3 
@media (min-width: 992px) {

    .carousel-inner .carousel-item-right.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(33%);
    }

    .carousel-inner .carousel-item-left.active,
    .carousel-inner .carousel-item-prev {
        transform: translateX(-33%);
    }
}

@media (max-width: 768px) {
    .carousel-inner .carousel-item>div {
        display: none;
    }

    .carousel-inner .carousel-item>div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

.carousel-inner .carousel-item-right,
.carousel-inner .carousel-item-left {
    transform: translateX(0);
}
*/