/***** ALTERNATIVE LOGIN *****/
.font-size-18 { font-size: 18px !important; }
.font-size-16 { font-size: 16px !important; }
.font-size-14 { font-size: 14px !important; }
.font-size-12 { font-size: 12px !important; }
@font-face {
	font-family: 'PeridotPE-Regular';
	src: url('../fonts/PeridotPE-Regular.woff') format('woff'),
		url('../fonts/PeridotPE-Regular.woff2') format('woff2'),
		url('../fonts/PeridotPE-Regular.ttf') format('truetype');
	font-weight: normal;
    font-style: normal;
}
@media (min-width: 600px) 
{
	#cosid-login-container{
		min-width:492px;
	}
}
#qr-link{
	font-weight: bold;
}
.login-container a {
	text-decoration: underline;
}

.powered-cosmote.text-center.padding-medium.padding-large.font-size-14{
 	margin-top:20px;
 }

.lightgray-bg {
	background-color: #f6f7f6;
}
.padding-container {
    padding: 20px 30px;
	font-family: PeridotPE-Regular;
}

main.login-wrapper {
	padding-bottom: 1rem;
}

.login-container {
	max-width: 494px;
	margin: auto;
	border: 1px solid #cdc9c9;
	box-shadow: 2px 2px 10px #ccc;
	background-color: #fff;
	color: #2e2e2e;
	font-size: 14px;
}
/*.login-container a {*/
/*	color: #007aa9;*/
/*	text-decoration: underline;*/
/*	cursor: pointer;*/
/*}*/
/*.login-container a#cosid_register{*/
/*	color:#0073a0;*/
/*}*/
/*.login-container a:hover, main.login-wrapper a:focus {*/
/*	color: #23527c;*/
/*	text-decoration: underline;*/
/*	outline: 0;*/
/*}*/
.login-container .btn-search-cancel {
	/* hide browser's clear button for password input */
    display: none !important;
}

.login-container .login-header {
	font-size: 16px;
	border-bottom: 1px solid #cbc9ca;
	text-align: center;
	max-height:115px;
	font-family: PeridotPE-Regular;
}
.login-container .login-footer {
	font-size: 16px;
	border-top: 1px solid #cbc9ca;
	text-align: center;
}
.login-container p {
	margin: 10px 0px;
}
.login-container label {
	display: inline-block;
	font-weight: normal;
    color: #212121;
    margin-bottom: 10px;
}

.login-container .qr-code {
    display: flex;
    align-items: center;
    padding-top: 30px;
}
.login-container .qr-code canvas {
	width: 115px;
	padding-right: 10px;
}
.login-container .qr-code p {
    font-size: 16px;
    padding: 0 10px;
    margin: 0px;
}
.login-container .qr-code .qr-expired {
	display: none;
}
.login-container #qr-code.qr-expired canvas {
	opacity: 0.2;
	display: block;
}

.login-container .separator {
    text-align: center;
    padding: 1rem 0;
    display: flex;
    justify-content: center;
    border: none;
    margin: 0px;
	font-family: PeridotPE-Regular;
}
.login-container .separator p {
	border-radius: 2px;
    border: 1px solid #e4e4e4;
    background-color: #f6f7f6;
    padding: .3rem 2rem;
    margin: 0px;
    min-width: max-content;
    width: 100%;
    font-size: 16px;
}

.login-container .separator-my-resp p {
    font-size: 14px;
    text-align: center;
    padding: .1rem 1rem;
    display:none;
	font-family: PeridotPE-Regular;
}
.login-container .separator:before, .login-container .separator:after {
    content: "";
    border-top: 1px solid #e4e4e4;
    padding-left: 30px;
    align-self: center;
}

.login-container .form-input-group {
	margin-bottom: 10px;
}
.login-container input.form-input {
	display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font: inherit;
    color: #555;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.login-container input.form-input:focus {
    border-color: #66afe9;
    -webkit-box-shadow: none;
    box-shadow: none;
	outline-offset: 2px;
	outline: #015782 2px solid; /* for visible focus*/
}
.login-container input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 50px #fff inset !important;
    -webkit-text-fill-color: #555;
}

