
#scale-app {
	opacity: 0;
	transition: opacity 0.3s ease;
	min-height: 70vh;
}
#scale-app.scale-loaded {
	opacity: 1;
}

.body-diagram-side a:hover path,
.body-diagram-side a.opened path {
	fill: #C5CED6;
	cursor: pointer;
	outline: none;
}
.body-diagram-side a:focus {
	outline: none;
}
.body-diagram-side a.score-1 path {
	fill: #F3DBCF;
}
.body-diagram-side a.score-2 path {
	fill: #EEBCAC;
}
.body-diagram-side a.score-3 path {
	fill: #E7A088;
}
.body-diagram-side a.score-4 path {
	fill: #D17D61;
}
.body-diagram-side a.score-5 path {
	fill: #C26242;
}
.body-diagram-side a.score-6 path {
	fill: #B94722;
}


.scale-app .btn {
	padding: 21px 31px;
	border-radius: 5px;
	background-color: #3275C4;
	box-shadow: 0 2px 4px 0 rgba(204,204,204,0.50);
}
/* .scale-app .btn:focus { */
.scale-app .btn:active,
.scale-app .btn:hover {
	background-color: #365F9A;
}

.progress {
	background: rgb(231,80,38);
	background: -moz-linear-gradient(left, rgba(231,80,38,1) 0%, rgba(245,136,78,1) 100%);
	background: -webkit-linear-gradient(left, rgba(231,80,38,1) 0%,rgba(245,136,78,1) 100%);
	background: linear-gradient(to right, rgba(231,80,38,1) 0%,rgba(245,136,78,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e75026', endColorstr='#f5884e',GradientType=1 );
	color: #fff;
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
}
.progress .items {
	background-color: #AD321F;
}
.progress .wrap {
	padding: 0;
}
.progress li {
	width: 33.33%;
	max-width: 236px;
	height: 55px;
	padding-top: 30px;
	position: relative;
	display: inline-block;
	line-height: 16px;
	vertical-align: top;
	overflow: hidden;
	border-right: 1px solid #BF5A50;
	color: #CE8479;
	font-size: 13px;
}
.progress li:last-of-type {
	border-right: none;
}
.progress li .ico {
	width: 17px;
	height: 17px;
	position: absolute;
	top: 6px;
	left: 50%;
	margin-left: -8px;
	border: 2px solid #fff;
	border-radius: 50%;
	opacity: 0.6;
}
.progress li .ico:after {
	content: '';
	width: 9px;
	height: 7px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -3px 0 0 -4px;
	background: url(/common/gfx/sprite.svg) no-repeat 0 -42px;
	background-size: 600px auto;

	display: none;
}
.progress li.completed .ico:after,
.progress .active.results .ico:after {
	display: block;
}
.progress .items .active {
	background-color: #791D0F;
	color: #fff;
}
.progress .items .active .ico {
	opacity: 1;
}
.progress .current {
	max-width: 492px;
	margin: 0 auto;
	padding: 18px 20px 25px;
}
.progress .bar {
	width: 100%;
	height: 8px;
	margin: 18px 0 0;
	position: relative;
	display: block;
	border-radius: 4px;
	background-color: #AA3312;
}
.progress .bar i {
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border-radius: 4px;
	background-color: #fff;
}

.section-risks .progress {
	background: rgb(231,134,38);
	background: -moz-linear-gradient(left, rgba(231,134,38,1) 13%, rgba(245,192,78,1) 85%);
	background: -webkit-linear-gradient(left, rgba(231,134,38,1) 13%,rgba(245,192,78,1) 85%);
	background: linear-gradient(to right, rgba(231,134,38,1) 13%,rgba(245,192,78,1) 85%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e78626', endColorstr='#f5c04e',GradientType=1 );
}
.section-risks .progress .bar {
	background-color: #C27613;
}
.section-risks .progress .items {
	background-color: #C27613;
}
.section-risks .progress li {
	border-color: #E8B36E;
	color: #DBAE74;
}
.section-risks .progress .items .active {
	background-color: #975A0B;
	color: #fff;
}

.section-results .progress .items {
	background-color: #004699;
}
.section-results .progress li {
	border-color: #3275C4;
	color: #6790C2;
}
.section-results .progress .items .active {
	background-color: #0B3B73;
	color: #fff;
}

	@media all and (min-width: 768px) {
		.progress .current {
			text-align: left;
		}
		.progress li {
			height: 40px;
			line-height: 40px;
			padding-top: 0;
		}
		.progress li .ico {
			width: 22px;
			height: 22px;
			margin-right: 30px;
			position: relative;
			top: auto;
			left: auto;
			display: inline-block;
			vertical-align: middle;
		}
		.progress li span {
			display: inline-block;
			vertical-align: middle;
			font-size: 16px;
			line-height: 22px;
		}

	}

.item-card {
	max-width: 620px;
	margin: 0 auto;
	padding: 32px 0 76px;
	position: relative;
	text-align: center;
}
.item-card.has-whatsthis {
	padding-top: 59px;
}
.item-card h2 {
	margin: 0 20px 32px;
	color: #B0782D;
	font-size: 24px;
	line-height: 130%;
}
.item-card .btn {
	width: 122px;
	margin: 16px;
	display: inline-block;
	font-size: 28px;
}
.prodro .item-card .btn.on {
	background-color: #1F4878;
	opacity: 1;
}

.skip-ques {
	margin: 8px 0 0;
	color: #365F9A;
	font-size: 18px;
}
.skip-ques:active,
.skip-ques:hover {
	text-decoration: underline;
}

.next-wrap {
	padding: 27px 0;
	background-color: #365F9A;
	text-align: center;
}

.next-ques {
	display: inline-block;
	vertical-align: top;
	color: #fff;
	font-size: 24px;
	font-weight: bold;
}
.next-ques .caret {
	width: 40px;
	height: 40px;
	position: relative;
	background: none;
	border: 1px solid #fff;
	border-radius: 50%;
}
.next-ques .caret:before {
	content: '';
	width: 11px;
	height: 18px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -9px 0 0 -5px;
	background: url(/common/gfx/sprite.svg) no-repeat -120px 0;
	background-size: 600px auto;
}
.next-ques:not(:disabled):active .caret,
.next-ques:not(:disabled):hover .caret {
	background-color: #fff;
}
.next-ques:not(:disabled):active .caret:before,
.next-ques:not(:disabled):hover .caret:before {
	background-position: -120px -20px;
}

.scale-app :disabled,
.answered .item-card .btn,
.answered .item-card .skip-ques {
	opacity: 0.6;
	cursor: default;
}

	@media all and (min-width: 768px) {
		.item-card {
			padding-top: 81px;
			padding-bottom: 81px;
		}
		.item-card.has-whatsthis {
			padding-top: 113px;
		}
		.item-card h2 {
			margin-bottom: 55px;
			font-size: 30px;
			line-height: 137%;
		}
		.item-card .btn {
			width: 187px;
			padding: 0;
			line-height: 94px;
			font-size: 34px;
		}
		.skip-ques {
			margin-top: 32px;
			font-size: 26px;
		}
		.next-wrap {
			padding: 48px 0 102px;
			border-top: 1px solid #0B235D;
			text-align: right;
		}
		.next-ques {
			margin-right: 10px;
		}
		.next-ques .caret {
			width: 45px;
			height: 45px;
		}
	}

.sec {
	background-color: #365F9A;
	color: #fff;
}

.symptom-areas {
	padding: 11px 0;
	position: relative;
	border-bottom: 1px solid #20417B;
	text-align: center;
}
.symptom-areas header {
	margin: 0 auto 23px;
}
.symptom-areas header h3 {
	font-size: 18px;
}
.symptom-areas header p {
	margin: 7px 0;
	font-size: 14px;
}
.prodro .error {
	width: 80%;
	width: calc(100% - 40px);
	max-width: 520px;
	margin: 16px auto;
	padding: 10px 20px;
	background-color: #791D0F;
	border-radius: 5px;
	color: #fff;
}

.body-svg {
	margin: 18px 0;
	position: relative;
}
.body-svg svg {
	width: 136px;
	height: 338px;
	margin: 0 auto;
	display: block;
}
.body-svg:before,
.body-svg:after {
	content: '';
	width: 73px;
	line-height: 17px;
	position: absolute;
	top: 59px;
	color: #fff;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
}
.body-svg:before {
	content: 'Right';
	right: 50%;
	margin-right: 49px;
}
.body-svg:after {
	content: 'Left';
	left: 50%;
	margin-left: 49px;
}
#body-back-svg:before {
	content: 'Left';
}
#body-back-svg:after {
	content: 'Right';
}

.tabs-nav li {
	width: 50%;
	display: inline-block;
	vertical-align: top;
}
.tabs-nav li button {
	width: 100%;
	display: block;
	background-color: #E6EAEE;
	color: #595959;
	font-size: 14px;
	line-height: 44px;
	font-weight: bold;
	text-transform: uppercase;
}
.tabs-nav.front .front button,
.tabs-nav.back .back button {
	background-color: #C5CED6;
	color: #718BA0;
}
.tabs-nav.front ~ .body-back,
.tabs-nav.back ~ .body-front {
	display: none;
}

.body-head {
	display: none;
}

.body-card {
	padding: 0 0 24px;
	position: absolute;
	top: 161px;
	right: 20px;
	left: 20px;
	z-index: 20;
	border-radius: 8px;
	background-color: #fff;
	color: #4a4a4a;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
}
.scale-app select {
	width: 100%;
	margin: 15px 0 0;
	padding: 0 20px;
	display: block;
	border: none;
	background-color: #E6EAEE;
	color: #365F9A;
}
.body-card h3 {
	padding: 18px 50px 18px 20px;
	border-radius: 8px 8px 0 0;
	background-color: #DB604C;
	color: #fff;
	font-size: 18px;
	line-height: 24px;
	text-align: left;
}
.body-card h3 span {
	text-transform: uppercase;
}
.scale-app label {
	display: block;
	font-size: 14px;
	line-height: 136%;
}
.scale-app label strong {
	padding: 22px 20px 8px;
	display: block;
	font-size: 16px;
}
.scale-app label span,
.scale-app legend span {
	padding: 0 20px;
	display: block;
}
.body-card .btn {
	width: 187px;
	margin: 16px 0 7px;
	font-size: 18px;
}

.closebtn {
	width: 45px;
	height: 0;
	padding-top: 60px;
	display: block;
	overflow: hidden;
	background: url(/common/gfx/sprite.svg) no-repeat -134px 0;
	background-size: 600px auto;
}

.body-card .closebtn {
	position: absolute;
	top: 0;
	right: 0;
}

.btn-del {
	color: #717171;
	font-size: 14px;
	font-weight: 700;
}

.symptom-card {
	text-align: center;
}
.symptom-card label strong {
	font-size: 18px;
}

.field.intensity select,
.field.freq.select {
	display: block;
}
.field.intensity .slider,
.field.freq.radio-alt3 {
	display: none;
}

	@media all and (min-width: 375px) {
		.scale-app select {
			padding-left: 60px;
			padding-right: 60px;
		}
	}
	@media all and (min-width: 768px) {
		.symptom-areas {
			padding-top: 55px;
			padding-bottom: 63px;
		}
		.symptom-areas header {
			max-width: 505px;
			margin: 0 auto 94px;
		}
		.symptom-areas header h3 {
			font-size: 34px;
		}
		.symptom-areas header p {
			font-size: 24px;
		}
		.symptom-areas .tabs-nav {
			display: none;
		}
		.prodro .symptom-areas .body-back,
		.prodro .symptom-areas .body-front {
			display: inline-block;
		}
		.body-svg svg {
			width: 212px;
			height: 527px;
			margin: 0 70px;
		}
		#body-front-svg {
/* 			margin-right: 212px; */
/* 			margin-right: 142px; */
		}
		.body-svg:before,
		.body-svg:after {
			width: 92px;
			top: 34px;
			font-size: 18px;
			line-height: 22px;
		}
		.body-svg:before {
			margin-right: 59px;
		}
		.body-svg:after {
			margin-left: 59px;
		}
		.body-head {
			margin: 0 auto 27px;
			display: block;
			font-size: 18px;
			text-align: center;
			text-transform: uppercase;
		}

		.body-card {
			min-height: 530px;
			top: 308px;
			left: 50%;
			margin-left: 10px;
		}
		.body-card h3 {
			font-size: 24px;
			line-height: 29px;
		}
		.body-card .closebtn {
			padding-top: 65px;
			background-position: -134px 2px;
		}
		.body-card .btn {
			margin-top: 23px;
		}
		.scale-app label,
		.scale-app legend {
			display: block;
			font-size: 18px;
			line-height: 136%;
		}
		.scale-app label strong,
		.scale-app legend strong {
			padding: 22px 20px 8px;
			display: block;
			font-size: 24px;
		}
		.scale-app select {
			margin-top: 30px;
			padding-left: 20px;
			padding-right: 40px;
			text-align: center;
		}

		.body-card.back {
			left: 20px;
			right: 50%;
			margin-right: 10px;
			margin-left: 0;
		}

		.symptom-details .field {
			border-top: 1px solid #0B235D;
		}
		.symptom-details legend {
			width: 100%;
			display: block;
		}
		.symptom-details label strong,
		.symptom-details legend strong {
			padding-top: 80px;
		}
		.symptom-details select {
			display: none;
		}
		.slider {
			max-width: 1020px;
			margin: 0 auto;
			padding: 0 40px 194px;
		}

		.rzslider .rz-tick-value {
			margin-left: 5px;
			top: 53px;
			font-size: 36px;
		}
		.rzslider .rz-bar {
			height: 18px;
			border-radius: 9px;
			background-color: #ECECEC;
		}
		.rzslider .rz-selection {
			background: rgb(248,193,161);
background: -moz-linear-gradient(left, rgba(248,193,161,1) 0%, rgba(240,92,70,1) 99%);
background: -webkit-linear-gradient(left, rgba(248,193,161,1) 0%,rgba(240,92,70,1) 99%);
background: linear-gradient(to right, rgba(248,193,161,1) 0%,rgba(240,92,70,1) 99%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8c1a1', endColorstr='#f05c46',GradientType=1 );
		}

		.rzslider .rz-tick {
			width: 10px;
			height: 10px;
			top: 7px;
			left: 1px;
			background-color: #C5CED6;
		}
		.rzslider .rz-tick.rz-selected {
			background-color: #986019;
		}
		.rzslider .rz-pointer {
			width: 58px;
			height: 58px;
			top: -20px;
			margin-left: -12px;
			border-radius: 50%;
			background-color: #B0782D;
		}
		.rzslider .rz-pointer:after {
			width: 18px;
			height: 18px;
			top: 20px;
			left: 20px;
			border-radius: 50%;
			background-color: #986019;
		}
		.rzslider .rz-pointer.rz-active:after {
			background-color: #C5CED6;
		}
		.rzslider .rz-tick-legend {
			max-width: 190px;
			top: 98px;
			margin-left: 5px;
			white-space: nowrap;
			font-size: 14px;
		}

		.field.intensity select,
		.field.freq.select {
			display: none;
		}
		.field.intensity .slider,
		.field.freq.radio-alt3 {
			display: block;
		}
		.field.intensity {
			border-bottom: 1px solid #0B235D;
		}
		.field.freq.radio-alt3 {
			border-top: none;
		}

		.radio-alt3 .group {
			width: 25%;
			margin: 60px 0;
			padding: 0 10px;
			display: inline-block;
			vertical-align: top;
		}
		.radio-alt3 .group legend {
			margin: 0 0 20px;
			color: #C7D6EC;
			font-weight: 700;
			text-transform: uppercase;
		}
		.radio-alt3 input[type=radio] {
			border: 0 !important;
			clip: rect(0 0 0 0) !important;
			height: 1px !important;
			margin: -1px !important;
			overflow: hidden !important;
			padding: 0 !important;
			position: absolute !important;
			width: 1px !important;
		}
		.radio-alt3 .opt {
			height: 114px;
			margin: 20px 0;
			position: relative;
			display: block;
			border-radius: 5px;
			background-color: #FFC15F;
			color: #5F3D1B;
			font-size: 16px;
			line-height: 20px;
			font-weight: 700;
			transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
		}
		.radio-alt3 .opt:active,
		.radio-alt3 .opt:hover {
			background-color: #D5A14D;
		}
		.radio-alt3 input[type=radio]:checked + .opt {
			background-color: #B0782D;
			color: #fff;
		}
		.radio-alt3 .opt span {
			width: 100%;
			padding: 0 20px;
			position: absolute;
			top: 50%;
			left: 0;
			-webkit-transform: translate3d(0, -50%, 0);
			-ms-transform: translate3d(0, -50%, 0);
			transform: translate3d(0, -50%, 0);
		}

	}
	@media all and (min-width: 900px) {
		.rzslider .rz-tick-legend {
			font-size: 18px;
		}
	}
	@media all and (min-width: 1024px) {
		.body-card {
			width: 460px;
		}
		.body-card.front {
			right: auto;
		}
		.body-card.back {
			left: auto;
		}
	}


.form-wrap {
	padding: 45px 20px;
	border-top: 1px solid #C9C9C9;
	text-align: center;
}
.form-wrap.sec {
	background-color: #fff;
	color: #4a4a4a;
}


.form-wrap h3,
.form-wrap legend {
	margin: 0 0 24px;
	color: #1B3E70;
	font-size: 18px;
	font-weight: normal;
}
.form-wrap header {
	margin: 0 0 24px;
}
.form-wrap header h3 {
	margin: 0;
	display: inline;
}

.form-con {
	max-width: 300px;
	margin: 0 auto;
}

.cb-group {
}
.cb-group label {
	margin: 30px 0;
	font-size: 14px;
	text-align: left;	
}
.cb-group input[type=checkbox] {
	border: 0 !important;
	clip: rect(0 0 0 0) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
}
.cb-group input[type=checkbox] + .ico {
	width: 24px;
	height: 24px;
	position: relative;
	display: inline-block;
	vertical-align: top;
	background-color: #FAFBFB;
	box-shadow: inset 0 1px 3px 0 rgba(147,147,147,0.50);
}
.cb-group input[type=checkbox]:checked + .ico:before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url(/common/gfx/sprite.svg) no-repeat -180px 0;
	background-size: 600px auto;
}
.cb-group input[type=checkbox] + .ico + span {
	width: calc(100% - 24px);
	padding: 3px 0 0 14px;
	display: inline-block;
	vertical-align: top;
}
.cb-group input[type=checkbox] + .ico + span em {
	display: block;
	line-height: 24px;
}

