.invitation-box {
    &-area {
        max-width: 736px;
        margin: 120px auto 145px auto;
        box-shadow: 0px 6px 30px rgba(1, 15, 28, 0.1);
        position: relative;
        .shape-top,
        .shape-bottom {
            position: absolute;
            left: -60px;
            right: -60px;
        }
        .shape-top {
            top: -120px;
        }
        .shape-bottom {
            bottom: -145px;
        }
    }
    padding: 244px 12px;
    background-color: $theme-color;
    max-width: 500px;
    margin: 0 auto;
    text-align: center;
    &_title,
    &_subtitle,
    &_date,
    &_time,
    &_address,
    &_name {
        color: $white-color;
    }
    &_title {
        font-family: $style-font;
        font-weight: 400;
        font-size: 72px;
        font-style: italic;
        margin-bottom: 12px;
    }
    &_name {
        margin-bottom: 22px;
    }
    &_subtitle {
        margin-bottom: 15px;
    }
    &_date {
        margin-bottom: 0;
    }
    &_time {
        margin-bottom: 20px;
    }
    &_address {
        margin-bottom: 26px;
    }
    .th-btn {
        border-color: $white-color;
        color: $white-color;
    }
}

@include sm {
    .invitation-box {
        padding: 180px 12px;
    }
}

@include xs {
    .invitation-box {
        &-area {
            margin: 80px auto 100px auto;
            .shape-top {
                top: -80px;
            }
            .shape-bottom {
                bottom: -100px;
            }
        }
        padding: 140px 12px;
        &_title {
            font-size: 54px;
        }
    }
}