/*Copyright (c) 2019 Patrick Cool, MIT License*/
	.flare-gas,
	.natural-gas {
		margin-top: -55px;
		float: right;
	}
	select {
		margin-top: -5px;
	}
	.flare-gas {
		margin-right: 2px;
	}
	.natural-gas {
		margin-right: 190px;
	}
	.radio-button-tabs input[type="radio"]:checked+.fox-label  {
		background-color: #0032a0;
	}

	.ModalHMC {
		width: 885px;
	}
	.choose,
	.radio-button-tabs input[type="radio"]:checked+.fox-label {
		color: #fff;
		font-size: 16px;
		font-weight: 700;
		margin-bottom: 5px;
		margin-left: 10px;
		padding: 6px 12px;
		-moz-border-radius: 12px;
		-webkit-border-radius: 12px;
		border-radius: 12px;
		-moz-box-shadow: #ccc 0 1px 1px;
		-webkit-box-shadow: #ccc 0 1px 1px;
		box-shadow: #ccc 0 1px 1px;
	}
	.choose {
		display: block;
		margin-top: 10px;
	}
	.sched:not(.active) {
		display: none;
	}
	.btn-primary {
		background-color: #0038A8;
	}
	.btn-success{
		width: 100px;
	}
	.configure {
		margin: auto 0;
		min-height: 20px;
		padding: 19px;
		margin-bottom: 20px;
		background-color: #fff;
		border: 1px solid #e3e3e3;
		border-radius: 4px;
		-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
		box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
	}
	.app-space {
		height: 900px;
	}
	.config-label,
	.question {
		display: inline-block;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 13px;
		color: #3e5272;
	}
	.question {
		font-size: 18px;
		font-weight: 700;
	}
	.btn-app{
		background-color: #ffa400;
		color:#0032a0;
		font-weight: bold;
	}
	.config-head {
		font-weight: 700;
		text-transform: capitalize;
		color: #0032a0;
		text-align: center;
	}
	.config-section {
		border-bottom: 1px #DADADA solid;
		margin-top: .9%;
		height: 42.5px;
	}
	section:last-of-type {
		border-bottom: none;
	}
	.config-unit,
	.config-flow-unit,
	.config-unit-flow,
	.config-unit-temp {
		color: #0032a0;
		opacity: 1;
		width: 70px;
		font-weight: bold;
		 background-color: #fff;
	}
	#selectModel {
		margin: 0 auto;
		text-align: center;
		width: 800px;
	}
	.bgr-input {
		width: 200px;
	}
	.bg-input {
		width: 100px !important;
	}
	.md-input {
		width: 100px !important;
	}
	.sm-input {
		width: 60px !important;
	}
	.bgr-input,
	.bg-input,
	.md-input,
	.sm-input {
		margin-left: 5px;
		margin-bottom: 5px;
		height: 30px;
		padding: 6px 12px;
		font-size: 14px;
		line-height: 1.42857143;
		color: #555;
		background-image: none;
		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;
	}
	.HMCChoose {
		border: 2px solid #ffffff;
	}
	.modelChoose,
	.model {
		border: 2px solid #f5f5f5;
	}
	.model {
		width: 75px;
		height: 95px;
	}
	.HMCChoose:hover,
	.modelChoose:hover,
	.model:hover,
	.model-selected {
		border: 2px solid #ffa400;
		cursor: pointer;
	}
	#modalHelpMeChoose .modal-content{
		width:800px;
	}
	#mainOutput {
		margin: 20px;
	}
	.modal-body img {
		max-width: 100%;
		height: auto;
	}
	.radio-button-tabs .fox-label:hover  {
		opacity: 1;
		cursor: pointer;
	}
	.radio-button-tabs input[type="radio"] {
		display: none;
	}
	.radio-button-tabs input[type="radio"]:checked+.fox-label  {
		border: 1px solid #3e5272;
		-webkit-box-shadow: 0px 0px 9px #3e5272;
		-moz-box-shadow: 0px 0px 9px #3e5272;
		-ms-box-shadow: 0px 0px 9px #3e5272;
		-o-box-shadow: 0px 0px 9px #3e5272;
		box-shadow: 0px 0px 9px #3e5272;
	}
	.radio-button-tabs .fox-label  {
		background-color: #eee;
		border: 1px solid #ddd;
		color: #999;
		display: inline-block;
		font-family: inherit;
		font-size: 16px;
		margin-bottom: 5px;
		margin-left: 10px;
		padding: 6px 12px;
		-moz-border-radius: 12px;
		-webkit-border-radius: 12px;
		border-radius: 12px;
		-moz-box-shadow: #ccc 0 1px 1px;
		-webkit-box-shadow: #ccc 0 1px 1px;
		box-shadow: #ccc 0 1px 1px;
	}
	.config-h1 {
		margin-top: 3%;
	}
	.config-calculation {
		background-color: #f8f8f8;
		border: 1px solid #e3e3e3;
		padding: 3px;
		color: green;
		font-weight: 700;
		width: 100px;
	}
	.config-model {
		background-color: #f8f8f8;
		border: 1px solid #e3e3e3;
		padding: 3px;
		color: #0032a0;
		font-weight: 700;
		width: 200px;
	}
	#modelCode {
		background-color: #f8f8f8;
		border: none;
	}
	.failure-percent,
	.failure-gas,
	.failed {
		font-weight: bolder;
		font-family: tahoma;
		font-size: 14px;
		color: #a94442;
	}
	.failure-gas,
	.failure-percent {
		display: inline-block;
	}
	.failure-gas {
		width: 230px;
	}
	.failure-percent {
		width: 400px;
	}
	.modal-mix-padding{
		padding-bottom: 50px;
	}
	.answers {
		display: block;
		margin: 10px;
	}
	.incomplete {
		border: solid red 2px;
		-webkit-animation: glow 1.5s ease-in-out infinite alternate;
		-moz-animation: glow 1.5s ease-in-out infinite alternate;
		animation: glow 1.5s ease-in-out infinite alternate;
	}
	.glyphicon-question-sign {
		cursor: pointer;
	}
	.col-inline {
		width: 230px;
		display: inline-block;
		padding: 5px 15px;
		margin: 0px 15px 5px 30px;
		border: 2px #3e5272 solid;
	}
	.col-lg-10 {
		width: 115.333333%;
	}
	.col-lg-push-1 {
		left: -3.566667%;
	}
	.popover-title {
		font-size: 12px;
	}
	.popover {
		font-size: 12px;
		max-width: 180px;
	}
	.slider {
		margin-top: 20px;
		margin-left: 10px;
		margin-bottom: 20px;
		width: 450px;
	}
	  .noUi-handle {
		background-color: #fff;
		border: 1px solid #3e5272;
		color: #3e5272;
		cursor: grab;
	  }
	  .noUi-handle:after,
	  .noUi-handle:before {
		background-color: #333;
	  }
	  .noUi-connect {
		background-color: #0032a0;
	  }
	  .noUi-state-tap {
		background-color: rgb(255, 252, 238);
	  }
	  .noUi-tooltip {
		display: none;
	  }
	  .noUi-active .noUi-tooltip {
		display: block;
	  }
	  .noUi-marker-horizontal.noUi-marker-large {
		  height: 5px;
	  }
	 
	  hr{
		margin-top: 15px;
		margin-bottom: 15px;
	  }
	  .input-group .form-control {
		z-index: 0;
	  }
	  .btn-image{
		  width: 325px;
	  }
	@-webkit-keyframes glow {
		from {
			box-shadow: 0 0 10px red, 0 0 20px red, 0 0 30px red;
		}
		to {
			box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff;
		}
	}
	/*glow for mozilla*/
	@-moz-keyframes glow {
		from {
			box-shadow: 0 0 10px red, 0 0 20px red, 0 0 30px red;
		}
		to {
			box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff;
		}
	}
	@keyframes glow {
		from {
			box-shadow: 0 0 10px red, 0 0 20px red, 0 0 30px red;
		}
		to {
			box-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff;
		}
	}
	/*Media*/
	@media screen and (max-width: 1028px) {
		.configure {
			margin: 2% 10%;
		}
	}
	@media(max-width:992px) {
		#selectModel {
			text-align: left;
		}
		.config-head {
			text-align: left;
			margin-left: 20%;
		}
	}
	@media screen and (max-width: 768px) {
		.configure {
			margin: 2% 1%;
		}
		.config-section {
			height: 60px;
		}
		.model {
			height: 75px;
			width: 75px;
		}
		#selectModel {
			width: 400px;
		}
		.sm-input, .md-input, .bg-input {
			width: 100% !important;
		}
	}