.bmi .item-card h2 + p,
.waist .item-card h2 + p {
	margin: -25px 20px 0;
	color: #B0782D;
	font-size: 18px;
	font-weight: bold;
	font-style: italic;
}

.radio-alt1 {
	border: 1px solid #C5CED6;
}
.radio-alt1 legend,
.radio-alt1 input[type=radio],
.radio-alt2 input[type=radio] {
	border: 0 !important;
	clip: rect(0 0 0 0) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
}
.radio-alt1 label {
	width: 50%;
	line-height: 42px;
	display: inline-block;
	vertical-align: top;
	background-color: #C5CED6;
	font-size: 14px;
}
.radio-alt1 input[type=radio] + span {
	color: #595959;
}
.radio-alt1 input[type=radio]:checked + span {
	background-color: #EEF1F4;
}

.radio-alt2 label {
	width: 187px;
	margin: 8px;
	display: inline-block;
	vertical-align: top;
}
.radio-alt2 input[type=radio] + span {
	width: 100%;
	font-size: 18px;
	display: block;
}
.radio-alt2.touched input[type=radio] + span {
	background-color: #7DA4D2;
}
.radio-alt2 input[type=radio]:checked + span {
	background-color: #1F4878;
}


.form-wrap.alt1 .field,
.form-wrap.alt1 .radio-alt1  {
	max-width: 187px;
	position: relative;
	margin: 15px auto;
}
.form-wrap.alt1 .radio-alt1 {
	margin-bottom: 23px;
}
.form-wrap.alt1 .field > span {
	width: 45px;
	padding: 0;
	position: absolute;
	line-height: 14px;
	top: 50%;
	margin-top: -7px;
	right: 100%;
	margin-right: 10px;
}

