/*-----------------------------------*\
  TRILOGY SYSTEM
\*-----------------------------------*/

body.trilogy-system {
/*	background: #6B5795;*/
}

.tssubheading {
	text-align: center; margin-top: 30px;
	color: #fff; font-size: 3.2rem;
	line-height: 1.2;
}

#tsintro {
	color: #fff; padding: 30px 0 40px;
}

#tsintro .smallintro {
	color: #fff;
}

.tsi-img {
	position: relative; border-radius: 8px;
	overflow: hidden; margin-bottom: 20px;
}

.tsi-label {
	position: absolute; left: 20px; bottom: 32px;
	font-size: 2rem; line-height: 1.2;
}

.tsi-label span {
	display: block; font-size: 5rem;
	font-weight: 500;
}

.tsintro-row {
	margin-bottom: 30px;
}

.tsi-col2 p {
	margin-bottom: 0;
	max-width: 587px;
}

/*.tsi-col1 h2 br {
	display: none;
}*/

.tsi-col1 h2 {
	max-width: 585px;
}

#tsvideo {
	text-align: center; padding: 30px 0 48px;
	color: #fff;
}

#tsvideo .video-container {
	border-radius: 10px;
}

#tscards {
	padding: 30px 0 36px;
}

.flipcard {
	background: #fff; text-align: center;
	border-radius: 10px; overflow: hidden;
	margin-bottom: 20px; position: relative;
	z-index: 2;
}

.flipcard-copy {
	padding: 30px 20px;
}

.flipcard-copy p {
	margin-bottom: 0;
}

.flipcard-copy h3 br {
	display: none;
}

@media only screen and (min-width: 768px) {

	.tssubheading {
		font-size: 3.6rem;
	}

	.tsintro-imgrow {
		display: grid;
	    grid-template-columns: repeat(3, 1fr);
	    grid-column-gap: 10px;
	}

	.tsi-img {
		margin-bottom: 0;
	}

	.tsi-label {
		left: 12px; bottom: 20px;
		font-size: 1.3rem; 
	}

	.tsi-label span {
		font-size: 3rem;
	}

	.tsintro-row {
		margin-bottom: 48px;
	}

	#tsvideo h2 {
		margin-bottom: 32px;
	}

	#tscards {
		padding: 40px 0 48px;
	}

	.flipcard-copy h3 br {
		display: block;
	}

	.tscard-row {
		display: grid;
	    grid-template-columns: repeat(2, 1fr);
	    grid-column-gap: 20px;
	}

	.flipcard {
		margin-bottom: 0;
	}

}

@media only screen and (min-width: 1024px) {

	.tssubheading {
		font-size: 4.8rem;
		margin-top: 60px;
	}

	#tsintro {
		padding: 60px 0 96px;
	}

	.tsintro-imgrow {
	    grid-column-gap: 16px;
	}

	.tsi-label {
		left: 20px; bottom: 32px;
		font-size: 1.6rem; 
	}

	.tsi-label span {
		font-size: 4rem;
	}

	.tsintro-row {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}

	.tsi-col1 {
		padding-right: 20px;
	}

	.tsbg {
		padding: 96px 0;
	}

	#tsvideo {
		padding: 48px 0 64px;
	}

	#tsvideo h2 {
		margin-bottom: 50px;
	}

	#tscards {
		padding: 65px 0 74px;
	}

	.flipcard-copy {
		padding: 40px 20px 44px;
	}

	.flipcard-copy h3 {
		margin-bottom: 30px;
	}

}

@media only screen and (min-width: 1280px) {

	.tssubheading {
		margin-top: 80px;
	}

	#tsintro {
		padding: 96px 0 130px;
	}

	.tsintro-imgrow {
	    grid-column-gap: 20px;
	}

	.tsi-label {
		left: 30px; bottom: 48px;
		font-size: 2rem; 
	}

	.tsi-label span {
		font-size: 5rem;
	}

	.tsintro-row {
		margin-bottom: 76px;
	}

	/*.tsi-col1 h2 br {
		display: block;
	}*/

	.tsbg {
		padding: 130px 0;
	}

	#tsvideo {
		padding: 96px 0 80px;
	}

	.flipcard-copy {
		padding: 50px 20px 54px;
	}

}

