@import url('../fonts/google-sans/stylesheet.css');
@import url('../fonts/montserrat/stylesheet.css');
@import url('../fonts/open-sans/style.css');

body {
    background: rgba(231, 236, 240, 1);
}

.max-w-my {
    max-width: 1860px;
}

.font-product-sans {
    /* font-family: 'Google Sans'; */
    /* font-family: 'Montserrat'; */
    font-family: 'Open Sans';
}

.font-montserrat {
    font-family: 'Montserrat';
}

/* ==== projects ==== */
.project-left {}

.project-left ul {
    list-style: circle;
    padding-left: 20px;
    margin-top: 15px;
    border-top: 1px solid rgba(70, 70, 70, 0.2);
    padding-top: 15px;
}

.project-left ul li {
    margin-top: 15px;
}

.project-left ul li span {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

/* ---- projects ---- */
/* ==== news ==== */
@media (min-width: 1280px) {
    .news-description {
        display: none;
    }

    .news-link {
        display: none;
    }
}

.news-title a {
    display: -webkit-box;
    overflow: hidden;
    -webkit-line-clamp: 6;
    -webkit-box-orient: vertical;
}

.active .news-title a {
    -webkit-line-clamp: 2;
}

.news-description {
    border-top: 1px solid rgba(70, 70, 70, 0.20);
}

.active .news-description {
    display: block;
}

.active .news-link {
    display: block;
}

/* ---- news ---- */
/* ==== events ==== */
.events {
    backdrop-filter: blur(10px);
    background-image: url(../img/events.jpg);
}

/* ---- events ---- */
/* ==== statement ==== */
.statement-body {}

.statement-body ul {}

.statement-body ul li {
    margin-top: 10px;
}

/* ---- statement ---- */
/* ==== banner ==== */
.banner-register {
    position: relative;
}

@media (min-width: 1024px) {
    .banner-register::before {
        position: absolute;
        content: '';
        width: 16px;
        height: 16px;
        left: 100%;
        bottom: 0;
        background-image: url(../img/border.svg);
        background-repeat: no-repeat;
    }

    .banner-register::after {
        position: absolute;
        content: '';
        width: 16px;
        height: 16px;
        left: 0;
        top: -16px;
        background-image: url(../img/border.svg);
        background-repeat: no-repeat;
        z-index: 10;
    }

    #banner {
        height: calc(100vh - 110px);
    }

    #banner video {
        height: calc(100vh - 110px);
    }
}

@media (max-width: 1023px) {
    #banner {
        height: calc(100vh);
    }

    #banner video {
        height: calc(100vh);
    }
}

/* ---- banner ---- */
/* ==== news list ==== */
.news-banner {}

.news-banner .swiper-button-prev {
    left: inherit;
    top: inherit;
    right: 70px !important;
    bottom: 15px !important;
}

.news-banner .swiper-button-prev::after {
    font-size: 16px;
}

.news-banner .swiper-button-next {
    left: inherit;
    top: inherit;
    right: 30px !important;
    bottom: 15px !important;
}

.news-banner .swiper-button-next::after {
    font-size: 16px;
}

@media (min-width: 1280px) {
    .news-banner .swiper-button-prev {
        right: 130px !important;
        bottom: 30px !important;
    }

    .news-banner .swiper-button-next {
        right: 60px !important;
        bottom: 30px !important;
    }

    .news-banner .swiper-button-prev::after {
        font-size: 24px;
    }

    .news-banner .swiper-button-next::after {
        font-size: 24px;
    }
}

/* ---- news list ---- */
/* ==== countries ==== */
.countries-swiper-content {}

.countries-swiper-content .swiper-button-prev {}

.countries-swiper-content .swiper-button-prev::after {
    font-size: 24px;
    color: rgba(23, 67, 64, 0.72);
}

.countries-swiper-content .swiper-button-next {}

.countries-swiper-content .swiper-button-next::after {
    font-size: 24px;
    color: rgba(23, 67, 64, 0.72);
}

/* ---- countries ---- */
/* ==== header ==== */

/* ---- header ---- */
/* ==== foto ==== */
.foto-flex {}

@media (min-width: 768px) {
    .foto-flex .foto-item:nth-child(6n + 1) {
        width: 50%;
    }

    .foto-flex .foto-item:nth-child(6n + 2) {
        width: 50%;
    }

    .foto-flex .foto-item:nth-child(6n + 3) {
        width: 60%;
    }

    .foto-flex .foto-item:nth-child(6n + 4) {
        width: 40%;
    }

    .foto-flex .foto-item:nth-child(6n + 5) {
        width: 40%;
    }

    .foto-flex .foto-item:nth-child(6n + 6) {
        width: 60%;
    }
}

/* ---- foto ---- */
/* ==== video ==== */
.video-in {
    position: relative;
}

.video-in::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 16px;
    background-image: url(../img/video-play.svg);
    background-position: center;
    background-repeat: no-repeat;
}

/* ---- video ---- */
/* ==== lefalet ==== */
.leaflet-link-image {
    position: relative;
}

.leaflet-link-image::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    border-radius: 16px;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 1;
}

/* ---- leaflet ---- */
/* ==== vr ==== */
.vr-content {
    position: relative;
}

.vr-content::after {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 16px;
}

/* ---- vr ---- */
/* ==== detail ==== */
.all-content {}

.all-content video {
    border-radius: 16px;
    margin: 15px auto;
}

/* ---- detail ---- */
/* ==== print ==== */
@media print {
    header {
        display: none;
    }
    footer {
        display: none;
    }
    #right-menu {
        display: none;
    }
    #print {
        display: none;
    }
}
/* ---- print ---- */
/* ==== print ==== */
.project-video-home {}
.project-video-home:after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';
    left: 0;
    top: 0;
    background-image: url("../img/video-play.svg");
    background-repeat: no-repeat;
    background-color: rgb(0, 0, 0, 0.4);
    background-position: center;
    border-radius: 16px;
}
/* ---- print ---- */
/* ==== print ==== */
/* ---- print ---- */
/* ==== print ==== */
/* ---- print ---- */
/* ==== print ==== */
/* ---- print ---- */
/* ==== print ==== */
/* ---- print ---- */
/* ==== print ==== */
/* ---- print ---- */