.form-wrap.alt1 fieldset + fieldset {
	margin-top: 40px;
}

.bmi-score {
	margin: 40px 0 0;
	font-size: 18px;
}
.bmi-score strong {
	width: 90px;
	margin: 0 0 0 20px;
	display: inline-block;
	border-bottom: 1px solid #979797;
}

.last-item .next-wrap {
	background-color: #ECECEC;
}
.last-item .next-ques {
	color: #1B3E70;
	font-weight: bold;
}
.last-item .next-ques .caret {
	border-color: #1B3E70;
}
.last-item .next-ques .caret:before {
	background-position: -120px -20px;
}
.last-item .next-ques:not(:disabled):active .caret,
.last-item .next-ques:not(:disabled):hover .caret {
	background-color: #1B3E70;
}
.last-item .next-ques:not(:disabled):active .caret:before,
.last-item .next-ques:not(:disabled):hover .caret:before {
	background-position: -120px 0;
}

	@media all and (min-width: 768px) {
		.form-wrap {
			padding-top: 60px;
			padding-bottom: 100px;
		}
		.form-wrap h3,
		.form-wrap legend {
			margin: 0 auto 44px;
			font-size: 24px;
			line-height: 29px;
			text-align: center;
		}
		.form-wrap h3,
		.form-wrap header {
			padding: 0 40px;
			text-align: center;
		}
		.form-wrap header h3 {
			margin-bottom: 29px;
			padding: 0;
			/* display: inline-block; */
		}
		.form-con {
			max-width: 420px;
			margin: 0 auto;
		}
		.cb-group label {
			font-size: 18px;
			line-height: 28px;
		}
		.cb-group input[type=checkbox] + .ico {
			width: 30px;
			height: 30px;
		}
		.cb-group input[type=checkbox]:checked + .ico:before {
			background-position: -225px 0;
			background-size: 750px;
		}
		.cb-group input[type=checkbox] + .ico + span {
			width: calc(100% - 30px);
			padding-top: 1px;
			padding-left: 20px;
		}

		.bmi .item-card h2 + p,
		.waist .item-card h2 + p {
			margin-top: -10px;
			font-size: 24px;
		}

		.bmi .form-con {
			text-align: left;
		}
		.bmi .field {
			display: inline-block;
			vertical-align: top;
		}
		.bmi input[type=text] {
			width: 142px;
		}

		.form-wrap.alt1 .field {
			max-width: 100%;
		}
		.form-wrap.alt1 .field > span {
			width: 117px;
			margin: 0;
			padding: 0 0 0 20px;
			position: static;
			display: inline-block;
			vertical-align: top;
			line-height: 44px;
		}
		.form-wrap.alt1 .field input {
			margin: 0;
			display: inline-block;
			vertical-align: top;
		}
		.form-wrap.alt1 .sec {
			margin-left: 18px;
		}

		.bmi-score {
			margin-left: 20px;
		}
		.bmi-score strong {
			width: 244px;
			margin-left: 30px;
			text-align: center;
		}

		.radio-alt2 legend {
			margin-bottom: 34px;
		}
		.radio-alt2 label {
			margin: 10px;
		}
		.radio-alt2 input[type=radio] + span {
			font-size: 24px;
		}

		.waist .circum legend {
			margin-bottom: 27px;
		}
		.waist .form-wrap.alt1 .radio-alt1,
		.waist .form-wrap.alt1 .field {
			width: 187px;
			margin: 0 10px;
			display: inline-block;
			vertical-align: top;
		}
	}