.login-container .greeting {
	color: #0E8103;
    font-size: 14px;
    text-align: center;
}
.login-container div.input-icon-wrapper {
    position: relative;
    width: 100%;
}
.login-container div.input-icon-wrapper input {
	padding: 6px 40px 6px 12px;
}
.login-container div.input-icon-wrapper span.icon {
	position: absolute;
    bottom: 5px;
    right: 8px;
    width: 25px;
    height: 25px;
    cursor: pointer;
    display: none;
}
.login-container div.input-icon-wrapper.input-icon-wrapper--error input {
	border: 1px solid #A40D15;
}
.login-container div.input-icon-wrapper.input-icon-wrapper--error input:focus {
/*
    border-color: #843534;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px #ce8483;

 */
}
.login-container div.input-icon-wrapper.input-icon-wrapper--password-show span.icon {
	background: var(--password-hide-image-url) no-repeat;
	display: block;
}
.login-container div.input-icon-wrapper.input-icon-wrapper--password-hide span.icon {
	background: var(--password-show-image-url) no-repeat;
	display: block;
}
.login-container .error-message,
.login-container .cosid-error-message {
	color: #3d5265;
    font-size: 12px;
    margin-top: 5px;
    display: none;
}
.login-container div.input-icon-wrapper.input-icon-wrapper--error ~ .error-message,
.login-container div.input-icon-wrapper.input-icon-wrapper--error ~ .cosid-error-message {
	display: block;
}
.login-container .error-message span,
.login-container .cosid-error-message span {
    color: #A40D15;
}

.login-container .flex-columns {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}


.login-container .button-container {
	text-align: center;
	margin-bottom: 10px;
}
.login-container .button-success {
	color: #fff;
    background-color: #0E8103;
    border: 1px solid #0E8103;
    border-radius: 4px;
    cursor: pointer;
    width: 120px;
    height: 40px;
    padding: 6px 18px;
	font-weight: 700;
}
.login-container .button-success[disabled] {
	cursor: not-allowed;
	opacity: .65;
}
.login-container .button-success:active:focus,
.login-container .button-success:focus,
.login-container .button-success:hover {
	color: #fff;
	background-color: #0E8103;
    border: 1px solid #0E8103;
    outline: none;
	font-weight: 700;
}

#cosmoteid-info .login-subtitle {
	text-align: center;
    margin-bottom: 6px;
    font-size: 14px;
    font-weight: bold;
}
#cosmoteid-info ul {
	margin: 0px;
    padding: 0px;
    list-style: none;
}
#cosmoteid-info ul > li {
	padding: 14px 10px 14px 41px;
    margin: 0px 0px 1px 0px;
    display: flex;
    align-items: center;
    position: relative;
	font-family: PeridotPE-Regular;
}
#cosmoteid-info ul > li img {
	position: absolute;
    left: 0;
}

@media (max-width: 494px) {
	
	.login-container .separator-my-resp p {
	    display:block;
 	}
	.padding-container {
		padding: 10px 20px;
	}
	
	main.login-wrapper {
		border-top: 1px solid #cdc9c9;
	}
	
	.login-container {
	    border: 0px;
	}
	.login-container label {
		font-size: 12px;
	}
	.login-container .login-header,
	.login-container .login-footer,
	.login-container .greeting,
	.login-container .qr-code p,
	.login-container .separator p
	#cosmoteid-info .login-subtitle {
		font-size: 14px;
	}
	.login-container input.form-input,
	.login-container .flex-columns {
		font-size: 14px;
	}
	.login-container input.form-input {
		font-size: 16px;
	}

	.login-container .qr-code,
	.login-container .separator {
		display: none;
	}
	.login-container .qr-code {
		padding-top: 20px;
	}
	.login-container .separator:before, .login-container .separator:after {
		padding-left: 20px;
	}
	.login-container .greeting {
		margin-top: 10px;
	}
	.login-container .flex-columns {
		margin-bottom: 10px;
	}
}

/***** ALTERNATIVE LOGIN (3rd parties) *****/
.third-party .login-container {
	color: #3d5265;
}
.third-party .login-container .button-success
{
	background-color: #3d5265;
	border-color: #3d5265;
	font-weight: 700;
}

.third-party .login-container .button-success:hover{
	background-color: #0D4D87 !important;
	border-color: #0D4D87!important;
}

.third-party .login-container .button-success:active{
	background-color: #223446!important;
	border-color: #223446!important;
}
.third-party .login-container .button-success:focus{
	background-color: #223446!important;
	border-color: #223446!important;
	outline-offset: 2px ;
	outline: solid 2px #223446!important;
}
	/* Third-party styling */
.third-party .login-container .button-success:disabled{
	background-color: #5f5f5f!important;
	border-color: #5f5f5f!important;
	outline-color: #5f5f5f!important;
}