@media only screen and (min-width: 1280px) {

	.tssubheading {
		margin-top: 96px;
		font-size: 6rem;
	}

}

/*-----------------------------------*\
  MID SECTION
\*-----------------------------------*/

.tsbg {
	background: #fff; padding: 60px 0 20px;
}

.tsv-lg {
	display: none;
}

.midsec h2 {
	font-size: 3.2rem; font-weight: 400;
	color: #002E64;
}

.midsec h2 span {
	color: #C377A7;
}

.midsec h2.has-sub {
	margin-bottom: 8px;
}

.tsv-sub {
	color: #002E64; font-size: 1.8rem;
	margin-bottom: 20px;
}

#valve {
	margin-bottom: 60px;
}

.tsvalve-intro {
	text-align: center; max-width: 648px;
	margin: 0 auto 20px;
}

.tsv-sm h3 {
	margin-bottom: 12px;
}

.tsv-list {
	list-style: none;
}

.tsv-list li {
	padding-left: 30px; line-height: 1.395;
	margin-bottom: 10px; position: relative;
}

.tsv-list li:before {
	content: ""; display: block;
	position: absolute; left: 6px; top: 6px;
	width: 8px; height: 8px; background: #C377A7;
	border-radius: 50%;
}

.tsv-split {
	margin-bottom: 60px;
}

.tsv-split:before {
	content: ""; display: block;
	height: 12px; border-radius: 10px 10px 0 0;
	border: 1px solid #707070;
	border-bottom: none;
	margin-bottom: 40px;
}

.colcontent p {
	margin-bottom: 0;
	line-height: 1.75;
}

.tsv-sm {
	padding-top: 20px;
}

.tsvimg-sm {
	width: 70%;
	margin: 0 auto 20px;
}

#sheath .tsvimg-sm {
	width: 100%;
}

.ts1-bullets {
	display: none;
}