/* ==========================================================================
   Help Me Choose v2 (markup and behavior: configure/js/hmc.js)
   Every selector in this block starts with #modalHelpMeChoose, so nothing here
   can affect other modals, the configurator itself, or the rest of the website.
   Brand tokens (--fox-blue, --fox-blue-dark, --fox-gold) come from css/fox-styles.css.
   ========================================================================== */

/* Dialog shell */
#modalHelpMeChoose .modal-dialog { width: 800px; max-width: calc(100% - 20px); margin-top: 20px; margin-bottom: 20px; }
/* The dialog never grows past the viewport: header and footer stay pinned and only the body scrolls */
#modalHelpMeChoose .modal-content { display: flex; flex-direction: column; width: auto; max-height: calc(100vh - 40px); max-height: calc(100dvh - 40px); border: 0; border-radius: 14px; box-shadow: 0 16px 48px rgba(0, 31, 97, .28); }
#modalHelpMeChoose .modal-header { flex: 0 0 auto; padding: 18px 24px; border-bottom: 1px solid #e6eaf3; }
#modalHelpMeChoose .modal-title { margin: 0; line-height: 1.3; }
#modalHelpMeChoose .modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 8px 24px 12px; }
#modalHelpMeChoose #mainOutput { margin: 14px 0 6px; }

