@import url('https://fonts.googleapis.com/css2?family=Allison&display=swap');

.bride {
    width: 100%;
    min-height: 100vh;
    text-align: center;
    padding: 10rem 8rem;
    position: relative;
}

.bride h2 {
    font-family: var(--arabic);
    font-weight: 600;
    font-size: 40px;
}

.bride h3 {
    font-size: var(--fontSize-heading-base);
    font-family: "Allison", cursive;
    font-weight: 400;
    margin: 1rem 0;
}

.bride .bride_couple,
.bride .bride_couple ul,
.bride .bride_couple li,
.bride .bride_couple li figure {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.bride .bride_couple {
    margin-top: 4rem;
}

.bride .bride_couple ul {
    gap: 1rem;
}

.bride .bride_couple li figure img {
    width: 15rem;
    height: 15rem;
    object-fit: cover;
}

.bride .bride_couple li figure figcaption {
    font-size: 60px;
    margin: 1rem 0;
    font-family: "Allison", cursive;
    font-weight: 600;
}

.bride .bride_couple span {
    font-size: 3.4rem;
    font-family: "Allison", cursive;
    font-weight: 400;
    margin-top: 1rem;
}

.bride i,
.hadist i,
.time a+p+i,
.galeri>i {
    font-size: 3rem;
    color: #908d8d;
    position: absolute;
    z-index: 10;
    animation: upAndDown 3s infinite;
}

.bride i:nth-of-type(1) {
    top: 14rem;
    right: 8rem;
}

.bride i:nth-of-type(2) {
    left: 8rem;
    top: 24rem;
}

.bride i:nth-of-type(3) {
    top: 54rem;
    right: 8rem;
}

.bride i:nth-of-type(4) {
    top: 60rem;
    left: 8rem;
}

.bride i:nth-of-type(5) {
    right: 8rem;
    bottom: 6rem;
}

.bride .bride_couple ul li:nth-child(1) {
    align-items: flex-end;
    /* cowok kanan */
    text-align: right;
}

.bride .bride_couple ul li:nth-child(2) {
    align-items: flex-start;
    /* cewek kiri */
    text-align: left;
}

/* supaya figure tetap ikut arah alignment */
.bride .bride_couple ul li figure {
    align-items: inherit;
}

/* Cowok → condong kanan */
.bride .bride_couple ul li:nth-child(1) {
    align-items: flex-end;
    text-align: right;
    padding-right: 10rem;
    /* masuk ke dalam */
}

/* Cewek → condong kiri */
.bride .bride_couple ul li:nth-child(2) {
    align-items: flex-start;
    text-align: left;
    padding-left: 10rem;
    /* masuk ke dalam */
}

/* Figure ikut arah */
.bride .bride_couple ul li figure {
    align-items: inherit;
}

/* & tetap di tengah */
.bride .bride_couple ul li span {
    align-self: center;
    text-align: center;
    width: 100%;
    padding-left: 10rem;
}

@media (max-width: 768px) {
    .bride .bride_couple li figure img {
        width: 12rem;
        height: 12rem;
        object-fit: cover;
    }

    .bride .bride_couple li figure figcaption {
        font-size: 45px;
        font-weight: 600;
    }
    .bride .bride_couple ul li:nth-child(1) {
        padding-right: 0 !important;
        align-items: flex-end;
        text-align: right;
    }
    
    .bride .bride_couple ul li:nth-child(2) {
        padding-left: 0 !important;
        align-items: flex-start;
        text-align: left;
    }

    /* & tetap center */
    .bride .bride_couple ul li span {
        padding-left: 0 !important;
        align-self: center !important;
        text-align: center !important;
    }

    /* figure ikut condong tapi tanpa geser */
    .bride .bride_couple ul li figure {
        align-items: inherit !important;
    }
}