#config_generator_container
{
    width : 100%;

    min-height : 100vh;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content: center;
}

#config_generator_main
{
    width : 100%;

    min-height : 100vh;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : flex-start;
    justify-content : center;
}

#config_generator_form
{
    width : 500px;
    min-height : 100vh;

    margin : 0px;
    padding : 0px;

    padding  :10px;

    display : flex;
    align-items : center;
    justify-content: flex-start;
    flex-direction: column;

    background-color : #ebebeb;
}

#config_generator_result
{
    width : calc(100% - 520px);

    margin : 0px;
    padding : 0px;

    padding : 10px;

    display : flex;
    align-items : center;
    justify-content : center;
    flex-direction: column;
}

#config_generator_form_title, #config_generator_result_title
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content: center;
}

#config_generator_form_title h2, #config_generator_result_title h2
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content: center;

    color : #536171;
    font-size : 1.2em;
}

#config_generator_form_main
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content : center;
    flex-direction : column;
}

#config_generator_form_main form
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : flex-start;
    justify-content : center;
    flex-direction : column;
}

#config_generator_form_main form h3
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    margin-top : 20px;
    margin-bottom : 10px;
    color : #536171;
    font-size : 1.1em;
}

#config_generator_form_main form p
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    margin-bottom : 10px;

    font-size : 14px;

    color : #536171;
}

#config_generator_form_main form p label
{
    display : inline-block;
    width : calc(100% - 200px);

    margin : 0px;
    padding : 0px;
}

#config_generator_form_main form p input[type=text]
{
    width : 150px;
}

#config_generator_form_main form p input[type=submit]
{
    width : 150px;

    margin-left : calc(50% - 75px)
}

#config_generator_form_main form p select
{
    width : 158px;
}

#config_generator_form_main form p textarea
{
    width : calc(100% - 8px);
}

#config_generator_result_buttons
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    margin-top : 10px;
    margin-bottom : 10px;

    display : flex;
    align-items : center;
    justify-content: center;
}

#config_generator_result_data_container
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content : center;

    background-color : red;
}

#config_generator_result_data
{
    width : 100%;

    margin : 0px;
    padding : 0px;

    display : flex;
    align-items : center;
    justify-content : center;

    background-color : blue;
}

#config_generator_result_data pre
{
    width : calc(100% - 40px);

    margin : 0px;
    padding : 0px;

    padding : 20px;

    display : flex;
    align-items : center;
    justify-content : center;
}

#config_generator_result_data pre code
{
    width : 100%;

    margin : 0px;
    padding : 0px;
}