.risks-step-option {
	padding: 14px 20px 22px;
	background-color: #ECECEC;
	color: #365F9A;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
}
.risks-step-option .next-ques {
	font-size: 18px;
}

.result-summary {
	padding: 25px 20px;
	background-color: #F7F8F8;
	font-size: 18px;
	box-shadow: 0 2px 6px 0 rgba(164,164,164,0.50);
}

.scale-meter {
	max-width: 722px;
	margin: 0 auto 15px;
	position: relative;
	text-align: center;
}
.meter-gfx {
	margin: 16px 0 0;
	position: relative;
	display: block;
}
.meter-gfx:before {
	box-sizing: border-box;
	content: '';
	width: 24px;
	position: absolute;
	top: -5px;
	bottom: -5px;
	left: 22px;
	border: 1px solid #fff;
	border-radius: 6px;
	background-color: #659A2A;
}
.yellow .meter-gfx:before {
	left: 50%;
	margin-left: -12px;
	background-color: #FFBB1B;
}
.orange1 .meter-gfx:before,
.orange2 .meter-gfx:before {
	left: 75%;
	margin-left: -12px;
	background-color: #FE943B;
}
.red .meter-gfx:before {
	left: auto;
	right: 22px;
	background-color: #E2381E;
}


.meter-gfx:after {
	content: '';
	width: 100%;
	padding-top: 2.49%;
	display: block;
	background: url(/common/gfx/scale-meter.png) no-repeat 50% 0;
	background-size: contain;
}

