#login_logo {
	background-color: var(--primary);
}

.logo_container {
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 40%;
}


#login_content, #recover_content, #recovery_content {
  width: 80%;
max-width: 400px;
}


.layout-page {
    display: -ms-flexbox;
    display: flex;
    overflow-x: auto;
    -ms-flex-direction: row;
    flex-direction: row;
    width: 100%;
    height: 100%;
    justify-items: center;
}

.layout-page>.layout-block {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-direction: column;
    flex-direction: column;
}

.layout-page>.layout-block.block-canvas {
    -ms-flex-pack: center;
    justify-content: center;
    max-width: 40%;
    background-color: var(--primary);
}

.layout-page>.layout-block.block-form {
    overflow: auto;
    background-color: var(--white);
}

.content {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    padding: 30px
}

.layout-page>.layout-block .layout-block_content:first-of-type {
    -ms-flex: 1;
    flex: 1;
}
.layout-page>.layout-block .layout-block_content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 100%;
}

.layout-page>.layout-block .layout-block_content .content-block {
    max-width: 500px;
}