/* General rules and borders */
.qis_form {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;margin-bottom:20px;}
.qis_form.none {border:0 solid #FFF;padding: 0;}
.qis_form.plain {border:1px solid #415063;padding:10px;}
.qis_form.rounded {border:1px solid #415063;padding:10px;border-radius: 10px;}
.qis_form.shadow {border:1px solid #415063;padding:10px;margin:0 10px 20px 0;box-shadow: 5px 5px 5px #415063;}
.qis_form.roundshadow {border:1px solid #415063;padding:10px; margin:0 10px 20px 0;box-shadow: 5px 5px 5px #415063;border-radius: 10px;}

.range {
	margin-bottom: 2em;
}

input[type="range"]:focus + .qis .qis__handle {box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);}

.qis-slidercenter {margin: auto; display: inline-block; text-align:center; outline: 0; }

.qis_form .qis_label_tiny {
	position: relative;
}

.qis_form .qis_label_tiny * {
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
}

.qis_form .qis_label_tiny.qis_input_content input, .qis_form .qis_label_tiny.qis_input_content textarea {
	padding-top: 1em;
}

.qis_form .qis_label_tiny label {
	position: absolute;
	top: 2px;
	left: 0;
	margin: 6px;
	font-size: 1em;
}

.qis_form .qis_label_tiny.qis_input_content label {
	font-size: 0.6em;
}

.qis-register select, #calculators {
	
	background-color: white;
	font: inherit;

	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-appearance: none;
	-moz-appearance: none;
	
	background-image:
		url('img/qis-arrow-down.png'),
		url('img/qis-arrow-down.png'),
		linear-gradient(to right, #343848, #343848);
	background-position:
		calc(100% - 18px) calc(50%),
		calc(100% + 18px) calc(50%),
		calc(100% + 4px) 0;
	background-size:
		8px,
		8px,
		51px calc(100% + 1px);
		
	background-repeat: no-repeat;
	outline: 0;
}

/* Slider outputs */
.qis_slideroutputs {
	display: flex;
	justify-content: space-between;
}
.qis_slideroutputs .column {
	flex-grow: 1;
}
.qis_slideroutputs .left {text-align: left;}
.qis_slideroutputs .center {text-align: center;}
.qis_slideroutputs .right {text-align: right;}

.qis_buttons {display:grid;grid-template-columns:4% 92% 4%;grid-column-gap: 0;position: relative;}
.qis_buttons div.plus {text-align: right;}
.circle-control svg {fill: #0041ff;cursor: pointer;}

/* Sliders */
.qis,
.qis__fill,
input[type=range] {
	background: #e6e6e6;display: block;
	box-sizing: border-box;
	border-radius: 3px;
}

.qis {
	position: relative;
	height: 6px;
	width: 100%;
}

.qis--disabled {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40);
	opacity: 0.4;
}

.qis__fill {
	height: 6px;
	width: 100%;
	background: #0041ff;
	position: absolute;
	top: 0;
}

.qis__handle {
	background: #fff;
	cursor: pointer;
	display: inline-block;
	border: 2px solid #0041ff;
	width: 21px;
	height:21px;
	position: absolute;
	top: -9px;
	border-radius: 50%;
	box-sizing: content-box !important;
}

.range {margin-bottom: 2em;}
input[type="range"]:focus + .qis .qis__handle {box-shadow: 0 0 8px rgba(255, 0, 255, 0.9);}

.qis-register select::-ms-expand, #calculators::-ms-expand {
	display: none;
}

.rangeslider__value-bubble {
  border: 1px solid #3D9BE9;
  display: block;
  padding: 2px;
  position: absolute;
  bottom: 150%;
  margin-bottom: 16px;
  width: 100px;
  left: 50%;
  margin-left: -50px;
  text-align: center;
  background-color: #FFF;
  border-radius: 5px;
}

/* Outputs */
.qis-repayments {margin-bottom: 1em;}
.qis-total {margin-bottom: 1em;}

.qis-sections:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
div.second_container {display:none !important;}

/* H2 Toggle */
.toggle-qis a {font-family: inherit;font-size: inherit;height:auto;border:1px solid #415063;width: 100%;box-sizing: border-box;line-height:normal;margin: 2px 0 3px 0;padding: 6px;border-radius:5px;text-align: center;margin-top:18px;}
.toggle-qis a, .qis-register .submit {display:block; background: #343838;text-align: center;cursor: pointer;color:#FFFFFF;}
.toggle-qis a:link, .toggle-qis a:visited, .toggle-qis a:hover {color:#FFF;text-decoration:none !important;}

/* H2 Toggle */
.qis-apply a {font-family: inherit;font-size: inherit;height:auto;border:1px solid #415063;width: 100%;box-sizing: border-box;line-height:normal;margin: 2px 0 3px 0;padding: 6px;border-radius:5px;text-align: center;margin-top:18px;}
.qis-apply a, .qis-register .submit {display:block; background: #343838;text-align: center;cursor: pointer;color:#FFFFFF;}
.qis-apply a:link, .qis-apply a:visited, .qis-apply a:hover {color:#FFF;text-decoration:none !important;}

.qis-slidercenter input.output { width: 100%; text-align: center; }

/* Application Form */
.qis-register input[type=text], .qis-register input[type=email], .qis-register input[type=tel], .qis-register textarea, .qis-register select, .qis-register .submit {margin: 5px 0 7px 0;padding: 8px;color: #465069;font-family: inherit;font-size: inherit;height:auto;border:1px solid #415063;width: 100%;box-sizing: border-box;line-height:normal;margin: 2px 0 3px 0;padding: 6px;}
.qis-register {text-align: left;margin: 10px 0 10px 0;padding: 0; max-width:280px;overflow: hidden;box-sizing: border-box;}
#calculators { margin: 5px 0 7px 0;padding: 8px;color: #465069;font-family: inherit;font-size: inherit;height:auto;border:1px solid #415063;width: 100%;box-sizing: border-box;line-height:normal;margin: 2px 0 3px 0;padding: 6px;}
.qis-rightregister {margin: 0px 0px 10px 0;}
.qis-register form, .qis-register p {margin: 0;padding: 0;}
.qis-register p {margin: 4px 0;}
.qis-register input[type=text] .required, .qis-register input[type=tel] .required, .qis-register textarea .required {border:1px solid green;}
.qis-register #submit {color: #FFF;background: #343838;text-align: center;cursor: pointer;}
.qis-register .hidden { display: none }
.qis-register .shown { display: block }
.qis-register .validator {margin-left: -999px;height:0;}
.qis-register span.step {background-color: #CCC;padding:6px;margin-right: 6px}
.qis-register span.step.highlight {background-color: lime;}
.qis-error-message {color:red;}

/* Application Form Part Two */

.applicationform input[type=text], .applicationform textarea, .applicationform select, .applicationform .submit {margin: 5px 0 7px 0;padding: 4px;color: #343848;font-family: inherit;font-size: inherit;height:auto;border:3px solid #888888;width: 100%;box-sizing: border-box;}
.entry .applicationform p, .applicationform span {margin: 4px 0;}
.applicationform input[type=text]:focus, .applicationform textarea:focus, .applicationform select:focus{border: 3px solid #1A82C7 !important;background-color:cornsilk;}
.applicationform .required {border:3px solid green !important;}
.applicationform fieldset {background:#EEEEEE;margin-bottom:20px;}
.applicationform fieldset h2 {background: #1A82C7;color:#FFF;padding:8px 30px;}
.applicationform fieldset p {padding: 6px 30px;}
.applicationform .submit {background: #1A82C7;color:#FFF;text-align: center;cursor: pointer;border:none;border-radius: 12px;}

.checklabel ul, .checklabel li { list-style: none; position: relative;}
.checklabel ul {padding: 0 !important; margin: 0 !important;  width: 100%;}
.checklabel li {float: right;text-align: left; padding: 5px 0 5px 20px;}
.checklabel li.label {float: left;color:#343848; padding-left: 0;}


.qis_checkbox {width: 20px;height: 20px;display: inline-block;position: relative;top: 3px;margin-right: 10px;}
.qis_checkbox input {visibility: hidden; position: absolute; }
.qis_checkbox label {width: 100%; height: 100%; display: block; border-radius: 3px; border: 1px solid #339966; position: relative; background-color: white; cursor: pointer; }
.qis_checkbox label::after {opacity: 0; border: 3px solid #339966; background: transparent; position: absolute; width: 9px; height: 5px; bottom: 7px; left: 5px; border-top: none; border-right: none; transform: rotate(-45deg);content: "";
}
.qis_checkbox label:hover::after {opacity: 0.5;}
.qis_checkbox input[type=checkbox]:checked + label:after {opacity: 1;}

.slider-label {font-size:1.2em;color:#888888;font-style: oblique;}

/* Waiting */

#filechecking {display:none;position: relative;top: 50%;left: 50%;}
.filecheckingcontent {left: -36px;position: relative;}

/* Tooltip */

.qis_tooltip_toggle { position: relative; display: block; float: right; padding-left: 10px;}
.qis_tooltip_toggle a { display: block; float: right; display: block; width: 30px; height: 30px; text-align: center; line-height: 30px; background-image: url(img/Info_icon.png);}
.qis_tooltip_body { display: none; position: absolute; top: 13px; right: 13px; width: 300px; height: auto; border: 3px solid #3D9BE9; z-index: 998; background-color: #343848; border-radius: 10px; color: white; padding: 10px;font-size: 80%;overflow:visible !important; }
.qis_tooltip_body .close {background-color: #FFF; border-radius: 50%; background-image: url(img/close.png); width:30px;height:30px;top:-15px;right: -15px;position: absolute;cursor: pointer; z-index:999; overflow:visible !important; }

/* Radio Buttons */

.checkradio ul, .checkradio li { list-style: none; position: relative;}
.checkradio ul {padding: 0 !important; margin: 0 !important;  width: 100%;}
.checkradio li {float: left;text-align: left; padding: 0 20px 10px 0;}
.checkradio li.label {float: left;color:#343848; padding-left: 0;}

.checkradio input[type=radio]:not(old){width: 2em;margin: 0;padding: 0;font-size: 1em;opacity: 0;}
.checkradio input[type=radio]:not(old) + label{display: inline-block;margin-left: -2em;line-height: 1.5em;}
.checkradio input[type=radio]:not(old) + label > span{display: inline-block;width: 1em;height: 1em;margin: 0.25em 0.5em 0.25em 0.25em;border: 3px solid #888;border-radius: 0.5em;background: #FFF;vertical-align: bottom;}
.checkradio input[type=radio]:not(old):checked + label > span{background: #888888;}

.registerradio ul, .registerradio li { list-style: none; position: relative;}
.registerradio ul {padding: 0 !important; margin: 0 !important;  width: 100%;}
.registerradio li {float: right;text-align: left; padding: 0 0 10px 20px;}
.registerradio li.label {float: left;color:#343848; padding-left: 0;}

.registerradio input[type=radio]:not(old){width: 2em;margin: 0;padding: 0;font-size: 1em;opacity: 0;}
.registerradio input[type=radio]:not(old) + label{display: inline-block;margin-left: -2em;line-height: 1.5em;}
.registerradio input[type=radio]:not(old) + label > span{display: inline-block;width: 1em;height: 1em;margin: 0.25em 0.5em 0.25em 0.25em;border:1px solid #415063;border-radius: 0.5em;background: #FFF;vertical-align: bottom;}
.registerradio input[type=radio]:not(old):checked + label > span{background: #888888;}

/*
	Graph
*/
.qisBarProgress1 {height: 100%;position: absolute;top: 0rem;left: 0rem;width: 25%;}
.qisBarProgress2 {height: 100%;position: absolute;top: 0rem;left: 25%;width: 25%;}
.qisBarProgress3 {height: 100%;position: absolute;top: 0rem;left: 50%;width: 25%;}
.qisBarProgress4 {height: 100%;position: absolute;top: 0rem;left: 75%;width: 25%;}
.qisBar {height: 18px;border: 1px solid #8a898a;position: relative;width: 100%;}
.qis_form p.legend span {display:inline-block;font-size: 1em;width:1em;height:1em;vertical-align: text-bottom;}


/* Email response */

div.emailresponse {border: 2px solid forestgreen; padding: 15px; color: forestgreen; margin:20px 0;}

/*
div.emailresponse  {
  -webkit-animation: seconds 1.0s forwards;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-delay: 3s;
  animation: seconds 1.0s forwards;
  animation-iteration-count: 1;
  animation-delay: 3s;
  position: relative;
}
@-webkit-keyframes seconds {
  0% {opacity: 1;}
  100% {opacity: 0;left: -9999px; }
}
@keyframes seconds {
  0% {opacity: 1;}
  100% {opacity: 0;left: -9999px; }
}
*/


/* NewButtons */
.output-pad		{ padding: 0 25px; line-height: 25px; min-height: 25px; position: relative; }
.circle-up:hover, .circle-down:hover { background-color: #e6e6e6; cursor: pointer; }
.circle-control {touch-action: none;}

/* Term Buttons */
.term-buttons { display: block; width: 100%;  

  -webkit-touch-callout: none; /* iOS Safari */
	-webkit-user-select: none; /* Safari */
	 -khtml-user-select: none; /* Konqueror HTML */
	   -moz-user-select: none; /* Firefox */
		-ms-user-select: none; /* Internet Explorer/Edge */
			user-select: none; /* Non-prefixed version, currently
								  supported by Chrome and Opera */
	background-color: #e6e6e6;
}
.termbutton { display: inline-block; text-align: center; height: 50px; line-height: 50px; cursor: pointer; 	border: 1px solid #FFF;}
.termbutton.selected { background-color: #369e71; }

@media only screen and (max-width: 700px) {
	.checklabel li { width: 50%; float: left;padding: 5px 0 5px 0;}
}


@media only screen and (max-width: 500px) {
	.checkradio li.label { display:none;}
	.qis_buttons {display:grid;grid-template-columns:8% 84% 8%;grid-column-gap: 0;position: relative;}
}