@import "../common_styles/nullstyle.css";
@import "../common_styles/index.css";

main {
    background-image: url('../common_assets/bg.png');
}

h1 {
    font-size: 48px;
    line-height: 140%;
    color: #8C64FF;
}

h2 {
    color: #F8E6E4;
}

.btn {
    background: #8C64FF;
    color: #F8E6E4;
}

.btn:hover {
    background-color: #7647FD;
}

.btn:active {
    background-color: #622BFF;
}

.form_steps_item_text .btn.hidden {
    transition: .5s;
    height: 0 !important;
    opacity: 0;
    pointer-events: none;
}

.form_steps_item_text .btn {
    transition: .5s;
    height: 48px;
    opacity: 1;
}

.form {
    display: flex;
    align-items: stretch;
    padding: 55px 60px;
    background: #131212;
    border: 1px solid #2B2B2B;
    z-index: 3;
}

.form_title {
    flex: 1;
    max-width: 440px;
    padding-right: 60px;
    border-right: 1px solid #8C64FF;
}

.form_steps {
    flex: 1.5;
    padding-left: 90px;
}

.form_steps_item {
    display: flex;
    align-items: baseline;
    margin-top: 28px;
}

.form_steps_item_icon {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 70px;
    height: 70px;
    background-color: #8C64FF;
    border-radius: 100%;
    margin-right: 40px;
}

.form_steps_item_icon:before {
    content: '';
    position: absolute;
    bottom: 100%;
    width: 3px;
    height: 80px;
    background-color: #8C64FF;
    z-index: -5;
}

.form_steps_item_icon.disabled:before {
    height: 34px;
}

.form_steps_item_icon.first:before {
    display: none;
}

.form_steps_item.disabled .form_steps_item_icon {
    background-color: rgba(64, 53, 96, 1);
}

.form_steps_item.disabled .form_steps_item_icon:before {
    background-color: rgba(64, 53, 96, 1);
}

.footer a svg path {
    fill: rgba(248, 230, 228, 1);
}

.footer a:hover > svg path {
    fill: rgba(118, 71, 253, 1);
}

.footer a:active > svg path {
    fill: rgba(98, 43, 255, 1);
}