@charset "UTF-8";
/* CSS Document */

main .container .mirror.inner { max-width: 800px; }

/* tabbed panes */

	.tabbed-panes {
		width: 100%;
	}
	.tabbed-panes ul.control {
		display: grid;
		position: sticky;
		position: -webkit-sticky;
		top: 50px;
		background-color: beige;
		background-color: white;
		width: calc(100% + 60px);
		margin-left: -30px;
		grid-auto-flow:column;
		grid-template-columns: 1fr 1fr;
		gap:0;
		padding-bottom: 15px;
		padding-bottom: 0;
	}
	.tabbed-panes ul.control li {
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		border-bottom: 2px solid var(--color_border);
		font-size: 1.25rem;
		line-height: 1.2;
		align-content: center;
	}
	.tabbed-panes ul.control li a {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		text-align: center;
		padding-top: 20px;
		padding-bottom: 15px;
		min-height: 40px;
		min-height: 0;
	}
	.tabbed-panes ul.control li a i {
	}
	.tabbed-panes ul.control li a em {
	}
	.tabbed-panes ul.contents {
		width: 100%;
	}
	.tabbed-panes ul.contents li {
		width: 100%;
		padding-top: 30px;
	}
	
	
	
	/*	send progress */
	
	.form-element > .ff > i {
		display: block;
		position: relative;
		float: right;
		width:       25px;
		height:      25px;
		margin: 0 0 -25px 0;
		top: 5px;
		right: 5px;
		pointer-events: none;
		opacity: 0.25;
		overflow: hidden;
		background-image:url("../../images/progress/positive/spinner-3.svg");
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center;
		opacity: 0;
		animation: rotating 1.2s steps(16) infinite;
	}
	@keyframes rotating {
		from { transform: rotate(0deg); }
		to   { transform: rotate(360deg); }
	}
	form[name="password-reset"][data-progress="1"] .form-element[data-label="email"] > .ff > i {
		opacity: 1;
	}
	form[name="password-reset"] {
		position: relative;
		transition: all 0.3s ease;
	}
	form[name="password-reset"].fade-out { opacity:0; }
	form[name="password-reset"].fade-in  { opacity:1.0; }

	.conditional-contents {}
	.conditional-contents .conditional-content {
		display: none;
	}
	
	.conditional-contents .conditional-content p > i {
		display: block;
		position: relative;
		font-size:   25px;
		line-height: 25px;
		width:       25px;
		height:      25px;
		margin: 0 0 -25px 0;
	}
	.conditional-contents .conditional-content p > em {
		display: block;
		position: relative;
		margin: 0 0 0 35px;
		white-space: pre-line;
	}
	.conditional-contents[data-current="form"]              .conditional-content[data-template="form"],
	.conditional-contents[data-current="email-sent"]        .conditional-content[data-template="email-sent"],
	.conditional-contents[data-current="email-send-failed"] .conditional-content[data-template="email-send-failed"],
	.conditional-contents[data-current="email-not-found"]   .conditional-content[data-template="email-not-found"] { display: block }
	
	.conditional-contents[data-current="email-sent"]        .conditional-content[data-template="email-sent"]        > p > i:before { content:"\EBA1"; color: #0B910B; }
	.conditional-contents[data-current="email-send-failed"] .conditional-content[data-template="email-send-failed"] > p > i:before { content:"\EBCB"; color: #BF0000; }
	.conditional-contents[data-current="email-not-found"]   .conditional-content[data-template="email-not-found"  ] > p > i:before { content:"\EBCB"; color: #BF0000; }