@media only screen and (min-width: 768px) {

	.tsbg {
		padding: 96px 0 48px;
	}

	.midsec .basic {
		padding: 0 24px;
	}

	#valve, #delivery {
		margin-bottom: 96px;
	}

	.tsv-sm {
		display: none;
	}

	.tsv-lg {
		display: block;
	}

	.tsvalve-intro {
		margin: 0 auto 56px;
	}

	.midsec h2 {
		font-size: 4rem;
	}

	.tsvideo {
		width: 342px;
		margin: 0 auto;
	}

	.tsv-about {
		position: relative; max-width: 708px;
		margin: 0 auto;
	}

	.ts1-bullets {
		display: block;
	}

	.bullet {
		position: absolute; font-size: 1.4rem;
		color: #002E64;
	}

	.bullet-copy {
		transition: all 0.5s ease-in-out 1s;
		opacity: 0; 
	}

	.bullet.ltr .bullet-copy {
		transform: translateX(-50px);
	}

	.bullet.rtl .bullet-copy {
		transform: translateX(50px);
	}

	.bullet.ttb .bullet-copy,
	#tsv5 .bullet-copy {
		transform: translateY(50px);
	}

	.bullet.btt .bullet-copy {
		transform: translateY(-50px);
	}

	.bullet.ltr.inview .bullet-copy,
	.bullet.rtl.inview .bullet-copy {
		opacity: 1; transform: translateX(0);
	}

	.bullet.ttb.inview .bullet-copy,
	.bullet.btt.inview .bullet-copy,
	#tsv5.inview .bullet-copy  {
		opacity: 1; transform: translateY(0);
	}

	.bullet:before {
		position: absolute; content: "";
		width: 16px; height: 16px;
		background: #fff; border-radius: 50%;
		z-index: 3; opacity: 0;
		transition: all 0.5s ease-in-out;
	}

	.bullet.inview:before {
		opacity: 1;
	}

	@keyframes pulse-animation {
		0% {
			box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.2);
		}
		100% {
			box-shadow: 0 0 0 20px rgba(0, 0, 0, 0);
		}
	}

	.bullet:hover:before {
		transform: scale(1.5);
		animation: pulse-animation 2s infinite;
	}

	.bullet:after {
		position: absolute; content: "";
		height: 1px; transform: scaleX(0);
		transition: all 0.5s ease-in-out 0.5s;
	}

	.bullet.ltr:after {
		background: linear-gradient(to right,  rgba(0,0,0,0) 0%,rgba(21,120,197,0.65) 100%);
		transform-origin: right;
	}

	.bullet.rtl:after {
		background: linear-gradient(to right,  rgba(21,120,197,0.65) 0%,rgba(0,0,0,0) 100%);
		transform-origin: left;
	}

	.bullet.ttb:after {
		background: linear-gradient(to bottom,  rgba(21,120,197,0.65) 0%,rgba(21,120,197,0) 100%);
		transform: scaleY(0);
		transform-origin: top; width: 1px;
	}

	.bullet.btt:after {
		background: linear-gradient(to bottom,  rgba(21,120,197,0) 0%,rgba(21,120,197,0.65) 100%);
		transform: scaleY(0);
		transform-origin: top; width: 1px;
	}

	.bullet.inview:after {
		transform: scaleX(1);
	}

	.bullet.ttb.inview:after {
		transform: scaleY(1);
	}

	#tsv1 {
		right: 0; top: 86px;
	}

	#tsv1.bullet:before {
		left: -79px; bottom: 3px;
	}

	#tsv1.bullet:after {
		width: 76px; left: -74px;
		bottom: 10px;
	}

	#tsv2 {
		right: 0; top: 134px;
	}

	#tsv2.bullet:before {
		left: -105px; top: 13px;
	}

	#tsv2.bullet:after {
		width: 90px; left: -92px;
		top: 21px;
	}

	#tsv3 {
		left: 10px; top: 128px;
	}

	#tsv3.bullet:before {
		right: -112px; top: 3px;
	}

	#tsv3.bullet:after {
		width: 110px; right: -110px;
		top: 11px;
	}

	#tsv4 {
		left: 5px; bottom: 70px;
	}

	#tsv4.bullet:before {
		right: -90px; top: 4px;
	}

	#tsv4.bullet:after {
		width: 100px; right: -90px;
		top: 12px;
	}

	#tsv6 {
		right: 20px; bottom: 70px;
	}

	#tsv6.bullet:before {
		left: -66px; top: 3px;
	}

	#tsv6.bullet:after {
		width: 60px; left: -60px;
		top: 11px;
	}

	#tsv5 {
		position: absolute; display: flex;
		left: 0; right: 0; bottom: -30px; 
		justify-content: center;
		text-align: center; color: #002E64;
		font-size: 1.4rem; 
	}

	.altbullet {
		position: absolute; top: -54px;
		width: 17px; height: 17px;
		background: #fff; border-radius: 50%;
		z-index: 3; opacity: 0;
		border: 1px solid rgba(21, 120, 197, 0.2);
		transition: all 0.5s ease-in-out;
	}

	.leftbullet {
		left: 239px;
	}

	.rightbullet {
		right: 239px;
	}

	#tsv5.inview .altbullet {
		opacity: 1;
	}

	#tsv5:hover .altbullet {
		transform: scale(1.5);
		animation: pulse-animation 2s infinite;
	}

	#tsv5:hover .altbullet:after {
		transform: none; 
	}

	.bulletline {
		position: absolute; top: -20px; left: 248px;
		width: 214px; height: 1px; background: #1578C5;
		transform: scaleX(0);
		transition: all 0.5s ease-in-out;
	}

	.bulletline:before {
		position: absolute; content: "";
		left: 0; width: 1px; height: 16px;
		background: #1578C5; top: -16px;
	}

	.bulletline:after {
		position: absolute; content: "";
		right: 0; width: 1px; height: 16px;
		background: #1578C5; top: -16px;
	}

	#tsv5.inview .bulletline {
		transform: scaleX(1);
	}

	#tsv5 .bullet-copy {
		position: relative;
	}

	#tsv5 .bullet-copy:before {
		position: absolute; content: "";
		top: -20px; height: 20px; width: 1px;
		left: 50%; transform: translateX(-50%);
		background: linear-gradient(to bottom,  rgba(21,120,197,0.65) 0%,rgba(21,120,197,0) 100%);
	}

	.tsv-split:before {
		margin-bottom: 96px;
	}

	.tsv-splitcol1 {
		text-align: center;
		margin-bottom: 60px;
	}

	.tsv-splitcol2 {
		max-width: 720px; margin: 0 auto;
		position: relative;
	}

	.tsv-sub {
		font-size: 2rem;
	}

	#delivery .colcontent p {
		margin: 0 auto; max-width: 573px;
	}

	#delivery .tsv-sub {
		width: 460px; margin: 0 auto 20px;
	}

	#sheath .colcontent p {
		margin: 0 auto; max-width: 520px;
	}

	.tsv-split .bullet {
		font-size: 1.6rem;
	}

	.tsv-split .bullet:before {
		background: #1578C5;
	}

	#tsd1 {
		left: 237px; top: -1px;
	}

	#tsd1.bullet:before {
		right: -148px; bottom: -12px;
	}

	#tsd1.bullet:after {
		width: 336px; left: 0;
		bottom: -5px;
	}

	#tsd2 {
		right: -12px; top: 298px;
	}

	#tsd2.bullet:before {
		left: -124px; top: -16px;
	}

	#tsd2.bullet:after {
		width: 305px; right: 0;
		top: -9px;
	}

	#tsd3 {
		left: 306px; bottom: 12px;
	}

	#tsd3.bullet:before {
		left: 64px; top: -77px;
	}

	#tsd3.bullet:after {
		left: 72px; top: -78px;
		height: 78px;
	}

	#tss1 {
		right: 80px; top: 67px;
	}

	#tss1.bullet:before {
		right: 27px; bottom: -111px;
	}

	#tss1.bullet:after {
		height: 97px; right: 34px;
		bottom: -96px;
	}

	#tss2 {
		left: 180px; bottom: 36px;
	}

	#tss2.bullet:before {
		left: 0; top: -83px;
	}

	#tss2.bullet:after {
		height: 80px; left: 7px;
		top: -80px;
	}

}

