
:root{
    --color-tab-menu: #101010;
    --font-rubik: Rubik !important;
}

.search-anyting {
    color: white !important;
}



.eltdf-page-header {
    height: 125px;
    background: var(--active-hover-black) !important;
}

    /*.eltdf-page-header:hover {
        background: var(--active-hover-black) !important;
    }*/

.hover-menu-active {
    background: var(--active-hover-black) !important;
}

.eltdf-content .eltdf-content-inner > .eltdf-container > .eltdf-container-inner, .eltdf-content .eltdf-content-inner > .eltdf-full-width > .eltdf-full-width-inner {
    padding-top: 0px;
    padding-bottom: 40px;
}

.link-menu a {
    color: white !important;
    font-weight: 600 !important;
}

.margin-content {
    margin-top: -166px;
}


.nav-tabs {
    border-bottom: unset;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-rubik) !important;
}

.header-text .header-title-about{
    color: #FFF;
    text-transform: uppercase;
    letter-spacing: 10px;
    font-size: 24px;
    font-weight: 400;
}

.header-text .header-desc-about {
    color: #FFF;
        margin: 15px 6% auto;
        line-height: 38px;
        font-size: 16px;
}

/*.eltdf-search-opener{
    color:black !important;
}

.eltdf-search-opener:hover{
    color:black !important;
}
*/
.nav-item {
    width: fit-content;
    margin: 0px 15px auto;
}

.nav-link{
color: var(--color-tab-menu) !important;
}

.nav-tabs .nav-link.active{
  border-color: transparent;
  border-bottom: 2px solid #575757;

}
.title-about-us{
    padding: 300px 0 227px 0
}


.title-about-us h2{
        letter-spacing: 0.22em;
        text-transform: uppercase;
        text-align: center;
        color: #ffffff;
        font-family: Rubik;
        font-size: 70px;
        font-weight: 500;
        line-height: 100px;
}
.container-vision{
    margin-top: 150px;
}
.content-our-vision{
        padding: 0px 0px 0px 0px;
}

.content-our-vision img{
    width: 110px;
        height: 110px;
        top: 1537px;
        left: 559px;
        padding: 14.82px 10.36px 14.82px 10.36px;
        gap: 0px;
        opacity: 0px;
}

.content-our-vision h5{
    font-family: Rubik;
        font-size: 24px;
        font-weight: 400;
        line-height: 33px;
        text-align: center;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
}

.content-our-vision p{
    font-family: Rubik;
        font-size: 14px;
        font-weight: 300;
        line-height: 26px;
        text-align: center;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
}


.our-team-content {
    /*padding: 130px 330px 30px*/
    padding: 30px 0px 30px;
}

/* player */
.container-player {
    position: relative;
    /* Membuat container sebagai referensi posisi */
    display: inline-block;
    /* Agar ukurannya mengikuti konten */
}

.bg-img {
    display: block;
    /* Hindari space ekstra di bawah gambar */
    width: 100%;
    /* Sesuaikan ukuran jika diperlukan */
}

.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    /* Agar pusat tombol tepat di tengah */
    width: 50px;
    /* Sesuaikan ukuran tombol */
    height: 50px;
    cursor: pointer;
}

/* desc */
.about-desc{
    max-width: 1099px;
    margin: 0 auto;
}

/* who are we */
.who-are-we-container{
    min-height: 640.13px;
}

.who-are-we-container img{
        width: 441.97px;
            height: 640.13px;
}
.who-are-we-container .who-are-we-content{
    position: relative;
        float: left;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        text-align: justify;
        font-family: Rubik;
        font-size: 16px;
        font-weight: 300;
        line-height: 38px;
        text-align: left;
        text-underline-position: from-font;
        text-decoration-skip-ink: none;
}

.our-factory{
    background: #DAD6D3;
}

.our-team-border{
        border-left: 1px solid;
            border-right: 1px solid;
            border-color: #A6A6A6;
}

.our-left-border {
    border-left: 1px solid;
    border-color: #A6A6A6;
}


.eltdf-team-holder .eltdf-team-image {
    width: 151px !important;
}

#section-what-we-do .title-we-do{
    font-style: italic;
    font-weight: 400;
    font-size: 18px;
    color: #585858;
}

/* footer */
@media only screen and (max-width: 680px) {

    .container-player {
            max-height: 200px;
        }

    .our-team-border {
            border-left: 0px solid;
            border-right: 0px solid;
            border-color: #A6A6A6;
        }

    .eltdf-eh-item-content.eltdf-eh-custom-6451 {
        padding: 80px 0 165px 0 !important;
    }

    .eltdf-eh-item{
        margin-bottom: 10px;
    }

    .our-team-section{
        padding: 20px;
    }

        .content-our-vision {
            padding: 0px;
        }

        .content-item{
            padding-left: 5px !important;
            padding-right: 5px !important;
        }
}

@media only screen and (max-width: 480px) {
    .container-player {
            max-height: 200px;
        }

    .content-item {
            padding-left: 5px !important;
            padding-right: 5px !important;
        }

    .eltdf-eh-item {
            margin-bottom: 10px;
            padding: 20px;
        }

    .our-brand-item, .our-team-content, .our-team-section {
        padding: 0 10px !important;
    }

    .nav-section{
        padding-bottom: 0px !important;
    }


        .content-our-vision {
            padding: 0px;
        }
    
}


@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) {
.container-player {
    max-height: 500px;
    }
}

@media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) {
    .container-player {
            max-height: 500px;
        }
    /* your css rules for ipad landscape */
}