/* Question / statement text */
#modalHelpMeChoose .hmc-question { margin: 0 0 18px; font-size: 19px; font-weight: 700; line-height: 1.4; color: var(--fox-blue-dark, #001f61); outline: 0; }
#modalHelpMeChoose .hmc-note { margin: -8px 0 16px; font-size: 14px; color: #4a5775; }
#modalHelpMeChoose .hmc-note a,
#modalHelpMeChoose .hmc-footnote a { color: var(--fox-blue, #0032a0); font-weight: 600; text-decoration: underline; }

/* Survey-style radio choices (the real radio input stays in the DOM for keyboard and screen readers) */
#modalHelpMeChoose .hmc-choice { position: relative; display: flex; align-items: center; margin: 0; padding: 12px 16px; border: 1.5px solid #d5dbe8; border-radius: 0; background: #fff; font-size: 16px; font-weight: 400; line-height: 1.35; color: var(--fox-blue-dark, #001f61); cursor: pointer; transition: border-color .15s, background-color .15s; }
#modalHelpMeChoose .hmc-choices .hmc-choice + .hmc-choice { margin-top: 10px; }
#modalHelpMeChoose .hmc-choice:hover { border-color: var(--fox-gold, #ffa400); }
#modalHelpMeChoose .hmc-choice.is-selected { border-color: var(--fox-blue, #0032a0); background: #f3f6fd; }
#modalHelpMeChoose .hmc-choice input { position: absolute; width: 1px; height: 1px; margin: 0; opacity: 0; }
#modalHelpMeChoose .hmc-choice-mark { position: relative; flex: 0 0 22px; width: 22px; height: 22px; margin-right: 12px; border: 2px solid #9aa6c0; border-radius: 50%; background: #fff; transition: border-color .15s; }
#modalHelpMeChoose .hmc-choice-mark::after { content: ""; position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: var(--fox-blue, #0032a0); transform: scale(0); transition: transform .12s ease-out; }
#modalHelpMeChoose .hmc-choice input:checked + .hmc-choice-mark { border-color: var(--fox-blue, #0032a0); }
#modalHelpMeChoose .hmc-choice input:checked + .hmc-choice-mark::after { transform: scale(1); }
#modalHelpMeChoose .hmc-choice input:focus + .hmc-choice-mark { box-shadow: 0 0 0 3px rgba(255, 164, 0, .55); }

