﻿html,body			{margin:0px; padding:0px; border:0px; background:#ffffff; font-size:100%; font-family:'proxima-nova',Arial, Helvetica, sans-serif; font-weight:normal;}
a					{color:#4a4a4a; text-decoration:underline; cursor:pointer;}

.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .clearfix             		{ zoom: 1; } /* IE6 */
*:first-child+html .clearfix 	{ zoom: 1; } /* IE7 */

input, textarea {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
    height: 26px;
    font-family:inherit;
}

::-webkit-input-placeholder { /* WebKit browsers */
    color:    #464646;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #464646;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #464646;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    #464646;
}

.nowrap                 {white-space:nowrap;}

.outerwrapper               {display:flex; flex-direction:column; max-width:100rem; margin:0px auto; min-height:100vh;}
.container                  {margin:3em 1em;}

.container.fancybox         {width: 80%; max-width: 30rem; margin: 2em auto; padding: 2em; box-sizing: border-box; 
                             border: 1px solid #94c1e0; border-radius: 1em; box-shadow: 0rem 0rem 1rem 0px #dfe1e4; text-align: center;        }
.fancybox h1                {margin-top:0px;}

img.kpilogo                 {width:40%; margin:1.2vw; max-width:40em; min-width:12rem;}


.error                      {color:red; font-size:0.8rem; font-weight:bold;}

.button                     {height: auto; background: #0077b1; color: white;
                            border: none;  padding: .5rem 1.5rem;  cursor: pointer;
                            font-size: 1.1rem;  line-height: 1.1rem;  vertical-align: middle; text-decoration: none;}

.login-input            {border: 1px solid #94c1e0; background: white; padding: .3rem; font-size: 1rem; margin-bottom:1em;}

.idp-or                 {margin: 2rem auto;}

.pwd-strength			{display:block; margin:-1em 0px 1em;}
.pwd-short              {font-weight: 600;font-size: 12px;color: red;}
.pwd-weak               {font-weight: 600; font-size: 12px; color: #ea7900;}
.pwd-good               {font-weight: 600; font-size: 12px; color: #0051ea;}
.pwd-strong             {font-weight: 600; font-size: 12px; color: #00a51d;}

.pwd-forgot             {display:block; font-weight: 400; font-size: 12px; margin: 0px auto 1rem;}

.form                           {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; margin: 0px auto; max-width:60rem; padding:0px 2rem;}
.formfield                      {position:relative; flex: 1 0 16rem; min-width: 50%; box-sizing: border-box; border: .5rem solid transparent;}
.formfield input[type=text],
.formfield input[type=tel],
.formfield input[type=password],
.formfield textarea             {position:relative; left:0px; top:0px; z-index:10; width: 100%; height:auto; box-sizing:border-box; padding:1rem .3rem .2rem;
                                 background:transparent; border: 1px solid #0077b0; letter-spacing:.03rem;}
.formfield.wide                 {width:100%;}
.formfield label                {position:absolute; left:0px; top:0px; z-index:20; margin:.1rem .3rem; font-size:.8rem; color:#7b7b7b;}
.formfield label.error          {color:red;}
.formfield input[type=text].error,
.formfield textarea.error       {border-color:red;}

#lblErrorMsg            {display:block; margin:1em auto;}