html {
     scroll-behavior: smooth; 
 }

/*/////// HOME PAGES ///////*/

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
cite,
code,
del,
dfn,
em,
img,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
dd,
dl,
dt,
li,
ol,
ul,
fieldset,
form,
label,
legend,
button,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: normal;
	font-style: normal;
	font-size: 100%;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
	position: relative
}

a:visited,
a {
	text-decoration: none
}

strong {
	font-weight: 500
}

body {
	background-color: #fff;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size: 13px;
	font-weight: normal;
	line-height: 18px;
	color: #212529;
	margin: 0;	
}


/*///// ORIGINAL /////*/

iframe {border: none}

.hidden {
    display: none;
}

.OReport-backgrd {
	background-color: #F2F6FF;	
	height: 100%;
	min-height: 100vh;
	box-sizing: border-box;
	padding-bottom: 200px;
	position: relative
		}

.OReport-backgrd .btn-OnlineReport {
	margin: 0
}

.OReport-backgrd .btn-OnlineReport-edit {
	margin-right:10px; 
	width: 102px
}

#OReport-btn-container{
	opacity:0;
	z-index: 50;
	-webkit-transition: opacity 0.3s linear;
	-o-transition: opacity 0.3s linear;
	transition: opacity 0.3s linear;	
}

#OReport-btn-container.open {
	opacity: 1
}

.emp-OReport-container {
	width: 818px;
    margin: auto;
	top: 110px;
    position: relative;
	
}

.emp-btn {
	padding-left: 20px;
	padding-right: 19px;
	padding-top: 15px;
	padding-bottom: 13px;
	border-width: 1px;
	border-style: solid;
	border-radius: 100px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-family: Roboto, sans-serif;
	font-size: 16px;
	line-height: 20px;
	outline: none;
	cursor: pointer
}

.emp-btn-primary {
	border-color: #2196F3;
	background-color: #2196F3;
	color: white;
	fill: white
}


.emp-btn-primary:hover {
	border-color: #1058aa;
	background-color: #1058aa;
	color: white;
}

.emp-btn-primary:active {
	border-color: #1058aa;
	background-color: #1058aa;
	color: white;
	box-shadow: 0 0 0 4pt #C0D3F0
}

.emp-btn-addSign {
    width: 14px;
    height: 14px;
    margin-right: 5px;
}


.emp-btn-default:hover {
	border-color: #1058aa;
	background-color: #fff;
	color: #1058aa;
	fill: #1058aa
}

.emp-btn-default:active {
	border-color: #1058aa;
	background-color: #fff;
	color: #1058aa;
	box-shadow: 0 0 0 4pt #C0D3F0
}

.emp-btn-default {
	border: #B4C2CD 1px solid;
	background-color: #fff;
	color: #516675;
	fill: #516675
}

.emp-btn span {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: start;
	-ms-flex-pack: start;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center
}

button span {
	margin-right: 0px;
	margin-left: 0px
}

.emp-btn-editSign {
    width: 20px;
    height: 20px;
    display: inline-block;
    border: none;
    margin-right: 5px;
    stroke: #516675;
    stroke-width: 1.1px;
    fill: transparent;
}

.emp-btn-primary.es-deactivated {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff;
	cursor: default;
}

.emp-btn-primary.es-deactivated:hover {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff
}

.emp-btn-primary.es-deactivated:active {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff;
	box-shadow: none
}

#emp-portfolio-scale,
.emp-iframe-scale {transform-origin: top left}

.emp-portfolio-edit,
.emp-portfolio-id {
	width: 816px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 60px;
	overflow: hidden;
	border: 0.42px solid #B4C2CD;
	background-color: white;
	position: relative;
}

.emp-portfolio-edit.active,
.emp-portfolio-id.active {
	animation-name: portfolio-blink-bckg;
  	animation-duration: 0.8s;
    animation-iteration-count: 1;
	}
	