/* Buttons: primary (Next, Submit), outline (Back, Start over, card links), link (Cancel) */
#modalHelpMeChoose .hmc-btn { display: inline-block; padding: 10px 22px; border: 2px solid transparent; border-radius: 0; font-family: 'segoeuib', 'Montserrat-SemiBold', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 15px; font-weight: 600; line-height: 1.2; text-align: center; text-decoration: none; box-shadow: none; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }
#modalHelpMeChoose .hmc-btn:focus { outline: 0; box-shadow: 0 0 0 3px rgba(255, 164, 0, .55); }
#modalHelpMeChoose .hmc-btn:hover,
#modalHelpMeChoose .hmc-btn:focus { text-decoration: none; }
#modalHelpMeChoose .hmc-btn[disabled] { opacity: .45; cursor: not-allowed; }
#modalHelpMeChoose .hmc-btn-primary { color: #fff; background: var(--fox-blue, #0032a0); border-color: var(--fox-blue, #0032a0); }
#modalHelpMeChoose .hmc-btn-primary:hover:not([disabled]),
#modalHelpMeChoose .hmc-btn-primary:focus { color: #fff; background: var(--fox-blue-dark, #001f61); border-color: var(--fox-blue-dark, #001f61); }
#modalHelpMeChoose .hmc-btn-outline { color: var(--fox-blue, #0032a0); background: #fff; border-color: var(--fox-gold, #ffa400); }
#modalHelpMeChoose .hmc-btn-outline:hover:not([disabled]),
#modalHelpMeChoose .hmc-btn-outline:focus { color: #fff; background: var(--fox-blue, #0032a0); border-color: var(--fox-blue, #0032a0); }
#modalHelpMeChoose .hmc-btn-link { color: #4a5775; background: transparent; border-color: transparent; }
#modalHelpMeChoose .hmc-btn-link:hover,
#modalHelpMeChoose .hmc-btn-link:focus { color: var(--fox-blue, #0032a0); background: #eef2fb; }
#modalHelpMeChoose .hmc-btn-block { display: block; width: 100%; margin-top: 10px; }

/* Footer: Cancel on the left, the other buttons on the right */
#modalHelpMeChoose .modal-footer { flex: 0 0 auto; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; padding: 14px 24px; border-top: 1px solid #e6eaf3; }
#modalHelpMeChoose .modal-footer::before,
#modalHelpMeChoose .modal-footer::after { display: none; }
#modalHelpMeChoose .modal-footer .btn { margin: 4px 0 4px 10px; }
#modalHelpMeChoose .modal-footer #cancelHelpMeChoose { margin-left: 0; margin-right: auto; }