@media only screen and (min-width: 1024px) {

	.midsec h2 {
		font-size: 4.8rem;
	}

	.midsec h2.has-sub {
		margin-bottom: 12px;
	}

}

@media only screen and (min-width: 1280px) {

	.tsbg {
		padding: 130px 0 96px;
	}

	.tsv-split:before {
		margin-bottom: 130px;
	}

	.midsec h2 {
		font-size: 6rem;
	}

}

@media only screen and (min-width: 1440px) {

	.midsec .basic {
		padding: 0 40px;
	}

	.midsec h2 {
		font-size: 7.2rem;
		line-height: 1.1;
		margin-bottom: 40px;
	}

	.midsec h2.has-sub {
		margin-bottom: 20px;
	}

	#valve {
		margin: 0 -40px 130px;
	}

	#delivery {
		margin-bottom: 200px;
	}

	.tsv-sub {
		font-size: 2.4rem;
	}

	#delivery .tsv-sub {
		width: 100%; margin: 0 0 20px;
	}

	.tsvalve-intro {
		margin: 0 auto 80px;
	}

	.tsv-about {
		max-width: 1440px;
	}

	.tsvideo {
		width: 716px;
	}

	.bullet {
		font-size: 1.6rem;
	}

	#tsv1 {
		right: 134px; top: 224px;
	}

	#tsv1.bullet:before {
		left: -210px; bottom: 18px;
	}

	#tsv1.bullet:after {
		width: 198px; left: -200px;
		bottom: 24px;
	}

	#tsv2 {
		right: 152px; top: 306px;
	}

	#tsv2.bullet:before {
		left: -202px; top: 30px;
	}

	#tsv2.bullet:after {
		width: 190px; left: -192px;
		top: 38px;
	}

	#tsv6 {
		right: 120px; bottom: 220px;
	}

	#tsv6.bullet:before {
		left: -198px; top: 30px;
	}

	#tsv6.bullet:after {
		width: 188px; left: -188px;
		top: 38px;
	}

	#tsv3 {
		left: 136px; top: 280px;
	}

	#tsv3.bullet:before {
		right: -268px; top: 5px;
	}

	#tsv3.bullet:after {
		width: 250px; right: -250px;
		top: 13px;
	}

	#tsv4 {
		left: 102px; bottom: 196px;
	}

	#tsv4.bullet:before {
		right: -230px; top: 4px;
	}

	#tsv4.bullet:after {
		width: 233px; right: -222px;
		top: 12px;
	}

	#tsv5 {
		bottom: 22px; 
		font-size: 1.6rem; 
	}

	.leftbullet {
		left: 490px;
	}

	.rightbullet {
		right: 490px;
	}

	.bulletline {
		left: 499px;
		width: 444px;
	}

	.tsv-splitrow {
		display: flex; justify-content: space-between;
		align-items: center;
	}

	.tsv-splitcol1 {
		text-align: left; margin-bottom: 0;
		width: 610px;
	}

	.tsv-splitcol2 {
		width: 720px; margin: 0;
	}

	#delivery .colcontent p {
		margin: 0; 
	}

	#sheath .colcontent p {
		margin: 0;
	}

}