@keyframes portfolio-blink-bckg {
    0% {background-color: white}
   	50% {background-color: #d8eaff}
   	70% {background-color: #d8eaff}
    100% {background-color: white}
}	

.emp-portfolio-banner {
	position: absolute;
	top: 0;
	width: 100%;
	height: 22px;
	background-color: #001586;
	font-family: Roboto;
    font-size: 14px;
    line-height: 22px;
    text-align: center;
    color: white;
    font-weight: 500
}

#btn-new-search {
	position: absolute;
    left: Calc(50% - 428px);
    top: 30px;
}

/*//// BUTTONS /////*/


.hp-btn {
	padding-left: 25px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 13px;
	border-width: 1px;
	border-style: solid;
	border-radius: 100px;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;
	cursor: pointer;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-weight: 400;
	display: inline-block;
  -webkit-touch-callout: none; 
    -webkit-user-select: none; 
     -khtml-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none;	
}

.hp-btn-orange {
	border-color: #ee5e27;
	background-color: #ee5e27;
	color: #fff
}

.hp-btn-orange:hover {
	border-color: #d93c01;
	background-color: #d93c01;
	color: #fff
}

.hp-btn-orange:active {
	border-color: #d93c01;
	background-color: #d93c01;
	color: #fff;
	box-shadow: 0 0 0 2pt white
}

.hp-btn.hp-btn-deactivated {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff;
	cursor: default;
}

.hp-btn.hp-btn-deactivated:hover {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff
}

.hp-btn.hp-btn-deactivated:active {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff;
	box-shadow: none
}

.hp-btn.hp-btn-loading {
	border-color: #d8dee3;
	background: linear-gradient(#979797 0 0) 0/0% no-repeat   #d8dee3;
	color: #fff;
	cursor: default;
	animation: loading 15s infinite linear;
}
	
@keyframes loading {
    100% {	background: linear-gradient(#979797 0 0) 0/100% no-repeat   #d8dee3;}
}
	
/*////// ANIMATION ///////*/

.an-slide-holder {
	position: relative;
    overflow: hidden;
    height: 270px;
}


.an-slide {
	display:  flex;
    justify-content: space-evenly;
	position: absolute;
    width: 100%;
    top: 50%;
    transform: translateY(-50%);
	transition: all 0.2s linear;
}

.an-slide.an-before {
	transform: translate(100%, -50%)
}

.an-slide.an-after {
	transform: translate(-100%, -50%)
}

#an-slide-digital .an-image-flex {
	display: flex;
    width: 380px;
    flex-wrap: wrap;
}


.an-slide-left {
	position: relative;
	width: 380px	
}


.an-slide-right {
	position: relative
}


#an-header {
	top: 0px;
    width: 100%;
    height: 50px;
    z-index: 20;
    padding-top: 13px;
	background: linear-gradient(40deg, black 26%, #19233f 88%, #0a0a1e 150%);
}

.an-logo-container {
	width: 90%;
    justify-content: space-between;
    height: 42px;
	margin: auto
}

#an-logo, #an-logo img {
	height: 35px;

}


.an-backgrd {
	background-color: #F2F6FF;	
	height: 100vh;
	box-sizing: border-box;
	padding-bottom: 100px;
	position: relative;
		}

.an-container {
	width: 818px;
    margin: auto;
	background: white;
	border: 0.42px solid #B4C2CD;
	padding: 40px 30px 0px 30px;
	margin-top: 40px
}

.pcs-medal-loader-container {
    width: 50%;
    height: 20px;
    background-color: #e7f1ff;
    display: block;
    margin: 20px auto 15px auto;
    border-radius: 10px;
}

.pcs-medal-loader {
    width: 120px;
    height: 20px;
    background-color: #ffc800;
	background: linear-gradient(40deg, #f47927 26%, #d92626 88%, #da2725 150%);
    display: block;
    border-radius: 10px;
    animation: medal-animation 6000ms linear 1 forwards;
}

@keyframes medal-animation {
0% {width: 20px; }
100% {width: 100%}	
}

.an-input-container {
	    display: flex;
    margin: auto;
    position: relative;
    justify-content: center;
}


.an-title {
    font-family: Roboto, sans-serif;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    line-height: 38px;
    color: #25282B;
    display: block;
	text-align: center;
	margin-bottom: 30px
}

.an-input {
    font-family: Roboto, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 26px;
    color: #25282B;
    display: block;
}

.an-input-image,
.an-input-image-container {
	height: 100px;
    width: 100px;
	margin-right: 10px;
	position: relative
}

.an-input-image {
	opacity: 0; 
	transition: opacity linear 20ms;
	position: absolute;
	top: 0;
	left: 0
		
}


.an-input-image.an-selected {opacity: 1} 

.an-input-text-container {
	margin-top: 22px
}

.an-text {
	font-family: Roboto, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 24px;
    color: #25282B;
    display: block;
}

.an-subtitle {
	font-size: 16px;
	font-weight: 500
}

.an-disclaimer {
	text-align: center;
	margin-bottom: 40px;
	font-size: 18px
}

.an-result-row {
	padding: 8px 11px 7px 11px;
    box-sizing: border-box;
	border-top: 1px solid #B4C2CD;
    max-width: 100%;
	position: relative;
}

.an-result-row.an-selected {
	background: #F2F6FF
}

.an-result-row:last-child {
    border-bottom: 1px solid #B4C2CD;
}


.an-image-linkedin {
    width: 160px;
    height: 160px;
	border-radius: 20px;
    background: #d0eaff;
	margin-right: 40px
		
}

.an-image-container,
.an-text-container {
	position: absolute;
	top: 50%;
	transform: translateY(-50%)
}

.linkedin-icon {
	fill: #24549E;
	 width: 160px;
    height: 160px;
	position: absolute;
	fill: #d0eaff;
    stroke: #d0eaff;
    stroke-width: 0.5px;
	animation: linkedin-animation 1500ms linear forwards;
}

@keyframes linkedin-animation {
0% {fill: #d0eaff; stroke: #d0eaff }
10% {fill: #e7f1ff; stroke: #e7f1ff }
100% {fill: #24549E; stroke: #24549E}	
}

.linkedin-icon.delay2,
.bottom-img.delay2,
.top-img.delay2,
.img-glass.delay2 {
animation-delay: 200ms
}

.linkedin-icon.delay3,
.bottom-img.delay3,
.top-img.delay3,
.img-glass.delay3 {
animation-delay: 400ms
}

.linkedin-icon.delay4,
.bottom-img.delay4,
.top-img.delay4 {
animation-delay: 600ms
}

.an-account.delay1,
.an-logo-icon.delay1 {
animation-delay: 1500ms
}

.an-account.delay2,
.an-logo-icon.delay2 {
animation-delay: 1700ms
}

.an-account.delay3,
.an-logo-icon.delay3 {
animation-delay: 1900ms
}

.an-account.delay4,
.an-logo-icon.delay4 {
animation-delay: 2100ms
}

.screen-bckg.delay1, 
.screen-top.delay1 {
animation-delay: 3000ms
}

.screen-bckg.delay2, 
.screen-top.delay2 {
animation-delay: 3200ms
}

.screen-bckg.delay3, 
.screen-top.delay3 {
animation-delay: 3400ms
}

.screen-bckg.delay4, 
.screen-top.delay4 {
animation-delay: 3600ms
}

.an-slide-left {
	display: flex;
	width: 380px
}



.an-image-career {
	    display: inline-block;
    width: 180px;
    height: 160px;
}

.an-check-circle {
	position: absolute;
    top: 9px;
    right: 8px;
    border-radius: 100%;
    width: 24px;
    height: 24px;
	background: #dbe7f6
}

.an-checked .an-check-circle {
	background: linear-gradient(40deg, #f47927 26%, #d92626 88%, #da2725 150%);
}

.an-check-mark,
.an-cross {
	display: inline-block;
    position: absolute;
    top: 10px;
    right: 9px;
    width: 22px;
    height: 22px;
	fill: white;
    stroke: white;
    stroke-width: 1px;
}

.an-check-mark {display: none}

.an-checked .an-check-mark {
	display: inline-block;
}

.an-checked .an-cross {
	display: none;
}

.an-slide-right {
width: 30%
}



li.an-text {
	margin-bottom: 5px
}
ul {
  list-style-type: none; /* Hide default bullets */
}


ul li::before {
content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #25282B;
    /* border-radius: 100%; */
    margin-right: 10px;
}

/*////// SOCIAL MEDIA //////*/
.an-logo-icon {
	width: 20px;
    height: 20px;
    display: inline-block;
    vertical-align: middle;
    fill: #dfebff;
	animation: icon-animation 1500ms linear forwards;

}

@keyframes icon-animation {
0% {fill: #dfebff }
30% {fill: #64ace4 }
100% {fill: #24549E}	
}

.an-account {
	width: 20px;
    height: 20px;
    background: #d0eaff;
    background: #dfebff;
    padding: 6px;
    border-radius: 3px;
    margin-bottom: 3px;
	margin-right: 3px;
    text-align: left;
    display: inline-block;
	animation: social-animation 1500ms linear forwards;
}


@keyframes social-animation {
0% {background: #dfebff }
30% {background: #aadbff }
100% {background: #d0eaff}	
}

.img-career {
	width: 160px;
	height: 150px;
	position: absolute;
	transform: scale(1.1)
}

#img-career-background {fill: #d0eaff}

.bottom-img,
#img-handle {
	fill: #89939E;
	stroke: #89939E;

}

.bottom-img {
	animation: bottom-animation 1500ms linear forwards;
}

@keyframes bottom-animation {
0% {fill: #c7cdd5; stroke: #c7cdd5 }
10% {fill: #dee2e7; stroke: #dee2e7 }
100% {fill: #89939E; stroke: #89939E}	
}


.top-img {
	fill: #191c20;
	stroke: #191c20
}

#img-frame {
	fill: #191c20;
}

.top-img {
	animation: top-animation 1500ms linear forwards;
}

@keyframes top-animation {
0% {fill: #2d2d2d; stroke: #2d2d2d }
10% {fill: #595d62; stroke: #595d62 }
100% {fill: #191c20; stroke: #191c20}	
}



#img-button {
	fill: white
}

.img-glass {
	fill: #BEC4CB;
	animation: glass-animation 1500ms linear forwards;
}

@keyframes glass-animation {
0% {fill: #c7cdd5}
10% {fill: #ebeff5}
100% {fill: #BEC4CB}	
}

.an-image-flex {
	display: flex
}

.an-telecom-container,
.an-telecom-img,
.an-telecom-circle {
	width: 160px;
	height: 160px;
	position: relative
}

.an-telecom-container:first-child {
margin-right: 40px
}

.an-telecom-img,
.an-telecom-circle {
	position: absolute;
	top: 0;
	left: 0;
}


.an-telecom-circle {
border-spacing: 11px;
    border-radius: 100%;
    border: 2px dashed #23549d;
	animation: rotate 20s infinite linear;
}

@keyframes rotate {
0% {transform: rotate(0)}
100% {transform: rotate(360deg)}	
}

.screen-bckg,
.screen-top { fill: #dfebff; stroke: #dfebff}

.screen-img {
	width: 160px;
	height: 160px;
	position: absolute
}

.screen-bckg {
	fill: #d0eaff;
	stroke: #d0eaff;
	animation: screen-bckg-animation 1500ms linear forwards;
}

@keyframes screen-bckg-animation {
0% {fill: #dfebff; stroke: #dfebff }
10% {fill: #aadbff; stroke: #aadbff }
100% {fill: #d0eaff; stroke: #d0eaff}	
}

.screen-top {
	fill: #d0eaff;
	stroke: #d0eaff;
	animation: screen-top-animation 1500ms linear forwards;
}

@keyframes screen-top-animation {
0% {fill: #dfebff; stroke: #dfebff }
10% {fill: #f6faff; stroke: #f6faff }
/*10% {fill: #24549E; stroke: #24549E }	*/
100% {fill: #37c6f4; stroke: #37c6f4}	
}

.an-email-img {
	width: 100px;
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.an-circle-img {width: 100px; 	animation: rotate 20s infinite linear;}


.an-email-container {
	width: 350px;
    height: 160px;
    position: relative;
}

.email-bckg {
	width: 350px;
	height: 160px;
	position: absolute;
	animation: mosaic 1600ms infinite linear;
	fill: white;
	stroke: white;
	transform: scale(1)
}

@keyframes mosaic {
0% {fill: white;}
	50% {fill: #8bccff;}
/*50% {fill: #addbff;}*/

100% {fill: white;}
}



.email-bckg.delay2{
animation-delay: 400ms
}


.email-bckg.delay3{
animation-delay: 800ms
}


.email-bckg.delay4{
animation-delay: 1200ms
}

/*// MOBILE //*/

@media (max-width:880px) {
	
#an-logo, #an-logo img {
    height: 32px;
}
	
#an-header {
	height: 46px	
}
	
	.an-container {
    width: 100%;
    border: none;
    padding: 40px 0px 0px 0px;
}
	.an-backgrd {
		padding: 0
	}
	
	.an-result-row {
		width: 94vw;
		margin: auto
	}
	
	#an-search .an-backgrd {
		background: white
	} 
	
	.pcs-medal-loader-container {
	
	width: 80%
	}
	
	.an-input, .an-disclaimer {
		font-size: 16px
	}

	.an-text.an-disclaimer {
		width: 94vw;
    margin: 0 auto 30px auto;
    
	}
	
	.an-slide-right {
		display: none
	}
	
	.an-slide {
		transform: translateY(-50%) scale(0.8)
	}
	
	.an-slide.an-after {
    transform: translate(-110%, -50%);
}
	.an-slide-left {
		width: 100%
	}
	
	.an-slide-holder {
		height: 250px
	}
	
	.an-input-text-container {
		max-width: calc(100% - 140px);
		overflow: hidden
	}

}


/*///// SIGN IN /////*/

.an-SignIn-Wrapper {margin-top: 20vh}

.an-SignIn-Title, 
.an-subscribe-title {
	font-size: 32px;
    line-height: 38px;
    font-weight: bold;
    color: #25282B;
    position: relative;
    text-align: center;
    margin-bottom: 40px;
    font-family: Roboto, Arial;
}

.an-subscribe-title {
    margin-bottom: 15px;
	}
	
.path-loader {
	position: relative;
	display: none;
	width: 100%
}

.path-loader.show {
	display: block
}

.path {
  stroke-dasharray: 2200;
  stroke-dashoffset: 2000;
  animation: dash 10s linear infinite;
  opacity: 0;
  fill: none;
  stroke-width: 2
}

@media (max-width: 739px){
.path {stroke-width: 8}
.an-SignIn-Wrapper {margin-top: 10vh}

}
	
.path.path1 {
	stroke: #ee5f27;
	animation-delay: 0s
}

.path.path2 {
	stroke: #17203a;
	animation-delay: 1.4s
}

.path.path3 {
	stroke: #ff2e24;
	animation-delay: 2.8s
}


@keyframes dash {
    0% {opacity: 0; stroke-dashoffset: 2000;}
	10% {opacity: 1; stroke-dashoffset: 1600;}	
    100% {opacity: 1; stroke-dashoffset: -2000;}
}




/*//// SIGN-IN / SIGN-UP ///*/

.hp-Signin-header{
	margin:0; 
	width: 100vw; 
	height: 30px; 
	position: relative; 
	overflow: hidden;
}

.hp-SignInUp, .hp-SignIn-btn-container {
    width: 400px;
    margin: auto;
}

#hp-Signin-logo,
#hp-Signin-logo img {
	position: relative;
    width: 200px;
    display: block;
	margin: 30px auto 30px auto;
	transform: translateX(6px);
    cursor: pointer;	
}


.hp-Signup-title-container {
	position: relative;
	height: 38px;
	margin-bottom: 10px;
	display: flex;
    justify-content: center;
}


#hp-SignIn-Wrapper h1.hp-Signin-title,
#hp-ForgotPassword-Wrapper h1.hp-Signin-title,
#hp-ResetPassword-Wrapper h1.hp-Signin-title,
#hp-SignIn-Wrapper h1.hp-Signup-title {
    font-size: 32px;
    line-height: 38px;
	font-weight: bold;
	color: #25282B;
	position: relative;
	text-align: center;
	margin-bottom: 10px;
	font-family: Roboto, Arial;
}

.hp-Signup-title {
	position: absolute;
	opacity: 1;
}

.hp-Signin-portal-container{
	display: block;
	position: relative;
	text-align: center;
	margin: 0 auto 40px auto;
    height: 26px;
}

.hp-Signin-portal-text{
	display: inline-block;
    font-weight: 500;
    font-size: 14px;
    line-height: 26px;
    text-decoration: none;
    color: white;
	position: absolute;
	text-align: center;
	padding: 0 6px 0 6px;

}



#hp-Signin-js-portal,
#hp-Signin-em-portal,
#hp-Signin-staff-portal{
	transform: translate(-50%,30px);
	opacity: 0;
	z-index: 0;
	-webkit-transition: all 0.4s linear;
    -o-transition: all 0.4s linear;
    transition: all 0.4s linear;
}

.hp-SignIn-row{
	min-height: 36px;
    position: relative;
    align-items: center;
    margin-bottom: 11px;
}

form input[type="text"],
form input[type="password"]{
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    color: #666;
    background-color: #fff;
    position: relative;
    padding: 0 8px;
    font-size: 15px;
    line-height: 21px;
    font-weight: normal;
    border: 1px solid #B4C2CD;
    box-sizing: border-box;
    border-radius: 4px;
    cursor: text
}

form input[type="text"]:hover,
form input[type="password"]:hover {
  border-color: #ed5e27;
    -webkit-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
}

::placeholder,
:-ms-input-placeholder,
::-ms-input-placeholder { 
  color: #9bb0bf;
  opacity: 1;
  font-style: italic;	
}

.hp-form-input-box{
	width: 400px; 
	height: 40px;
}
	
.hp-show-password-row {
	height: 20px; 
	margin-bottom: 25px;
    display: flex;
	justify-content: space-between;}


.hp-show-password,
.hp-hint-password,
.hp-redirect-text,
.hp-redirect-link,
.hp-error-link {
	text-decoration: none;
	font-size: 15px;
	line-height: 20px;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
}



.hp-hint-password,
.hp-show-password {
    color: #ee5e27;
    font-weight: bold;
	cursor: pointer;
}

.hp-hint-password:hover,
.hp-show-password:hover {
	color: #d93c01;
	text-decoration: underline
}

.hp-error-link {
	color: #25282B;
    font-weight: bold;
	cursor: pointer;
	text-decoration: underline;	
}

.hp-signIn-btn{
	font-size: 17px;
    line-height: 21px;
    font-weight: 500;
	width: 100%;
	text-align: center
}

.hp-SignIn-redirect-container{
	text-align: center
}

.hp-redirect-text{color: #4d6575;}

.hp-redirect-link{
	color: #4d6475; 
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;}

.hp-redirect-link:hover,
.hp-error-link:hover {
	color: #d93c01; 
	text-decoration: none	
}

.hp-SignIn-btn-container{
	margin-bottom: 40px}


.hp-text-highlight {
	background-color: yellow;
    padding: 0 3px;
}



/*//// MOBILE SIGN-IN / SIGN-UP ///*/

@media (max-width: 739px){
	#hp-Signin-logo, #hp-Signin-logo img  {width: 180px}
	

	.hp-Signin-portal-container 
	{margin-bottom: 15px}

	.hp-form-input-box{
		width: 86vw;
		display: block;
		margin: auto
	}
	
	form input[type="text"]{margin: auto}
	
	.hp-SignInUp, .hp-SignIn-btn-container {width: 100vw}
	
	.hp-signIn-btn {
		display: block;
		width: 86%;
		margin: auto
	}
	
	.hp-show-password-row {
		width: 86vw;
		margin: 0 auto 25px auto
	}
	
	.hp-Signin-title,
	.hp-Signup-title {
		font-size: 26px;}
	
}

@media (max-width: 389px){
	.hp-hide-390px{
		display: none
	}}



/*/// SIGN-IN / SIGN-UP ERROR MESSAGES ///*/


form.hp-SignInUp span.error {
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 15px;
    line-height: 30px;
    color: #25282B;
    text-align: left;
    height: 30px;
    align-items: center;
    background-color: white;
    border-radius: 6px;
    border: solid 1px #808080;
    padding: 5px 4px 5px 40px;
    position: absolute;
    z-index: 1;
    top: 46px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 2px 2px 0 rgba(0, 0, 0, 0.2);
    background: #fff url('/resources/images/professional/dashboard/Icon_Warning.svg') no-repeat 5px 4px;
    background-size: 30px;
}

form.hp-SignInUp .hp-SignUp-class-code span.error {width: 224px;}
form.hp-SignInUp .query-type-container span.error {width: 128px;}
form.hp-SignInUp .hp-SignInUp-email span.error {width: 236px;}
form.hp-SignInUp .hp-SignInUp-email span.error.work-email {width: 255px;}
form.hp-SignInUp.hp-articleInput span.error {width: 130px;}

form.hp-SignInUp .hp-SignInUp-pswd span.error {width: 194px;}
form.hp-SignInUp .hp-SignUp-full span.error {width: 194px;}



form.hp-SignInUp span.error:before {
    content: '';
    display: block;  
    position: absolute;
    left: 20px;
    bottom: 100%;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-bottom-color: black;
}

form.hp-SignInUp span.error:after {
    content: '';
    display: block;  
    position: absolute;
    left: 21px;
    bottom: 100%;
    width: 0;
    height: 0;
    border: 9px solid transparent;
    border-bottom-color: white;
}

.hp-error-text{
  font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 16px;
  line-height: 30px;	
  color: #25282B;
  text-align: left;	
}

.hp-error-sign {width:30px; margin-right: 4px}

#hp-SignIn-wrongpswd0 {display: none}
body.wrongpswd #hp-SignIn-wrongpswd0 {display: block}

#hp-wrongpswd {display: none}
#hp-wrongpswd.show {display: block}

#hp-emailFound {display: none}
#hp-emailFound.show {display: block}

.hp-SignIn-error-box {
	display: block;
    width: 400px;
    margin: auto;
	color: #25282B;
	background-color: #fff8f8;
	border: 1px solid #ff9a9a;
    box-sizing: border-box;
    border-radius: 4px;	
	padding: 15px
}

.hp-SignIn-error-box,
.hp-reset-text{
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 15px;
	margin-bottom: 11px;
	line-height: 24px
}

.hp-reset-text {
	display: block;
    width: 400px;
    margin: 0 auto 11px auto;
	color: #25282B;
    box-sizing: border-box;
}

.hp-Signin-error-title{
	color:#fa2c2d;
	display: flex;
	line-height: 30px;
	margin-bottom: 10px;
	font-weight: 500;
    font-size: 16px;
}

.hp-Signin-error-text {
	margin-bottom: 10px
}


@media (max-width: 739px) {
.hp-SignIn-error-box,
.hp-reset-text {width: 86vw}
	}


/*/// SUBSCRIBE AFTER ANIMATION ///*/

#an-subscribe #an-header {margin-bottom: 60px;}
.an-subscribe-wrapper {
	display: flex;
    flex-direction: row;
    justify-content: center; 
    z-index: 10;
    position: relative;
}


.an-subscribe-panel {
	width: 50%;
	padding: 0 70px
}

.an-subscribe-panel.right-panel {
	border-left: 1px solid #B4C2CD;
	    border-left: 1px dashed #B4C2CD
}

.an-subscribe-subtitle {
	text-align: center;
    font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 22px;
    font-weight: normal;
    line-height: 30px;
    color: #4d6575;
    margin-bottom: 42px;
} 

.an-subscribe-subtitle.colored {
    color: #d93c01;
    font-weight: 600;
    margin: 0;
}

.an-subscribe-width, #an-subscribe .hp-SignInUp {width: 400px; margin: 0; margin-bottom: 60px}
.an-subscribe-margin30 {margin-bottom: 30px}

.an-subscribe-section-title {
    font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
    font-size: 20px;
    font-weight: bold;
    line-height: 24px;
    color: #25282B;
    margin: 10px 0
}


.an-subscribe-candidate {
	background: white;
	border: 1px solid #B4C2CD;
	border-radius: 4px;
	width: 400px;
	height: 140px;
	display: flex;
	padding: 20px;
	box-sizing: border-box;
	margin-bottom: 40px
}

.an-subscribe-avatar {
	width: 100px;
	height: 100px;
	border-radius: 100%;
	margin-right: 20px
}

.an-right-aligned {
	float: right
}

.an-avatar-text-parent {
	position: relative;
	width: 238px;
}

.an-avatar-text-child {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 238px;
}

.an-subscribe-input {
	font-family: Roboto, sans-serif;
    font-style: normal;
    font-weight: normal;
    font-size: 17px;
    line-height: 26px;
    color: #25282B;
    display: block;
    text-wrap: nowrap;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.an-subscribe-lock {position: relative;
    top: 60px;
    left: -15px;}

.an-subscribe-input.an-date {
	color: #4d6575;
    font-size: 15px;}


.an-pricing-card {
    background: #f9fbfe;
    border: 1px solid #B4C2CD;
    border-radius: 4px;
    width: 400px;
    padding: 20px;
    box-sizing: border-box;
    margin-bottom: 15px;
    position: relative
}


.mti-ribbon {
    padding: 2px 25px;
    position: absolute;    
    
    font-size: 18px;
    color: white;
    line-height: 24px;
    letter-spacing: 1PX;
    display: block;
    font-weight: 500;
    background: linear-gradient(40deg, #f47927 26%, #d92626 74%, #da2725 150%);
    cursor: default;
}

.ribbon--left {
    left: -8px;
}

.ribbon--top {
    top: 14px;
}

.ribbon--left:after {
    border-right: 8px solid #f47927;
    left: 0;
}

.ribbon--top:after {
    border-bottom: 8px solid transparent;
    top: 100%;
}

.mti-ribbon:after {
    content: "";
    display: block;
    height: 0px;
    position: absolute;
    width: 0;
}

.an-pricing-card.selected {
	border: 1.5px solid #ee5e27;
    background: #fff8f6;
    padding-top: 53px;
}

.an-pricing-card.selected .an-pricing-title {color: #d93c01}
.an-pricing-card.selected .an-pricing-subtitle {color: #23282b}
.an-pricing-card.selected .an-pricing-rate-row {
    color: #d93c01;
    font-weight: 500;
}

.an-pricing-card.selected .an-pricing-text {color: #25282B}




.an-pricing-title,
.an-pricing-subtitle,
.an-pricing-text,
.an-pricing-rate-row,
.an-pricing-dollar-value,
.an-pricing-due,
.an-subscribe-legal {
	font-weight: normal;
	font-style: normal;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
	color: #25282B
}
	
.an-pricing-title {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 15px;
    display: block;
    color: #1058aa;
}
.an-pricing-subtitle {
    font-size: 14px;
    color: #4d6575;
    line-height: 24px;
    letter-spacing: 1PX;
    display: block;
    font-weight: 600;   
}
.an-pricing-text {
    font-size: 15px;
    font-weight: 400;
    color: #4d6575;
    line-height: 24px;  
}
.an-pricing-rate-row {
    display: inline-block;
    line-height: 32px;
    font-size: 15px;
    color: #1058aa; 
    font-weight: 500
}

.an-pricing-dollar-value {
    font-size: 15px;
    font-weight: 500;
    color: #1058aa;
    display: inline-block;
}

.an-pricing-due {
    float: right;
    margin-top: 20px;
    color: #171f37;
    font-size: 26px;
    margin-right: 25px;
    font-weight: 500;
    background: #F2F6FF;
    padding: 2px;
}

.an-subscribe-legal {
	font-size: 15px;
    font-weight: 400;
    color: #4d6575;
    margin-bottom: 10px;
    line-height: 24px; 
}


#an-subscribe .emp-checkbox-checkmark {
	float: left;
	margin-right: 5px;
	margin-top: 2px;
}

@media ( max-width: 999px) {
	.an-mobile-hide {
	display: none}
	
	.an-mobile-display {
	display: block}
	
	.an-subscribe-wrapper {display: block}
	.an-subscribe-panel {width: 400px; margin: auto; padding: 0}
	.an-subscribe-panel.right-panel {border: none;}
	.an-subscribe-width, #an-subscribe .hp-SignInUp, .an-pricing-card {margin-bottom: 40px}
	
	#an-subscribe .an-backgrd {padding-bottom: 60px}
	
	.an-title, .an-SignIn-Title, .an-subscribe-title {font-size: 25px}
	.an-subscribe-subtitle, .an-subscribe-section-title {font-size: 18px}
}

@media (max-width: 739px) {
	.an-subscribe-panel,
	.an-pricing-card,
	.an-subscribe-width, #an-subscribe .hp-SignInUp,
	.an-subscribe-legal, #an-subscribe .emp-checkbox-container,
	#an-subscribe .hp-signIn-btn {width: 86vw;}
		
}


@media ( min-width: 1000px) {
	.an-mobile-hide {
	display: block}
	
	.an-mobile-display {
	display: none}
}

/*////// ((EMP)) CUSTOM CHECKBOX //////*/

.emp-checkbox-container {
  	display: block;
  	position: relative;
  	cursor: pointer;
  	-webkit-user-select: none;
  	-moz-user-select: none;
  	-ms-user-select: none;
  	user-select: none;
  	width: 400px;
  	margin-bottom: 30px
}



/* Hide the browser's default radio button */
.emp-checkbox-container input {
position: absolute;
    opacity: 0;
    width: 2px;
    right: 0;
    top: -50px;
}


.emp-checkbox-checkmark {
  	height: 16px;
  	width: 16px;
  	border-radius: 4px;
	border: 1px #B2C2CD solid;
	background-color: white
}

[type="checkbox"] {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	padding: 0
}

.emp-checkbox-container:active input ~ .emp-checkbox-checkmark {
  	border: 1px #2196F3 solid;
	box-shadow: 0 0 0 2px #C0D3F0;
}

/* When the checkbox is checked, add a blue background */
.emp-checkbox-container input:checked ~ .emp-checkbox-checkmark {
  	background-color: #2196F3;
	border: 1px #2196F3 solid	
}

/* Create the checkmark/indicator (hidden when not checked) */
.emp-checkbox-checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.emp-checkbox-container input:checked ~ .emp-checkbox-checkmark:after {
  display: block;
}

/* Style the checkmark/indicator */
.emp-checkbox-container .emp-checkbox-checkmark:after {
  	left: 6px;
  	top: 4px;
  	width: 3px;
  	height: 9px;
  	border: solid white;
  	border-width: 0 3px 3px 0;
  	-webkit-transform: rotate(42deg);
  	-ms-transform: rotate(42deg);
  	transform: rotate(42deg);
}


/*/// ERROR ///*/

#error-page {background-color: #F2F6FF}

#error-page .an-SignIn-Wrapper {margin-top: 10vh}

.hp-dogerror-text {
	font-family: Roboto;
    font-size: 21px;
    line-height: 26px;
    font-weight: normal;
    color: #718fa2;
    position: relative;
    text-align: center;
    width: 800px;
    max-width: 80%;
    margin: 0 auto 40px auto;
}

.hp-dogerror-img {
	max-width: 400px;
	margin: auto;
	width: 80%;
	display: block;
}

@media ( max-width: 739px) {
	.hp-dogerror-text {
	font-family: Roboto;
    font-size: 16px;
    line-height: 21px;
    width: 90%;
    max-width: 90%;}
}

    
.hp-BCPhoto-container {
    width: 400px;
    background-color: #f2f7ff;
    padding: 20px;
    box-sizing: border-box;
    margin: 20px auto 11px auto;
    display: flex;
}

.hp-authorization-code {
    text-decoration: none;
    font-size: 15px;
    font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.hp-authorization-code {
    line-height: 22px;
    color: #4d6575;
}
 

#hp-authorization-container.wrongcode.active {
    animation-name: es-error-blink-bckg;
    animation-duration: 1s;
    animation-iteration-count: 1;
}

#hp-authorization-container {
    display: none
} 


#hp-authorization-container.wrongcode {
    background-color: #ffebeb;
    display: block
} 


#hp-authorization-container.wrongcode .hp-authorization-code {
 color: #ff0000;
}


@keyframes es-error-blink-bckg {
    0% {background-color: #ffebeb}
    50% {background-color: #ffe0e0}
    100% {background-color: #ffebeb}
    }
    
@media ( max-width: 739px) {
	#hp-authorization-container{
	    width: 86vw;
}
}
	
	
/*/////// FACE ID VERIFICATION ///////*/
	
.main-container-parent {
	display: flex;
 	flex-direction: column;
 	justify-content: center;
  	align-items: center;
  	text-align: center;
  	min-height: 100vh;
  	height: 100vh;
  	position: relative
	}

.main-container-child {
	position: absolute;
	top: 10%
}

.welcomeLogoImage {
	display: inline-block;
	width: 100%;
	height: auto;
	text-align: center;
	margin-bottom: 20px
}

@media (max-width:739px){
.welcomeLogoImage {
	zoom: 0.8
	}}

	
.faceid-welcome-box {
	width: 400px;
        align-content: center;
        margin: auto;
        background-color: #F2F6FF;
        padding: 30px;
        box-sizing: border-box;
        margin-bottom: 15px;        
}

.faceid-welcome-text {
        font-size: 18px;
        font-family: Roboto, Arial;
        line-height: 28px;
        overflow: visible;
        text-align: center;
}	

.faceid-icon {
    width: 60px;
    height: 60px;
    display: inline-block;
    border: none;
    stroke: black;
    stroke-width: 1px;
    fill: transparent;
    stroke-width: 1.2px;
    fill: transparent;
    zoom: 2;
    margin-bottom: 10px;
}

.faceid-SignIn-row {
	margin-bottom: 15px
}

form .faceid-transparent.input[type="text"] {
	background-color: transparent;
}

form input[type="text"].faceid-transparent {
	background-color: transparent;
}

form input[type="text"].faceid-transparent:hover {
    background-color: #F8FAFE;
    -webkit-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
}

#faceid-login #js-full-name.faceid-error,
#faceid-login #js-phone.faceid-error,
#faceid-login #js-email.faceid-error,
#faceid-login #js-country-autocomplete.faceid-error {
	background-color: rgba(255, 0, 0, 0.1);
	color: red;
}

#faceid-login #js-full-name.faceid-error::placeholder,
#faceid-login #js-phone.faceid-error::placeholder,
#faceid-login #js-email.faceid-error::placeholder,
#faceid-login #js-country-autocomplete.faceid-error::placeholder {
	color: red !important;
	opacity: 1;
	font-style: normal;
}

#faceid-login #js-full-name.faceid-error::-webkit-input-placeholder,
#faceid-login #js-phone.faceid-error::-webkit-input-placeholder,
#faceid-login #js-email.faceid-error::-webkit-input-placeholder,
#faceid-login #js-country-autocomplete.faceid-error::-webkit-input-placeholder {
	color: red !important;
	opacity: 1;
	font-style: normal;
}

#faceid-login #js-full-name.faceid-error:-ms-input-placeholder,
#faceid-login #js-phone.faceid-error:-ms-input-placeholder,
#faceid-login #js-email.faceid-error:-ms-input-placeholder,
#faceid-login #js-country-autocomplete.faceid-error:-ms-input-placeholder {
	color: red !important;
	opacity: 1;
	font-style: normal;
}

#faceid-login #js-full-name.faceid-error::-ms-input-placeholder,
#faceid-login #js-phone.faceid-error::-ms-input-placeholder,
#faceid-login #js-email.faceid-error::-ms-input-placeholder,
#faceid-login #js-country-autocomplete.faceid-error::-ms-input-placeholder {
	color: red !important;
	opacity: 1;
	font-style: normal;
}


.btn-cst-color.deactivated,
.btn-cst-color.deactivated:hover,
.btn-cst-color.deactivated:active {
	border-color: #d8dee3;
	background-color: #d8dee3;
	color: #fff;
	cursor: default;
}

@media (max-width: 739px) {
    .faceid-welcome-box {
        width: 86vw;
    }
}

/*////////////// UI-MENU AUTOCOMPLETE //////////////*/

.ui-helper-hidden-accessible {
	display: none;
}

.ui-menu,
.ui-autocomplete.ui-menu {
	z-index: 200 !important;
	position: absolute;
	list-style: none;
	list-style-image: none;
	list-style-position: outside;
	box-sizing: border-box;
	display: block;
	margin: 0;
	margin-block: 0;
	margin-inline: 0;
	padding: 8px 0;
	padding-inline-start: 0;
	text-align: left;
	color: #1c252c;
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 0 0 1px rgb(77 101 117 / 10%), 0 3px 10px 0 rgb(77 101 117 / 20%);
	overflow-x: hidden;
	overflow-y: scroll;
	max-height: 240px;
	width: 400px !important;
	max-width: 86vw;
}

.ui-widget-content {
	background-color: #fff;
	color: #25282b;
}

.ui-widget,
.ui-menu-item a {
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif;
	font-size: 15px;
	line-height: 22px;
	color: #25282b;
}

.ui-autocomplete.ui-menu.ui-widget,
.ui-autocomplete.ui-menu.ui-widget-content,
.ui-autocomplete.ui-menu.ui-corner-all {
	border: none;
	background-image: none;
}

.ui-menu .ui-menu-item {
	clear: left;
	float: left;
}

.ui-autocomplete.ui-menu .ui-menu-item,
.ui-autocomplete.ui-menu li.ui-menu-item {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 100%;
}

.ui-autocomplete.ui-menu .ui-menu-item::marker,
.ui-autocomplete.ui-menu li.ui-menu-item::marker {
	content: "";
}

#faceid-login .ui-menu li::before,
#faceid-login .ui-menu li.ui-menu-item::before,
#faceid-login .ui-autocomplete.ui-menu li::before,
#faceid-login .ui-autocomplete.ui-menu li.ui-menu-item::before {
	content: none !important;
	display: none !important;
	width: 0 !important;
	height: 0 !important;
	margin-right: 0 !important;
	background-color: transparent !important;
}

.ui-menu .ui-menu-item a {
	box-sizing: border-box;
	display: block;
	width: 100%;
	padding: 4px 16px;
	font-weight: normal;
	text-decoration: none;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	cursor: pointer;
	outline: none;
	color: #25292c;
	background-color: transparent;
	font-family: Roboto, Arial, "Helvetica Neue", Helvetica, sans-serif !important;
	font-size: 15px;
	line-height: 26px;
}

.ui-menu .ui-menu-item a:hover {
	background: #e9effc;
	color: #25282b;
	margin: 0;
	text-decoration: none;
}

.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item.ui-state-focus,
.ui-menu .ui-menu-item:hover {
	font-weight: normal !important;
	background-image: none !important;
	text-shadow: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	color: #25292c !important;
	background-color: #e9effc !important;
	margin: 0 !important;
	border: none !important;
}

.ui-menu .ui-menu-item a:active,
.ui-menu .ui-menu-item:active {
	background: #1058aa !important;
	color: #fff !important;
}

.ui-menu .ui-menu-item a.selected,
.ui-menu .ui-menu-item a.selected:hover {
	background: #1058aa;
	color: #fff;
	margin: 0;
	text-decoration: none;
}

.ui-autocomplete.ui-menu::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 12px;
}

.ui-autocomplete.ui-menu::-webkit-scrollbar-thumb {
	border-radius: 4px;
	border: #A5D0E2 1px solid;
	background-color: #E7F6FC;
}

.ui-autocomplete.ui-menu::-webkit-scrollbar-thumb:hover,
.ui-autocomplete.ui-menu::-webkit-scrollbar-thumb:active {
	background-color: #c7efff;
}

@media (max-width: 739px) {
	.ui-autocomplete.ui-menu {
		width: 86vw !important;
	}
}