ul{list-style:none;padding:0;margin:0;}
body {background: #eeeeee;font-family:Open Sans,sans-serif;}
html {height: 100%;}

/*Login Page*/
.email_login_block{margin:10px;}
body .email_password_block .login_block .imgcontainer {margin: 0 0 0 0;}
.login_block { max-width: 400px; margin: 10% auto 0;padding: 30px;background:#ffffff;border-radius: 3px;}
.login_block .alert {margin-bottom: 5px;}
.login_block h2{text-align: center;}
.cmpy_logo{max-width: 150px;}
.login_sec_block button {margin: 0px 0 10px 0;width: 100%;}
.imgcontainer {text-align: center; margin: 10px 0 10px 0;}
span.psw {float: right;}
body .login_block .imgcontainer {text-align: left;margin: 0 0 20px 0;width: 100%;}
.login_block .imgcontainer h3 {margin-bottom: 3px;}

/*login email and password design*/
.login_block .placeholder {color: #aaaaaa;font-size: 13px;left: 25px;position: absolute;top: 5px;-webkit-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;z-index: 7;font-weight:normal;}
.login_block .placeholder_class.add_placeholder .placeholder {font-size: 12px;top: -15px;}
.login_block .placeholder_class.add_placeholder i.form-control-feedback {top: -20px;}
.add_placeholder input.form-control {border-bottom: 2px solid #2466b1}
.login_block .placeholder_class.has-feedback i.form-control-feedback{-webkit-transition: all 0.5s ease 0s;-moz-transition: all 0.5s ease 0s;-o-transition: all 0.5s ease 0s;transition: all 0.5s ease 0s;}
.login_block .placeholder_class.has-feedback .form-control {margin-bottom: 25px;}
.login_block .placeholder_class.has-feedback.pswd_formgroup .form-control {margin-bottom: 0;}
.login_block .has-feedback .form-control {padding-left: 25px;padding-right:12px;position: relative;z-index: 9;background:none;}
.login_block .has-feedback i.form-control-feedback {top: 0px;left:0px;line-height: 25px;height:25px;width:25px;text-align: left;}
.login_block .form-control {background:none;border-top:none;border-left:none;border-right:none;border-radius:0px;box-shadow:none;}
.email_id_block .custom_input.input-version2 {margin-bottom: 25px;height: 90px;}
.email_title_block {text-align: left;margin-bottom: 25px;}


/*Custom Input design*/
/* tympanus.net/codrops/2015/01/08/inspiration-text-input-effects/ */
.custom_input {position: relative;z-index: 1;display: inline-block;max-width: 350px;width: calc(100% - 0em);vertical-align: top;}
.custom_input label.error {color: #ff0000;display: block;font-size: 11px;}
.input_field-version2:focus, .input-filled .input_field-version2.error {border-color: #ff0000;}
.input_field {position: relative;display: block;float: right;padding: 0.8em;width: 60%;border: none;border-radius: 0;background: #f0f0f0;
	font-weight: 400;-webkit-appearance: none; /* for box shadows to show on iOS */}
.input_field:focus {outline: none;}
.input_label {display: inline-block;float: right;padding: 0 1em;width: 40%;color: #696969;-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.input_label-content {position: relative;display: block;padding: 1.6em 0;width: 100%;}
.input-version2 {padding-top: 1em;padding-bottom:0.8em;}
.input_field-version2 {width: 100%;padding: 0.8em 0 0.5em 0;background: transparent;border-bottom: 1px solid #b5b5b5;-webkit-transition: border-color 0.25s;
	transition: border-color 0.25s;}
.input_label-version2 {width: 100%;position: absolute;top: -10px;text-align: left;overflow: hidden;padding: 0;pointer-events: none;-webkit-transform: translate3d(0, 3em, 0);transform: translate3d(0, 3em, 0);}
.input_label-content-version2 {	padding: 0;	font-weight: 400;color: #b5b5b5;font-weight:normal;}
.input_label-content-version2::after {content: attr(data-content);position: absolute;top: -200%;left: 0;color: #2466b1;font-weight: normal;font-size: 11px;}
.input_field-version2:focus,.input-filled .input_field-version2 {border-color: #2466b1;}
.input_field-version2:focus + .input_label-version2,.input-filled .input_label-version2 {-webkit-animation: anim-chisato-1 0.25s forwards;animation: anim-chisato-1 0.25s forwards;}
.input_field-version2:focus + .input_label-version2 .input_label-content-version2,.input-filled .input_label-content-version2 {-webkit-animation: anim-chisato-2 0.25s forwards ease-in;animation: anim-chisato-2 0.25s forwards ease-in;top:5px;}

@-webkit-keyframes anim-chisato-1 {
	0%, 70% {
		-webkit-transform: translate3d(0, 3em, 0);
		transform: translate3d(0, 3em, 0);
	}
	71%, 100% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@-webkit-keyframes anim-chisato-2 {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	70%, 71% {
		-webkit-transform: translate3d(0, 125%, 0);
		transform: translate3d(0, 125%, 0);
		opacity: 0;
		-webkit-animation-timing-function: ease-out;
	}
	100% {
		color: transparent;
		-webkit-transform: translate3d(0, 200%, 0);
		transform: translate3d(0, 200%, 0);
	}
}

@keyframes anim-chisato-1 {
	0%, 70% {
		-webkit-transform: translate3d(0, 3em, 0);
		transform: translate3d(0, 3em, 0);
	}
	71%, 100% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}

@keyframes anim-chisato-2 {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
	70%, 71% {
		-webkit-transform: translate3d(0, 125%, 0);
		transform: translate3d(0, 125%, 0);
		opacity: 0;
		-webkit-animation-timing-function: ease-out;
	}
	100% {
		color: transparent;
		-webkit-transform: translate3d(0, 200%, 0);
		transform: translate3d(0, 200%, 0);
	}
}
/*Custom Input design-end*/
.email_next .btn { border-radius: 3px; background-color: #2466b1; border: none; color: #FFFFFF; text-align: center;  font-size: 11px;padding:7px 10px; width: 65px; transition: all 0.5s; cursor: pointer; margin: 7px 0 0px 10px;text-transform:uppercase;font-weight:bold;float:right;}
.email_next .btn.bck_user_btn {width: 150px;}
.email_next .btn.bck_user_btn span { cursor: pointer; display: inline-block;position: relative;transition: 0.5s;}
.email_next .btn.nxt_login_btn span { cursor: pointer; display: inline-block;position: relative;transition: 0.5s;}
.email_next .btn.nxt_login_btn span:after {content: '\f101';font-family:FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit;position: absolute;opacity: 0;top: 0;right: -20px; transition: 0.5s;}
/* .email_next .btn.bck_user_btn span:before {content: '\f100';font-family:FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit;position: absolute;opacity: 0;top: 0;left: -20px; transition: 0.5s;}
.email_next .btn.bck_user_btn:hover span, .email_next .btn.bck_user_btn:active span, .email_next .btn.bck_user_btn:focus span {padding-left: 20px;}
.email_next .btn.bck_user_btn:hover span:before, .email_next .btn.bck_user_btn:active span:before, .email_next .btn.bck_user_btn:focus span:before { opacity: 1; left: 0;} */
.email_next .btn.nxt_login_btn:hover span, .email_next .btn.nxt_login_btn:active span, .email_next .btn.nxt_login_btn:focus span {padding-right: 20px;}
.email_next .btn.nxt_login_btn:hover span:after, .email_next .btn.nxt_login_btn:active span:after, .email_next .btn.nxt_login_btn:focus span:after { opacity: 1; right: 0;}

.cmpy_email_login .btn { border-radius: 3px; background-color: #2466b1; border: none; color: #FFFFFF; text-align: center;  font-size: 14px;padding:7px 10px; width: 90px; transition: all 0.5s; cursor: pointer; margin: 5px 0;text-transform:uppercase;font-weight:bold;}
.cmpy_email_login .btn span { cursor: pointer; display: inline-block;position: relative;transition: 0.5s;}
.cmpy_email_login .btn span:after {content: '\f101';font-family:FontAwesome;font-style: normal;font-weight: normal;position: absolute;opacity: 0;top: 0;right: -20px; transition: 0.5s;}
.cmpy_email_login .btn:hover span, .cmpy_email_login .btn:active span, .cmpy_email_login .btn:focus span {padding-right: 20px;}
.cmpy_email_login .btn:hover span:after, .cmpy_email_login .btn:active span:after, .cmpy_email_login .btn:focus span:after { opacity: 1; right: 0;}

/*Login with email*/
.email_next {float:right;}
.forgot_pwd {float: left;margin: 10px 0;}
.forgot_pwd a {color: #4285f4;text-decoration: none;font-size: 11px;}


/*Company Login*/
.powered_by {position: absolute;bottom: 10px;right: 10px;}
/* .powered_by_brand {background: rgba(255,255,255,0.85);padding: 10px;border-radius: 5px;} */
.powered_by .cmpy_logo {max-width: 100px;}
.overlay_powered_by {height: 100%;width: 100%;position: absolute;left: 0;right: 0;top: 0;bottom: 0;z-index: -1;
background: rgba(0,0,0,1);
background: -moz-linear-gradient(-45deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 75%, rgba(255,255,255,0.33) 100%);
background: -webkit-gradient(left top, right bottom, color-stop(0%, rgba(0,0,0,1)), color-stop(75%, rgba(0,0,0,0.5)), color-stop(100%, rgba(255,255,255,0.33)));
background: -webkit-linear-gradient(-45deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 75%, rgba(255,255,255,0.33) 100%);
background: -o-linear-gradient(-45deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 75%, rgba(255,255,255,0.33) 100%);
background: -ms-linear-gradient(-45deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 75%, rgba(255,255,255,0.33) 100%);
background: linear-gradient(135deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.5) 75%, rgba(255,255,255,0.33) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#ffffff', GradientType=1 );
}
.email_login_block .imgcontainer .client_logo_img{height: 50px;vertical-align: middle;display: table-cell;margin: 0 auto;text-align: left;width: 100%;}
.email_login_block .imgcontainer {text-align: center;margin: 0 auto;float: none;display: table;}
.client_logo_img .client_logo {max-height: 75px;border: 1px solid #f0f0f0;height: 100%;width: 100%;object-fit: contain;padding: 2px;}
.client_logo_img .selected {position: relative;}
.client_logo_img .selected .client_logo {border: 1px solid #2466b1;}
.client_logo_img .selected:before {content: "\f058";font-family: FontAwesome;font-style: normal;font-weight: normal;text-decoration: inherit;color: #00BF00;
    font-size: 16px;position: absolute;top: -15px;left: 3px;}
.client_logo_img li {float: left;width: 30%;text-align: center;margin-right: 5px;height: 50px;margin-bottom: 5px;}
/* .client_logo_img li a {display: table;padding: 0px;text-align: center;width: 100%;} */
.client_logo_img li a {text-decoration:none;}
.cmpy_email_login{text-align:right;}
.powered_by span {display: block;text-align: center;font-size: 9px;}
.back_btn {margin-top: 10px;text-align:center;}
.back_btn .back_icon{text-decoration:none;color: #333333;}
.back_btn .back_icon:hover{color: #2466b1;}
/* .back_btn .back_icon { cursor: pointer; display: inline-block;position: relative;transition: 0.5s;}
.back_btn .back_icon:before {content: '\f060';font-family:FontAwesome;font-style: normal;font-weight: normal;position: absolute;opacity: 0;top: 0;left: -20px; transition: 0.5s;}
.back_btn:hover .back_icon, .back_btn:active .back_icon, .back_btn:focus .back_icon {padding-left: 20px;}
.back_btn:hover .back_icon:before, .back_btn:active .back_icon:before, .back_btn:focus .back_icon:before { opacity: 1; left: 0;} */

/*Alert - Notify*/
body .ui-pnotify {top: 3px !important;left: 0 !important;right: 0 !important;margin: 0 auto;}
body .ui-pnotify-title {font-size: 12px;}
body .ui-pnotify-container {padding: 0.3em 1em;}

/* Responsive */
@media(max-width: 767px){
	.login_block {padding:15px;}
	.email_next .btn {width: 50px;}
	.email_next .btn.bck_user_btn {width: 140px;font-size: 10px;}
	.forgot_pwd a {font-size:10px;}
	.email_login_block {padding-bottom: 50px;}
	.powered_by {position: absolute;}
}

@media screen and (max-width: 300px) {
    span.psw {display: block; float: none;}
}