.scale-meter li {
	display: inline-block;
	vertical-align: top;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing 0.57px;

	display: none;
}
.green .scale-meter .low,
.yellow .scale-meter .med,
.orange1 .scale-meter .med,
.orange2 .scale-meter .med,
.red .scale-meter .hi {
	font-weight: bold;
	display: inline-block;
}

.result-summary .summary {
	max-width: 706px;
	margin: 0 auto 32px;
	border-radius: 8px;
	background-color: #466A1F;
	color: #fff;
}
.result-summary .summary .body {
	padding: 20px 20px 40px;
	border-radius: 8px;
	background-color: #659A2A;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
}
.result-summary .summary h2 {
	margin: 0 0 7px;
	font-size: 22px;
}
.result-summary .summary .answered {
	padding: 18px 20px 26px;
	text-align: center;
}
.result-summary .summary .answered ul {
	margin: 10px 0 0;
}
.result-summary .summary .answered li {
	margin: 5px 0;
	display: block;
	list-style: none;
}
.result-summary .summary .answered li:after {
	content: ' & ';
}
.result-summary .summary .answered li:last-of-type:after {
	content: '';
}
.result-summary .summary .answered li strong {
	position: relative;
	display: inline-block;
	font-weight: normal;
}
.result-summary .summary .answered li strong:after {
	content: '';
	width: 100%;
	position: absolute;
	bottom: -12px;
	left: 0;
	display: block;
	border-bottom: 3px solid #FFFFFF;
}

.results-wrap h3 {
	margin: 0 auto 20px;
	color: #9D6C2A;
	font-size: 22px;
	font-weight: bold;
	line-height: 123%;
	text-align: left;
}
.results-wrap .actions {
	margin: 40px 0 0;
	text-align: center;
}
.results-wrap .actions .btn {
	width: 260px;
	margin: 10px;
	padding-right: 0;
	padding-left: 0;
}
.results-wrap .actions .btn.download {
	max-width: 414px;
}
.results-wrap .actions .btn.email {
	max-width: 300px;
}
	@media all and (min-width: 500px) {
		.results-wrap .actions .btn.download {
			width: calc(56% - 20px);
		}
		.results-wrap .actions .btn.email {
			width: calc(44% - 20px);
		}
	}
.scale-summary-wrap {
	margin: 7px 0;
	padding: 34px 20px;
/* 	border-top: 1px solid #E7E8E8; */
}
.legend-card {
	max-width: 344px;
	margin: 20px 0 40px;
	border-radius: 8px;
	border: 1px solid #C3C3C3;
	font-size: 14px;
	letter-spacing: 0.5px;
}
.legend-card h4 {
	padding: 19px 10px;
	border-radius: 8px 8px 0 0;
	background-color: #004699;
	color: #fff;
	font-size: 15px;
	line-height: 120%;
	text-align: center;
}
.legend-card p {
	margin: 20px;
	line-height: 121%;
}
.legend-card h5 {
	margin: 0 20px -10px;
	font-size: 100%;
}
.legend-card ul {
	margin: 0 20px;
}
.legend-card li {
	margin: 30px 0;
	display: block;
	list-style: none;
}
.legend-card li strong {
	width: 49px;
	margin-right: 15px;
	position: relative;
	display: inline-block;
	vertical-align: bottom;
	font-size: 18px;
	letter-spacing: 0.64px;
}
.legend-card li strong:after {
	content: '';
	width: 15px;
	position: absolute;
	top: 50%;
	left: 100%;
	border-top: 1px solid currentColor;
}
.legend-card .mild,
.mild-tag {
	color: #659A2A;
}
.legend-card .moderate,
.moderate-tag {
	color: #D89D11;
}
.legend-card .severe,
.severe-tag {
	color: #D0021B;
}

