@import url('https://fonts.googleapis.com/css2?family=Changa:wght@200..800');
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i");

html {
    max-width: 1920px;
    margin: auto;

    --maincolor: #A8A08D;
    --maincolor-20: #A8A08D33;
    --maincolor-80: #A8A08DCD;
    font-size: 20px;
    color: #3A3A3A;
}

@media screen and (max-width: 1024px) {
    html {
        font-size: 17px;
    }
}

@media screen and (max-width: 768px) {
    html {
        font-size: 15px;
    }
}

body {
    color: #000;
    font-family: "Open Sans";
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 0.3pt;
    line-height: 1.7rem;
}

h1, h2, h3, .b-footer {
    font-family: "Changa";
    font-weight: 300;
    color: var(--maincolor) !important;
    margin-bottom:2.5rem;
}

h1 {
    font-size: 4rem;
    letter-spacing: 2pt;
    line-height: 4.5rem;
    margin-bottom: 0;
}

h2 {
    font-size: 1.95rem;
    font-weight: 400;
    letter-spacing: 0.75pt;
    line-height: 2.7rem;
}

h3 {
    font-size: 1.25rem;
    font-weight: 400;
    letter-spacing: 0.5pt;
    line-height: 1.5rem;
}

@media screen and (max-width: 768px) {
    h1 {
        font-size: 2.5rem;
        line-height: 3rem;
    }
}

.b-bg-color {
    border-color: var(--maincolor);
    background-color: var(--maincolor);
}

.b-bg-color-20 {
    border-color: var(--maincolor-20);
    background-color: var(--maincolor-20);
}

.b-bg-color-80 {
    border-color: var(--maincolor-80);
    background-color: var(--maincolor-80);
}

.b-text-align {
    text-align: start;
}

.b-castka {
    text-align: center;
    font-size: 3.50rem;
    font-weight: 400;
    letter-spacing: 0.75pt;
    line-height: 4rem;
}

.b-castka-total {
    text-align: center;
    font-size: 1.80rem;
    font-weight: 400;
    letter-spacing: 0.75pt;
    line-height: 2rem;
}

.b-castka-poznamka {
    text-align: center;
    font-size: 1.20rem;
    font-weight: 300;
    letter-spacing: 0.5pt;
    line-height: 3rem;
}

.b-cislo-uctu {
    font-family: "Changa";
    font-size: 1.25rem;
    font-weight: 400;
    color: var(--maincolor) !important;
}

.b-div-castka {
    font-family: "Changa";
    color: white !important;
}

@media screen and (max-width: 768px) {
    .b-text-align {
        text-align: center;
    }
}

/*@media screen and (max-width: 768px) {
    #tumba {
        transform: rotate(180deg);
    }
}*/

@media (min-width: 768px) {
    .carousel-inner {
        display: flex;
    }

    .carousel-item {
        margin-right: 0;
        flex: 0 0 33.333333%;
        display: block;
    }

    .lightbox-carousel .carousel-item {
        flex: 0 0 100%;
    }
}
.lightbox-carousel .ratio {
    background-color: transparent !important;
}

.carousel-inner {
    padding: 0em;
}

#carouselFoto .card {
    margin: 0;
    box-shadow: 2px 6px 8px 0 rgba(22, 22, 26, 0.18);
    border: none;
}

.carousel-control-prev, .carousel-control-next {
    /*background-color: #e1e1e1;*/
    width: 6vh;
    height: 6vh;
    /*border-radius: 50%;*/
    top: 50%;
    transform: translateY(-50%);
}

.carousel-control-prev-icon {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" style="fill: rgba(255,255,255, 1);transform: ;msFilter:;"><path d="M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"></path><path d="M13.293 6.293 7.586 12l5.707 5.707 1.414-1.414L10.414 12l4.293-4.293z"></path></svg>');
    width: 4rem;
    height: 4rem;
}

.carousel-control-next-icon {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="36" height="36" viewBox="0 0 24 24" style="fill: rgba(255,255,255, 1);transform: ;msFilter:;"><path d="M12 2C6.486 2 2 6.486 2 12s4.486 10 10 10 10-4.486 10-10S17.514 2 12 2zm0 18c-4.411 0-8-3.589-8-8s3.589-8 8-8 8 3.589 8 8-3.589 8-8 8z"></path><path d="M9.293 7.707 13.586 12l-4.293 4.293 1.414 1.414L16.414 12l-5.707-5.707z"></path></svg>');
    width: 4rem;
    height: 4rem;
}

.card-main {
    min-height: 50vh;
}
.img-main {
    object-fit:cover;
    min-width: 100%;
    min-height: 100%
}

.b-video {
    border: solid 20px white;
    width: 100%;
    aspect-ratio: 4/3;
}

/*@media screen and (max-width: 768px) {
    .b-video {
        height: 300px;
    }
}

.card .img-wrapper {
    max-width: 100%;
    height: 13em;
    display: flex;
    justify-content: center;
    align-items: center;
}

img {
    max-height: 100%;
}*/