.third-party .login-container .button-success.disabled{
	background-color: #5f5f5f!important;
	border-color: #5f5f5f!important;
	outline-color: #5f5f5f!important;
}

.third-party .login-container .greeting {
	color: #3d5265;
}

/***** ALTERNATIVE LOGIN WIDGET *****/
#cosid_dropdown.dropdown-menu {
	max-width: 320px;
    right: 20px;
    margin-top: 10px;
}
#cosid_dropdown.dropdown-menu:after {
	border-bottom-color: #f6f7f6;
}

/* Append Media Queries */
#cosid_dropdown .login-container {
    border: 0px;
}
#cosid_dropdown .login-container .padding-container {
	padding: 10px 20px;
}
#cosid_dropdown .login-container label {
	font-size: 12px;
}
#cosid_dropdown .login-container .login-header,
#cosid_dropdown .login-container .login-footer,
#cosid_dropdown .login-container .greeting,
#cosid_dropdown .login-container .qr-code p,
#cosid_dropdown .login-container .separator p
#cosid_dropdown #cosmoteid-info .login-subtitle {
	font-size: 14px;
}
#cosid_dropdown .login-container input.form-input,
#cosid_dropdown .login-container .flex-columns {
	font-size: 12px;
}
#cosid_dropdown .login-container .qr-code {
	padding-top: 20px;
}
#cosid_dropdown .login-container .separator:before,
#cosid_dropdown .login-container .separator:after {
	padding-left: 20px;
}
#cosid_dropdown .login-container .flex-columns {
	margin-bottom: 10px;
}

/* Styles for Loaders */
#cosid_dropdown .login-container .qr-code .qr-loader {
	background: var(--loader-qr-image-url) no-repeat;
    background-position: center;
    width: 100%;
    height: 100px;
    display: none;
}
#cosid_dropdown .login-container .qr-code.cosid_login-mask #qr-code,
#cosid_dropdown .login-container .qr-code.cosid_login-mask .qr-msg,
#cosid_dropdown .login-container .qr-code.cosid_login-mask .qr-expired {
	display: none;
}
#cosid_dropdown .login-container .qr-code.cosid_login-mask .qr-loader {
	display: block;
}
#cosid_dropdown .login-container .cosid_button_loader {
	background: var(--loader-btn-image-url) no-repeat;
	background-position: center;
	background-size: contain;
	width: 100%;
    height: 100%;
    vertical-align: middle;
    display: none;
}
#cosid_dropdown .login-container .cosid_login-mask .cosid_button_loader {
    display: inline-block;
}
#cosid_dropdown .login-container .cosid_login-mask .cosid_button_text {
    display: none;
}

/*** Continue as div ****/
.cosid_continue_as_div {
	color: #333;
}
.cosid_continue_as_div p {
	margin: 0 0 10px;
	font-size: 14px;
}
.cosid_continue_as_div .logo-container {
	text-align: center;
	padding: 10px 5px;
}
.cosid_continue_as_div .cosid_logoimg {
	max-width: 100%;
}
.cosid_continue_as_div .login-label {
	border-bottom: 1px solid #ebebeb;
    color: #aeaeae;
    font-weight: bold;
    text-align: center;
}
.cosid_continue_as_div .logged-in-info {
	margin: 0 20px;
}
.cosid_continue_as_div .logged-in-info p > span {
	font-weight: bold;
}
.cosid_continue_as_div .cosid_button-continue {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	white-space: nowrap;
	/*width: 100%;*/
	background: #0E8103;
    color: #fff;
    /*display: table;*/
    border-radius: 8px;
    padding: 5px;
    cursor: pointer;
}
.cosid_continue_as_div .button-logo {
	display: inline-block;
	vertical-align: middle;
}
.cosid_continue_as_div .button-text {
	display: inline-block;
	text-align: center;
	min-width: 185px;
	vertical-align: middle;
	overflow: hidden;
	text-overflow: ellipsis;
	padding-left: 5px;

}
.cosid_continue_as_div .relogin {
	text-align: center;
	padding: 1em 0;
}
.cosid_continue_as_div .relogin > a {
	display: block;
    color: #6d6e76;
    font-size: 14px;
    line-height: 1.1em;
    padding: 0 0 10px 0;
    text-decoration: underline;
    outline: none;
}
.third-party .cosid_continue_as_div .cosid_button-continue {
	 background-color: #3d5265;
	 border-color: #3d5265;
}
.loginDisable{
	background-color: #eee !important;
	opacity: 1 !important;
}