/*-----------------------------------*\
  STATS
\*-----------------------------------*/

#practice {
	text-align: center;
	margin-bottom: 30px;
}

#practice h2 {
	font-size: 3.6rem;
	font-weight: 300;
}

#practice p {
	max-width: 460px;
	margin: 0 auto 30px;
	line-height: 1.75;
}

.percent-row {
	margin-bottom: 48px;
}

.percent {
	font-weight: 500;
	margin-bottom: 30px;
}

.percent-number {
	color: #1578C5; font-size: 7.2rem;
	line-height: 1.1;
	letter-spacing: -0.05em;
}

.percent-number sup {
	position: relative;
	font-size: 0.5em;
	top: -0.725em;
}

.percent-label {
	font-size: 1.6rem; color: #002E64;
}

.practice-disclaimers {
	font-size: 1.2rem;
}

#outcomes {
	margin-bottom: 60px;
}

.chartsec:before {
	content: ""; display: block;
	height: 12px; border-radius: 10px 10px 0 0;
	border: 1px solid #707070;
	border-bottom: none;
	margin-bottom: 40px;
}

.oc-col1 {
	margin-bottom: 40px;
}

.oc-table {
	font-size: clamp(1.1rem, 3.466vw, 1.3rem);
}

.oct-row {
	display: flex; padding: 0 8px;
	align-items: center; height: 64px;
	color: #183969;
}

.oct-row:nth-of-type(odd) {
	background: rgba(22, 77, 160, 0.08);
	border-radius: 8px;
}

.oct-row:first-of-type {
	font-weight: 500; justify-content: center;
	background: rgba(22, 77, 160, 0.2);
}

.oct-stat {
	margin-left: auto;
}

.oc-notes {
	font-size: 1.2rem;
	margin-top: 20px;
}

.oc-note:first-of-type {
	margin-bottom: 12px;
}

.chart {
	position: relative;
}

.chart.oc-chart {
	width: 200px;
	margin: 0;
}

.chart-stat {
	position: absolute; top: 0;
	bottom: 0; width: 120px;
	padding-left: 40px;
	background: url(../img/chartarrow.png) no-repeat 5px top;
	background-size: 31px;
	font-size: 1.2rem; color: #183969;
	display: flex; align-items: center;
	right: -120px; transform: translateX(-120px);
	opacity: 0; line-height: 1.2;
	transition: all 0.5s ease-in-out;
	transition-delay: 1.5s;
}

.inview .chart-stat {
	opacity: 1;
	transform: translateX(0);
}

.sc-chartwrap .chart {
	width: 90%; max-width: 364px;
	margin: 0 auto;
	z-index: 2;
}

.chart-item {
	display: flex; align-items: center;
	justify-content: center; position: relative;
	color: #fff; font-weight: 500; font-size: 2rem;
}

.chart-item span {
	position: relative;
	z-index: 2; line-height: 1;
}

.chart-item:before {
	content: ""; position: absolute;
	left: 0; right: 0; top: 0; bottom: 0;
	transition: all 0.5s ease-in-out;
	transform: scaleY(0); transform-origin: bottom;
}

.n53-chart .chart-item:before {
	transition: all 0.375s ease-in-out;
}

.inview .chart-item:before {
	transform: scaleY(1);
}

.chart-item.chart-top {
	border-radius: 8px 8px 0 0;
	overflow: hidden;
}

.chart-item.chart-btm {
	border-radius: 0 0 8px 8px;
	overflow: hidden;
}

.mild {
	height: 24px;
	margin-bottom: 3px;
}

.chart-item.mild:before {
	background: #0F2E60;
	transition-delay: 1s;
}