.result-summary.yellow .summary {
	background-color: #B2810E;
}
.result-summary.yellow .summary .body {
	background-color: #D89D11;
}
.result-summary.orange1 .summary,
.result-summary.orange2 .summary {
	background-color: #C96F24;
}
.result-summary.orange1 .summary .body,
.result-summary.orange2 .summary .body {
	background-color: #E28231;
}
.result-summary.orange2 .summary .answered li {
	font-size: 15px;
	line-height: 123%;
}
.result-summary.orange2 .summary .answered li em {
	display: block;
	font-style: normal;
}
.result-summary.orange2 .summary .answered li strong {
	font-weight: bold;
}
.result-summary.orange2 .summary .answered li strong:after {
	display: none;
}

.result-summary.red .summary {
	background-color: #9C2C1A;
}
.result-summary.red .summary .body {
	background-color: #C82D15;
}

.scale-summary-wrap .tabs-nav {
	margin-right: -20px;
	margin-left: -20px;
}

.tabs-nav.symptoms .symptoms button,
.tabs-nav.risks .risks button {
	background-color: #C5CED6;
	color: #718BA0;
}
.tabs-nav.symptoms ~ .risks-summary,
.tabs-nav.risks ~ .symptoms-summary {
	display: none;
}

	@media all and (min-width: 768px) {
		.result-summary {
			padding-top: 62px;
			padding-bottom: 77px;
			font-size: 24px;
		}
		.result-summary .summary .body {
			padding: 48px 130px 78px;
		}
		.result-summary .summary .body h2 {
			font-size: 30px;
		}
		.result-summary .summary .body p {
			font-size: 20px;
		}
		.result-summary .summary .answered {
			padding: 18px 20px 40px;
		}
		.results-wrap h3 {
			max-width: 706px;
			margin-bottom: 38px;
			font-size: 32px;
		}

		.scale-meter {
			margin-bottom: 18px;
		}
		.meter-gfx {
			margin-top: 21px;
		}
		.meter-gfx:before {
			width: 34px;
			top: -4px;
			bottom: -4px;
			left: 9px;
		}
		.yellow .meter-gfx:before,
		.orange1 .meter-gfx:before,
		.orange2 .meter-gfx:before {
			margin-left: -17px;
		}
		.red .meter-gfx:before {
			right: 9px;
		}

		.scale-meter ul {
			position: relative;
		}
		.scale-meter li {
			display: inline-block;
			vertical-align: top;
			color: #717171;
			font-size: 16px;
		}
		.green .scale-meter .low,
		.yellow .scale-meter .med,
		.orange1 .scale-meter .med,
		.orange2 .scale-meter .med,
		.red .scale-meter .hi {
			color: #212121;
			font-weight: bold;
		}
		.scale-meter .low,
		.scale-meter .hi {
			position: absolute;
			top: 0;
		}
		.scale-meter .low {
			left: 0;
		}
		.scale-meter .hi {
			right: 0;
		}

		.result-summary .summary .answered li {
			display: inline;
		}

		.scale-summary-wrap {
			max-width: 980px;
			margin: 0 auto;
			padding-bottom: 52px;
			font-size: 18px;
		}
		.scale-summary-wrap .desc {
			min-height: 460px;
			position: relative;
			padding-left: 364px;
		}
		.legend-card {
			width: 344px;
			margin: 0;
			position: absolute;
			top: 0;
			left: 0;
		}
		.legend-card li strong {
			margin-right: 45px;
		}
		.legend-card li strong:after {
			width: 43px;
		}

		.scale-summary-wrap h3 {
			max-width: 100%;
		}
		.scale-summary-wrap .tabs-nav {
			margin: 0 -26px;
/* 			padding: 0 20px; */
		}
		.scale-summary-wrap .tabs-nav li {
			width: auto;
		}
		.scale-summary-wrap .tabs-nav li {
			margin: 0 26px;
		}
		.scale-summary-wrap .tabs-nav li button {
			background-color: transparent;
			color: #E2C195;
			font-size: 24px;
			line-height: 58px;
			text-transform: none;
		}
		.scale-summary-wrap .tabs-nav.symptoms .symptoms button,
		.scale-summary-wrap .tabs-nav.risks .risks button {
			background-color: transparent;
			color: #B0782D;
			border-bottom: 4px solid #B0782D;
		}
	}

.summary-card > ul > li {
	margin: 33px 0;
	position: relative;
	font-weight: bold;
	text-transform: uppercase;
}
.summary-card > ul > li.ans-no {
	font-weight: normal;
}
.summary-card ul {
	list-style: none
}

.summary-card .val-tag {
	width: 85px;
	position: absolute;
	right: 0;
	top: 0;
	text-align: right;
	font-weight: bold;
}
.summary-card .val-tag .sml {
	font-size: 80%;
	white-space: nowrap;
}
.summary-card .val-tag.waist {
	width: 100px;
	display: block;
	font-style: normal;
}
.summary-card .val-tag.bmi {
	width: 120px;
}

.summary-card .name {
	padding-right: 85px;
	display: block;
}
.summary-card .ans-unknown .name {
	padding-right: 125px;
}
.summary-card > ul > li.ans-unknown .val-tag {
	width: 115px;
}

.summary-card .followup {
	display: none;
}

/* .risks-summary .val-tag.yes */
.risks-summary .val-tag.score-1 {
	color: #CB3D0C;
}

