/* set tombol more>>  */
.more {
    color: #a83232;
    font-size: 0.97rem;
    text-decoration: underline;
    margin-left: 0.3em;
    cursor: pointer;
}

.more:hover {
    color: #d94c4c;
}

/* layer embed (index) */
#embed-trailers {
    position: relative;
}

/* Trailer Modal (index) */
.trailer-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 110%);
    background-color: #E4DEBE;
    padding: 10px;
    border-radius: 8px;
    display: none;
    z-index: 100;
    width: 100%;
    max-width: 720px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.7);
    animation: fadeIn 1.0s ease-in-out;
}

/* embed YT (index)*/
.trailer-modal iframe {
    width: 100%;
    height: 400px;
    border-radius: 6px;
    border: none;
    animation: fadeIn 1.5s ease-in-out;
}

/* tombol X (index)*/
.trailer-modal .close {
    cursor: pointer;
    right: 15px;
    position: absolute;
    font-size: 28px;
    font-weight: bold;
    color: #A94438;
    text-shadow: 0px 0px 5px white;
}

/* tablet */
@media (max-width: 780px) {

    .trailer-modal {
        transform: translate(-50%, 125%);
        max-width: 620px;
    }

    .trailer-modal iframe {
        height: 300px;
    }

    .trailer-modal .close {
        font-size: 20px;
    }
}

/* handphone */
@media (max-width: 450px) {

    .trailer-modal {
        transform: translate(-50%, 140%);
        max-width: 350px;
    }

    .trailer-modal iframe {
        height: 190px;
    }
}