.trace {
	height: 108px;
	margin-bottom: 3px;
}

.chart-item.trace:before {
	background: #3777BF;
	transition-delay: 0.5s
}

.none {
	height: 511px;
}

.chart-item.none:before {
	background: #4C9DF8;
}

.n58-4 {
	height: 30px;
	margin-bottom: 3px;
}

.chart-item.n58-4:before {
	background: #091D3C;
	transition-delay: 1.125s
}

.n58-3 {
	height: 376px;
	margin-bottom: 3px;
}

.n53-3 {
	height: 54px;
	margin-bottom: 4px;
}

.chart-item.n58-3:before,
.chart-item.n53-3:before {
	background: #0F2E60;
	transition-delay: 0.75s
}

.chart-item.n53-3:before {
	transition-delay: 1s
}

.n58-2 {
	height: 239px;
}

.n53-2 {
	height: 203px;
	margin-bottom: 4px;
}

.chart-item.n58-2:before,
.chart-item.n53-2:before {
	background: #3777BF;
	transition-delay: 0.375s
}

.chart-item.n53-2:before {
	transition-delay: 0.5s
}

.n58-1 {
	height: 30px;
}

.n53-1 {
	height: 386px;
}

.chart-item.n58-1:before,
.chart-item.n53-1:before {
	background: #4C9DF8;
}

.n53-2 span {
	display: inline-block; padding-bottom: 140px;
}

.chart-ribbon {
	background: #ECF1F8; position: absolute;
	display: flex; align-items: center;
	justify-content: center; color: #000;
	top: 241px; left: -12px; right: -12px;
	height: 123px; border: 4px solid #fff;
	z-index: 3; font-weight: 300; 
	font-size: 3.4rem; letter-spacing: -0.01em;
	opacity: 0; transform: translateY(45px);
	transition: all 0.5s ease-in-out 1.5s;
}

.n53-chart .chart-ribbon {
	font-size: 2rem;
}

.inview .chart-ribbon {
	opacity: 1; transform: translateY(0);
}

.chart-legend {
	text-align: center; font-size: 0;
	margin: 30px auto 0;
}

.oc-col2 .chart-legend {
	max-width: 364px;
}

.cl-item {
	display: inline-block;
	vertical-align: top;
	margin: 0 0 10px 10px;
}

.cl-item:first-of-type {
	margin-left: 0;
}

.cl-color {
	display: inline-block; vertical-align: top;
	width: 20px; height: 20px;
}

.cl-label {
	display: inline-block; vertical-align: top;
	line-height: 20px; font-size: 1.2rem;
	padding-left: 4px;
}

.imp-intro {
	max-width: 410px;
	margin-bottom: 30px;
}

.stripes-row {
	display: flex;
}

.stripe-col {
	width: 50%;
}

.sc-toplabel, .sc-btmlabel {
	display: flex; align-items: center;
	justify-content: center; font-weight: 500;
	height: 54px; font-size: 2rem;
}

.sc-btmlabel {
	font-weight: 400; font-size: 1.8rem;
}

.sc-chartwrap {
/*	background: repeating-linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0px, rgba(0, 0, 0, 0.2) 1px, #fff 1px, #fff 65px);*/
	position: relative;
}

.sc-chartwrap:before {
	content: ""; display: block;
	position: absolute; top: 0;
	left: 0; right: 0; height: 1px;
	background: rgba(0, 0, 0, 0.2);
}

.sc-chartwrap:after {
	content: ""; display: block;
	position: absolute; bottom: 0;
	left: 0; right: 0; height: 1px;
	background: rgba(0, 0, 0, 0.2);
}

#improvements {
	padding-bottom: 28px;
}

