* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
    /* color: black; */
    /* background-color: black; */
    /* color: white; */
}

a {
    text-decoration: none;
    text-decoration-line: underline;
    color: black;
}

.table>tbody>tr>td:nth-child(1) {
    padding-left: 0 !important;
}

/* .table-striped-columns>tbody>tr>td:nth-child(even) {
    background-color: rgb(255, 0, 0);
} */

.font-work-400,
.coloPhone,
.cardList,
.cardCard,
.itemList,
.itemTitle {
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}

.font-work-italic {
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: italic;
}

.font-work-bold {
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}

.font-work-200 {
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 200;
    font-style: normal;
}

.font-work-300 {
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

.fixedTable {
    table-layout: fixed;
}

.autoTable {
    table-layout: auto;
}


/* .cardCard, */
/* .cardList, */
/* .itemList, */
/* .itemTitle  */
/* .font-sofia-400 {
    font-family: "Sofia Sans Condensed", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
} */

/* .font-sofia-500 {
    font-family: "Sofia Sans Condensed", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
} */

.narrowType,
.coloPhone,
.cardList,
.cardCard {
    /* letter-spacing: -0.01em; */
    letter-spacing: -0.04em;
    /* letter-spacing: -0.08em; */
}


.itemList,
.itemTitle,
.filmTitle,
.cardTitle {
    letter-spacing: -0.04em;
    /* letter-spacing: -0.06em; */
    color: black;
}

.videoPoster {
    cursor: pointer;
}

.cardCard,
.cardGrid,
.itemGrid,
.filmContainer,
.coloPhone {
    width: 90%;
}

.cardGrid,
.cardContainer,
.filmContainer,
.itemGrid {
    container-type: inline-size;
}

.cardTitle {
    /* font-size: 6cqw; */
    font-size: 9cqw;
}

.itemTitle {
    font-size: 5cqw;
    /* font-size: 6cqw; */
}

.filmTitle {
    font-size: 4.5cqw;
}

.ratio43 {
    aspect-ratio: 4/3;
    object-fit: cover;
}

.ratio1610 {
    aspect-ratio: 16/10;
    object-fit: cover;
}



@media (min-width:640px) {
    .itemTitle {
        font-size: 2.4cqw;
    }

    .filmTitle {
        font-size: 2.4cqw;
    }

    .cardTitle {
        font-size: 7.0cqw;
    }
}

@media (min-width:992px) {
    .itemTitle {
        font-size: 2cqw;
    }

    .cardList {
        letter-spacing: -0.16em;
    }

    .filmTitle {
        font-size: 2.0cqw;
    }

    .cardTitle {
        font-size: 6.5cqw;
    }

    .cardCard,
    .cardGrid,
    .itemGrid,
    .filmContainer,
    .coloPhone {
        width: 72%;
    }

}

@media (min-width:1280px) {
    .itemTitle {
        font-size: 1.4cqw;
    }

    .filmTitle {
        font-size: 1.4cqw;
    }

    .cardTitle {
        font-size: 5.5cqw;
    }
}


/* maakt menu semi transparant */
.navbar {
    background-color: rgb(255, 255, 255, 0.92);
}

.list-group-item,
.nav-link,
.card-header,
.card-title,
.card-text {
    color: black;
}

/* .kleurZwart {
    background-color: black;
    border-color: black;
    color: black;
} */

/* hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid black;
    margin: 1em 0;
    padding: 0;
} */

/* haalt button om toggler weg */
/* .navbar {
    --bs-navbar-toggler-padding-y: 0;
    --bs-navbar-toggler-padding-x: 0;
    --bs-navbar-toggler-font-size: 1.5rem;
    --bs-navbar-toggler-border-color: none;
    --bs-navbar-toggler-border-radius: 0;
    --bs-navbar-toggler-focus-width: 0;
    --bs-navbar-toggler-transition: none;
    --bs-navbar-toggler-border-color: rgba(0, 0, 0, 0.1);
}

.navbar-dark {
    --bs-navbar-toggler-border-color: none;
} */