html, body, div, p, img, header, nav, section, h1, h2, h3, h4, h5, h6, form, select, option, textarea, button, input, table, td, th, hr, a, span, ul.reset, ul.reset li { margin: 0px; padding: 0px; border: 0px; outline: none; box-sizing: border-box; -webkit-box-sizing: border-box; }
ul.reset { list-style-type: none; }
article, aside, header, section, nav, footer, main, audio, video, form, iframe { display: block; }

@font-face {
    font-family: 'robotoregular';
    src: url('../fonts/Roboto-Regular-webfont.eot');
    src: url('../fonts/Roboto-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Regular-webfont.woff') format('woff'),
         url('../fonts/Roboto-Regular-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Regular-webfont.svg#robotoregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotoitalic';
    src: url('../fonts/Roboto-Italic-webfont.eot');
    src: url('../fonts/Roboto-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Italic-webfont.woff') format('woff'),
         url('../fonts/Roboto-Italic-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Italic-webfont.svg#robotoitalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotobold';
    src: url('../fonts/Roboto-Bold-webfont.eot');
    src: url('../fonts/Roboto-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Bold-webfont.woff') format('woff'),
         url('../fonts/Roboto-Bold-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Bold-webfont.svg#robotobold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotobold_italic';
    src: url('../fonts/Roboto-BoldItalic-webfont.eot');
    src: url('../fonts/Roboto-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/Roboto-BoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-BoldItalic-webfont.svg#robotobold_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotomedium';
    src: url('../fonts/Roboto-Medium-webfont.eot');
    src: url('../fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Medium-webfont.woff') format('woff'),
         url('../fonts/Roboto-Medium-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Medium-webfont.svg#robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotomedium_italic';
    src: url('../fonts/Roboto-MediumItalic-webfont.eot');
    src: url('../fonts/Roboto-MediumItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-MediumItalic-webfont.woff') format('woff'),
         url('../fonts/Roboto-MediumItalic-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-MediumItalic-webfont.svg#robotomedium_italic') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotoblack';
    src: url('../fonts/Roboto-Black-webfont.eot');
    src: url('../fonts/Roboto-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Black-webfont.woff') format('woff'),
         url('../fonts/Roboto-Black-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Black-webfont.svg#robotoblack') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
	font-family: 'Mat-Icons';
	src: url('../fonts/MaterialIconsOutlined-Regular.otf') format('opentype'),
		 url('../fonts/MaterialIconsOutlined-Regular.ttf') format('truetype'),	
		 url('../fonts/MaterialIconsOutlined-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}


body, th, td, input, select, textarea, button, h1, h2, h3, h4, h5, h6
{
font-family: 'robotoregular', arial, helvetica, sans-serif; font-weight: normal;
font-size: 16px; line-height: 24px; letter-spacing: 0.15px; vertical-align: middle; color: rgba(0,0,0,0.6);
text-size-adjust: none; -webkit-text-size-adjust: none;
}

:root { --pf-global--FontFamily--sans-serif: 'robotoregular', arial, helvetica, sans-serif; }


.pf-c-form-control,
.form-control { display: inline-block; width: 100%; height: auto; padding: 0px; font-size: 16px; line-height: 24px; color: rgba(0,0,0,0.87); background-color: transparent; background-image: none; border: none; border-radius: 0px; box-shadow: none; }


input, select, textarea { color: rgba(0,0,0,0.87); -webkit-appearance: none; border-radius: 0px; background-color: transparent; }
input[type='checkbox'] { -webkit-appearance: checkbox }
input[type='radio'] { -webkit-appearance: radio }

strong, b, .bold { font-family: 'robotobold', arial, helvetica, sans-serif; font-weight: normal; font-style: normal; }

h1, h2, h3, h4, h5, h6 { padding-bottom: 16px; font-size: 34px; line-height: 40px; letter-spacing: 0.25px; color: rgba(0,0,0,0.87); }

a, a:link, a:visited { color: #E10000; text-decoration: underline; }
a:hover, a:focus, a:active { color: #91999A; }

p { padding-bottom: 22px; }


/* show hide elements in step 1 and 2 */

body .apaPostForm1a { display: block; }
body .apaPostForm1b { display: block; padding-top: 22px; }

body.login-pf-settings { display: flex; }

body.step_02 .formGroupUsername,
body.step_02 .formGroupUsername:hover { border: 2px solid #ffffff; }
body.step_02 .formGroupUsername label { display: none; }
body.step_02 .formGroupUsername span.pf-m-error { display: none; }

/* body.resetCredentials .apaPreHeader { display: none; } */
body.resetCredentials .passwordforgotten { display: block; }
body.resetCredentials .step2element { display: none; }

body.updatePassword .apaPreHeader { /* display: none; */ display: block; }
body.updatePassword .step2element { display: none; }


body.bodyUpdateProfile .apaPreHeader { display: none; }


.contentWrapper { width: 96%; max-width: 1130px; margin: 0px auto; padding: 100px 0px; display: flex; flex-direction: row; justify-content: space-between; }
.contentLeft { width: 53.1%; }
.contentRight { width: 34%; }

.contentLeft h2 { padding-left: 19%; }
.contentLeft h3 { padding-left: 19%; font-size: 24px; line-height: 28px; color: #E10000; }
.contentLeft p  { padding-left: 19%; padding-bottom: 48px; }
.contentLeftVisual img { width: 100%; }


#kc-header { text-align: center; white-space: normal; color: rgba(0,0,0,0.6); }
#kc-header-wrapper { padding: 0px 0px 20px 0px; min-height: 52px; font-size: 16px; line-height: 24px; letter-spacing: 0px; text-transform: none;}
.kc-header-image { display: block; width: 76px; margin: 0px auto; }
#kc-header h1 { font-size: 24px; line-height: 28px; letter-spacing: 0.18px; }
#kc-header h2 { font-size: 24px; line-height: 28px; }
.page-subtitle { width: 90%; margin: 0px auto; }


.contentRight .login-pf-page { padding: 50px 20px 10px 20px; margin-bottom: 28px; border: 1px solid rgba(0,0,0,0.12); border-radius: 4px; }

/* IAM-567 */
/* .contentRight .login-pf-page .card-pf { display: flex; flex-direction: column; min-height: 500px; box-shadow: none; border-top-style: none; }
/* .contentRight #kc-info { padding-bottom: 0px; margin: 20px 0px 0px 0px; }
/* .contentRight .login-pf-page .card-pf .form-footer { margin-top: auto; }
/* /IAM-567 */

.login-pf-page .login-pf-page-header { margin: 0px; }
.login-pf-page .login-pf-header { margin: 0px; }
.pf-c-form-control:focus,
.form-control:focus { border: none; outline: 0; box-shadow: none; }
#kc-form-buttons { margin: 0px; }
.form-horizontal .form-group { margin: 0px 0px 30px 0px; }
.form-horizontal .control-label { padding: 15px 0px 17px 0px; }
.form-horizontal div.formGroupFocused label, .form-horizontal div.formGroupFocused:hover label { padding: 0px 3px; }


.login-pf-page .pf-c-form-control,
.login-pf-page .form-control { height: auto; line-height: 24px; }
.login-pf-page .login-pf-settings { justify-content: flex-start; font-size: 12px; line-height: 16px; letter-spacing: 0.4px; min-height: 0px; }
.login-pf-page .login-pf-settings input { margin-top: 0px; }
.login-pf-page .login-pf-settings #rememberMe { position: unset; margin-bottom: 3px; margin-left: 0px; }
/*
.login-pf-page .login-pf-settings label { font-size: 12px; line-height: 16px; letter-spacing: 0.4px; }
*/
.login-pf-page .login-pf-settings a { color: rgba(0,0,0,0.87); }




input[type=submit] {
    background-color: #E10000;
    background-image: none !important;
}

div.form-group { position: relative; left: 0px; top: 0px; padding: 12px 10px 12px 10px; margin-bottom: 30px; min-height: 56px; border: 1px solid rgba(0,0,0,0.32); border-radius: 5px; -webkit-border-radius: 5px; }
div.form-group:after { content: " "; clear: both; display: block; visibility: hidden; height: 0px; overflow: hidden; }
div.form-group label { position: absolute; left: 10px; top: 0px; display: block; padding: 15px 0px 17px 0px; margin: 0px; font-size: 18px; line-height: 24px; font-weight: normal; transition: all 100ms; -webkit-transition: all 100ms; }
div.form-group label.alert-error,
div.form-group label.alert-error a { color: #E10000; }
div.form-group select,
div.form-group input[type='text'],
div.form-group input[type='password']
{ width: 100%; opacity: 0; }

div.form-group:hover { border: 1px solid #616161; }

div.formGroupFocused,
div.formGroupFocused:hover
{  padding: 11px 9px 11px 9px; border: 2px solid #545E69; }
div.formGroupFocused select,
div.formGroupFocused input[type='text'],
div.formGroupFocused input[type='password']
{ opacity: 1; }
div.formGroupFocused label,
div.formGroupFocused:hover label
{ top: -9px; padding: 0px 3px; left: 6px; font-size: 12px; line-height: 16px; background-color: #FFFFFF; }

div.checkbox label { position: relative; left: 0px; top: 0px; padding: 0px 0px 0px 25px; font-size: 16px; line-height: 22px; color: #4A4A4A; }
div.checkbox label input { position: absolute; left: 0px; top: 6px; }

div.form-group.has-error { border: 2px solid #E10000; margin-top: -2px; }
div.form-group.has-error label { color: #E10000; }

div.field-error-message { position: absolute; right: 10px; bottom: -19px; padding-top: 2px; font-size: 12px; line-height: 16px; color: #E10000; }

ul.field-error-message { position: absolute; right: 10px; bottom: -19px; padding-top: 2px; font-size: 12px; line-height: 16px; color: #E10000; }


div.formGroupFocused div.field-error-message { right: 9px; bottom: -20px; }

div.form-group_padding_top { padding-top: 25px; }

div.form-group-checkbox { display: flex; flex-direction: row; align-items: flex-start; border: 0px; min-height: 0px; }
div.form-group-checkbox:hover { border: 0px; }
div.form-group-checkbox input { margin: 5px 10px 0 0; }
div.form-group-checkbox label { position: static; display: inline; padding: 0px; font-size: 14px; line-height: 20px; letter-spacing: 0.25px; color: #555F69; }

div.form-group-checkbox-skipAutoComplete { margin: 0px!important; }
div.form-group-checkbox-skipAutoComplete input { margin: 0 10px 0 0; }

.login-pf-settings span { margin-left: auto; }

.form-text { margin-bottom: 30px; font-size: 12px; line-height: 16px; letter-spacing: 0.4px; color: rgba(0,0,0,0.6); }

div.form-group-submit { border: 0px; padding: 0px; min-height: 0px; }
div.form-group-submit:hover { border: 0px; }

div.form-group.login-pf-settings,
div.form-group.register-pf-settings,
#kc-form-buttons.form-group,
div.form-group-noBorder,
div.form-group.login-pf-settings:hover,
div.form-group.register-pf-settings:hover,
#kc-form-buttons.form-group:hover,
div.form-group-noBorder:hover
{ border: 1px solid #ffffff; padding: 0px; }

div.form-group-select { 
background-position: 97% center;
background-size: 15px auto; -webkit-background-size: 15px auto;
}
div.form-group-select.formGroupFocused { background-image: none; }
div.form-group-select select { -moz-appearance: none; -webkit-appearance: none; appearance: none; }
div.form-group-select select::-ms-expand { display: none; }

.form-group-two-buttons { display: flex; flex-direction: row; justify-content: space-between; }
.form-group-two-buttons .btn { width: 48%; height: 34px;  }
.form-group-two-buttons:after { content: none!important; }

.showHidePassword { position: absolute; right: 10px; top: calc(50% - 12px); width: 24px; height: 24px; font-family: "Mat-Icons"; font-size: 24px; line-height: 24px; cursor: pointer; }
.showHidePassword:before { content: "\e8f4"; }
.hidePassword:before { content: "\e8f5"; }


.btn {
    display: block; width:100%; padding: 0px 10px; color: #ffffff;
    cursor: pointer; touch-action: manipulation; white-space: nowrap; user-select: none;
    vertical-align: middle; text-align: center; text-decoration: none; text-transform: uppercase; font-size: 14px; font-weight: 500; letter-spacing: 1.25px; line-height: 34px;
	border-radius: 4px; border: 1px solid #E10000; background-color: #E10000; 
}

.btn:disabled,
.btn[disabled],
button:disabled,
button[disabled]
{ border-color: #cccccc; background-color: #cccccc; color: #666666; }

.btn:disabled:hover,
.btn[disabled]:hover,
button:disabled:hover,
button[disabled]:hover
{ border-color: #cccccc; background-color: #cccccc; color: #666666; box-shadow: none; cursor: not-allowed; }




.btnWhite,
input.btnWhite { border-color: rgba(0,0,0,0.12); background-color: #FFFFFF!important; color: #E10000!important; text-decoration: none!important; }

.btnWhite:hover,
input.btnWhite:hover { background-color: #E10000!important; color: #FFFFFF!important; }



.btn:hover,
.btn:focus,
.btn:active,
button:hover,
button:focus,
button:active
{ color: #FFFFFF; border-color: #E10000; background-color: #E10000; box-shadow: 0px 1px 3px 1px rgba(0,0,0,0.16); }

button.btn_link,
button.btn_link:hover,
button.btn_link:focus,
button.btn_link:active
{ width: auto; display: block; margin: 0px auto; background-color: transparent!important; box-shadow: none!important; color: #E10000!important; text-decoration: underline; font-size: 14px; line-height: 20px; letter-spacing: 0.25px; cursor: pointer; }


.login-pf, body { background-image: none; background: white !important; }
#kc-social-providers { display: none; }

.alert { display: flex; flex-direction: row; align-items: center; border-radius: 5px; background-color: transparent; margin-bottom: 22px; border: 1px solid currentcolor; }

.pficon-error-circle-o:before { content: "\e92b"; }
.alert_icon { position: absolute; left: 13px; top: 14px; font-size: 22px; }
.alert_icon span.fa-fw { width: auto!important; }
.alert-error { border-color: #cc0000; color: #333333; }
.alert-warning .alert_icon { color: #ec7a08; }
.alert-success .alert_icon { color: #3f9c35; }
.alert-error .alert_icon { color: #cc0000; }

.alert-error { color: #cc0000; }
.alert-warning { color: #ec7a08; }
.alert-success { color: #3f9c35; }
.alert-info { color: #333333; }

.pf-c-alert__icon { padding: 16px 0px 16px 16px; }
.pf-c-alert__icon span { display: block; width: 24px; height: 24px;  font-family: "Mat-Icons"; font-size: 24px; line-height: 24px; }
.pf-c-alert__title { padding: 16px; }

.alert-error .pf-c-alert__icon span:before { content: "\e001"; }
.alert-warning .pf-c-alert__icon span:before { content: "\e8b2"; }
.alert-success .pf-c-alert__icon span:before { content: "\e86c"; }
.alert-info .pf-c-alert__icon span:before { content: "\e88e"; }

.infoMessage { display: flex; flex-direction: column; font-size: 14px; align-items: center; padding-left: 6px; padding-right: 6px; padding-top: 6px; padding-bottom: 6px; border-radius: 5px; background-color: transparent; margin-bottom: 22px; border: 1px solid currentcolor; }

.infoMessage-warning { color: #ec7a08;}

.apaPreHeader { display: block; padding-bottom: 20px; text-align: center; font-size: 14px; line-height: 20px; letter-spacing: 0.25px; }
.apaPostForm { padding-bottom: 20px; font-size: 12px; line-height: 16px; letter-spacing: 0.4px; text-align: center; }
.apaPostForm a { color: rgba(0,0,0,0.87); }

.apaPostForm3 { display: flex; flex-direction: row; justify-content: space-between; padding-top: 20px;  font-size: 16px; line-height: 25px; letter-spacing: 0.5px; color: rgba(0,0,0,0.87); border-top: 1px solid rgba(0,0,0,0.12); border-bottom: 1px solid rgba(0,0,0,0.12); }
.apaPostForm3 a { color: #e10000; }

.apaPostForm4 { text-align: right; }

.alignLeft { text-align: left; }
.alignJustify { text-align: justify; }


.passwordforgotten { padding-bottom: 20px; }

.form-footer { padding: 25px 0px; font-size: 12px; letter-spacing: 0.4px; line-height: 20px; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; }
.form-footer a { margin: 0px 4px; color: rgba(0,0,0,0.87); }


.pf-m-error { position: absolute; left: 10px; top: calc(100% + 3px); font-size: 12px; line-height: 16px; color: #E10000; }


.customerCareContact { display: block; padding-top: 24px; }
.mobileInlineON { display: none; }
.mobileInline { display: block; }


/* IAM-640 */
div.formGroupUsernameStep2 { border: 2px solid #ffffff!important; text-align: left!important; padding-right: 34px; }
div.formGroupUsernameStep2:hover { border: 2px solid #ffffff!important; }
div.formGroupUsernameStep2 label { display: inline; position: static; font-size: 16px!important; line-height: 24px!important; color: rgba(0, 0, 0, 0.87)!important; }
div.formGroupUsernameStep2 span.pf-m-error { display: none; }

div.formGroupUsernameStep2 #reset-login { position: absolute; right: 10px; top: 8px; }

/* pwstrength */
.form-horizontal .formGroupPassword { margin-bottom: 44px; }

.progress { position: absolute; left: 0px; bottom: -24px; height: 4px; width: 100%; border-radius: 2px; font-size: 12px; line-height: 16px; letter-spacing: 0.4px; background-color: #e9ecef; }
.progress-bar { height: 100%; transition: width 600ms; border-radius: 2px; }
.password-verdict { display: block; position: absolute; right: 12px; bottom: 4px; }
.bg-danger { color: #dc3545; background-color: #dc3545; }
.bg-warning { color: #ffc107; background-color: #ffc107; }
.bg-success { color: #28a745; background-color: #28a745; }


#kc-info-message p { text-align: center; }


@media screen and (max-width: 1024px) {
	.contentWrapper { width: 92%; }
	.contentLeft { width: 50%; }
	.contentRight { width: 40%; }
}

@media screen and (max-width: 768px) {
	.contentLeft { width: 50%; }
	.contentLeft h2 { padding-left: 0; }
	.contentLeft h3 { padding-left: 0; }
	.contentLeft p  { padding-left: 0; }
	.contentRight { width: 45%; }
}

@media screen and (max-width: 600px) {
	.contentWrapper { padding: 20px 0px; }
	.contentLeft { display: none; }
	
	.contentRight { width: 100%; }
	.contentRight .login-pf-page { padding: 20px 12px 12px 12px; margin-bottom: 20px; }

 	.customerCareContact { padding-top: 0px; }
 	.mobileInlineON { display: inline; }
	.mobileInline { display: inline; }
	.mobileOFF { display: none; }

	.bodyUpdateProfile .contentWrapper { flex-direction: column; }
	.bodyUpdateProfile .contentLeft { width: 100%; padding-top: 20px; }
	.bodyUpdateProfile .contentLeft h2 { font-size: 24px; line-height: 30px; }
	.bodyUpdateProfile .contentLeft h3 { font-size: 20px; line-height: 26px; }
	.bodyUpdateProfile .contentLeft p { padding-bottom: 0px; }
	.bodyUpdateProfile .contentLeftVisual { display: none; }
	.bodyUpdateProfile .contentRight { padding-top: 0px; }
	.bodyUpdateProfile #kc-header-wrapper { display: none; }
	.bodyUpdateProfile .apaPreHeader { display: none; }

	.form-footer { padding: 16px 0px; }
	.form-footer a { margin: 4px 4px; }
}

@media screen and (max-width: 440px) {
	.contentRight .login-pf-page { border: 0px; padding: 0px; margin: 0px; }
	div.form-group { margin-bottom: 24px; }

	.apaPostForm3 { padding: 12px 0px; }
	.apaPostForm3,
	.apaPostForm3 span,
	.apaPostForm3 a { display: block; }

	.form-footer { padding: 16px 0px 0px 0px; }
	.form-footer a { margin: 8px 4px; }
}