/* Recommendation card: photo banner on top, description + feature box side by side, two actions */
#modalHelpMeChoose .hmc-card { display: grid; grid-template-columns: 230px minmax(0, 1fr); align-items: center; margin: 4px 0 18px; padding: 26px; border: 1px solid #e1e6f1; border-radius: 14px; background: #fff; box-shadow: 0 6px 20px rgba(0, 31, 97, .08); }
#modalHelpMeChoose .hmc-card-media { display: flex; align-items: center; justify-content: center; min-height: 300px; padding: 14px; border-radius: 12px; background: radial-gradient(circle at 50% 40%, #fff 0, #f3f6fd 100%); }
#modalHelpMeChoose .hmc-card-media img { width: auto; max-width: 100%; height: auto; max-height: 280px; mix-blend-mode: multiply; }
#modalHelpMeChoose .hmc-card-body { min-width: 0; margin-left: 28px; }
#modalHelpMeChoose .hmc-card-badge { display: inline-block; margin-bottom: 10px; padding: 5px 11px; border-radius: 999px; background: #fff4dd; font-family: 'segoeuib', 'Montserrat-SemiBold', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 11.5px; font-weight: 600; letter-spacing: .07em; line-height: 1.2; text-transform: uppercase; color: #8a5a00; }
#modalHelpMeChoose .hmc-card-badge::before { content: "\2605"; margin-right: 6px; }
#modalHelpMeChoose .hmc-card-title { margin: 0 0 12px; font-family: 'DDT_ddt ex bd', 'Montserrat-SemiBold', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 24px; line-height: 1.2; text-align: left; color: var(--fox-blue, #0032a0); }
#modalHelpMeChoose .hmc-card-desc { margin: 0; font-size: 14px; line-height: 1.55; color: #2b3550; }
#modalHelpMeChoose .hmc-card-feats { margin: 16px 0 22px; }
#modalHelpMeChoose .hmc-card-features-title { margin: 0 0 8px; font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #4a5775; }
#modalHelpMeChoose .hmc-card-features { margin: 0; padding: 0; list-style: none; }
#modalHelpMeChoose .hmc-card-features li { position: relative; margin: 0 0 7px; padding-left: 26px; font-size: 14px; line-height: 1.45; color: #2b3550; }
#modalHelpMeChoose .hmc-card-features li::before { content: ""; position: absolute; top: 2px; left: 0; width: 17px; height: 17px; border-radius: 50%; background: var(--fox-blue, #0032a0) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.2 8.4l2.4 2.4 5-5.2' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat; }
#modalHelpMeChoose .hmc-card-actions { display: flex; flex-wrap: wrap; margin: -5px -6px 0; }
#modalHelpMeChoose .hmc-card-actions .hmc-btn { flex: 1 1 auto; margin: 5px 6px; padding-left: 14px; padding-right: 14px; }
#modalHelpMeChoose .hmc-footnote { margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: #4a5775; }

