main {
    align-items: stretch;
    position: relative;
}

body main #frontend_content_auth {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;

    display: flex;
    flex-direction: column;

    max-height: 100vh;
    overflow-y: auto;
}
body main #frontend_content_auth #frontend_content_auth_form {
    padding: 64px;
    
    flex-grow: 1;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;
}
body main #frontend_content_auth #frontend_content_auth_form form {
    flex-grow: 1;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main {
    flex-grow: 1;

    padding: 0 64px;
    max-width: 1100px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    row-gap: 16px;
}

body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_title {
    text-transform: uppercase;
    font-size: 2rem;
    line-height: 1;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_subtitle {
    color: var( --color-primary );
    font-size: 1.5rem;
    line-height: 1;
    margin-bottom: 16px;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main input[type="text"] {
    width: 100%;
    border: 1px solid #777;
    text-align: center;
    padding: 6px 16px;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main input[type="email"] {
    width: 100%;
    border: 1px solid #777;
    text-align: center;
    padding: 6px 16px;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_message {
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: var( --color-primary );
    cursor: pointer;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_legaltext {
    margin-top: 16px;
    font-size: 0.75rem;
    font-weight: 200;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_legaltext a {
    color: var( --color-primary );
    text-decoration: none;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox {
    width: 100%;
    text-align: left;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox input[type="checkbox"] {
    outline: none;
    appearance: none;
    flex-shrink: 0;    
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    margin: 0;
    margin-right: 10px;
    border: 1px solid var( --color-primary );
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox input[type="checkbox"]:checked {
    background-position: 50%;
    background-repeat: no-repeat;
    background-color: var( --color-primary );
    background-image: url( "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 11' width='13' height='11' fill='none'><path d='M11.0426 1.02893C11.3258 0.695792 11.8254 0.655283 12.1585 0.938451C12.4917 1.22162 12.5322 1.72124 12.249 2.05437L5.51985 9.97104C5.23224 10.3094 4.72261 10.3451 4.3907 10.05L0.828197 6.88335C0.50141 6.59288 0.471975 6.09249 0.762452 5.7657C1.05293 5.43891 1.55332 5.40948 1.88011 5.69995L4.83765 8.32889L11.0426 1.02893Z' fill='%23ffffff'/></svg>" );  
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox label {
    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 200;
    column-gap: 4px;
}
body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox label a {
    color: var( --color-primary );
    text-decoration: none;    
}

body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main .frontend_content_auth_form_main_checkbox input[type="checkbox"] {
    
}

/* #frontend_content_auth #frontend_content_auth_music { */
/*     z-index: 1000; */
/*     position: absolute; */
/*     right: 32px; */
/*     bottom: 32px; */
/*     color: var( --color-primary ); */
/*     font-size: 3rem; */
/*     cursor: pointer; */
/*     min-width: 4rem; */
/*     display: flex; */
/*     align-items: center; */
/*     justify-content: flex-start; */
/* } */


@media only screen and ( max-width: 600px ) {
    main { background-size-x: 50%; }
    body main #frontend_content_auth #frontend_content_auth_form { padding: 16px 5vw; }
    body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main { padding: 0; row-gap: 12px; }
    body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_title { font-size: 1.5rem; }
    body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_subtitle { font-size: 1rem; }
    body main #frontend_content_auth #frontend_content_auth_form form #frontend_content_auth_form_main #frontend_content_auth_form_main_message { min-height: 32px; }    
}

