@font-face {
    font-family: 'Optima';
    src: url('../font/Optima.eot');
    src: url('../font/Optima.eot?#iefix') format('embedded-opentype'),
        url('../font/Optima.woff2') format('woff2'),
        url('../font/Optima.woff') format('woff'),
        url('../font/Optima.ttf')  format('truetype'),
        url('../font/Optima.svg#Optima') format('svg');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

.carousel-item h1,
.tuna-coklat h3 li,
#produk_kami h3,
#resep h3,
#profil h1,
#profil h3,
#profil .flow-text  {
    text-shadow: 1px 1px 2px rgba(60,60,60);
}

.head-image-left {
    background-image: url("../img/head_l.png");
    background-position: center;
    height: 650px;
    background-repeat: no-repeat;
    background-size: cover;
}

.head-image-right {
    background-image: url("../img/head_r.png");
    background-position: center;
    height: 650px;
    background-repeat: no-repeat;
    background-size: cover;
    filter: brightness(105%);
    opacity: 0.7 !important; 
}

.tuna-coklat {
    background-image: url("../img/tuna_coklat.jpg");
    background-position: center;
    height: 530px;
    background-repeat: no-repeat;
    background-size: cover;
}

#carousel_produk {
    height: 400px;
    perspective: 250px;
}

#carousel_produk .carousel-item {
    margin: 30px 0 0;
    width: 400px;
}

#carousel_produk .carousel-item img {
    width: 100%;
}

#carousel_produk .carousel-item h4 {
    margin: -5px 0 0;
    padding: 0;
    /* background: #fff; */
    color: #000;
    /* box-sizing: border-box; */
    padding: 10px 5px;
    font-weight: bold;
    font-size: 1em;
    text-align: center;
}

#carousel_promo {
    height: 750px;
    perspective: 250px;
}

#carousel_promo .carousel-item {
    margin: 25px 0 0;
    width: 90%;
}

#carousel_promo .carousel-item img {
    width: 100%;
    height: 92%;
}

#carousel_promo .carousel-item h4 {
    margin: -5px 0 0;
    padding: 0;
    /* background: #fff; */
    color: #000;
    /* box-sizing: border-box; */
    padding: 10px 5px;
    font-weight: bold;
    font-size: 1em;
    text-align: center;
}

#resep {
    background-image: url("../img/resep.jpg");
    background-position: center;
    height: 600px;
    background-repeat: no-repeat;
    background-size: cover;
}

#carousel_resep {
    height: 600px;
    perspective: 250px;
}

#carousel_resep .carousel-item {
    margin: -60px 0 0;
    width: 400px;
}

#carousel_resep .carousel-item img {
    width: 100%;
}

#carousel_resep .carousel-item h4 {
    margin: -5px 0 0;
    padding: 0;
    color: #fff;
    box-sizing: border-box;
    padding: 10px 5px;
    font-weight: bold;
    font-size: 1em;
    text-align: center;
}

#profil_left {
    background-image: url("../img/profil.jpg");
    background-position: center;
    height: 550px;
    background-repeat: no-repeat;
    background-size: cover;
}

footer .m8,
footer .m4 {
    height: 400px;
}