/* Application Review Request form */
#modalHelpMeChoose .hmc-form { margin-top: 4px; }
#modalHelpMeChoose .hmc-form-title { margin: 0 0 14px; font-family: 'DDT_ddt ex bd', 'Montserrat-SemiBold', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; font-size: 18px; color: var(--fox-blue, #0032a0); }
#modalHelpMeChoose .hmc-field { margin-bottom: 14px; }
#modalHelpMeChoose .hmc-label { display: block; margin: 0 0 6px; font-size: 14px; font-weight: 600; color: var(--fox-blue-dark, #001f61); }
#modalHelpMeChoose .hmc-field input[type="text"],
#modalHelpMeChoose .hmc-field input[type="email"],
#modalHelpMeChoose .hmc-field input[type="tel"],
#modalHelpMeChoose .hmc-field textarea { display: block; width: 100%; padding: 10px 12px; border: 1.5px solid #cfd6e6; border-radius: 0; background: #fff; box-shadow: none; font-size: 15px; line-height: 1.4; color: #1c2a4a; transition: border-color .15s, box-shadow .15s; }
#modalHelpMeChoose .hmc-field input[type="text"]:focus,
#modalHelpMeChoose .hmc-field input[type="email"]:focus,
#modalHelpMeChoose .hmc-field input[type="tel"]:focus,
#modalHelpMeChoose .hmc-field textarea:focus { outline: 0; border-color: var(--fox-blue, #0032a0); box-shadow: 0 0 0 3px rgba(0, 50, 160, .15); }
#modalHelpMeChoose .hmc-field-row { display: flex; }
#modalHelpMeChoose .hmc-field-row .hmc-field { flex: 1 1 0; min-width: 0; }
#modalHelpMeChoose .hmc-field-row .hmc-field + .hmc-field { margin-left: 14px; }
#modalHelpMeChoose .hmc-field textarea { resize: vertical; }
#modalHelpMeChoose .hmc-field textarea[readonly] { background: #f5f7fb; color: #44506c; }
#modalHelpMeChoose .hmc-choice-inline { display: inline-flex; margin: 0 10px 0 0; padding: 9px 16px; }
#modalHelpMeChoose .hmc-form-status { margin: 0 0 12px; padding: 10px 12px; border-radius: 0; background: #fff1ef; font-size: 14px; color: #8a1f11; }
#modalHelpMeChoose .hmc-thanks { margin: 0; font-size: 16px; line-height: 1.5; color: #2b3550; }
/* Spam trap: real visitors never see or reach this field */
#modalHelpMeChoose .hmc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Short desktop windows (laptops): tighten the result card so it needs less scrolling */
@media (min-width: 768px) and (max-height: 920px) {
  #modalHelpMeChoose .hmc-card { padding: 18px 20px; }
  #modalHelpMeChoose .hmc-card-media { min-height: 240px; }
  #modalHelpMeChoose .hmc-card-media img { max-height: 220px; }
  #modalHelpMeChoose .hmc-card-badge { margin-bottom: 8px; }
  #modalHelpMeChoose .hmc-card-title { margin-bottom: 8px; }
  #modalHelpMeChoose .hmc-card-feats { margin: 10px 0 14px; }
}
@media (max-width: 767px) {
  #modalHelpMeChoose .modal-dialog { margin-top: 10px; margin-bottom: 10px; }
  #modalHelpMeChoose .modal-content { max-height: calc(100vh - 20px); max-height: calc(100dvh - 20px); }
  #modalHelpMeChoose .modal-header,
  #modalHelpMeChoose .modal-footer { padding-left: 16px; padding-right: 16px; }
  #modalHelpMeChoose .modal-body { padding-left: 16px; padding-right: 16px; }
  #modalHelpMeChoose .hmc-question { font-size: 17px; }
  #modalHelpMeChoose .hmc-field-row { display: block; }
  #modalHelpMeChoose .hmc-field-row .hmc-field + .hmc-field { margin-left: 0; }
  #modalHelpMeChoose .hmc-card { display: block; padding: 18px; }
  #modalHelpMeChoose .hmc-card-media { min-height: 0; padding: 10px; }
  #modalHelpMeChoose .hmc-card-media img { max-height: 210px; }
  #modalHelpMeChoose .hmc-card-body { margin: 18px 0 0; }
  #modalHelpMeChoose .hmc-card-title { font-size: 21px; }
  #modalHelpMeChoose .hmc-card-actions { display: block; margin: 0; }
  #modalHelpMeChoose .hmc-card-actions .hmc-btn { display: block; width: 100%; margin: 0; }
  #modalHelpMeChoose .hmc-card-actions .hmc-btn + .hmc-btn { margin-top: 10px; }
  #modalHelpMeChoose .modal-footer .btn { flex: 1 1 auto; }
  #modalHelpMeChoose .modal-footer #cancelHelpMeChoose { flex: 1 1 100%; margin-right: 0; }
}
@media (prefers-reduced-motion: reduce) {
  #modalHelpMeChoose .hmc-choice,
  #modalHelpMeChoose .hmc-choice-mark,
  #modalHelpMeChoose .hmc-choice-mark::after,
  #modalHelpMeChoose .hmc-btn,
  #modalHelpMeChoose .hmc-field input,
  #modalHelpMeChoose .hmc-field textarea { transition: none; }
}
