@font-face {
  font-family: 'AlphaEcho';
  src: url('../webfonts/alphaecho.eot'); /* IE9 Compat Modes */
  src: url('../webfonts/alphaecho.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		url('../webfonts/alphaecho.woff2') format('woff2'), /* Modern Browsers */ 
		url('../webfonts/alphaecho.woff') format('woff'), /* Modern Browsers */
		url('../webfonts/alphaecho.ttf') format('truetype'), /* Safari, Android, iOS */
		url('../webfonts/alphaecho.svg') format('svg'); /* Legacy iOS */	
  font-weight: normal;
  font-style: normal;
}

body {
	margin:0;
	padding:0;
	overflow:hidden;
	background-color:#e9eaef;
	background-image: linear-gradient(155deg, #f1f2f7 0%, #e0e2e9 100%);
	background-attachment: fixed;
}

.background {
	width:600px;
	left:50%;
	margin-left:-300px;
	height:100%;
	background-color:#ffffff;
	position:fixed;
	box-shadow:0 0 16px rgba(0,0,0,0.18);
}

a {
	color: #1F3D89;
	text-decoration:none;
	font-weight:600;
	white-space: nowrap;
	background-color: #ece8e8;
    padding: 0.3em;
	line-height: 2.2em;
	border-radius:0.5em;
}

a:hover {
	background-color: #bdbdbd;
}


.emailcover {
	background-color:rgba(0, 0, 0, 0.3);
	position:fixed;
	top:0;
	left:0;
	z-index:9999;
	width:100%;
	height:100%;
	display:none;
}

.emailconnect {
	width:265px;
	left: calc(50% - 150px);
	top:40%;
	position:absolute;
	background-color:#ffffff;
	border-radius:0.5em;
	font-family:'Arial';
	font-size:0.8em;
	text-align:center;
	padding:1em;
}

.emailbutton {
	width:calc(100% - 1em);
	border-radius:0.5em;
	font-family:'Arial';
	background-color:#0094c0;
	color:#ffffff;
	padding:0.5em;
	margin-top:0.5em;
	cursor: pointer;
}

textarea {
	width: 100%;
    height: 4em;
	font-family:'Arial';
	font-size:0.8em;
	margin-top:0.5em;
	border-radius:0.5em;
}

input {
	width:100%;
    height: 2em;
	font-family:'Arial';
	font-size:0.8em;
	margin-top:0.5em;
	border-radius:0.5em;	
}

select {
	width:100%;
    height: 2em;
	font-family:'Arial';
	font-size:0.8em;
	margin-top:0.5em;
	border-radius:0.5em;
}

option {
	width:100%;
	font-family:'Arial';
}

.sb_stop {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
}

.slt_head_contain {
	position:fixed;
	height:4em;
	width:100%;
	background-color: #6F2E8D;
	z-index:999;
	top:0px;
}

.slt_header {
	height:2.5em;
	max-width:430px;
	background-color: #6F2E8D;
	position:relative;
	font-family:'AlphaEcho';
	font-size:0.8em;
	color:#ffffff;
	text-align:center;
	padding-top:1.5em;
	margin:auto;
	padding-left:5em;
	padding-right:5em;
}

.slt_logo {
	position:absolute;
	left: max(0.5rem, calc(50% - 300px + 0.5rem));
	top:50%;
	transform:translateY(-50%);
	z-index:1;
}

.slt_escape {
	display:flex;
	align-items:center;
	gap:0.45em;
	background-color: #007DA3;
	border-radius:1.4em;
	color:#ffffff;
	position:absolute;
	right: max(0.5rem, calc(50% - 300px + 0.5rem));
	top:50%;
	transform:translateY(-50%);
	padding:0.45em 0.9em;
	font-family:'AlphaEcho';
	font-size:0.8em;
	line-height:1;
	white-space:nowrap;
	cursor:pointer;
	box-shadow:0 1px 3px rgba(0,0,0,0.25);
}

.slt_escape:hover {
	background-color:#00647f;
}

.slt_title {
	font-weight:600;
	color:#238560;
	font-size:1em;
}

.slt_text {
	font-family: 'Arial';
	font-size: 0.85em;
	padding-top:1.5em;
	padding-bottom:1.5em;
}

.slt_next_holder {
	position:fixed;
	bottom:0.5em;
	left:0px;
	width:100%;
}

.slt_next {
	background-color:#007DA3;
	font-family: 'Arial';	
	font-size: 0.8em;
	color:#ffffff;
	border-radius:0.5em;
	text-align:center;
	width:calc(100% - 2em);
	-webkit-box-shadow: 0px 0px 0px 2px rgb(31,61, 137);
	-moz-box-shadow: 0px 0px 0px 2px rgb(31,61, 137);
	box-shadow: 0px 0px 0px 2px rgb(31,61, 137);	
	cursor:pointer;
	max-width:360px;
	margin:auto;
	position:relative;
	height:2em;
}

.slt_back {
	width:30%;
	position:absolute;
	left:0;
	border-right: 1px solid white; 
	padding-top:0.4em;
	padding-bottom:0.4em;
	border-top-left-radius: 0.5em;
	border-bottom-left-radius: 0.5em;
}

.slt_back:hover {
	background-color: #006584;
}

.slt_forward {
	width:calc(70% - 1px);
	position:absolute;
	right:0;
	padding-top:0.4em;
	padding-bottom:0.4em;
	border-top-right-radius: 0.5em;
	border-bottom-right-radius: 0.5em;	
}

.slt_forward:hover {
	background-color: #006584;
}

.slt_box {
	background-color:#299A6F;
	font-family: 'Arial';	
	font-size: 0.9em;
	color:#ffffff;
	border-radius:0.5em;
	padding:0.5em;
	margin:0.5em;
	text-align:center;
	width:calc(100% - 2em);
}

.slt_contain {
	max-width:600px;
	position:relative;
	margin:auto;
	background-color:#ffffff;
	margin-bottom:4em;
	margin-top:4em;
}

.slt_option {
	background-color:#35569f;
	font-family: 'Arial';	
	font-size: 1em;
	color:#ffffff;
	border-radius:0.5em;
	padding:0.5em;
	margin-bottom:0.5em;
	width:calc( 100% - 1em );
}

.slt_q_option {
    background-color: #35569f;
    font-family: 'Arial';
    font-size: 1em;
    color: #ffffff;
    border-radius: 0.5em;
    padding: 0.5em;
    padding-left: 2.5em;
	padding-right: 2.5em;
    margin-bottom: 1em;
	margin-top:-0.25em;
    width: calc(50% - 7em);
    margin-left: 1em;
    float: left;
}

.slt_option_select {
	background-color:#ffffff;
	width:1.3em;
	height:1.3em;
	border-radius:1.3em;
	margin-right:0.5em;
	float:left;
}

.slt_option_selected {
	background-color:#008753;
	width:1.2em;
	height:1.2em;
	border-radius:1.2em;
	position:absolute;
	margin-top:-0.05em;
	margin-left:-0.05em;
	display:none;
	border: white 0.1em solid;
}

.slt_slide_option_selected {
	background-color:#008753;
	color:#ffffff;
	width:1.2em;
	height:1.2em;
	border-radius:1em;
	position:absolute;
	margin-top:0.05em;
	margin-left:0.05em;
	margin-right:0.05em;
	display:none;
}

.slt_check {
	font-size:0.8em;
	padding-left:0.3em;
	padding-right:0.3em;
	padding-top:0.3em;
}

.slt_option_hint_group {
	width:100%;
	position:relative;
	border-radius:0.5em;
	background-color:#D3D3D3;
}

.slt_hint_button {
	background-color:#35569f;
	font-family: 'Arial';	
	font-size: 1em;
	color:#ffffff;
	border-radius:0.5em;
	padding:0.5em;
	margin-bottom:0.5em;
	width:calc(100% - 1em);
}

.slt_option_hint_button {
	background-color:#35569f;
	font-family: 'Arial';	
	font-size: 1em;
	color:#ffffff;
	border-radius:0.5em;
	padding:0.5em;
	margin-bottom:0.5em;
	width:calc( 100% - 1em );
}

.slt_option_hint_button_single {
	background-color:#35569f;
	font-family: 'Arial';	
	font-size: 1em;
	color:#ffffff;
	border-radius:0.5em;
	padding:0.5em;
	margin-bottom:0.5em;
	width:calc( 100% - 1em );
}

.slt_option_hint_slide {
	background-color:#D3D3D3;
	font-family: 'Arial';	
	font-size: 0.9em;
	color:#3a3a3a;	
	border-radius:0.5em;
	width:calc( 100% - 1em);
	padding:0.5em;
	display:none;
	margin-top:-0.5em;
	margin-bottom:0.5em;
	position:relative;
}

.slt_option_hint_toggle {
	color: #6f2e8d;
	padding:0.25em;
	background-color:#ffffff;
	border-radius:0.5em;
	width:0.9em;
	float:right;
	margin-left:0.5em;
	margin-top:-0.15em;
}

.slt_slide_option {
	padding:0.3em;
}

.slt_head_title {
    font-size: 1em;
    color: #ffffff;
}

.flip {
	transform: rotate(-180deg);
}

@media (min-width: 30em) {
	.slt_head_title{font-size:1.3em;margin-top:-0.1em;}
}

/* ---- Option row alignment: flex-centre the circle, label and toggle ---- */
.slt_option,
.slt_option_hint_button,
.slt_option_hint_button_single,
.slt_hint_button,
.slt_slide_option { display: flex; align-items: center; }

.slt_option_select { float: none; flex: 0 0 auto; position: relative; }

.slt_option > label,
.slt_option_hint_button > label,
.slt_option_hint_button_single > label,
.slt_hint_button > label,
.slt_slide_option > label { flex: 1 1 auto; min-width: 0; margin: 0; }

.slt_option_hint_toggle { float: none; flex: 0 0 auto; margin-top: 0; align-self: center; display: flex; align-items: center; justify-content: center; box-sizing: content-box; height: 1em; }


@media (min-width: 50em) {
	.slt_header {font-size:1.1em;width:30em;max-width:none;}
	.slt_head_contain {height:4.5em;}
	.slt_logo {left: calc(50% - 22rem + 0.5rem);}
	.slt_escape {top:50%; right: calc(50% - 22rem + 0.5rem);}
	.slt_contain {margin-top:4.5em;max-width:40rem;}
	.background {width:44rem;margin-left:-22rem;}
	.slt_head_title{font-size:1.4em;margin-top:-0.1em;}
}

@media (min-width: 75em) {
	.slt_header {font-size:1.2em;width:45em;max-width:none;}
	.slt_head_contain {height:5em;}
	.slt_logo {left: calc(50% - 22rem + 0.5rem);}
	.slt_escape {right: calc(50% - 22rem + 0.5rem);}
	.slt_contain {margin-top:5em;max-width:40rem;font-size:1.1em;}
	.background {width:44rem;margin-left:-22rem;}
	.slt_head_title{font-size:1.6em;margin-top:-0.2em;}
}

/* ---- Lightening pass: softer pills with a touch of depth and spacing ---- */
.slt_option, .slt_option_hint_button, .slt_option_hint_button_single, .slt_hint_button, .slt_q_option {
	box-shadow: 0 1px 2px rgba(0,0,0,0.10);
	margin-bottom: 0.6em;
}

/* ---- Narrow header: keep the title clear of the logo and Quick Exit ---- */
/* Instead of truncating, let a long title flow to (at most) two lines. */
@media (max-width: 42em) {
	.slt_header {
		padding-left: 4em;
		padding-right: 10em;
		padding-top: 0;
		height: 4em;
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
	.slt_head_title, .slt_head_title h1 {
		white-space: normal;
		overflow: hidden;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		line-height: 1.15;
	}
}