.main-block {
    margin: 32px 18.75%;
    display: flex;
    justify-content: space-between;
}
.main-block-img {
    width: calc(62.5% - 100px);
    height: auto;
    background: radial-gradient(circle, #EEBD3B 0%, rgb(238, 190, 58, 0) 150%);
    border: #EEBD3B solid 2px;
}
.main-block-first-chapter {
    width: calc(37.5% - 4px);
    text-align: center;
}
.main-block-title {
    margin: 0 0 32px 0;
}
.main-block-form {
    margin: 16px 0;
}
.main-block-button {
    display: block;
    border: none;
    background: var(--color-dark-9);
    color: var(--color-light-1);
    margin: 16px auto;
    padding: 18px 32px;
    font-family: 'Montserrat';
    font-weight: 600;
    width: 100%;
    border-radius: 32px;
    transition: 0.4s;
    text-align: center;
}
body.dark .main-block-button {
    background: var(--color-light-1);
    color: var(--color-dark-9);
}
.main-block-button:hover {
    background: var(--color-dark-1);
    cursor: pointer;
}
body.dark .main-block-button:hover {
    background: var(--color-light-4);
}
.main-block-or {
    font-family: 'Montserrat';
    font-weight: 500;
    margin: 0;
    color: var(--color-dark-9);
    transition: initial;
    transition: 0.4s;
}
body.dark .main-block-or {
    color: var(--color-light-1);
}
.main-block-a-register {
    border: 2px var(--color-light-5) solid;
    background: var(--color-light-2);
    color: var(--color-dark-9);
    margin: 16px auto;
    padding: 16px 32px;
    font-family: 'Montserrat';
    font-weight: 600;
    width: calc(100% - 68px);
    border-radius: 32px;
    transition: 0.4s;
    text-decoration: none;
    display: block;
}
body.dark .main-block-a-register {
    border: 2px var(--color-dark-3) solid;
    background: var(--color-dark-8);
    color: var(--color-light-1);
}
.main-block-a-register:hover {
    border: 2px var(--color-light-6) solid;
    background: var(--color-light-4);
}
body.dark .main-block-a-register:hover {
    border: 2px var(--color-dark-2) solid;
    background: var(--color-dark-4);
}
@media screen and (max-width: 1200px) {
    .main-block {
        margin: calc(32px * 1200 / 1920) 18.75%;
    }
    .main-block-img {
        width: calc(62.5% - 100px * 1200 / 1920);
        border-width: calc(2px * 1200 / 1920);
    }
    .main-block-first-chapter {
        width: calc(37.5% - 4px * 1200 / 1920);
    }
    .main-block-title {
        margin: 0 0 calc(32px * 1200 / 1920) 0;
    }
    .main-block-form {
        margin: calc(16px * 1200 / 1920) 0;
    }
    .main-block-button {
        margin: calc(16px * 1200 / 1920) auto;
        padding: calc(18px * 1200 / 1920) calc(32px * 1200 / 1920);
        border-radius: calc(32px * 1200 / 1920);
    }
}
@media screen and (max-width: 992px) {
    .main-block {
        margin: calc(32px * 992 / 1920) 18.75%;
    }
    .main-block-img {
        width: calc(62.5% - 100px * 992 / 1920);
        border-width: calc(2px * 992 / 1920);
    }
    .main-block-first-chapter {
        width: calc(37.5% - 4px * 992 / 1920);
    }
    .main-block-title {
        margin: 0 0 calc(32px * 992 / 1920) 0;
    }
    .main-block-form {
        margin: calc(16px * 992 / 1920) 0;
    }
    .main-block-button {
        margin: calc(16px * 992 / 1920) auto;
        padding: calc(18px * 992 / 1920) calc(32px * 992 / 1920);
        border-radius: calc(32px * 992 / 1920);
    }
}
@media screen and (max-width: 768px) {
    .main-block {
        margin: calc(32px * 768 / 1920) 18.75%;
    }
    .main-block-img {
        width: calc(62.5% - 100px * 768 / 1920);
        border-width: calc(2px * 768 / 1920);
    }
    .main-block-first-chapter {
        width: calc(37.5% - 4px * 768 / 1920);
    }
    .main-block-title {
        margin: 0 0 calc(32px * 768 / 1920) 0;
    }
    .main-block-form {
        margin: calc(16px * 768 / 1920) 0;
    }
    .main-block-button {
        margin: calc(16px * 768 / 1920) auto;
        padding: calc(18px * 768 / 1920) calc(32px * 768 / 1920);
        border-radius: calc(32px * 768 / 1920);
    }
}
@media screen and (max-width: 576px) {
    .main-block {
        margin: 16px;
        display: block;
    }
    .main-block-img {
        display: none;
    }
    .main-block-first-chapter {
        width: auto;
    }
    .main-block-title {
        margin: 0 0 32px 0;
    }
    .main-block-form {
        margin: 16px 0;
    }
}
@media screen and (max-width: 390px) {
    .main-block {
        margin: 12px;
    }
    .main-block-title {
        margin: 0 0 24px 0;
    }
    .main-block-form {
        margin: 12px 0;
    }
}