._title_style {
    font-family: var(--font_primary) !important;
    font-size: var(--font_primary_size) !important;
}

._main_style {
    position: absolute;
    width: 60%;
    left: 50%;
    /* top: var(--main_align); */
    top: calc(var(--main_align) + 10%);
    transform: translateY(-30%) translateX(-50%);
}

._main_style_background {
    background-color: var(--main_color_background);
    border-radius: 20px;
}

._main_nama {
    font-family: var(--main_font_name);
    font-size: var(--main_font_name_size);
    color: var(--main_font_name_color);
}

._main_tanggal {
    font-family: var(--main_font_date);
    font-size: var(--main_font_date_size);
    color: var(--main_font_date_color);
}

._cover_style {
    position: absolute;
    width: 60%;
    left: 50%;
    top: var(--cover_align);
    transform: translateY(-30%) translateX(-50%);
}

._cover_style_background {
    background-color: var(--cover_color_background);
    border-radius: 20px;
}

._cover_nama {
    font-family: var(--cover_font_name);
    font-size: var(--cover_font_name_size);
    color: var(--cover_font_name_color);
}

._cover_tanggal {
    font-family: var(--cover_font_date);
    font-size: var(--cover_font_date_size);
    color: var(--cover_font_date_color);
}

.btn_open_view {
    padding: 15px;
    border-radius: 10px;
    /* color: var(--color_secondary); */
    color: var(--color_text);
    font-weight: 600;
    background-color: var(--color_primary);
    border-color: var(--color_primary);
}

._tamu_style_nama {
    /* position: relative;
    width: 100%;
    display: none; */
}

._tamu_nama {
    font: 17px Poppins, Arial;
    margin: auto;
    font-weight: 600;
    color: #333;
    padding: 5%;
}

@media only screen and (max-width: 960px) {
    ._tamu_style_nama {
        position: relative;
        width: 100%;
        display: none;
    }
    
    ._main_style {
        position: relative;
        width: 100%;
        left: 0%;
        top: var(--main_align);
        transform: unset;
    }

    ._cover_style {
        position: absolute;
        /* width: 60%;
        left: 50%; */
        top: var(--cover_align);
        transform: translateY(-50%) translateX(-50%);
    }

    ._cover_nama {
        font-family: var(--cover_font_name);
        /* font-size: calc(var(--cover_font_name_size) - 5px); */
        font-size: var(--cover_font_name_size);
        color: var(--cover_font_name_color);
    }

    ._cover_tanggal {
        font-family: var(--cover_font_date);
        /* font-size: calc(var(--cover_font_date_size) - 5px); */
        font-size: var(--cover_font_date_size);
        color: var(--cover_font_date_color);
    }
}

._main_bg {
    background-image: var(--bg_cover);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
}

._quote_pembuka_bg {
    background-image: var(--bg_image);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: bottom;
    padding: 40px 0px;
}
._quote_pembuka_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._pasangan_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    padding: 40px 0px;
}
._pasangan_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._acara_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    padding: 40px 0px;
}
._acara_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._turut_mengundang_bg {
    background-image: var(--bg_image);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: inherit;
    padding: 40px 0px;
}
._turut_mengundang_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._map_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: bottom;
    padding: 40px 0px;
}
._map_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._gallery_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    padding: 40px 0px;
}
._gallery_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._amplop_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: inherit;
    padding: 40px 0px;
}
._amplop_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._quote_penutup_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    padding: 40px 0px;
}
._quote_penutup_bg * {
    font-family: var(--font_secondary);
    font-size: var(--font_secondary_size);
}

._quote_bottom_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: bottom;
    padding-bottom: 40px;
}
._quote_bottom_bg * {
    font-family: var(--font_primary);
    font-size: var(--font_primary_size);
}

._footer_bg {
    background-image: var(--bg_main);
    background-size: cover, contain;
    background-repeat: no-repeat;
    /* height: 100%; */
    background-position: inherit;
}
._footer_bg * {
    color: #393646 !important;
}