.authorization-block {
    width: 330px;
    background-color: var(--hm-white);
    padding: 20px 30px 30px 30px;
}

.logo-auth {
    text-align: center;
}

.authorization-title {
    font-family: R500, sans-serif;
    font-size: 16px;
    line-height: 100%;
    color: var(--hm-gunmetal);
    text-align: center;
    padding: 15px;
}

.button-action {
    width: 100%;
    margin-top: 5px;
    cursor: pointer;
    height: 38px;
    padding: 10px;
}

.authorization-message {
    display: none;
    margin-bottom: 10px;
    background-color: var(--hm-error-block);
    color: var(--hm-red);
    padding: 8px 12px;
    font-family: R400, sans-serif;
    font-size: 14px;
    line-height: 100%;
}

.authorization-message.error {
    display: block;
}

.authorization-line {
    position: relative;
    margin-bottom: 10px;
}

.authorization-line input:focus {
    border-color: var(--hm-yellow50);
}

.search-password {
    position: absolute;
    top: 50%;
    right: 12px;
    width: 16px;
    height: 16px;
    margin-top: -8px;
    cursor: pointer;
}

.search-password svg {
    width: 100%;
    height: 100%;
}

.search-password.action svg path {
    fill: var(--hm-yellow50);
}

.authorization-line.button {
    margin-bottom: 0;
}

.bkg-left {
    display: flex;
    flex-wrap: wrap;
}

.bkg-line {
    flex-basis: 100%;
    display: flex;
}

.bkg-item-column {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
}

.bkg-w90 {
    width: 90px;
}

.bkg-block {
    position: absolute;
    bottom: 0;
    display: flex;
    z-index: -1;
}

.bkg-image {
    display: block;
    opacity: 0;
    transition: opacity 1s;
}

.bkg-image.on {
    opacity: 1;
}

.bkg-image.pos-a {
    position: absolute;
}

.bkg-image-19 {
    top: 172px;
    /*bottom: 480px;*/
    left: 195px;
}

.bkg-image-20 {
    top: 100px;
    /*bottom: 624px;*/
    left: 414px;
}

.bkg-image-21 {
    top: 246px;
    /*bottom: 428px;*/
    right: 348px;
}