.summary-card .symptom-details {
	margin: 10px 0;
	color: #435363;
    font-size: 14px;
    font-weight: normal;
    text-transform: none;
}
.summary-card .symptom-details p {
	margin: 5px 0;
}

.summary-card > ul > li > ul li:first-of-type {
	margin-top: 20px;
}
.pain-card {
	margin-right: -20px;
	margin-left: -20px;
	padding: 0;
	position: relative;
	display: block;
	background-color: #C5CED6;
	background-color: #F5F5F9;
	text-transform: none;
	font-size: 14px;
	font-weight: normal;
}
.summary-card .pain-card + .pain-card {
	margin-top: -1px;
}
.pain-card strong {
	padding: 14px 20px;
	position: relative;
	display: block;
	border: 1px solid #B1BEC9;
	background-color: #C5CED6;
	color: #365F9A;
	font: 600 14px/120% "proxima-nova",sans-serif;
	cursor: pointer;
}
.pain-card strong:after {
	content: '';
	width: 14px;
	height: 8px;
	position: absolute;
	top: 50%;
	margin-top: -4px;
	right: 20px;
	background: url(/common/gfx/sprite.svg) no-repeat -180px -24px;
	background-size: 600px auto;
	transition: transform 0.3s ease-in-out;
}
.pain-card .con {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-in-out;
}
.pain-card.on .con {
	max-height: 1000px;
}

.pain-card .details {
	padding: 5px 20px;
	border: 1px solid #E0E0E0;
	background-color: #F5F5F9;
}
.pain-card .details p {
	margin: 12px 0;
}
.pain-card .details p em {
	font-style: normal;
	text-transform: uppercase;
}

.pain-card.on strong:after {
	-webkit-transform: rotate(180deg);
	    -ms-transform: rotate(180deg);
	        transform: rotate(180deg);
}

	@media all and (min-width: 768px) {
		.summary-card .followup {
			display: block;
		}
		.summary-card {
			line-height: 24px;
		}
		.summary-card > ul > li {
			width: 60%;
			margin: 55px 0;
			padding-bottom: 13px;
			position: relative;
			border-bottom: 1px solid #E7E8E8;
		}
		.summary-card .val-tag {
			width: 100px;
			right: 12px;
		}
		.summary-card > ul > li.ans-unknown .val-tag {
			width: 140px;
		}
		.summary-card .ans-unknown .name {
			padding-right: 150px;
		}
		.summary-card .val-tag.waist {
			width: 160px;
		}
		.summary-card .val-tag.bmi {
			width: 220px;
		}
		.summary-card .name {
			padding-right: 85px;
		}

		.summary-card > ul > li > ul,
		.summary-card .symptom-details {
			width: 66.5%;
			width: calc(66.5% - 60px);
			margin: 0;
			position: absolute;
			top: 1px;
			left: 100%;
			margin-left: 60px;
		}
		.summary-card > ul > li > ul {
			z-index: 10;
		}

		.summary-card > ul > li > ul li:first-of-type {
			margin-top: 0;
		}
		.pain-card {
			width: 100%;
			margin: 0;
		}
		.pain-card .details {
			background-color: #fff;
		}

		.summary-card .has-details:after {
			box-sizing: border-box;
			content: '';
			position: absolute;
			top: 11px;
			left: 100%;
			margin-left: -6px;
			right: -35px;
			border-top: 2px solid #C0C0C0;
		}

/* 		.summary-card .pain-card strong:before, */
/* 		.summary-card .pain-card:after, */
		.summary-card > ul > li > ul:before,
		.summary-card > ul > li > ul:after,
		.summary-card .symptom-details p:after {
			box-sizing: border-box;
			content: '';
			width: 14px;
			height: 14px;
			position: absolute;
			top: 3px;
			left: -27px;
			display: block;
			border: 2px solid #C0C0C0;
			border-radius: 50%;
		}
		.summary-card > ul > li > ul:after {
			top: auto;
			bottom: 3px;
		}
		.summary-card > ul > li > ul li:after,
		.summary-card .symptom-details p:before {
			box-sizing: border-box;
			content: '';
			width: 1px;
			position: absolute;
			top: 16px;
			bottom: 16px;
			left: -21px;
			border-left: 2px solid #C0C0C0;
		}
		.summary-card > ul > li > ul li:after {
			top: 0;
			bottom: 0;
		}
		.summary-card > ul > li > ul li:first-of-type:after {
			top: 17px;
		}
		.summary-card > ul > li > ul li:last-of-type:after {
			bottom: 17px;
		}

		.summary-card .symptom-details p,
		.summary-card .symptom-details ul {
			margin: 0;
			position: relative;
			/* color: #435363; */
			font-size: 18px;
			line-height: 22px;
		}
		.summary-card .symptom-details ul li + li{
			margin: 5px 0 0;
		}
		.summary-card .symptom-details p + p {
			margin-top: 20px;
		}
		.summary-card .symptom-details p:before {
			top: 16px;
			bottom: -24px;
		}
		.summary-card .symptom-details p:last-of-type:before {
			display: none;
		}
		.summary-card .symptom-details p:after {
			top: 4px;
		}

		.scale-summary-wrap .actions {
			margin-top: 80px;
		}

	}
	@media all and (min-width: 900px) {
		.summary-card > ul > li {
			width: 440px;
		}
		.summary-card > ul > li > ul,
		.summary-card .symptom-details {
			width: 340px;
		}
	}
	@media all and (min-width: 980px) {
		.summary-card > ul > li > ul,
		.summary-card .symptom-details {
			width: 380px;
			margin-left: 120px;
		}
		.summary-card .has-details:after {
			right: -95px;
		}
	}


