html{width:100%;height:100%}body{background-color:#eff3f4;position:relative;width:100%;height:100%;font-size:16px;font-family:"Source Sans Pro",sans-serif;font-weight:400;-webkit-font-smoothing:antialiased}form{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:block;width:100%;max-width:400px;background-color:#fff;margin:0;padding:2.25em;box-sizing:border-box;border:solid 1px #ddd;border-radius:.5em;font-family:"Source Sans Pro",sans-serif}form .svgContainer{position:relative;width:200px;height:200px;margin:0 auto 1em;border-radius:50%;pointer-events:none}form .svgContainer div{position:relative;width:100%;height:0;overflow:hidden;border-radius:50%;padding-bottom:100%}form .svgContainer .mySVG{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}form .svgContainer:after{content:"";position:absolute;top:0;left:0;z-index:10;width:inherit;height:inherit;box-sizing:border-box;border:solid 2.5px #217093;border-radius:50%}form .inputGroup{margin:0 0 15px;padding:0;position:relative}form .inputGroup:last-of-type{margin-bottom:0}form label{margin:0 0 12px;display:block;font-size:1.25em;color:#217093;font-weight:700;font-family:inherit}form input[type=email],form input[type=text],form input[type=number],form input[type=url],form input[type=search],form input[type=password]{display:block;margin:0;padding:0 1em 0;padding:.875em 1em 0;background-color:#f3fafd;border:solid 2px #217093;border-radius:4px;-webkit-appearance:none;box-sizing:border-box;width:100%;height:65px;font-size:1.55em;color:#353538;font-weight:600;font-family:inherit;transition:box-shadow .2s linear,border-color .25s ease-out}form input[type=email]:focus,form input[type=text]:focus,form input[type=number]:focus,form input[type=url]:focus,form input[type=search]:focus,form input[type=password]:focus{outline:none;box-shadow:0 2px 10px rgba(0,0,0,.1);border:solid 2px #4eb8dd}.is-invalid{border:solid 2px red!important}#login{display:block;margin:0;padding:.65em 1em 1em;background-color:#4eb8dd;border:none;border-radius:4px;box-sizing:border-box;box-shadow:none;width:100%;height:65px;font-size:1.55em;color:#fff;font-weight:600;font-family:inherit;transition:background-color .2s ease-out;cursor:pointer}#login:hover,#login:active{background-color:#217093}form .inputGroup1 .helper{position:absolute;z-index:1;font-family:inherit}form .inputGroup1 .helper1{top:0;left:0;transform:translate(1em,2.2em) scale(1);transform-origin:0 0;color:#217093;font-size:1.55em;font-weight:400;opacity:.65;pointer-events:none;transition:transform .2s ease-out,opacity .2s linear}form .inputGroup1.focusWithText .helper{transform:translate(1em,1.55em) scale(.6);opacity:1}form .inputGroup2 input[type=password]{padding:.4em 1em .5em}form .inputGroup2 input[type=text]{padding:.025em 1em 0}form .inputGroup2 #showPasswordToggle{display:block;padding:0 0 0 1.45em;position:absolute;top:.25em;right:0;font-size:1em}form .inputGroup2 #showPasswordToggle input{position:absolute;z-index:-1;opacity:0}form .inputGroup2 #showPasswordToggle .indicator{position:absolute;top:0;left:0;height:20px;width:20px;background-color:#f3fafd;border:solid 2px #217093;border-radius:3px}form .inputGroup2 #showPasswordToggle .indicator:after{content:"";position:absolute;left:.25em;top:.025em;width:10px;height:10px;border:solid #217093;border-width:0 3px 3px 0;transform:rotate(45deg);visibility:hidden}form .inputGroup2 #showPasswordToggle input:checked~.indicator:after{visibility:visible}form .inputGroup2 #showPasswordToggle input:focus~.indicator,form .inputGroup2 #showPasswordToggle input:hover~.indicator{border-color:#4eb8dd}form .inputGroup2 #showPasswordToggle input:disabled~.indicator{opacity:.5}form .inputGroup2 #showPasswordToggle input:disabled~.indicator:after{visibility:hidden}