:root{
                font-size: 16px;
            }

body {
    background: aliceblue;
    background-size: 150% 150%;
    background-position: 20% 20%;
    font-family: 'Roboto', Helvetica, sans-serif;
}


            h1, h2, h3, h4 {
                font-family: 'Roboto', Helvetica, sans-serif
            }

            h1{
                font-size: 2em;
            }

            h2{
                font-size: 1.75em;
            }

            h3{
                font-size: 1.5em;
            }

            h4{
                font-size: 1.25em;
            }

            h5{
                font-size: 1.1em;
            }

            form input{
                font-size: 1.2em;
                padding: .5em .5em;
               /* border-radius: .5em;*/
            }
            
            form label{
                font-size: 1.2em;
                margin-top: 10px;
            }
.line {
    white-space: nowrap;
    text-align: center;
    margin-bottom: 25px;
    margin-top: 25px;
}

.hr-text {
    position: relative;
    border: none;
    height: 1px;
    background: #333;
}

    .hr-text::before {
        content: attr(data-content);
        display: inline-block;
        position: relative;
        top: -0.7em;
        font-size: 1.5em;
        padding: 0 0.25em;
        background: white;
    }
form button[type="submit"], .submit-btn {
    background-color: #4285F5;
    border-color: #4285F5;
    margin-top: 20px;
    font-weight: 600;
    padding: .5em;
    font-size: 1.2em;
    border-radius: .5em;
    max-width: 50%;
    align-self: center;
    padding: .5em 2em;
    cursor: pointer;
    transition: .2s all ease-in-out;
    border: none;
    color: white;
    border-radius:5px;
}
.google-sign-in-button {
    cursor: pointer;
    transition: background-color .3s, box-shadow .3s;
    padding: 12px 16px 12px 42px;
    border: none;
    border-radius: 3px;
    box-shadow: 0 -1px 0 rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .25);
    color: #757575;
    font-size: 14px;
    font-weight: 500;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNMTcuNiA5LjJsLS4xLTEuOEg5djMuNGg0LjhDMTMuNiAxMiAxMyAxMyAxMiAxMy42djIuMmgzYTguOCA4LjggMCAwIDAgMi42LTYuNnoiIGZpbGw9IiM0Mjg1RjQiIGZpbGwtcnVsZT0ibm9uemVybyIvPjxwYXRoIGQ9Ik05IDE4YzIuNCAwIDQuNS0uOCA2LTIuMmwtMy0yLjJhNS40IDUuNCAwIDAgMS04LTIuOUgxVjEzYTkgOSAwIDAgMCA4IDV6IiBmaWxsPSIjMzRBODUzIiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNNCAxMC43YTUuNCA1LjQgMCAwIDEgMC0zLjRWNUgxYTkgOSAwIDAgMCAwIDhsMy0yLjN6IiBmaWxsPSIjRkJCQzA1IiBmaWxsLXJ1bGU9Im5vbnplcm8iLz48cGF0aCBkPSJNOSAzLjZjMS4zIDAgMi41LjQgMy40IDEuM0wxNSAyLjNBOSA5IDAgMCAwIDEgNWwzIDIuNGE1LjQgNS40IDAgMCAxIDUtMy43eiIgZmlsbD0iI0VBNDMzNSIgZmlsbC1ydWxlPSJub256ZXJvIi8+PHBhdGggZD0iTTAgMGgxOHYxOEgweiIvPjwvZz48L3N2Zz4=);
    background-color: white;
    background-repeat: no-repeat;
    background-position: 12px 11px;
}

.google-image {
    background: url('/assets/img/google-image.png') no-repeat scroll 5px center #007bff;
    padding-left: 30px; /* adjust this value based on your image's width */
}

    .submit-btn:hover {
        color: white;
        background-color: #0069d9;
        border-color: #0062cc;
    }

                form button[type="submit"]:hover {
                    box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.44);
                }

            fieldset{
                border: none;
            }
            
            .password-wrap{
                position: relative;
                display: flex;
                flex-direction: row;
                align-items: center;
            }

            span.eye{
                font-size: 1.25em;
                opacity: .5;
                position: absolute;
                right: .5em;
                cursor: pointer;
            }

            .password-wrap input{
                width: 100%;
            }

            #body-nm h1{
                margin: 0px;
            }

            #body-nm h3{
                margin-bottom: .5em;
            }

            #body-nm h2{
                margin: 1em 0 0 0;
            }


            #body-nm main{
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                width: 100%;
                height: 100vh;
            }

                #body-nm main .form-container {
                    display: grid;
                    grid-template-columns: 2fr 1.5fr;
                    min-width: 500px;
                    background-color: #FFF;
                    border-radius: 1em;
                    box-shadow: 0px 0px 20px 1px rgba(0,0,0,0.44);
                    overflow: hidden;
                    max-width: 1000px
                }

            #body-nm main .form-container .form-wrap {
                padding: 2em;
            }

            #body-nm main .form-container form fieldset{
                display: flex;
                flex-direction:column;
            }

                    #body-nm main .form-container aside {
                        display: flex;
                        flex-direction: column;
                        min-width: 40%;
                        height: auto;
                        padding: 3em;
                        background-color: #253131;
                        border-left: 1px solid #CCC;
                    }

            #body-nm main .form-container aside ul{
                margin-top: 0;
            }

            #body-nm main .form-container aside ul li{
                margin-top: 5px;
                font-size: 1.0em;
                font-weight: 600;
            }

            #body-nm main .form-container aside figure{
                margin: 0;
                width: 100%;
            }

            
            #body-nm svg#reg-graphic{
                width: 100%;
                height: auto;
            }

            #body-nm #body-nm main .form-container aside li{
                font-weight: 600;
                font-size: 1.15em;
                margin: 1em 0;
            }

            @media (max-width: 800px){
                #body-nm h1{
                    line-height: 1.2em;
                    margin-bottom: 1.5em;
                    font-size: 2em;
                }

                #body-nm h2{
                    margin-top: .1em;
                    font-size: 1.5em;
                }

                #body-nm main {
                    height: 100%;
                }

                #body-nm main .form-container{
                    min-width: 100%;
                }

                #body-nm main .form-container{
                    grid-template-rows: 1fr 1fr;
                    grid-template-columns: 1fr;
                    
                }

                #body-nm main .form-container aside{
                    border-top: 1px solid #CCC;
                    padding: 2em;
                }
            }