button.whatsthis {
	padding-left: 23px;
	position: absolute;
	top: 32px;
	right: 20px;
	color: #B0782D;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}
button.whatsthis:before {
	content: '';
	width: 16px;
	height: 16px;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -8px;
	background: url(/common/gfx/sprite.svg) no-repeat -153px 0;
	background-size: 450px auto;
}
	@media all and (min-width: 768px) {
		button.whatsthis {
			padding-left: 27px;
			top: 72px;
			font-size: 14px;
			line-height: 21px;
		}
		button.whatsthis:before {
			width: 21px;
			height: 21px;
			margin-top: -11px;
			background-position: -204px 0;
			background-size: 600px auto;
		}
	}

.tooltip {
	max-width: 460px;
	width: 80%;
	margin: 28px auto;
	position: relative;
	overflow: hidden;
	border-radius: 8px;
	background-color: #fff;
	box-shadow: 0 2px 4px 0 rgba(0,0,0,0.50);
	text-align: left;
	transition: opacity 0.3s ease;
}
.tooltip.ng-hide {
	opacity: 0;
}
.tooltip .closebtn {
	position: absolute;
	top: -9px;
	right: 0;
}
.tooltip h2 {
	margin: 0;
	padding: 10px 40px 10px 20px;
	background-color: #DB604C;
	color: #fff;
	font-size: 18px;
	line-height: 120%;
}
.tooltip .desc {
	padding: 20px;
}
.tooltip .desc p + p {
	margin-top: 10px;
}
	@media all and (min-width: 768px) {
		.tooltip .closebtn {
			top: -5px;
		}
		.tooltip h2 {
			padding: 11px 55px 11px 37px;
			font-size: 24px;
		}
		.tooltip .desc {
			padding: 26px 37px 32px;
		}
		.tooltip .desc p {
			font-size: 16px;
		}
	}

.mask {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 100;
	background-color: rgba(0, 0, 0, 0.75);
	display: none;
}
.overlay-on .mask {
	display: block;
}

.tooltip.heading {
	position: fixed;
	top: 50%;
	left: 50%;
	-webkit-transform: translate3d(-50%, -50%, 0);
	-ms-transform: translate3d(-50%, -50%, 0);
	transform: translate3d(-50%, -50%, 0);
	z-index: 150;
}

button.whatsthis.alt {
	width: 16px;
	height: 16px;
	margin: 0 0 2px 5px;
	padding: 0;
	position: relative;
	top: auto;
	left: auto;
	right: auto;
	-webkit-transform: translate3d(0, 0, 0);
	-ms-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	display: inline-block;
	vertical-align: bottom;
	line-height: 22px;
}
	@media all and (min-width: 768px) {
		button.whatsthis.alt {
			margin-bottom: 5px;
		}
	}



.email-mod {
	margin: 0;
	padding: 32px 24px;
	position: fixed;
	top: 20px;
	right: 20px;
	bottom: 20px;
	left: 20px;
	z-index: 110;
	border: 1px solid #C5CED6;
	background: #FFFFFF;
	color: #656565;
	box-shadow: 0 2px 4px 0 rgba(219,219,219,0.50);
	text-align: left;
	transition: opacity 0.3s ease;
}
.email-mod + .mask {
	z-index: 100;
	display: block;
	background-color: rgba(255, 255, 255, 0.9);
	transition: opacity 0.3s ease;
}
.email-mod.ng-hide,
.email-mod + .mask.ng-hide {
	opacity: 0;
}
/* .email-mod:after {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	border: 1px solid #C5CED6;
	background: #FFFFFF;
	color: #656565;
	box-shadow: 0 2px 4px 0 rgba(219,219,219,0.50);
	z-index: 1;
} */
.email-mod .closebtn {
	width: 31px;
	padding-top: 31px;
	height: 0;
	overflow: hidden;
	background: url(/common/gfx/sprite.svg) no-repeat -478px 0;
	background-size: 600px auto;
	position: absolute;
	top: 7px;
	right: 7px;
	z-index: 105;
}
/* .email-mod .closebtn:after {
	content: '';
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background-color: rgba(255, 255, 255, 0.9);
	cursor: default;
} */
.email-mod label {
	margin: 10px 0;
}
.email-mod label em {
	font-size: 14px;
}
.email-mod label span {
	margin: 0 0 10px;
	padding: 0;
	display: block;
	color: #9D6C2A;
	font-weight: bold;
}
.email-mod textarea {
	height: 156px;
}
.email-mod .btn {
	width: 120px;
	height: 54px;
	line-height: 54px;
	margin: 20px auto;
	padding: 0;
	display: block;
	background-color: #365F9A;
	border-radius: 0;
	font-size: 15px;
	box-shadow: none;
}
.email-sent {
	width: 100%;
	padding: 0 40px;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translate3d(0, -50%, 0);
	-ms-transform: translate3d(0, -50%, 0);
	transform: translate3d(0, -50%, 0);
}
	@media all and (min-width: 768px) {
		.email-mod {
			width: 508px;
			left: 50%;
			right: auto;
			margin-left: -254px;
			overflow: auto;
		}
	}
	@media all and (min-height: 620px) {
		.email-mod {
			height: 580px;
			top: 50%;
			bottom: auto;
			margin-top: -290px;
		}
	}


@-webkit-keyframes spinner {
	to {
		-webkit-transform: rotate(360deg);
	}
}
@keyframes spinner {
	to {
		transform: rotate(360deg);
	}
}

.spinning:before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 50;
	background-color: rgba(255, 255, 255, 0.8);
}
.spinning:after {
	content: '';
	box-sizing: border-box;
	width: 30px;
	height: 30px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -15px;
	margin-left: -15px;
	z-index: 60;
	border: 2px solid #ccc;
	border-top-color: #E22E12;
	border-radius: 50%;
	-webkit-animation: spinner 0.6s linear infinite;
	animation: spinner 0.6s linear infinite;
}