@media only screen and (min-width: 768px) {

	#practice {
		max-width: 848px;
		margin: 0 auto 30px;
	}

	#practice h2 {
		font-size: 6rem;
		margin-bottom: 30px;
		line-height: 1.16;
	}

	.percent-row {
		display: flex;
		margin-bottom: 96px;
	}

	.percent {
		width: 50%;
		margin-bottom: 0;
	}

	.practice-disclaimers {
		font-size: 1.4rem;
		max-width: 800px;
		margin: 0 auto;
	}

	.percent-number {
		font-size: 12rem;
	}

	.percent-label {
		font-size: 1.8rem; 
	}

	.chartsec:before {
		margin-bottom: 72px;
	}

	#outcomes {
		margin-bottom: 96px;
	}

	.oc-row {
		display: flex;
		justify-content: space-between;
	}

	.oc-col1 {
		width: 50%;
		margin-bottom: 0;
	}

	.oc-col2 {
		width: 44%;
	}

	.chart {
		max-width: 364px;
		margin: 0 auto;
	}

	.cl-item {
		margin: 0 0 0 40px;
	}

	.oc-col2 .cl-item {
		margin: 0 0 0 8px;
	}

	.cl-color {
		width: 30px; height: 30px;
	}

	.oc-col2 .cl-color {
		width: 20px; height: 20px;
	}

	.cl-label {
		line-height: 30px; font-size: 1.6rem;
		padding-left: 8px;
	}

	.oc-col2 .cl-label {
		line-height: 20px; font-size: 1.3rem;
		padding-left: 4px;
	}

	.imp-intro {
		margin-bottom: 48px;
	}

	#improvements {
		padding-bottom: 36px;
	}

	.n53-chart .chart-ribbon {
		font-size: 3.4rem;
	}

}

@media only screen and (min-width: 1024px) {

	.percent-number {
		font-size: 15rem;
	}

	.percent-label {
		font-size: 2rem; 
	}

	.percent-row {
		margin-bottom: 148px;
	}

	.chartsec:before {
		margin-bottom: 96px;
	}

	.oc-col1 h2 {
		margin-bottom: 30px;
	}

	.oc-table {
		font-size: 1.4rem;
	}

	.oct-row {
		padding: 0 12px;
	}

	.oc-col2 {
		width: 50%;
	}

	.oc2-inner {
		max-width: 440px;
		margin: 0 auto;
	}

	.oc-col2 .chart-legend {
		max-width: 440px;
	}

	.chart.oc-chart {
		width: 260px;
		margin: 0 auto;
	}

	.oc-col2 .cl-item {
		margin: 0 0 0 20px;
	}

	.oc-col2 .cl-item:first-of-type {
		margin: 0;
	}

	.oc-col2 .cl-color {
		width: 30px; height: 30px;
	}

	.oc-col2 .cl-label {
		line-height: 30px;
		font-size: 1.4rem;
	}

	.chart-ribbon {
		left: -24px; right: -24px;
	}

	#improvements {
		padding-bottom: 48px;
	}

	.imp-intro {
		margin-bottom: 60px;
	}

}

@media only screen and (min-width: 1280px) {

	.oc-col1 {
		width: 53%;
	}

	.oc-col2 {
		width: 47%;
	}

	.oc1-inner {
		max-width: 652px;
		margin: 0 auto;
	}

	.oc-col1 h2 {
		font-size: 3.5rem;
	}

	.oc-table {
		font-size: 2rem;
		max-width: 624px;
	}

	.oct-row {
		padding: 0 20px;
		height: 80px;
	}

	.oct-row:nth-of-type(odd) {
		border-radius: 16px;
	}

	.oc-notes {
		font-size: 1.4rem;
		margin-top: 30px;
		padding-left: 20px;
	}

	.oc-note:first-of-type {
		margin-bottom: 20px;
	}

	.imp-intro {
		margin-bottom: 72px;
	}

	.chart.oc-chart {
		width: 300px;
	}

	.oc-col2 .cl-label {
		font-size: 1.6rem;
		padding-left: 8px;
	}

	.chart-stat {
		width: 160px;
		font-size: 1.6rem;
		right: -160px;
	}

}

@media only screen and (min-width: 1440px) {

	.chart.oc-chart {
		width: 364px;
	}

	.chart-stat {
		width: 200px;
		font-size: 2rem;
		right: -200px;
		padding-left: 44px;
		background: url(../img/chartarrow.png) no-repeat 8px top;
		background-size: 31px;
	}

}

@media only screen and (min-width: 1520px) {

	.chart-stat {
		width: 200px;
		font-size: 2rem;
		right: -200px;
		padding-left: 52px;
		background: url(../img/chartarrow.png) no-repeat 14px top;
		background-size: 31px;
	}

}

@media only screen and (min-width: 1680px) {

	.chart-stat {
		font-size: 2.2rem;
	}

}