/*
	----------------
	/ Variables
	----------------
*/

:root{
  
  	/*
        ----------------
        - Colours
        ----------------
    */

	--c--h: 210;

	--c-1: hsl(var(--c--h), 40%, 98%);
	--c-2: hsl(var(--c--h), 30%, 96%);
	--c-3: hsl(var(--c--h), 25%, 91%);
	--c-4: hsl(var(--c--h), 22%, 84%);
	--c-5: hsl(var(--c--h), 20%, 65%);
	--c-6: hsl(var(--c--h), 15%, 46%);
	--c-7: hsl(var(--c--h), 15%, 38%);
	--c-8: hsl(var(--c--h), 20%, 30%);
	--c-9: hsl(var(--c--h), 25%, 22%);
	--c-10: hsl(var(--c--h), 30%, 19%);
	--c-11: hsl(var(--c--h), 35%, 14%);
	--c-12: hsl(var(--c--h), 40%, 10%);
	--c-primary--h: 201;
	--c-primary--s: 100%;
	--c-primary: hsl(var(--c-primary--h), var(--c-primary--s), 23%);
	--c-primary-light: hsl(var(--c-primary--h), var(--c-primary--s), 27%);
	--c-primary-dark: hsl(var(--c-primary--h), var(--c-primary--s), 15%);

	--c-primary-contrast: #fff;

	--c-secondary--h: 140;
	--c-secondary--s: 62%;
	--c-secondary: hsl(var(--c-secondary--h), var(--c-secondary--s), 46%);
	--c-secondary-light: hsl(var(--c-secondary--h), var(--c-secondary--s), 50%);
	--c-secondary-dark: hsl(var(--c-secondary--h), var(--c-secondary--s), 34%);

	--c-gradient-1: #19bc70;
	--c-gradient-2: #12b36e;
	--c-gradient-3: #00a06b;
	--c-gradient-4: #009e7e;
	--c-gradient-5: #008d84;
	--c-gradient-6: #008a9c;
	--c-gradient-7: #007ea5;
	--c-gradient-8: #006da2;



	/*
		----------------
		- Spacing
		----------------
	*/

	--s-section: calc(4.5rem + 4.5 * var(--range));
	--s-0: 0rem;
	--s-1: calc(0.4rem + .2 * var(--range));
	--s-2: calc(1rem + .4 * var(--range));
	--s-3: calc(1.8rem + .6 * var(--range));
	--s-4: calc(2.8rem + .8 * var(--range));
	--s-5: calc(4rem + 1.0 * var(--range));
	--s-6: calc(5.4rem + 1.2 * var(--range));
	--s-7: calc(7rem + 1.4 * var(--range));
	--s-8: calc(8.8rem + 1.6 * var(--range));
	--s-9: calc(10.8rem + 1.8 * var(--range));


	/*
		----------------
		- Assign colours
		----------------
	*/

	--root--ba-co: rgb(var(--theme-page_background)); 
	--root--co: var(--c-7);
	--c-soft: var(--c-6);
	--c-hard: var(--c-10);
	--c-light: var(--c-7);
	--c-dark: var(--c-9);
  
  
	/*
		----------------
		- Typography
		----------------
	*/

	--li-he: 1.6;
	--text-crop-top: 0.82;
	--text-crop-bottom: 0.77;

  
  
	--range: 0rem;
}

@media (min-width: 400px){
	:root{
		--range: calc((100vw - 40rem) / (120 - 40));
	}
}
@media (min-width: 1200px){
	:root{
		--range: 1rem;
	}
}




/*
	----------------
	/ Base
	----------------
*/

*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0;min-width:0;list-style:none}

figure{
  margin: 0;
}

html{
  font-size: 10px;
}

img{
	max-width: 100%;
	height: auto;
}

.ipsApp video{
	display: inline-block;
	max-width: 100%;
  	height: auto;
  	vertical-align: top;
}


/*
	----------------
	- Grid
	----------------
*/
.grid, .fluid {
	--basis: 250px;
	--gap: 0px;
	--row-gap: 0px;
}

.grid {
	--auto: auto-fill;
	display: grid;
	grid-gap: var(--row-gap) var(--gap);
	gap: var(--row-gap) var(--gap);
	grid-template-columns: repeat(var(--auto), minmax(var(--basis), 1fr));
	grid-template-columns: repeat(var(--auto), minmax(min(var(--basis), 100%), 1fr));
}

.grid, .grid > * {
	margin: 0 !important;
}

.fluid {
	display: flex;
	flex-wrap: wrap;
	flex-basis: 250px;
}

.fluid > * {
	flex: 1 1 0%;
	flex-basis: inherit;
}


/*
	----------------
	- Flexbox
	----------------
*/
.flex, .d_flex {
	display: flex;
}

.inline-flex, .d_inline-flex {
	display: inline-flex;
}

.flex-panels {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.flex-panels__primary {
	flex: 9999 1 50%;
}

.flex-panels__secondary {
	flex: 1 1 auto;
}

/*
	----------------
	- Ratio
	----------------
*/
.ratio {
	--ratio: 100%;
	display: grid;
	align-items: center;
  	grid-template-areas: 'ratio';
	position: relative;
	background-size: cover;
	background-position: 50%;
}

.ratio::before {
	content: '';
	padding-top: var(--ratio);
	grid-area: ratio;
	pointer-events: none;
}

.ratio > * {
	grid-area: ratio;
	border-radius: inherit;
	max-height: inherit;
}

.ratio > *,
.ratio > picture > img {
	-o-object-fit: cover;
	 object-fit: cover;
}

.ratio.ratio--contain > *,
.ratio.ratio--contain > picture > img {
	-o-object-fit: contain;
	 object-fit: contain;
}

.ratio > i {
	pointer-events: none;
}

.ratio > :not(.ratio__content),
.ratio > picture > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.ratio__content {
	position: relative;
}

.ratio_20 {
	--ratio: 20%;
}

.ratio_25 {
	--ratio: 25%;
}

.ratio_30 {
	--ratio: 30%;
}

.ratio_40 {
	--ratio: 40%;
}

.ratio_50 {
	--ratio: 50%;
}

.ratio_60 {
	--ratio: 60%;
}

.ratio_66 {
	--ratio: 66%;
}

.ratio_70 {
	--ratio: 70%;
}

.ratio_75 {
	--ratio: 75%;
}

.ratio_80 {
	--ratio: 80%;
}

.ratio_90 {
	--ratio: 90%;
}

.ratio_100 {
	--ratio: 100%;
}

.ratio_110 {
	--ratio: 110%;
}

.ratio_120 {
	--ratio: 120%;
}

.ratio_130 {
	--ratio: 130%;
}

.ratio_140 {
	--ratio: 140%;
}

.ratio_150 {
	--ratio: 150%;
}

.ratio_160 {
	--ratio: 160%;
}

.ratio_170 {
	--ratio: 170%;
}

.ratio_180 {
	--ratio: 180%;
}

.ratio_190 {
	--ratio: 190%;
}

.ratio_200 {
	--ratio: 200%;
}

.ratio_video {
	--ratio: 56.25%;
}

@media (min-width: 640px) {
	.md__ratio_20 {
	--ratio: 20%;
	}
	.md__ratio_25 {
	--ratio: 25%;
	}
	.md__ratio_30 {
	--ratio: 30%;
	}
	.md__ratio_40 {
	--ratio: 40%;
	}
	.md__ratio_50 {
	--ratio: 50%;
	}
	.md__ratio_60 {
	--ratio: 60%;
	}
	.md__ratio_66 {
	--ratio: 66%;
	}
	.md__ratio_70 {
	--ratio: 70%;
	}
	.md__ratio_75 {
	--ratio: 75%;
	}
	.md__ratio_80 {
	--ratio: 80%;
	}
	.md__ratio_90 {
	--ratio: 90%;
	}
	.md__ratio_100 {
	--ratio: 100%;
	}
	.md__ratio_110 {
	--ratio: 110%;
	}
	.md__ratio_120 {
	--ratio: 120%;
	}
	.md__ratio_130 {
	--ratio: 130%;
	}
	.md__ratio_140 {
	--ratio: 140%;
	}
	.md__ratio_150 {
	--ratio: 150%;
	}
	.md__ratio_160 {
	--ratio: 160%;
	}
	.md__ratio_170 {
	--ratio: 170%;
	}
	.md__ratio_180 {
	--ratio: 180%;
	}
	.md__ratio_190 {
	--ratio: 190%;
	}
	.md__ratio_200 {
	--ratio: 200%;
	}
	.md__ratio_video {
	--ratio: 56.25%;
	}
}

@media (min-width: 860px) {
	.lg__ratio_20 {
	--ratio: 20%;
	}
	.lg__ratio_25 {
	--ratio: 25%;
	}
	.lg__ratio_30 {
	--ratio: 30%;
	}
	.lg__ratio_40 {
	--ratio: 40%;
	}
	.lg__ratio_50 {
	--ratio: 50%;
	}
	.lg__ratio_60 {
	--ratio: 60%;
	}
	.lg__ratio_66 {
	--ratio: 66%;
	}
	.lg__ratio_70 {
	--ratio: 70%;
	}
	.lg__ratio_75 {
	--ratio: 75%;
	}
	.lg__ratio_80 {
	--ratio: 80%;
	}
	.lg__ratio_90 {
	--ratio: 90%;
	}
	.lg__ratio_100 {
	--ratio: 100%;
	}
	.lg__ratio_110 {
	--ratio: 110%;
	}
	.lg__ratio_120 {
	--ratio: 120%;
	}
	.lg__ratio_130 {
	--ratio: 130%;
	}
	.lg__ratio_140 {
	--ratio: 140%;
	}
	.lg__ratio_150 {
	--ratio: 150%;
	}
	.lg__ratio_160 {
	--ratio: 160%;
	}
	.lg__ratio_170 {
	--ratio: 170%;
	}
	.lg__ratio_180 {
	--ratio: 180%;
	}
	.lg__ratio_190 {
	--ratio: 190%;
	}
	.lg__ratio_200 {
	--ratio: 200%;
	}
	.lg__ratio_video {
	--ratio: 56.25%;
	}
}


/*
	----------------
	- svg
	----------------
*/

.svg{
  display: block;
  max-width: 100%;
  height: auto;
  fill: currentColor;
}

.svg > g > path:nth-child(2):nth-last-child(1),
.svg__primary{
  fill: var(--svg-primary--fi, currentColor);
  opacity: var(--svg-primary--op, 1);
}


.svg > g > path:nth-child(1):nth-last-child(2),
.svg__secondary{
  fill: var(--svg-secondary--fi, currentColor);
  opacity: var(--svg-secondary--op, .5);
}

.svg > path:nth-child(2){
	opacity: .6;
}

/*
	----------------
	- Set font-size for website content
	----------------
*/

[data-page="website"] #elCmsPageWrap{
	font-size: 1.5rem;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}



/*
	----------------
	/ Components
	----------------
*/

/*
	----------------
	- Invision logo
	----------------
*/

.bi_logo-black{
	background-image: url(https://sitecontent.invisioncommunity.com/layout/logo--black-cropped.svg);
}
.bi_logo-white{
	background-image: url(https://sitecontent.invisioncommunity.com/layout/logo--white-cropped.svg);
}

	.bg-panel.bi_logo-black,
	.bg-panel.bi_logo-white{
		filter: opacity(.1);
		opacity: 1;
	}


/*
	----------------
	- Sections
	----------------
*/

.i-section{
	padding: var(--s-section) 0;
}

.i-section--raised{
	background-color: var(--root--ba-co);
	box-shadow: rgba(14, 39, 78, 0.05) 0px 0px 0px 1px, rgba(14, 39, 78, 0.05) 0px 0px 40px;
	position: relative;
}

.i-section--faint{
	background-image: linear-gradient(to right, hsla(var(--c--h), 20%, 65%, 0), hsla(var(--c--h), 20%, 65%, .3), hsla(var(--c--h), 20%, 65%, 0)), radial-gradient(closest-side, var(--c-2) 0%, var(--root--ba-co) 100%);
    background-size: 100% 1px, 100% 400px;
    background-position: 50% 100%, 50% calc(100% + 200px);
    background-repeat: no-repeat;
}


/*
	----------------
	- Backgrounds
	----------------
*/

:root{
 --section-clip: 4vmin; 
}

@media (min-width: 900px){
	:root{
	 --section-clip: 8vmin; 
	}	
}

.bg-panel{
	background-position: 50%;
	background-size: cover;
	border-radius: inherit;
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

._bg-panel--clip-bottom,
._bg-panel--clip-top,
._bg-panel--clip{
	background: none !important;
}

._bg-panel--clip-top{
	margin-top: calc(var(--section-clip) * -1);
}

	._bg-panel--clip-top::before,
	._bg-panel--clip::before,
	._bg-panel--clip::after,
	._bg-panel--clip-bottom::after{
		content: '';
		display: block;
		height: var(--section-clip);
	}

	._bg-panel--clip-top > .bg-panel{
		clip-path: polygon(0 var(--section-clip), 100% 0, 100% 100%, 0 100%);
	}

._bg-panel--clip-bottom{
	margin-bottom: calc(var(--section-clip) * -1);
}

	._bg-panel--clip-bottom > .bg-panel{
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--section-clip)), 0 100%);
	}

._bg-panel--clip{
	margin-top: calc(var(--section-clip) * -1);
	margin-bottom: calc(var(--section-clip) * -1);
}

	._bg-panel--clip > .bg-panel{
		clip-path: polygon(0 var(--section-clip), 100% 0, 100% calc(100% - var(--section-clip)), 0 100%);
	}


/*
	----------------
	- Boxes
	----------------
*/

.i-box{
	--bar--ba-co: var(--gradient, currentColor);
	background: #fff;
	box-shadow: rgba(12, 34, 88, 0.06) 0px 10px 20px, rgba(11, 49, 110, 0.1) 0px 6px 2px -5px;
	border-radius: 9px;
	padding: var(--s-4);
	position: relative;
}

	.i-box--with-bar::before{
		content: '';
		height: 6px;
		background: var(--bar--ba-co);
		position: absolute;
		top: 0; left: 0; right: 0;
		border-top-left-radius: inherit;
		border-top-right-radius: inherit;
	}

	.i-box.-tinted{
		background: var(--c-2);
		box-shadow: none;
	}


/*
	----------------
	- Headers
	----------------
*/

.h1, .h2, .h3, .h4{
  color: var(--c-hard);
}

.section-title{
	/* --title--fo-si: calc(2.4rem + 2.2 * var(--range)); */
  	--title--fo-si: calc(2.2rem + 1 * var(--range));
	--desc--fo-si: calc(1.5rem + 0.3 * var(--range));
}

	.section-title_-1{
		--title--fo-si: calc(1.8rem + 2.5 * var(--range));
		--desc--fo-si: calc(1.5rem + 0.2 * var(--range));
	}

	.section-title__category{
		font-weight: bold;
		color: var(--c-secondary);
		text-transform: uppercase;
		margin: 0;
      	font-size: inherit;
	}

	.section-title__title{
		color: var(--c-primary-dark);
		font-size: var(--title--fo-si);
		margin: 0;
		font-weight: bold;
		line-height: 1;
		--li-he: 1;
	}

		.section-title__category + .section-title__title{
			margin-top: .2em;
		}

	.section-title__desc{
		font-size: var(--desc--fo-si);
		font-weight: 500;
		color: var(--c-primary-light);
		/* max-width: 700px; */
	}

	.section-title__title + .section-title__desc{
		margin-top: 0.8em;
	}




/*
	----------------
	- Link panel
	----------------
*/

.link-panel{
	display: block;
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
}

	.link-panel > span{
		border: 0;
		clip: rect(1px, 1px, 1px, 1px);
		clip-path: inset(50%);
		height: 1px;
		margin: -1px;
		overflow: hidden;
		padding: 0;
		position: absolute !important;
		white-space: nowrap !important;
		width: 1px;
	}


/*
	----------------
	- Heroes
	----------------
*/

.hero{
	background-color: var(--c-primary-dark);
	background-size: cover;
	background-position: 50%;
	color: var(--c-primary-contrast);
	padding: calc(4rem + 4 * var(--range)) 0;
	/* min-height: 350px; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	position: relative;
}

	.hero--tall{
		padding: calc(12vh + 4 * var(--range)) 0;
	}

    .hero--short{
        padding-top: var(--s-6);
        padding-bottom: var(--s-6);
        min-height: 0;
    }

	.hero__width{
		max-width: 900px;
		margin: 0 auto;
		flex: 1 1 auto;
		min-width: 0;
		position: relative;
	}

	.hero > .ipsLayout_container{
		position: relative;
		/* flex: 1 1 auto; */
		width: 100%;
	}

	.hero__section{
		font-weight: bold;
		color: var(--c-secondary);
		text-transform: uppercase;
		margin: 0;
	}

	.hero__title{
		font-size: calc(2rem + 3 * var(--range));
		margin: 0;
		line-height: 1.2;
		--li-he: 1.2;
	}

		.hero__section + .hero__title{
			margin-top: var(--s-1);
		}

	.hero__subtitle{
		font-size: calc(1.5rem + 0.5 * var(--range));
		margin: var(--s-1) 0 0 0;
		font-weight: 500;
      	color: var(--c-4);
		/* max-width: 700px; */
	}

	.hero__subtitle a{
    color: inherit;
    text-decoration: underline;
	}

/*
	----------------
	- Buttons
	----------------
*/

:root {
	--button--ba-co: transparent;
	--button--co: currentColor;
	--button--bo-ra: 4px;
	--button--bo-co: currentColor;
	--button--bo-co-op: 0;
}

.button {
  	border: 0;
  	-webkit-appearance: none;
  	appearance: none;
  	font: inherit;
  
	background-color: var(--button--ba-co);
	color: var(--button--co);
	align-items: center;
	border-radius: var(--button--bo-ra);
	cursor: pointer;
	display: inline-flex;
	font-weight: 500;
	justify-content: center;
	line-height: 1.2 !important; /* Required due to .ipsApp button */
	min-width: 40px;
	padding: .8em 1.8em;
	position: relative;
	text-align: center;
	text-decoration: none !important;
	transition: all 0.2s ease-in-out;
	vertical-align: middle;
}

	a.button{
		color: var(--button--co);
	}

.button:active {
	top: 1px;
}

.button:hover,
.hover:hover .button {
	color: var(--button-hover--co, var(--button--co));
	background-color: var(--button-hover--ba-co, var(--button--ba-co));
}

.button--disabled{
	filter: grayscale(1);
	opacity: .7;
}

.button > * + * {
	margin-left: .5em;
}

.button::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 1px solid var(--button--bo-co);
	border-radius: inherit;
	opacity: var(--button--bo-co-op);
	pointer-events: none;
}

.button:hover::after,
.hover:hover .button::after {
	opacity: var(--button-hover--bo-co-op, var(--button--bo-co-op));
}

.button--primary {
	--button--ba-co: var(--c-primary);
	--button--co: #fff;
	--button-hover--ba-co: var(--c-primary-light);
	box-shadow: rgba(12, 54, 119, 0.24) 0px 7px 15px -3px;
}

.button--secondary {
	--button--ba-co: var(--c-secondary);
	--button--co: #fff;
	--button-hover--ba-co: var(--c-secondary-light);
}

.button--ghost {
	--button--bo-co-op: .5;
	--button-hover--bo-co-op: 1;
}

.button--wide{
  display: flex;
}

.button--inherit{
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}

	.button--inherit::before{
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: currentColor;
		border-radius: inherit;
		opacity: .1;
		pointer-events: none;
		transition: all 0.2s ease-in-out;
	}

		.button--inherit:hover::before,
		.hover:hover .button--inherit::before{
			opacity: .18;
		}

.button--ba-co{
	--button--ba-co: #fff;
	--button--co: var(--c-primary);
	box-shadow: rgba(0,0,0,.1) 0px 3px 6px -1px;
}

.button--wi_1{
	min-width: min(200px, 100%);
}

.button--wi_2{
	min-width: min(260px, 100%);
}

.button--he_1{
	min-height: calc(4rem + 1 * var(--range));
}



/*
	----------------
	Format: This neatly formats blocks of text
	----------------
*/

.ipsLayout_container--ch{
  max-width: 100ch;
}

.format > * {
	margin-top: var(--format, 1.28em);
	margin-bottom: var(--format, 1.28em);
}

.format h1, .format h2, .format h3, .format h4 {
	margin-top: var(--format-headers, 0px);
  margin-bottom: 0;
	font-weight: bold;
}

.format h3, .format h4{
	font-weight: 500;
}

.format > *:first-child {
	margin-top: 0;
}

.format > *:last-child {
	margin-bottom: 0;
}

.format blockquote,
.format pre {
	background-color: var(--c-2);
	padding: var(--s-2);
	border-left: 4px solid var(--c-4);
}

.format pre {
	overflow: auto;
}

.format_-3 {
	--format: 0;
}

.format_-2 {
	--format: calc(var(--li-he) * 0.3em);
}

.format_-1 {
	--format: calc(var(--li-he) * 0.6em);
}

.format_reset {
	--format: calc(var(--li-he) * 0.8em);
}

.format_1 {
	--format: calc(var(--li-he) * 1em);
}

.format--legal{
	--format-headers: 1em;
}

/*
  ----------------
  - Lists
  ----------------
*/

/* List with SVG's */
.list-with-icon{
	--basis: 260px;
	--gap: var(--s-5);
	--row-gap: var(--gap);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--basis), 1fr));
  grid-gap: var(--row-gap) var(--gap);
  gap: var(--row-gap) var(--gap);
  margin: 0 !important;
}

	.list-with-icon > *{
	  max-width: calc(100vw - 30px);
	  margin: 0 !important;
	}

@supports (width: min(1px, 100%)){
	.list-with-icon{
		grid-template-columns: repeat(auto-fit, minmax(min(var(--basis), 100%), 1fr));
	}
	.list-with-icon > *{
		max-width: none;
	}
}

.list-with-icon .__icon{
	margin-bottom: var(--s-2);
	color: var(--c-secondary);
	font-size: var(--icon--size, 24px);
	height: var(--icon--size, 24px);
}

	.list-with-icon svg,
	.list-with-icon i.fa{		
		height: 100%;
		width: auto;
		display: block;
	}

	.list-with-icon .__title{
		font-weight: 500;
		color: var(--c-hard);
		font-size: var(--title--fo-si, 1.6rem);
		line-height: 1.4;
	}


/* Large list */
.list-with-icon.-large{
	--icon--size: 30px;
	--title--fo-si: 1.8rem;
}
		.list-with-icon.-large .__title + *{
			margin-top: var(--s-1);
		}


/* Small list */
.list-with-icon.-small{
	--icon--size: 16px;
}

/* Invert */
.list-with-icon.-invert{
	color: var(--c-5);
}
	.list-with-icon.-invert .__title{
		color: #fff;
	}

/* Gradient icons */
.list-with-icon.-gradient .__icon{
	color: var(--gradient, var(--c-secondary));
}

/* Inline svg's */
.list-with-icon.-inline > *{
  display: flex;
}

	.list-with-icon.-inline .__icon{
		font-size: var(--icon--size, 24px);
		width: 1em;
		margin: 5px 12px 0 0;
	}

	.list-with-icon.-inline.-boxed .__icon{
        margin: 4px 15px 0 0;
    }

	.list-with-icon.-inline svg,
	.list-with-icon.-inline i.fa{
		width: 1em;
		height: auto;
	}

	.list-with-icon.-inline li > *:first-child{
		flex: 0 0 auto;
	}

	.list-with-icon.-inline li > *:last-child{
		flex: 1 1 auto;
	}

/* Small inline */
.list-with-icon.-inline.-small{
	--icon-size: 16px;
}

/* Boxed icons */
.list-with-icon.-boxed .__icon{
	width: 1em;
	height: 1em;
	font-size: var(--icon--size, 40px);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 5px;
	color: #fff;
	background-color: var(--gradient, var(--icon--ba-co, var(--c-secondary)));
	/* background-image: linear-gradient(135deg, rgba(255,255,255,.14) 25%, rgba(0,0,0,0) 25%, rgba(0,0,0,0) 75%, rgba(0,0,0,.08) 75%); */
	background-image: linear-gradient(135deg, rgba(255,255,255,.1) 50%, rgba(0,0,0,0) 50%);
}

	.list-with-icon.-boxed .__icon .svg,
	.list-with-icon.-boxed .__icon .fa{
		height: 50%;
		max-width: 80%;
		font-size: .5em;
	}

	.list-with-icon.-boxed .__icon .fa{
		height: auto;
		max-width: none;
	}

/* Large boxed icons */
.list-with-icon.-boxed.-large{
	--icon--size: 45px;
}

/* Small boxed icons */
.list-with-icon.-boxed.-small{
	--icon--size: 30px;
}

/*
	----------------
	- Logo grid
	----------------
*/

.logo-grid{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

	.logo-grid li{
		flex:  0 0 auto;
		margin: 20px 30px;
		margin: 20px min(4vw, 30px);
      	max-width: 170px;
	}

	.logo-grid a{
		display: block;
		transition: transform 0.15s ease-in-out;
	}

	.logo-grid a:hover{
		transform: scale(1.1);
	}

	.logo-grid img{
		width: auto;
		max-width: 100%;
		height: 40px;
		object-fit: contain;
		display: block;
	}

.logo-grid--mono img{
	filter: sepia(1) brightness(.8) hue-rotate(174deg) opacity(0.65) saturate(1.3);
}

	.logo-grid--mono a:hover img{
		filter: none;
	}



/*
	----------------
	- Devices
	----------------
*/

.device-mobile{
	--mobile--wi: 390;
	--mobile--he: 844;
	--mobile-ratio: calc(var(--mobile--he) / var(--mobile--wi));
	--mobile-radius: 10%;
	position: relative;
	border-radius: var(--mobile-radius) / calc(var(--mobile-radius) / var(--mobile-ratio));
	background: var(--c-8);
	box-shadow: 0 50px 100px -20px rgba(50,50,93,.25),0 30px 60px -30px rgba(0,0,0,.3),inset 0 0 3px 0 rgba(0,0,0,.3);
  margin: 0;
}

	.device-mobile ._rim{
		padding: 1%;
	}

	@supports(clip-path: polygon(0 0, 100% 0, 0 100%)){
		.device-mobile::after{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0));
			opacity: .1;
			clip-path: polygon(0 0, 100% 0, 0 100%);
			border-radius: inherit;
			pointer-events: none;
		}
	}

	.device-mobile ._buttons{
		position: absolute;
		right: 100%;
		top: 16%;
		width: 0.87%;
		height: 24%;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

		.device-mobile ._buttons i,
		.device-mobile ._buttons::before,
		.device-mobile ._buttons::after{
			content: '';
			background: var(--c-8);
			height: 30%;
			border-radius: 3px 0 0 3px;
		}

		.device-mobile ._buttons::before{
			height: 15%;
		}

	.device-mobile ._inner{
		--mobile-radius: 9.6%;
		border-radius: var(--mobile-radius) / calc(var(--mobile-radius) / var(--mobile-ratio));
		background: #0e1822;
		padding: 3.5%;
	}

	.device-mobile ._content{
		--mobile-radius: 8%;
		border-radius: var(--mobile-radius) / calc(var(--mobile-radius) / var(--mobile-ratio));
		position: relative;
		overflow: hidden;
	}

	.device-mobile img{
		width: 100%;
	}

		.device-mobile ._content::before {
		    content: '';
		    display: block;
		    padding-bottom: calc(var(--mobile-ratio) * 100%);
			pointer-events: none;
		}

		.device-mobile ._content::after{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			border: 1px solid rgba(0, 0, 0, 0.15);
			border-radius: inherit;
			pointer-events: none;
		}

	.device-mobile ._content > *{
		border-radius: inherit;
		position: absolute;
		top: 0; left: 0;
		width: 100%; height: 100%;
		object-fit: cover;
		object-position: 0 0;
	}

.device-desktop{
	/* --device--wi: 1600; */
  	--device--wi: 1440;
	--device--he: 900;
	background: rgba(14, 24, 34, 0.88);
	border-radius: 5px;
	overflow: hidden;
	box-shadow: 0 50px 100px -20px rgba(50,50,93,.25),0 30px 60px -30px rgba(0,0,0,.3);
	margin: 0;
}

	.device-desktop ._chrome{
		position: relative;
	}

		.device-desktop ._chrome::before{
			content: '';
			display: block;
			padding-bottom: 4%;
		}

		.device-desktop ._chrome i{
			width: 1%;
			border-radius: 50%;
			background: #fff;
			opacity: .3;
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
		}

			.device-desktop ._chrome i::before{
				content: '';
				display: block;
				padding-bottom: 100%;
			}

		.device-desktop ._chrome i:nth-child(1){
			left: 1%;
		}
		.device-desktop ._chrome i:nth-child(2){
			left: 2.5%;
		}
		.device-desktop ._chrome i:nth-child(3){
			left: 4%;
		}

	.device-desktop ._content{
		position: relative;
		margin: .8%;
		/* margin: .4%;
		margin: max(1px, .4%); */
		border-radius: 4px;
		overflow: hidden;
		background: #edf0f4;
	}

		.device-desktop ._chrome + ._content{
			margin-top: 0;
		}

		/* Minimal versions have no chrome border */
		.device-desktop--minimal{
			border-radius: 6px;
		}

			.device-desktop--minimal ._content{
				margin: 0;
				border-radius: inherit;
			}

		.device-desktop ._content::before{
			content: '';
			display: block;
			padding-bottom: calc(var(--device--he) / var(--device--wi) * 100%);
			border-radius: inherit;
			position: relative;
			z-index: 1;
			box-shadow: inset rgba(255,255,255,0.15) 0px 0px 0px 1px;
          	pointer-events: none;
		}

		.device-desktop ._content > *{
			display: block;
			width: 100%;
			position: absolute;
			top: 0; left: 0;
			height: 100%;
			object-fit: cover;
			object-position: 50% 0;
		}

.device-desktop img{
  width: 100%;
}

.device-desktop--light{
	background: rgba(90, 107, 124, 0.88);
	box-shadow: none;
}

.device-desktop--light ._content::before{
	box-shadow: none;
}

.device-desktop--auto ._content::before{
	padding: 0;
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
}

		.device-desktop--auto ._content img,
		.device-desktop--auto ._content video{
			position: relative;
			height: auto;
		}



/* The ._scroll element allows long screenshots to be scrolled */

/* This animation only enables pointer-events when screenshots are hovered for 1s. This prevents scroll hijacking */
@keyframes delay-pointer-events {
    0% {
        pointer-events: none;
    }
    100% {
        pointer-events: auto;
    }
}

.device-desktop ._scroll,
.device-mobile ._scroll,
.hero-screenshots ._scroll{
  overflow-y: scroll;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
  pointer-events: none;
}

	
	.device-desktop:hover ._scroll,
	.device-mobile:hover ._scroll,
	.hero-screenshots:hover ._scroll{
		animation-name: delay-pointer-events;
		animation-duration: 0s;
		animation-delay: .7s;
		animation-fill-mode: forwards;
	}

	.device-mobile ._scroll::-webkit-scrollbar,
	.device-desktop ._scroll::-webkit-scrollbar,
	.hero-screenshots ._scroll::-webkit-scrollbar {
	  -webkit-appearance: none;
	  width: 0px;
	}

		.device-mobile ._scroll img,
		.device-desktop ._scroll img,
		.hero-screenshots ._scroll img{
		  display: block;
		}


/* Scroll icon */
._content ._scroll-icon,
.hero-screenshots ._scroll-icon{
	position: absolute;
	bottom: -1px;
	left: 0;
	right: 0;
	top: auto;
	height: 12%;
	background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.5));
	border-radius: 0;
	color: #fff;
	pointer-events: none;
	
	opacity: 0;
	transform: translateY(50%);
	transition: all 0.2s ease-in-out;
}

._content:hover ._scroll-icon,
.hero-screenshots ._mobile:hover ._scroll-icon,
.hero-screenshots ._desktop:hover ._scroll-icon{
	transition-delay: 0.7s;
	opacity: 1;
	transform: translateY(0);
}

._scroll-icon::before{
	content: '';
	position: absolute;
	bottom: 10px;
	left: 50%;
	width: 18px;
	height: 32px;
	margin-left: -9px;
	border-radius: 100px;
	border: 2px solid currentColor;
}

@keyframes scroll-icon{
	0%{
		opacity: 1;
		transform: translateY(0);
	}
	100%{
		opacity: 0;
		transform: translateY(16px);
	}
}

._scroll-icon::after{
	content: '';
	position: absolute;
	width: 4px;
	height: 4px;
	background: currentColor;
	border-radius: 10px;
	left: 50%;
	margin-left: -2px;
	bottom: 30px;
}

/* Add filter and animation on hover - potential performance improvement? */
._content:hover ._scroll-icon::before,
.hero-screenshots ._mobile:hover ._scroll-icon::before,
.hero-screenshots ._desktop:hover ._scroll-icon::before{
	filter: drop-shadow(rgba(0,0,0,.4) 0px 1px 1px);
}
._content:hover ._scroll-icon::after,
.hero-screenshots ._mobile:hover ._scroll-icon::after,
.hero-screenshots ._desktop:hover ._scroll-icon::after{
	animation-name: scroll-icon;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	filter: drop-shadow(rgba(0,0,0,.4) 0px 1px 1px);
}



/* Slideshows in devices

	For n images:
		Always use 0%, 5% and 100%
		Add (100% / n + 5%) to the bottom selector.
		Add 5% and add it to the top selector

*/

@keyframes device-slideshow{
	0%, 42%, 100%{
		opacity: 0;
	}
	5%, 38%{
		opacity: 1;
	}
}

.device-mobile.-slideshow img,
.device-desktop.-slideshow img{
	animation-name: device-slideshow;
	animation-duration: 12s;
	animation-iteration-count: infinite;
  	will-change: opacity;
}

.device-mobile.-slideshow img:nth-child(2),
.device-desktop.-slideshow img:nth-child(2){
	animation-delay: 4s;
}

.device-mobile.-slideshow img:nth-child(3),
.device-desktop.-slideshow img:nth-child(3){
	animation-delay: 8s;
}


/* This allows desktop screenshots to extend beyond the content width */
.device-desktop--overflow,
.devices--overflow,
.device-desktop--overflow,
.devices--overflow{
	width: 140%;
	max-width: 88vw; /* if this content wraps to its own line on mobiles, ensure the whole image is shown */
	margin-left: auto;
	margin-right: auto;
}

.devices{
	position: relative;
}

	.devices::before{
		content: '';
		display: block;
		padding-bottom: 59%;
	}

		.devices .device-mobile{
			position: absolute;
			width: 20%;
			z-index: 2;
		}

		.devices .device-desktop{
			position: absolute;
			width: 85%;
			z-index: 1;
		}


/* Alignment 1: Mobile in front, desktop behind */
.devices--1::before{
	
}

	.devices--1 .device-mobile{
		bottom: 0;
	}

	.devices--1 .device-desktop{
		bottom: 5%;
		right: 0;
	}

/* Alignment 2: 2 mobiles, first one blurred */
.devices--2::before{
	padding-bottom: 130%;
}

	.devices--2 .device-mobile:nth-child(1){
		bottom: 2%;
		right: 0;
		-webkit-filter: blur(2px);
		filter: blur(2px);
		width: 60%;
		box-shadow: none;
	}

	.devices--2 .device-mobile:nth-child(2){
		bottom: 0;
		left: 0;
		width: 63%;
	}

/* Alignment 3:  Mobile in front, desktop behind */
.devices--3::before{
	padding-bottom: 35%;
}

	.devices--3 .device-mobile{
		bottom: 0;
		right: 5%;
		left: auto;
	}

	.devices--3 .device-desktop{
		bottom: 5%;
		width: 100%;
	}

/*
	----------------
	- Hero Screenshots
	----------------
*/

.hero-screenshots{
	position: relative;
	max-width: 80vw;
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	-webkit-mask-image: linear-gradient(150deg, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
	mask-image: linear-gradient(150deg, rgba(0,0,0,1) 50%, rgba(0,0,0,0));
}

	.hero .hero-screenshots::before{
		content: '';
		display: block;
		padding-bottom: 51%;
	}

	.hero-screenshots img{
		width: 100%;
		height: auto;
		position: absolute;
		top: 0; left: 0;
	}

	.hero-screenshots ._scroll{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0; left: 0;
	}

		.hero-screenshots ._scroll img{
			position: static;
		}

	.hero-screenshots__desktop,
	.hero-screenshots ._desktop{
		width: 84%;
		position: absolute;
		left: 16%;
		bottom: 0;
		border-radius: 4px 4px 0 0;
		overflow: hidden;
		background: #edf1f4;
	}

		.hero-screenshots__desktop::before,
		.hero-screenshots ._desktop::before{
			content: '';
			display: block;
			padding-bottom: calc(870 / 1440 * 100%);
		}

	.hero-screenshots__mobile,
	.hero-screenshots ._mobile{
		position: absolute;
		bottom: 0;
		left: 0;
		width: 19%;
		border-radius: 4px 4px 0 0;
		overflow: hidden;
		background: #edf1f4;
		box-shadow: hsla(201.6, 100%, 12%, 0.75) 0px 20px 80px, hsla(201.6, 100%, 12%, 0.4) 0px 0px 2px;
	}

		.hero-screenshots__mobile::before,
		.hero-screenshots ._mobile::before{
			content: '';
			display: block;
			padding-bottom: calc(844 / 390 * 100%);
		}


/*
	----------------
	- Faded screenshots
	----------------
*/

.faded-screenshot{
	padding: 10px;
	position: relative;
	-webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
	mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 60%, rgba(0,0,0,0));
	overflow: hidden;
}

	.faded-screenshot__image,
	.faded-screenshot ._image{		
		border-radius: 6px;
		background-color: #edf0f4;
		position: relative;
	}

		.faded-screenshot__image img,
		.faded-screenshot ._image img{
			width: 100%;
			border-radius: inherit;
			display: block;
		}

		.faded-screenshot__image::after,
		.faded-screenshot ._image::after{
			content: '';
			position: absolute;
			top: 0; left: 0; right: 0; bottom: 0;
			box-shadow: inset rgba(8, 40, 81, 0.2) 0px 0px 0px 1px, rgba(8, 40, 81,.1) 0px 0px 10px;
			border-radius: inherit;
		}

/* This prevents the screenshot from stretching the content area, if it's placed in .fluid or .flex-panels */
.faded-screenshot.-cover{
	height: calc(100% + 20px);
	display: grid;
	margin: -10px;
	padding: 0;
}

	.faded-screenshot.-cover::before{
		content: '';
		display: block;
		padding-top: var(--faded-screenshot__ratio, 75%);
	}

	.faded-screenshot.-cover .faded-screenshot__image,
	.faded-screenshot.-cover ._image{
		position: absolute;
		top: 10px;
		left: 10px;
		right: 10px;
	}

/*
	----------------
	- Feature Grid
	----------------
*/

.feature-grid{
  --gap: calc(2rem + 1 * var(--range));
  --padding: calc(2.5rem + 1.5 * var(--range));
  /* --background-color: hsl(210, 30%, 98%);
  --box-shadow: none; */
  --color: var(--c-hard);
 	display: flex;
  flex-wrap: wrap;
  margin: calc(var(--gap) * -1) 0 0 calc(var(--gap) * -1);
  padding: 0;
  list-style: none;
  font-weight: 500;

  /* White background by default */
  --background-color: #fff;
	--box-shadow: hsla(201, 50%, 15.1%,.1) 0px 10px 50px, hsla(201, 50%, 15.1%,.15) 0px 5px 3px -4px;	
}

.bc_root .feature-grid{
	--box-shadow: hsla(201, 50%, 15.1%,.3) 0px 10px 50px, hsla(201, 50%, 15.1%,.15) 0px 5px 3px -4px;
}

/* White background */
.feature-grid.-white,
.feature-grid__item.-white{
	--background-color: #fff;
	--box-shadow: hsla(201, 50%, 15.1%,.2) 0px 10px 50px, hsla(201, 50%, 15.1%,.15) 0px 5px 3px -4px;
}

/* Tinted background */
.feature-grid.-tinted,
.feature-grid__item.-tinted{
	--background-color: hsl(210, 30%, 98%);
	--box-shadow: none;
}

/* Dark background */
.feature-grid.-invert,
.feature-grid__item.-invert{
	--background-color: var(--c-11);
	--color: var(--c-5);
	--gradient: #fff;
}

@supports ( background-blend-mode: overlay){
  .feature-grid.-invert,
  .feature-grid__item.-invert:not([style]) {
      background-image: 
        linear-gradient(115deg, rgba(255,255,255,.15) 50%, rgba(255,255,255,0) 50%),
        linear-gradient(100deg, rgba(0,0,0,0) 80%, rgba(0,0,0,.07) 80%),
        linear-gradient(80deg, rgba(255,255,255,.05) 15%, rgba(0,0,0,0) 15%),
        linear-gradient(190deg, rgba(255,255,255,.1) 60%, rgba(0,0,0,.04) 60%);
      background-blend-mode: overlay;
  }
}
  
/* Match the background-color of the default theme */
.feature-grid__item.-background{
	--background-color: #edf0f4;
	--color: var(--c-hard);
}
.bc_1 .feature-grid__item.-background,
.bc_2 .feature-grid__item.-background{
	/* --box-shadow: inset rgba(0,0,0,.12) 0px 0px 3px, #fff 0px 1px 0px; */
	--box-shadow: hsla(201, 50%, 15.1%,.3) 0px 10px 50px, hsla(201, 50%, 15.1%,.15) 0px 5px 3px -4px;
}


/* Center text on full width blocks */
@media (min-width: 980px){
	.feature-grid__item--1-1{
		text-align: center;
	}
}

.feature-grid__item.-center .feature-grid__image{
  padding-top: var(--padding);
  flex: 0 0 auto;
  margin-top: auto;
  margin-bottom: auto;
  text-align: center;
}

.feature-grid__item.-wide .feature-grid__image{
 	margin: calc(var(--padding) * -1);
  margin-top: auto;
  flex: 0 0 auto;
}

.feature-grid__item.-bottom .feature-grid__image{
	flex: 0 0 auto;
 	margin: calc(var(--padding) * -1);
  margin-top: auto;
  padding: var(--padding);
  padding-bottom: 0;
  overflow: hidden;
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
}

/* Add a white box-shadow so white images blend into feature-grid__item */
.feature-grid__item.-fade .feature-grid__image img,
.feature-grid__item.-fade .feature-grid__image video{
	box-shadow: #eef0f4 0px 0px 45px 35px;
}

/* Replace white parts of a video with the background colour of feature-grid__item */
.feature-grid__item.-blend .feature-grid__image img,
.feature-grid__item.-blend .feature-grid__image video{
	mix-blend-mode: multiply;
}

/* Add a shadow and round the corners of screenshots */
.feature-grid__item.-shadow .feature-grid__image img,
.feature-grid__item.-shadow .feature-grid__image video{
	box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1), 0 3px 15px rgba(0, 0, 0, 0.04);
	border-radius: 8px;
}

/* Embedded videos from Vimeo/Youtube */
.feature-grid__embedded-video{
	position: relative;
	padding-top: calc(9 / 16 * 100%);
	border-radius: 8px;
	overflow: hidden;
	margin-top: 40px;
}

.feature-grid__embedded-video iframe{
	width:100%;
	height: 100%;
	position: absolute;
	top: 0; left: 0;
}

.feature-grid__item,
.feature-grid__item:nth-child(14n-13){
--gradient: var(--c-gradient-1);
}
.feature-grid__item:nth-child(14n),
.feature-grid__item:nth-child(14n-12){
--gradient: var(--c-gradient-2);
}
.feature-grid__item:nth-child(14n-11),
.feature-grid__item:nth-child(14n-1){
--gradient: var(--c-gradient-3);
}
.feature-grid__item:nth-child(14n-10),
.feature-grid__item:nth-child(14n-2){
--gradient: var(--c-gradient-4);
}
.feature-grid__item:nth-child(14n-9),
.feature-grid__item:nth-child(14n-3){
--gradient: var(--c-gradient-5);
}
.feature-grid__item:nth-child(14n-8),
.feature-grid__item:nth-child(14n-4){
--gradient: var(--c-gradient-6);
}
.feature-grid__item:nth-child(14n-7),
.feature-grid__item:nth-child(14n-5){
--gradient: var(--c-gradient-7);
}
.feature-grid__item:nth-child(14n-6){
--gradient: var(--c-gradient-8);
}

  
  .feature-grid__item{
   	flex: 1 1 100%;
    flex-basis: calc(100% - var(--gap));
    margin: var(--gap) 0 0 var(--gap);
    min-width: 0;
    background: var(--background-color);
    box-shadow: var(--box-shadow, none);
    color: var(--color);
    padding: var(--padding);
    min-height: 100%;
    display: flex;
    flex-direction: column;
		border-radius: 8px;
    position: relative;

    /* Todo: remove? */
    overflow: hidden;
  }

  .feature-grid__item::before{
		content: '';
		position: absolute;
		top: 0; left: 0; right: 0;
		height: 6px;
		background: var(--gradient, var(--c-secondary));
		border-top-left-radius: inherit;
		border-top-right-radius: inherit;
	}
 
@media (min-width: 680px){
  
  .feature-grid__item--1-2,
  .feature-grid__item--1-3,
  .feature-grid__item--2-3{
    flex-basis: calc(50% - var(--gap));
  }
  
}
  
@media (min-width: 979px){

  .feature-grid__item--1-3{
    flex-basis: calc(33.33% - var(--gap));
  }
  
  .feature-grid__item--2-3{
    flex-basis: calc(66.66% - var(--gap));
  }
    
}


/* Mobile feature grids expand to full width with no margins */
@media (max-width: 600px){
	.feature-grid{
		margin-right: -15px;
		margin-left: -15px;
	}
	
	.feature-grid__item{
		margin: 0;
		border-radius: 0;
		box-shadow: none;
	}
}

.feature-grid__item > *{
  position: relative;
}

.feature-grid__item > .p_cover{
	overflow: hidden;
	border-radius: inherit;
}

	.feature-grid__item > .p_cover .bg-panel{
	  position: absolute;
	  top: -10px; right: -10px; bottom: -10px; left: -10px;
	  width: auto; height: auto;
	}

  .feature-grid__title{
   	font-weight: 500; 
    color: var(--gradient, var(--c-secondary));
    flex: 0 0 auto;
    font-size: 1.9rem;
  }

    .feature-grid__item.-invert .feature-grid__title{
  		color: #fff;
  	}

.feature-grid__title .fa{
  /* color: var(--gradient, var(--c-secondary));
  margin-left: .8em; */
  display: none;
}
  
  .feature-grid__desc{
    margin-top: .5em;
    flex: 0 0 auto;
  }

    .feature-grid__item.-invert .feature-grid__desc{
  		
  	}

.feature-grid__desc a{
	color: inherit;
	position: relative;
	font-weight: 500;
}

.feature-grid__desc a::before{
	content: '';
	position: absolute;
	left: 0; right: 0; top: 100%;
	height: 2px;
	background: currentColor;
	opacity: .2;
	transition: all 0.2s ease-in-out;
}

.feature-grid__desc a:hover::before{
	opacity: .7;
}
  
  .feature-grid__image{
    padding-top: var(--padding);
    flex: 1 1 auto;
  }
  
  .feature-grid__image img{
    object-position: 50% 0;
  }

  .feature-grid__image video{
  	margin: 0 auto;
    display: block;
  }

/*
  ----------------
  - Pills
  ----------------
*/

.pill-tabs{
  text-align: center;
}

  .pill-tabs > *:not(:first-child){
    margin-top: 30px;
  }

.pill-tabs img{
  max-width: 100%;
}

.pill-tabs__tabs{
	background: hsla(var(--c--h), 15%, 38%, .1);
  border-radius: 50px;
  line-height: 40px;
  font-weight: 500;
  color: var(--c-dark);
  font-size: 1.5rem;
  text-shadow: none; /* Overwrite parent text-shadows if they exist */
  
  margin: 0;
  padding: 3px;
  list-style: none;
  display: inline-flex;
  position: relative;
  white-space: nowrap;
  overflow-x: auto;
  max-width: 100%;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

  .pill-tabs__tabs::-webkit-scrollbar {
    -webkit-appearance: none;
  }

  .pill-tabs__tab{
    padding: 0 1.6em;
    flex: 0 0 auto;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    position: relative;
    z-index: 1;
    border-radius: inherit;
    opacity: .65;
  }

    .pill-tabs__tab:hover{
      opacity: 1;
    }

    .pill-tabs__tab.is-active{
      background-color: currentColor;
      opacity: 1;
    }

      .pill-tabs__tab.is-active span{
        color: #fff;
      }


      /* Invert tabs to white text */
      .pill-tabs__tabs--invert{
        color: #fff;
        background: rgba(255,255,255,.1);
      }

        .pill-tabs__tabs--invert .pill-tabs__tab.is-active span{
          color: var(--c-dark);
        }

.pill-tabs__tab-contents{
  display: grid;
  align-items: center;
}

  .pill-tabs__tab-content{
    grid-area: 1 / 1 / 2 / 2;
    transition: all .2s ease-in-out;
  }

    .pill-tabs__tab-content:not(.is-active){
      visibility: hidden;
      opacity: 0;
    }

  .pill-tabs__tab-text{
    margin-left: auto;
    margin-right: auto;
    max-width: 750px;
  }

    * + .pill-tabs__tab-text{
      margin-top: 30px;
    }

    .pill-tabs__tab-text p:not(:first-child){
      margin-top: .8em;
    }

/*
  ----------------
  - Horizontal Tabs
  ----------------
*/

/*
.tabs_horizontal img{
  max-width: 100%;
}

.tabs_horizontal__tabs{
  margin: 0 0 30px 0;
  padding: 0;
  list-style: none;
  display: flex;
  align-items: flex-end;
  text-align: center;
  white-space: nowrap;
  overflow-x: scroll;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

  .tabs_horizontal__tabs::-webkit-scrollbar {
    -webkit-appearance: none;
  }

  .tabs_horizontal__tab{
    color: var(--c-soft);
    border-bottom: 4px solid var(--c-3);
    padding: .9em;
    flex: 1 0 auto;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
  }

    .tabs_horizontal__tab:hover{
      border-color: var(--c-4);
      color: var(--c-hard);
    }

    .tabs_horizontal__tab.is-active{
      border-color: var(--c-8);
      color: var(--c-hard);
    }

    .tabs_horizontal__title{
      font-size: calc(1.6rem + .2 * var(--range));
      font-weight: 500;
    }

    .tabs_horizontal__mobile-content{
      
    }

    .tabs_horizontal__tab-contents{
      margin-top: var(--sp-3);
    }

    .tabs_horizontal__tab-content:not(.is-active){
      display: none;
    }
*/


/*
  ----------------
  - Vertical tabs
  ----------------
*/

.tabs_vertical img{
  max-width: 100%;
}

.tabs_vertical__tabs{
  margin: 0;
  padding: 0;
  list-style: none;
}

  .tabs_vertical__tab{
    padding: 2em 0;
  }

    .tabs_vertical__title{
      margin: 0 0 0.3em 0;
      color: var(--c-hard);
      font-size: 1.6rem;
      font-weight: 500;
    }

	.tabs_vertical__title .fa{
      display: inline-block;
      width: 1.7em;
      color: var(--c-secondary);
	}

    .tabs_vertical__mobile-content{
      margin-bottom: 25px;
    }

    .tabs_vertical__tab-contents{
      display: none;
    }

@media (max-width: 979px){
  .tabs_vertical__tabs{
    display: grid;
        grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
        grid-gap: 40px;
        gap: 40px;
  }
}

@media (min-width: 980px){

  .tabs_vertical{
    display: flex;
        align-items: center;
  }

    .tabs_vertical__tabs{
      flex: 0 0 500px;
      margin-right: 60px;
    }

      .tabs_vertical__tab{
        padding: 1.5em 2em;
        border-left: 7px solid var(--c-3);
        background-color: hsla(var(--c--h), 30%, 50%, .06);
        cursor: pointer;
        border-radius: 8px;
        margin-bottom: 8px;
      }

        .tabs_vertical__tab:hover{
          border-color: var(--c-5);
          background-color: hsla(var(--c--h), 30%, 50%, .1);
        }

        .tabs_vertical__tab.is-active{
          border-color: var(--c-9);
          background-color: hsla(var(--c--h), 30%, 50%, .2);
        }
  
        .tabs_vertical__text{
          
        }
  
          .tabs_vertical__tab:not(.is-active) .tabs_vertical__text{
            color: var(--c-soft);
          }

        .tabs_vertical__mobile-content{
          display: none;
        }

  .tabs_vertical__tab-contents{
    flex: 1 1 100%;
    min-width: 0;
    display: grid;
    align-items: center;
  }

    .tabs_vertical__tab-content{
      grid-area: 1 / 1 / 2 / 2;
      opacity: 0;
      visibility: hidden;
      transition: all 0.3s ease-in-out;
      text-align: center;
    }

      .tabs_vertical__tab-content.is-active{
        opacity: 1;
        visibility: visible;
      } 

}

/*
	----------------
	- New badge
	----------------
*/

.new-badge{
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	background: #f28716;
	padding: .4em 1em;
	border-radius: 0.3em;
	text-transform: uppercase;
	line-height: 1;
	display: inline-block;
	vertical-align: middle;
}



/*
	----------------
	- Accordion
	----------------
*/

.accordion{
	counter-reset: faqList;
}

	.accordion ._item{
		counter-increment: faqList;
	}

		.accordion ._item + ._item{
			margin-top: var(--s-1);
		}

	.accordion ._toggle {
		background-color: var(--c-2);
		color: var(--c-8);
		border-radius: 5px;
		border: 0;
		-webkit-appearance: none;
		appearance: none;
		font-weight: 500;
		padding: 1em;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		text-align: inherit;
		cursor: pointer;
	}

		.accordion ._toggle::before{
			content: counter(faqList, decimal)".";
			opacity: .3;
			font-weight: 500;
			margin-right: .6em;
		}

		.accordion ._toggle span{
			flex: 1 1 0px;
		}

			.accordion ._toggle:hover,
			.accordion .-active ._toggle{
				background-color: var(--c-3);
				color: var(--c-11);
			}

	.accordion ._toggle-icon{
		display: block;
		font-size: 2rem;
		width: 0.7em;
		height: 0.7em;
		position: relative;
		flex: 0 0 auto;
	}

		.accordion ._toggle-icon::before {
			content: '';
			background: currentcolor;
			width: 0.1em;
			height: 100%;
			position: absolute;
			top: 0;
			left: 50%;
			margin-left: -0.05em;
			transform: scaleY(1);
			transform-origin: 50% 50%;
			transition: transform 0.2s linear;
		}
			.accordion .-active ._toggle-icon::before{
				transform: scaleY(0);
			}

		.accordion ._toggle-icon::after {
			content: '';
			background: currentcolor;
			width: 100%;
			height: 0.1em;
			position: absolute;
			top: 50%; left: 0;
			margin-top: -0.05em;
		}

	.accordion ._content{
		padding: var(--s-2);
		display: none;
	}

		.accordion ._content > * + *{
			margin-top: .8em;
		}

/*
	----------------
	- Modals
	----------------
*/
[data-modal] {
  display: flex;
  align-items: center;
  justify-content: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 5000;
  visibility: hidden;
  opacity: 0;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}

[data-modal].modal--visible,
[data-modal]:target{
  visibility: visible;
  opacity: 1;
}

[data-modal],
.modal {
  transition: all 0.25s ease-in-out;
}

.modal-overlay {
  background-color: var(--c-hard);
  opacity: .5;
  position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modal {
  display: flex;
  flex-direction: column;
  background-color: var(--root--ba-co);
  position: relative;
  width: 98%;
  max-width: 600px;
  max-height: 90vh;
  transform: translateY(-50px);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
  border-radius: 5px;
}

.modal--visible .modal,
[data-modal]:target .modal{
  transform: translateY(0px);
}

.modal__close {
	border: 0;
	background: none;
	-webkit-appearance: none;
	appearance: none;
	font: inherit;
	color:  inherit;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  cursor: pointer;
  font-size: 1.4rem;
  padding: .9em;
  border-radius: 5px;
}

.modal__close svg {
  position: relative;
  height: 1em;
}

.modal__close svg line {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
}

.modal__close::before {
  content: '';
  border-radius: inherit;
  transition: opacity 0.1s linear;
  background: currentColor;
  opacity: 0;
  position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.modal__close:hover::before {
  opacity: 0.05;
}

.modal > .modal__close {
  position: absolute;
  top: 5px;
  right: 5px;
  z-index: 1;
}

/* Hide or show the close button(s) depending on target */
  [data-modal] a.modal__close,
  [data-modal]:target button.modal__close{
    display: none;
  }
  [data-modal]:target a.modal__close{
    display: flex;
  }

.modal__header {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  padding-left: 30px;
  border-bottom: 1px solid currentColor;
  border-top-left-radius: inherit;
  border-top-right-radius: inherit;
}

.modal__content {
  flex: 0 1 auto;
  overflow: auto;
}

.modal__footer {
  background-color: var(--c-2);
  flex: 0 0 auto;
  padding: 15px;
  text-align: right;
  border-top: 1px solid currentColor;
  border-bottom-left-radius: inherit;
  border-bottom-right-radius: inherit;
}

.modal__header,
.modal__footer {
  border-color: var(--c-3);
}


/*
	----------------
	/ Page specific styles
	----------------
*/

/*
	----------------
	- Page: innovate/success-stories/
	----------------
*/

.success-story{
	background: #fff;
	box-shadow: rgba(12, 34, 88, 0.06) 0px 10px 20px, rgba(11, 49, 110, 0.1) 0px 6px 2px -5px, rgba(11, 49, 110, 0.05) 0px 0px 0px 1px;
	border-radius: 6px;
	overflow: hidden;
	position: relative;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding: 6px;
	padding-bottom: 12px;
	min-height: 100%;
}

	.success-story.-reverse{
		flex-direction: row-reverse;
	}

	/* .success-story::before {
    content: '';
    height: 6px;
    background: var(--brand);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
	} */

	.success-story ._image{
		flex: 1 1 380px;
		position: relative;
		border-radius: inherit;
	}

		.success-story ._image::before{
			content: '';
			display: block;
			padding-bottom: 40%;
		}

		.success-story ._image img{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			object-position: 0 0;
			border-radius: inherit;
		}

		.success-story ._image::after{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			border-radius: inherit;
			border: 1px solid rgba(0,0,0,.15);
		}

	.success-story ._text{
		padding: var(--s-3);
		flex: 9999 1 60%;
		display: flex;
		flex-direction: column;
		position: relative;
	}

	.success-story blockquote{
		font-size: 1.65rem;
		color: var(--c-12);
		flex: 1 1 auto;
	}

		.success-story blockquote p + p{
			margin-top: .8em;
		}

	.success-story ._author-row{
		margin-top: var(--s-4);
		display: flex;
		align-items: center;
		/* color: var(--brand, var(--c-12)); */
		color: var(--c-soft);
		flex: 0 0 auto;
	}

		.success-story ._logo{
			flex: 0 0 50px;
			margin-right: var(--s-2);
		}

			.success-story ._logo img{
				display: block;
				object-fit: contain;
				object-position: 50% 50%;
			}

		.success-story ._author{
			flex: 1 1 auto;
			font-size: 1.4rem;
			font-weight: 500;
		}


/* Smaller version for homepage */
.success-story.-small{
	padding: var(--s-3);
	flex-wrap: nowrap;
}

	.success-story.-small::before {
    bottom: auto;
    top: 0;
	}

	.success-story.-small ._logo{
		flex: 0 0 20px;
		margin-right: var(--s-1);
	}

		.success-story.-small ._logo img{
			border-radius: 100px;
		}

	.success-story.-small ._text{
		padding: 0;
	}

	.success-story.-small blockquote{
		font-size: inherit;
	}



/*
	----------------
	- Page: services/brand-match/
	----------------
*/

/* Masonry grid */

.masonry-grid{
	display: grid;
	grid-gap: 25px;
  gap: 25px;
  gap: min(2vw, 25px);
	grid-template-columns: repeat(4, 1fr);
}

	.masonry-grid a{
		color: inherit;
		display: block;
	}

	.masonry-grid > *{
		background-color: var(--c-6);
		border-radius: 8px;
		overflow: hidden;
		background-size: cover;
		background-position: 0 0;
		position: relative;
	}

	.masonry-grid > *:nth-child(1){
		grid-column: span 2;
		grid-row: span 2;
	}
	.masonry-grid > *:nth-child(2){
		grid-row: span 2;
	}
	.masonry-grid > *:nth-child(7){
		grid-column: span 2;
	}




	.masonry-grid--showcase > *::before,
	.masonry-grid--showcase a::after{
		content: '';
		position: absolute;
		top: 0; left: 0;
		width: 100%;
		height: 100%;
		border-radius: inherit;
		border: 1px solid currentColor;
		opacity: .3;
		z-index: 1;
		pointer-events: none;
	}

	.masonry-grid--showcase a::after{
		border: 0;
		background: currentColor;
		opacity: 0;
		transition: all .15s ease-in-out;
	}

		.masonry-grid--showcase a:hover::after{
			opacity: .25;
		}

	.masonry-grid--showcase img{
		position: absolute;
		top: 0; left: 0;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: 0 0;
	}


/*
	----------------
	- Page: innovate/gamify/
	----------------
*/

/* Points list */
.gamify__points-list > li{ 
	background: rgba(0,0,0,.3);
  	color: rgba(255,255,255,.9);
	border-radius: 6px;
	padding: .7em 1.2em;
}

@media (min-width: 1200px){
	.gamify__points-list > li{ 
		padding:  1.5em 2.5em;
	}
}


/*
	----------------
	- Page: home
	----------------
*/



/*
	----------------
	- Addon icons
	----------------
*/

.block__addon-icons{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(90px, 1fr));
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.4rem;
	max-width: 1100px;
	margin: 0 auto;
}

.block__addon-icons a{
	color: inherit;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 1.3em 0;
	border-radius: 8px;
	position: relative;
}
.block__addon-icons a::before{
	content: '';
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	border-radius: inherit;
	opacity: 0;
	background: currentColor;
}
.block__addon-icons a:hover::before{
	opacity: .06;
}

.block__addon-icons li:nth-child(1){
	color: var(--c-gradient-1);
}
.block__addon-icons li:nth-child(2){
	color: var(--c-gradient-2);
}
.block__addon-icons li:nth-child(3){
	color: var(--c-gradient-3);
}
.block__addon-icons li:nth-child(4){
	color: var(--c-gradient-4);
}
.block__addon-icons li:nth-child(5){
	color: var(--c-gradient-5);
}
.block__addon-icons li:nth-child(6){
	color: var(--c-gradient-6);
}
.block__addon-icons li:nth-child(7){
	color: var(--c-gradient-7);
}
.block__addon-icons li:nth-child(8){
	color: var(--c-gradient-8);
}
.block__addon-icons .svg{
	width: auto;
	height: 32px;
}
.block__addon-icons span{
	margin-top: var(--s-2);
}

@media (max-width: 820px){
  .block__addon-icons{
    font-size: 1.1rem;
  }
  .block__addon-icons .svg{
    height: 26px;
  }
}


/*
	----------------
	- Page: features/
	----------------
*/

[data-pagename^="features/"] .hero:first-child,
[data-pagename^="0-features/"] .hero:first-child{
	padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}

	[data-pagename^="features/"] .hero .flex-panels,
	[data-pagename^="0-features/"] .hero .flex-panels{
		--gap: var(--s-3);
		--row-gap: var(--s-1);
		margin: calc(var(--row-gap, 0px) * -1) 0 0 calc(var(--gap, 0px) * -1);
		flex-wrap: nowrap;
	}

	[data-pagename^="features/"] .hero .flex-panels > *,
	[data-pagename^="0-features/"] .hero .flex-panels > *{
		margin-top: var(--row-gap, 0px);
		margin-left: var(--gap, 0px);
	}

	[data-pagename^="features/"] .hero .flex-panels__primary,
	[data-pagename^="0-features/"] .hero .flex-panels__primary{
    	flex: 1 1 38%;
    	padding: calc(4rem + 4 * var(--range)) 0;
    	display: flex;
    	flex-direction: column;
    	justify-content: center;
	}

	[data-pagename^="features/"] .hero .hero__subtitle,
	[data-pagename^="0-features/"] .hero .hero__subtitle{
		max-width: 750px;
		margin-left: auto;
		margin-right: auto;
	}

	[data-pagename^="features/"] .hero .flex-panels__secondary,
	[data-pagename^="0-features/"] .hero .flex-panels__secondary{
		flex: 1 1 62%;
      	align-self: flex-end;
	}

	[data-pagename^="features/"] .hero .screenshots,
	[data-pagename^="0-features/"] .hero .screenshots{
		margin-top: 15px;
	}

@media (max-width: 1000px){
	[data-pagename^="features/"] .hero .flex-panels,
  	[data-pagename^="0-features/"] .hero .flex-panels{
		flex-wrap: wrap;
	}
	[data-pagename^="features/"] .hero .flex-panels__primary,
  	[data-pagename^="0-features/"] .hero .flex-panels__primary{
		text-align: center;
		flex: 1 1 100%;
		align-items: center;
	}
	[data-pagename^="features/"] .hero .flex-panels__secondary,
	[data-pagename^="0-features/"] .hero .flex-panels__secondary{
		flex: 0 1 600px;
	}
}



/*
	----------------
	- Buy page
	----------------
*/

.buy__annual-monthly-buttons{
	--pa: 5px;
	--button--wi: 160px;
	color: #fff;
	font-size: 1.4rem;
	background: rgba(0,0,0,.25);
	box-shadow: inset rgba(0,0,0,.3) 0px 1px 7px, rgba(255,255,255,.15) 0px 1px 0px;
	font-weight: 600;
  display: inline-flex;
  box-sizing: content-box;
  position: relative;
  border-radius: 6px;
  padding: var(--pa);
  z-index: 1;
  vertical-align: top;	
}

  .buy__annual-monthly-buttons ._button{
    border: 0;
    background: none;
    color: inherit;
    padding: 0;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    line-height: 50px;
    flex: 0 0 auto;
    text-align: center;
    width: var(--button--wi);
    position: relative;
    z-index: 1;
    font-weight: 500;
    cursor: pointer;
    transition: color 0.15s linear;
		border-radius: inherit;
  }

  	.buy__annual-monthly-buttons ._button:not(.-active):hover{
				background: rgba(0,0,0,0.05);
  	}

    .buy__annual-monthly-buttons ._button:not(:hover):not(.-active){
      opacity: .85;
    }

    .buy__annual-monthly-buttons ._button.-active{
      font-weight: 600;
      color: var(--c-dark);
    }

  .buy__annual-monthly-buttons ._active{
    content: '';
    position: absolute;
    left: var(--pa);
    top: var(--pa);
    bottom: var(--pa);
    width: var(--button--wi);
    background-color: #fff;
		box-shadow: rgba(0,0,0,.1) 0px 1px 4px;
    border-radius: inherit;
    transition: all .3s ease-in-out;
    transform: translateX(0);
  }

    .buy__annual-monthly-buttons ._button.-active:nth-child(2) ~ ._active{
      transform: translateX(100%);
    }

.buy__columns{
  display: flex;
	flex-wrap: nowrap;
	border: 1px solid var(--c-3);
	border-width: 0 0 1px 0;
	background: var(--c-3);
	gap: 1px;
}

@media (max-width: 1100px){
	.buy__columns{
		flex-wrap: wrap;
		justify-content: center;
	}
}

  .buy__column{
  	/* min-width: 0;
    display: flex;
    flex-direction: column; */
    position: relative;
		flex: 1 1 340px;
		padding: var(--s-4);
		background: var(--c-1);
		transition: background-color 0.1s linear;
	}

	.buy__column:nth-child(2n) {
		background: #fff;
	}

	@media (max-width: 1500px){
		.buy__column{
			padding-left: var(--s-3);
			padding-right: var(--s-3);
		}
	}

	.buy__column::before{
    content: '';
    height: 6px;
    background: var(--gradient, var(--c-secondary));
    border-top-left-radius: inherit;
    border-top-right-radius: inherit;
    position: absolute;
		top: 0;
		left: -1px;
		right: -1px;
  }

  	.buy__column:first-child::before{
			left: 0;
		}
		.buy__column:last-child::before{
			right: 0;
		}

		/* The -1px above causes an overflow on smaller screens */
		body{
			overflow-x: hidden;
		}

[data-active-price='monthly'] [data-price='annual'],
[data-active-price='annual'] [data-price='monthly']{
  display: none;
}

/* Recommended plan */
.buy__column--recommended{
	isolation: isolate;
	z-index: 1;
}

	.buy__column--recommended::after{
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: var(--root--ba-co);
		box-shadow: rgba(8, 58, 74, 0.1) 0px 10px 30px, rgba(8, 58, 74, 0.06) 0px 2px 2px;
		border-top: 6px solid var(--gradient, var(--c-secondary));
		z-index: -1;
	}

	@media (min-width: 1101px){
		.buy__column--recommended::after{
			top: -30px;
			left: -1px;
			right: -1px;
			bottom: -8px;
			border-radius: 5px;
		}
	}

.buy__column-content{
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	border-bottom-left-radius: inherit;
	border-bottom-right-radius: inherit;
}

	.buy__column-content--starter{
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		padding: var(--s-4);
		border-radius: 6px;
		gap: var(--s-4);
	}

	.buy__column h2{
		font-weight: 500;
		font-size: 1.7rem;

		display: flex;
		flex-direction: column;
	}

		.buy__column h2::after{
			content: '.';
			font-size: 11px;
			background: var(--gradient, var(--c-secondary));
			color: #fff;
			border-radius: 5px;
			padding: .2em 1.3em;
			text-transform: uppercase;
			font-weight: 600;
			margin: 5px auto 0;
			letter-spacing: 0;
			visibility: hidden;

			display: none;
		}

			
			.buy__column--recommended h2::after{
				content: "Recommended";
				visibility: visible;
			}

			[data-plan="enterprise"] h2::after{
				content: "Best for brands";
				visibility: visible;
			}

		.buy__column-content--starter .buy__audience{
			min-height: 0;
		}

		.buy__column-content--starter .buy__feature-list{
			display: grid;
			grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
		}

		.buy__column-content--starter .buy__price{
			min-height: 0;
			margin-bottom: var(--s-3);
		}

.buy__pre-plan-bar{
	/*
	height: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: -6px;
	color: #fff;
	background: var(--gradient, var(--c-secondary));
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
	text-align: center;
	order: -1;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	*/
	display: none;
}

	.buy__pre-plan-bar:empty{
		visibility: hidden;
	}

.buy__price{
  text-align: center;
  font-weight: 500;
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--c-dark);
}

.buy__audience{
	color: var(--c-dark);
	font-weight: 500;
	min-height: 70px;
	text-align: center;
	margin-top: var(--s-2);
	font-size: 1.4rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

.buy__feature-list{
  font-size: 1.4rem;
	font-weight: 500;
  color: var(--c-hard);
}

.buy__feature-list > li{
  position: relative;
  display: flex;
  align-items: flex-start;
  padding: 8px 0 8px 28px;
}

  .buy__feature-list .__text{
    flex: 1 1 auto;
  }

  .buy__feature-list .__icon{
    flex: 0 0 auto;
    color: var(--gradient, var(--c-secondary));
		border-radius: 50%;
    width: 18px;
    height: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'FontAwesome';
    line-height: 1;
    font-size: 9px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: absolute;
		top: 9px;
		left: 0;
		z-index: 1;
		pointer-events: none;
  }

  	.buy__feature-list .__icon::after{
			content: '';
			position: absolute;
			top: 0; left: 0;
			width: 100%;
			height: 100%;
			border-radius: inherit;
			background: var(--gradient, var(--c-secondary));
			opacity: .15;

			content: none;
		}

    .buy__feature-list .__icon:empty::before{
      content: "\f00c";
    }

    .buy__feature-list .__icon.-extra::before{
			content: "\f155";
		}

    .buy__feature-list .-no{
      color: var(--c-soft);
      font-weight: normal;
      opacity: .2;
    }

@media (max-width: 1100px){
  .buy__feature-list .-no{ display: none; }
}

      .buy__feature-list .-no .__icon{
        background: var(--c-soft);
        opacity: .2;
      }

        .buy__feature-list .-no .__icon:empty::before{
          content: "\f068";
        }

    .buy__feature-list .-extra{
      color: var(--c-soft);
    }

      .buy__feature-list .-extra .__icon{
        opacity: .3;
				filter: grayscale(.6);
      }

        .buy__feature-list .-extra .__icon:empty::before{
          content: "\f155";
        }

      .buy__feature-list .-extra .__text{
        border-bottom: 1px dashed var(--c-5);
        font-weight: normal;
      }

    .buy__feature-list .-info{
      
    }

      .buy__feature-list .-info .__icon{
        background: var(--c-soft);
      }

        .buy__feature-list .-info .__icon:empty::before{
          content: "\f129";
        }

	.buy__feature-list [data-ipstooltip]{
		border-bottom: 1px dashed var(--c-5);
	}      

  .buy__feature-list a{
  	color: inherit;
  	border-bottom: 1px dashed var(--c-5);
  }

    .buy__feature-list a:hover{
    	border-color: var(--c-7);
    }

.buy__feature-list .__text button{
		color: inherit;
		text-align: inherit;
		display: inline-flex;
		align-items: center;
		border: 0;
		background: none;
		cursor: pointer;
		border-bottom: 1px dashed var(--c-4);

		position: relative;
		display: block;
		width: 100%;
		z-index: 0;
		padding: 0;
		border-width: 0;
		font-weight: inherit;
	}

		.buy__feature-list .__text button::before{
			content: '';
			position: absolute;
			top: -8px;
			right: calc(var(--s-2) * -1);
			bottom: -8px;
			left: calc(var(--s-2) * -1 - 28px);
			
			z-index: -1;
			border-radius: 5px;
		}

			.buy__feature-list .__text button:hover::before{
				background: var(--gradient, var(--c-secondary));
				opacity: .06;
			}

			.buy__feature-list .__coming-soon{
				display: block;
				text-transform: uppercase;
				font-size: 1.2rem;
				color: var(--gradient, var(--c-secondary));
			}

	/* Expand icon */
	.buy__feature-list .__text button::after{
		opacity: 0;
		content: "\f055";
		font-family: "FontAwesome";
		font-size: 16px;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		color: var(--gradient, var(--c-secondary));
	}

		.buy__feature-list .__text button:hover::after{
			opacity: 0.5;
		}

		.buy__feature-list .__text button[data-expanded]::after{
			content:  "\f056";
		}

.buy__feature-list [data-ipstooltip]{
	border-bottom: 0;
}

	.buy__expanded-feature-list{
		padding: 10px 0;
		font-size: 0.9em;
		color: var(--c-soft);
		font-weight: normal;
	}

		.buy__expanded-feature-list > li{
			padding: .3em 0;
			position: relative;
		}

/* Buy now buttons */
.buy__column .button{
	box-shadow: none;
	width: 100%;
	font-weight: bold;
	padding: 1em 1.8em;
}

  .buy__column .button--primary{
  	--button--ba-co: var(--gradient, var(--c-primary));
  	--button-hover--ba-co: var(--button--ba-co);
  	z-index: 1;
  }

  	.buy__column .button--primary:hover{
  		background-image: linear-gradient(to top, rgba(0,0,0,.15), rgba(0,0,0,.15));
  	}

.buy__trial-link{
	text-align: center;
	color: var(--c-soft);
	font-size: 1.4rem;
	font-weight: 500;
	border-bottom: 1px solid rgba(0,0,0,.1);
	padding-bottom: 1em;
}

	.buy__trial-link a{
		color: inherit;
	}

		.buy__trial-link a:hover{
			border-bottom: 1px solid rgba(0,0,0,.2);
		}


[data-plan="beginner"] .buy__column-content{
		max-width: 1200px;
		margin: 0 auto;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: center;
		gap: var(--s-4);
	}

		[data-plan="beginner"] .buy__audience{
			min-height: 0;
			display: block;
			text-align: inherit;
		}

		[data-plan="beginner"] .buy__feature-list{
			display: grid;
			grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
			margin-top: 1.5em;
		}

			[data-plan="beginner"] .buy__feature-list > li{
				padding-top: 5px;
				padding-bottom: 5px;
			}

		[data-plan="beginner"] .buy__price{
			min-height: 0;
			margin-bottom: var(--s-3);
		}


@media (max-width: 660px){
	#allFeatures{
		display: none;
	}
}


.buy__all-features{
		--header--he: 60px;
	}
	.buy__all-features ._row{
		display: flex;
		align-items: center;
		padding: 11px;
		border-top: 1px solid rgba(0,0,0,0.07);
	}

		.buy__all-features ._row:hover{
			background-color: rgba(0,0,0,0.02);
		}

		.buy__all-features ._row > *{
			flex: 1 1 15%;
			text-align: center;
		}

			.buy__all-features ._row > *:nth-child(1){
				text-align: left;
				font-weight: 500;
				flex-basis: 35%;
			}

			.buy__all-features ._row > *:nth-child(2){
				--gradient: var(--c-gradient-8);
			}

			.buy__all-features ._row > *:nth-child(3){
				--gradient: var(--c-gradient-7);
			}

			.buy__all-features ._row > *:nth-child(4){
				--gradient: var(--c-gradient-6);
			}

			.buy__all-features ._row > *:nth-child(5){
				--gradient: var(--c-gradient-5);
			}

			.buy__all-features ._row > *:nth-child(6){
				--gradient: var(--c-gradient-4);
			}
			.buy__all-features ._row > :nth-child(7){
				--gradient: var(--c-gradient-3);
			}

	.buy__all-features ._header{
		font-weight: bold;
		background: #fff !important;
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 10;
		border-radius: 0 0 7px 7px;
		box-shadow: rgba(6, 101, 147, 0.15) 0px 8px 7px -7px, rgba(5, 38, 54, 0.12) 0px 1px 0px;
		margin-bottom: 5px;
		border-radius: 0;
		padding-top: 0;
		padding-bottom: 0;
		height: var(--header--he);
		border-width: 0;
	}

		.buy__all-features ._header > *{
			color: var(--gradient, inherit);
		}

	.buy__all-features ._category-header{
		position: -webkit-sticky;
		position: sticky;
		top: 0;
		z-index: 11;
		padding-top: 0;
		padding-bottom: 0;
		height: var(--header--he);
		background: none !important;
		border-color: transparent;
	}

	.buy__all-features ._category{
		margin-top: 50px;
	}

		.buy__all-features ._category-header > *:first-child{
			font-weight: bold;
			font-size: 1.6em;
			line-height: 1;
		}

	.buy__all-features [data-ipstooltip],
	.buy__all-features a{
		border-bottom: 1px dashed var(--c-5);
	}

	.buy__all-features a{
		color: inherit;
	}

	.buy__all-features ._yes,
	.buy__all-features ._no,
	.buy__all-features ._extra {
		color: var(--gradient, var(--c-secondary));
		display: inline-block;
		vertical-align: baseline;
		font-family: 'FontAwesome';
		line-height: 1;
		font-size: 16px;
		text-rendering: auto;
		-moz-osx-font-smoothing: grayscale;
		border: 0;
		font-style: normal;
	}

	.buy__all-features ._yes::before{
		content: "\f00c";
	}

	.buy__all-features ._no{
		filter: grayscale(1);
		opacity: .1;
	}

		.buy__all-features ._no::before{
			content: "\f068";
		}

	/* .buy__all-features ._extra{
		filter: grayscale(0.5);
	} */

		.buy__all-features ._extra::before{
			content: "\f155";
		}

/* Sales photos */
.buy__sales-photos{
	display: flex;
	align-items: center;
	justify-content: center;
}

	.buy__sales-photos > *{
		flex: 0 1 80px;
	}

	.buy__sales-photos > *:nth-child(2){
		margin: 0 -10px;
		position: relative;
		flex: 0 1 110px;
	}

		.buy__sales-photos img{
			width: 100%;
			height: auto;
			display: block;
			border-radius: 50%;
		}

		.buy__sales-photos > *:nth-child(2) img{
			border: 3px solid #fff;
		}

/*
	----------------
	- Animate height: Used on buy page to expand features
	----------------
*/

@keyframes animateHeight{
	0%{
		max-height: 0;
	}
	100%{
		max-height: var(--animating);
	}
}

[data-slide][style*="--animating"]{
	animation: animateHeight 0.3s;
	overflow: hidden;
}

[data-slide]:not([data-slide-visible]){
	animation-direction: reverse;
	max-height: 0;
	overflow: hidden;
}


/*
	----------------
	- Forms
	----------------
*/

.i-form input[type="text"],
.i-form textarea{
	--form-field--borderColor: rgba(0,0,0,.15);
	--form-field--borderHoverColor: rgba(0,0,0,.25);
	--form-field--radius: 5px;

	background: #fff;
	color: var(--c-9);
	box-shadow: rgba(0,0,0,.05) 0px 3px 4px -1px;
}

/* 2 Column form */
.i-form--enterprise .ipsForm,
.i-form--columns .ipsForm{
	display: flex;
	flex-wrap: wrap;
	margin: -20px 0 0 -20px;
}

	.i-form--enterprise .ipsFieldRow,
	.i-form--columns .ipsFieldRow{
		flex: 1 1 270px;
		margin: 0;
		padding: 20px 0 0 20px;
	}

	.i-form--enterprise .ipsFieldRow_title,
	.i-form--columns .ipsFieldRow_title{
		padding: 0 !important;
	}

	.i-form--enterprise form p.ipsType_center,
	.i-form--columns form p.ipsType_center{
		text-align: right;
	}

/* Form messages: missing fields, etc */
.sContactBlock__message--error{
	color: #b60d0d;
	background: #ffe2e2;
	font-weight: 500;
	margin-bottom: 2em;
	text-align: center;
	padding: 1em;
	border-radius: 5px;
}


/*
	----------------
	- Page: legal
	----------------
*/

.format--legal h2,
.format--legal h3,
.format--legal h4{
	color: var(--c-hard);
}


/*
	----------------
	- Gaps
	----------------
*/
.wrap_gap::before, .wrap_gap::after {
	content: '';
	display: table;
}

[class*=" gap_"] {
	--row-gap: var(--gap);
	margin: calc(var(--row-gap, 0px) * -1) 0 0 calc(var(--gap, 0px) * -1);
}

[class*=" gap_"] > * {
	margin-top: var(--row-gap, 0px);
	margin-left: var(--gap, 0px);
}

.gap_0 {
	--gap: 0px;
}

.gap_1 {
	--gap: var(--s-1);
}

.gap_2 {
	--gap: var(--s-2);
}

.gap_3 {
	--gap: var(--s-3);
}

.gap_4 {
	--gap: var(--s-4);
}

.gap_5 {
	--gap: var(--s-5);
}

.gap_6 {
	--gap: var(--s-6);
}

.gap_7 {
	--gap: var(--s-7);
}

.gap_8 {
	--gap: var(--s-8);
}

.gap_9 {
	--gap: var(--s-9);
}

.gap_section {
	--gap: var(--s-section);
}

.row-gap_0 {
	--row-gap: 0px;
}

.row-gap_1 {
	--row-gap: var(--s-1);
}

.row-gap_2 {
	--row-gap: var(--s-2);
}

.row-gap_3 {
	--row-gap: var(--s-3);
}

.row-gap_4 {
	--row-gap: var(--s-4);
}

.row-gap_5 {
	--row-gap: var(--s-5);
}

.row-gap_6 {
	--row-gap: var(--s-6);
}

.row-gap_7 {
	--row-gap: var(--s-7);
}

.row-gap_8 {
	--row-gap: var(--s-8);
}

.row-gap_9 {
	--row-gap: var(--s-9);
}

.row-gap_section {
	--row-gap: var(--s-section);
}


/*
	----------------
	- Basis classes control the widths of children under .fluid, .grid and .flex
	----------------
*/
[class*="basis_"] {
	flex-basis: var(--basis);
}

.basis_auto {
	--basis: auto;
}

.basis_10 {
	--basis: 10px;
}

.basis_20 {
	--basis: 20px;
}

.basis_30 {
	--basis: 30px;
}

.basis_40 {
	--basis: 40px;
}

.basis_50 {
	--basis: 50px;
}

.basis_60 {
	--basis: 60px;
}

.basis_70 {
	--basis: 70px;
}

.basis_80 {
	--basis: 80px;
}

.basis_90 {
	--basis: 90px;
}

.basis_100 {
	--basis: 100px;
}

.basis_120 {
	--basis: 120px;
}

.basis_140 {
	--basis: 140px;
}

.basis_160 {
	--basis: 160px;
}

.basis_180 {
	--basis: 180px;
}

.basis_200 {
	--basis: 200px;
}

.basis_220 {
	--basis: 220px;
}

.basis_240 {
	--basis: 240px;
}

.basis_260 {
	--basis: 260px;
}

.basis_280 {
	--basis: 280px;
}

.basis_300 {
	--basis: 300px;
}

.basis_320 {
	--basis: 320px;
}

.basis_340 {
	--basis: 340px;
}

.basis_360 {
	--basis: 360px;
}

.basis_380 {
	--basis: 380px;
}

.basis_400 {
	--basis: 400px;
}

.basis_420 {
	--basis: 420px;
}

.basis_440 {
	--basis: 440px;
}

.basis_460 {
	--basis: 460px;
}

.basis_480 {
	--basis: 480px;
}

.basis_500 {
	--basis: 500px;
}

.basis_520 {
	--basis: 520px;
}

.basis_540 {
	--basis: 540px;
}

.basis_560 {
	--basis: 560px;
}

.basis_580 {
	--basis: 580px;
}

.basis_600 {
	--basis: 600px;
}

.basis_620 {
	--basis: 620px;
}

.basis_640 {
	--basis: 640px;
}

.basis_660 {
	--basis: 660px;
}

.basis_680 {
	--basis: 680px;
}

.basis_700 {
	--basis: 700px;
}

.basis_720 {
	--basis: 720px;
}

.basis_740 {
	--basis: 740px;
}

.basis_760 {
	--basis: 760px;
}

.basis_780 {
	--basis: 780px;
}

.basis_800 {
	--basis: 800px;
}

.basis_820 {
	--basis: 820px;
}

.basis_840 {
	--basis: 840px;
}

.basis_860 {
	--basis: 860px;
}

.basis_880 {
	--basis: 880px;
}

.basis_900 {
	--basis: 900px;
}

.basis_920 {
	--basis: 920px;
}

.basis_940 {
	--basis: 940px;
}

.basis_960 {
	--basis: 960px;
}

.basis_980 {
	--basis: 980px;
}

.basis_1000 {
	--basis: 1000px;
}

.basis_10p {
	--basis: 10%;
}

.basis_20p {
	--basis: 20%;
}

.basis_25p {
	--basis: 25%;
}

.basis_30p {
	--basis: 30%;
}

.basis_33p {
	--basis: 33%;
}

.basis_40p {
	--basis: 40%;
}

.basis_50p {
	--basis: 50%;
}

.basis_60p {
	--basis: 60%;
}

.basis_66p {
	--basis: 66%;
}

.basis_70p {
	--basis: 70%;
}

.basis_75p {
	--basis: 75%;
}

.basis_80p {
	--basis: 80%;
}

.basis_90p {
	--basis: 90%;
}

.basis_100p {
	--basis: 100%;
}

._basis > * {
	flex-basis: inherit;
}

/*
	----------------
	- Border
	----------------
*/

.br_1 {
	border-radius: 3px;
}

.br_2 {
	border-radius: 5px;
}

.br_3 {
	border-radius: 7px;
}

.br_4 {
	border-radius: 9px;
}

.br_5 {
	border-radius: 11px;
}

.br_inherit {
	border-radius: inherit;
}

.br_50p {
	border-radius: 1000px;
}

.bs_1 {
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.bs_2 {
	box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.bs_3 {
	box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.bs_4 {
	box-shadow: 0 20px 25px rgba(0, 0, 0, 0.1), 0 3px 15px  rgba(0, 0, 0, 0.04);
}

.bs_5 {
	box-shadow: 0 25px 50px -8px rgba(0, 0, 0, 0.25);
}

/*
	----------------
	- Colours
	----------------
*/
.c_primary,
.hover:hover .hover__c_primary,
.hover__c_primary:hover,
._a__c_primary a,
._a-hover__c_primary a:hover {
	color: var(--c-primary);
}

.c_primary-light,
.hover:hover .hover__c_primary-light,
.hover__c_primary-light:hover,
._a__c_primary-light a,
._a-hover__c_primary-light a:hover {
	color: var(--c-primary-light);
}

.c_primary-dark,
.hover:hover .hover__c_primary-dark,
.hover__c_primary-dark:hover,
._a__c_primary-dark a,
._a-hover__c_primary-dark a:hover {
	color: var(--c-primary-dark);
}

.c_secondary,
.hover:hover .hover__c_secondary,
.hover__c_secondary:hover,
._a__c_secondary a,
._a-hover__c_secondary a:hover {
	color: var(--c-secondary);
}

.c_secondary-light,
.hover:hover .hover__c_secondary-light,
.hover__c_secondary-light:hover,
._a__c_secondary-light a,
._a-hover__c_secondary-light a:hover {
	color: var(--c-secondary-light);
}

.c_secondary-dark,
.hover:hover .hover__c_secondary-dark,
.hover__c_secondary-dark:hover,
._a__c_secondary-dark a,
._a-hover__c_secondary-dark a:hover {
	color: var(--c-secondary-dark);
}

.c_soft,
.hover:hover .hover__c_soft,
.hover__c_soft:hover,
._a__c_soft a,
._a-hover__c_soft a:hover {
	color: var(--c-soft);
}

.c_hard,
.hover:hover .hover__c_hard,
.hover__c_hard:hover,
._a__c_hard a,
._a-hover__c_hard a:hover {
	color: var(--c-hard);
}

.c_light,
.hover:hover .hover__c_light,
.hover__c_light:hover,
._a__c_light a,
._a-hover__c_light a:hover {
	color: var(--c-light);
}

.c_dark,
.hover:hover .hover__c_dark,
.hover__c_dark:hover,
._a__c_dark a,
._a-hover__c_dark a:hover {
	color: var(--c-dark);
}

.c_white,
.hover:hover .hover__c_white,
.hover__c_white:hover,
._a__c_white a,
._a-hover__c_white a:hover {
	color: #fff;
}

.c_inherit,
.hover:hover .hover__c_inherit,
.hover__c_inherit:hover,
._a__c_inherit a,
._a-hover__c_inherit a:hover {
	color: inherit;
}

.c_root,
.hover:hover .hover__c_root,
.hover__c_root:hover,
._a__c_root a,
._a-hover__c_root a:hover {
	color: var(--root--co);
}

.c_1,
.hover:hover .hover__c_1,
.hover__c_1:hover,
._a__c_1 a,
._a-hover__c_1 a:hover {
	color: var(--c-1);
}

.c_2,
.hover:hover .hover__c_2,
.hover__c_2:hover,
._a__c_2 a,
._a-hover__c_2 a:hover {
	color: var(--c-2);
}

.c_3,
.hover:hover .hover__c_3,
.hover__c_3:hover,
._a__c_3 a,
._a-hover__c_3 a:hover {
	color: var(--c-3);
}

.c_4,
.hover:hover .hover__c_4,
.hover__c_4:hover,
._a__c_4 a,
._a-hover__c_4 a:hover {
	color: var(--c-4);
}

.c_5,
.hover:hover .hover__c_5,
.hover__c_5:hover,
._a__c_5 a,
._a-hover__c_5 a:hover {
	color: var(--c-5);
}

.c_6,
.hover:hover .hover__c_6,
.hover__c_6:hover,
._a__c_6 a,
._a-hover__c_6 a:hover {
	color: var(--c-6);
}

.c_7,
.hover:hover .hover__c_7,
.hover__c_7:hover,
._a__c_7 a,
._a-hover__c_7 a:hover {
	color: var(--c-7);
}

.c_8,
.hover:hover .hover__c_8,
.hover__c_8:hover,
._a__c_8 a,
._a-hover__c_8 a:hover {
	color: var(--c-8);
}

.c_9,
.hover:hover .hover__c_9,
.hover__c_9:hover,
._a__c_9 a,
._a-hover__c_9 a:hover {
	color: var(--c-9);
}

.c_10,
.hover:hover .hover__c_10,
.hover__c_10:hover,
._a__c_10 a,
._a-hover__c_10 a:hover {
	color: var(--c-10);
}

.c_11,
.hover:hover .hover__c_11,
.hover__c_11:hover,
._a__c_11 a,
._a-hover__c_11 a:hover {
	color: var(--c-11);
}

.c_12,
.hover:hover .hover__c_12,
.hover__c_12:hover,
._a__c_12 a,
._a-hover__c_12 a:hover {
	color: var(--c-12);
}

.bc_primary,
.hover:hover .hover__bc_primary,
.hover__bc_primary:hover {
	background-color: var(--c-primary);
}

.bc_primary-light,
.hover:hover .hover__bc_primary-light,
.hover__bc_primary-light:hover {
	background-color: var(--c-primary-light);
}

.bc_primary-dark,
.hover:hover .hover__bc_primary-dark,
.hover__bc_primary-dark:hover {
	background-color: var(--c-primary-dark);
}

.bc_secondary,
.hover:hover .hover__bc_secondary,
.hover__bc_secondary:hover {
	background-color: var(--c-secondary);
}

.bc_secondary-light,
.hover:hover .hover__bc_secondary-light,
.hover__bc_secondary-light:hover {
	background-color: var(--c-secondary-light);
}

.bc_secondary-dark,
.hover:hover .hover__bc_secondary-dark,
.hover__bc_secondary-dark:hover {
	background-color: var(--c-secondary-dark);
}

.bc_soft,
.hover:hover .hover__bc_soft,
.hover__bc_soft:hover {
	background-color: var(--c-soft);
}

.bc_hard,
.hover:hover .hover__bc_hard,
.hover__bc_hard:hover {
	background-color: var(--c-hard);
}

.bc_light,
.hover:hover .hover__bc_light,
.hover__bc_light:hover {
	background-color: var(--c-light);
}

.bc_dark,
.hover:hover .hover__bc_dark,
.hover__bc_dark:hover {
	background-color: var(--c-dark);
}

.bc_root,
.hover:hover .hover__bc_root,
.hover__bc_root:hover {
	background-color: var(--root--ba-co);
}

.bc_1,
.hover:hover .hover__bc_1,
.hover__bc_1:hover {
	background-color: var(--c-1);
}

.bc_2,
.hover:hover .hover__bc_2,
.hover__bc_2:hover {
	background-color: var(--c-2);
}

.bc_3,
.hover:hover .hover__bc_3,
.hover__bc_3:hover {
	background-color: var(--c-3);
}

.bc_4,
.hover:hover .hover__bc_4,
.hover__bc_4:hover {
	background-color: var(--c-4);
}

.bc_5,
.hover:hover .hover__bc_5,
.hover__bc_5:hover {
	background-color: var(--c-5);
}

.bc_6,
.hover:hover .hover__bc_6,
.hover__bc_6:hover {
	background-color: var(--c-6);
}

.bc_7,
.hover:hover .hover__bc_7,
.hover__bc_7:hover {
	background-color: var(--c-7);
}

.bc_8,
.hover:hover .hover__bc_8,
.hover__bc_8:hover {
	background-color: var(--c-8);
}

.bc_9,
.hover:hover .hover__bc_9,
.hover__bc_9:hover {
	background-color: var(--c-9);
}

.bc_10,
.hover:hover .hover__bc_10,
.hover__bc_10:hover {
	background-color: var(--c-10);
}

.bc_11,
.hover:hover .hover__bc_11,
.hover__bc_11:hover {
	background-color: var(--c-11);
}

.bc_12,
.hover:hover .hover__bc_12,
.hover__bc_12:hover {
	background-color: var(--c-12);
}

.var--gradient-1{ --gradient: var(--c-gradient-1); }
.var--gradient-2{ --gradient: var(--c-gradient-2); }
.var--gradient-3{ --gradient: var(--c-gradient-3); }
.var--gradient-4{ --gradient: var(--c-gradient-4); }
.var--gradient-5{ --gradient: var(--c-gradient-5); }
.var--gradient-6{ --gradient: var(--c-gradient-6); }
.var--gradient-7{ --gradient: var(--c-gradient-7); }
.var--gradient-8{ --gradient: var(--c-gradient-8); }

.c_gradient{ color: var(--gradient, var(--c-secondary)); }
.c_gradient-1{ color: var(--c-gradient-1); }
.c_gradient-2{ color: var(--c-gradient-2); }
.c_gradient-3{ color: var(--c-gradient-3); }
.c_gradient-4{ color: var(--c-gradient-4); }
.c_gradient-5{ color: var(--c-gradient-5); }
.c_gradient-6{ color: var(--c-gradient-6); }
.c_gradient-7{ color: var(--c-gradient-7); }
.c_gradient-8{ color: var(--c-gradient-8); }

.-gradient > *,
.-gradient > *:nth-child(14n-13),
.-gradient-reverse > *:nth-child(14n-6){
	--gradient: var(--c-gradient-1);
}
.-gradient > *:nth-child(14n),
.-gradient > *:nth-child(14n-12),
.-gradient-reverse > *:nth-child(14n-7),
.-gradient-reverse > *:nth-child(14n-5){
	--gradient: var(--c-gradient-2);
}
.-gradient > *:nth-child(14n-11),
.-gradient > *:nth-child(14n-1),
.-gradient-reverse > *:nth-child(14n-8),
.-gradient-reverse > *:nth-child(14n-4){
	--gradient: var(--c-gradient-3);
}
.-gradient > *:nth-child(14n-10),
.-gradient > *:nth-child(14n-2),
.-gradient-reverse > *:nth-child(14n-9),
.-gradient-reverse > *:nth-child(14n-3){
	--gradient: var(--c-gradient-4);
}
.-gradient > *:nth-child(14n-9),
.-gradient > *:nth-child(14n-3),
.-gradient-reverse > *:nth-child(14n-10),
.-gradient-reverse > *:nth-child(14n-2){
	--gradient: var(--c-gradient-5);
}
.-gradient > *:nth-child(14n-8),
.-gradient > *:nth-child(14n-4),
.-gradient-reverse > *:nth-child(14n-11),
.-gradient-reverse > *:nth-child(14n-1){
	--gradient: var(--c-gradient-6);
}
.-gradient > *:nth-child(14n-7),
.-gradient > *:nth-child(14n-5),
.-gradient-reverse > *:nth-child(14n),
.-gradient-reverse > *:nth-child(14n-12){
	--gradient: var(--c-gradient-7);
}
.-gradient > *:nth-child(14n-6),
.-gradient-reverse > *,
.-gradient-reverse > *:nth-child(14n-13){
	--gradient: var(--c-gradient-8);
}

/* Contain gradients to 5 elements */
.-gradient.-contain > *:nth-child(2):nth-last-child(4){
	--gradient: var(--c-gradient-2);
}
.-gradient.-contain > *:nth-child(3):nth-last-child(3){
	--gradient: var(--c-gradient-4);
}
.-gradient.-contain > *:nth-child(4):nth-last-child(2){
	--gradient: var(--c-gradient-6);
}
.-gradient.-contain > *:nth-child(5):nth-last-child(1){
	--gradient: var(--c-gradient-8);
}


/* Contain gradients to 4 elements */
.-gradient.-contain > *:nth-child(2):nth-last-child(3){
	--gradient: var(--c-gradient-3);
}
.-gradient.-contain > *:nth-child(3):nth-last-child(2){
	--gradient: var(--c-gradient-6);
}
.-gradient.-contain > *:nth-child(4):nth-last-child(1){
	--gradient: var(--c-gradient-8);
}

/* Contain gradient to 3 elements */
.-gradient.-contain > *:nth-child(2):nth-last-child(2){
	--gradient: var(--c-gradient-4);
}
.-gradient.-contain > *:nth-child(3):nth-last-child(1){
	--gradient: var(--c-gradient-8);
}


/*
	----------------
	- Flexbox utility classes
	----------------
*/
.ai_flex-start {
	align-items: flex-start;
}

.ai_center {
	align-items: center;
}

.ai_flex-end {
	align-items: flex-end;
}

.ai_stretch {
	align-items: stretch;
}

.as_flex-start {
	align-self: flex-start;
}

.as_center {
	align-self: center;
}

.as_flex-end {
	align-self: flex-end;
}

.as_stretch {
	align-self: stretch;
}

.jc_flex-start {
	justify-content: flex-start;
}

.jc_center {
	justify-content: center;
}

.jc_flex-end {
	justify-content: flex-end;
}

.jc_space-around {
	justify-content: space-around;
}

.jc_space-between {
	justify-content: space-between;
}

.fd_column {
	flex-direction: column;
}

.fd_row-reverse {
	flex-direction: row-reverse;
}

.fw_wrap {
	flex-wrap: wrap;
}

.fw_wrap-reverse {
	flex-wrap: wrap-reverse;
}

@media (min-width: 640px) {
	.md__fd_row {
		flex-direction: row;
	}
	.md__fd_column {
		flex-direction: column;
	}
	.md__fd_row-reverse {
		flex-direction: row-reverse;
	}
    .md__jc_flex-start {
        justify-content: flex-start;
    }
}

@media (min-width: 860px) {
	.lg__fd_row {
		flex-direction: row;
	}
	.lg__fd_column {
		flex-direction: column;
	}
	.lg__fd_row-reverse {
		flex-direction: row-reverse;
	}
    .lg__jc_flex-start {
        justify-content: flex-start;
    }

}

/*
	----------------
	- Flex grow and shrink
	----------------
*/
body .flex_00, ._flex_00 > * {
	flex-grow: 0;
	flex-shrink: 0;
}

body .flex_10, ._flex_10 > * {
	flex-grow: 1;
	flex-shrink: 0;
}

body .flex_11, ._flex_11 > * {
	flex-grow: 1;
	flex-shrink: 1;
}

body .flex_01, ._flex_01 > * {
	flex-grow: 0;
	flex-shrink: 1;
}

/*
	----------------
	- Font sizes
	----------------
*/
.fs_-2 {
	font-size: 1.2rem;
}

.fs_-1 {
	font-size: 1.4rem;
}

.fs_root {
	font-size: 1.5rem;
}

.fs_1 {
	font-size: 1.65rem;
}

.fs_2, .format h4, .h4 {
	font-size: 1.8rem;
}

.fs_3, .format h3 {
	font-size: calc(1.9rem + .1 * var(--range));
	line-height: 1.38;
	--li-he: 1.38;
}

.fs_4, .h3, .format h2 {
	font-size: calc(2.4rem + .3 * var(--range));
	line-height: 1.35;
	--li-he: 1.35;
}

.fs_5, .format h1 {
	font-size: calc(2.7rem + .6 * var(--range));
	line-height: 1.3;
	--li-he: 1.3;
}

.fs_6, .h2 {
	font-size: calc(3rem + 1 * var(--range));
	line-height: 1.3;
	--li-he: 1.3;
}

.fs_7 {
	font-size: calc(3.2rem + 1.4 * var(--range));
	line-height: 1.25;
	--li-he: 1.25;
}

.fs_8, .h1 {
	font-size: calc(3.4rem + 2.3 * var(--range));
	line-height: 1.15;
	--li-he: 1.15;
}

.fs_9 {
	font-size: calc(4rem + 4.5 * var(--range));
	line-height: 1.1;
	--li-he: 1.1;
}

/* Safari resize fix */
.fs_3, .fs_4, .fs_5, .fs_6, .fs_7, .fs_8, .fs_9, .fs_fluid {
	-webkit-marquee-increment: 0vw;
}


/*
	----------------
	Font Weight
	----------------
*/
.fw_100 {
	font-weight: 100;
}

.fw_200 {
	font-weight: 200;
}

.fw_300 {
	font-weight: 300;
}

.fw_400,
.fw_normal {
	font-weight: 400;
}

.fw_500 {
	font-weight: 500;
}

.fw_600 {
	font-weight: 600;
}

.fw_700,
.fw_bold {
	font-weight: 700;
}

.fw_800 {
	font-weight: 800;
}

.fw_900 {
	font-weight: 900;
}

/*
	----------------
	- Opacity
	----------------
*/
.o_0, .hover__o_0:hover, .hover:hover .hover__o_0 {
	opacity: 0;
}

.o_1, .hover__o_1:hover, .hover:hover .hover__o_1 {
	opacity: 0.1;
}

.o_2, .hover__o_2:hover, .hover:hover .hover__o_2 {
	opacity: 0.2;
}

.o_3, .hover__o_3:hover, .hover:hover .hover__o_3 {
	opacity: 0.3;
}

.o_4, .hover__o_4:hover, .hover:hover .hover__o_4 {
	opacity: 0.4;
}

.o_5, .hover__o_5:hover, .hover:hover .hover__o_5 {
	opacity: 0.5;
}

.o_6, .hover__o_6:hover, .hover:hover .hover__o_6 {
	opacity: 0.6;
}

.o_7, .hover__o_7:hover, .hover:hover .hover__o_7 {
	opacity: 0.7;
}

.o_8, .hover__o_8:hover, .hover:hover .hover__o_8 {
	opacity: 0.8;
}

.o_9, .hover__o_9:hover, .hover:hover .hover__o_9 {
	opacity: 0.9;
}

.o_10, .hover__o_10:hover, .hover:hover .hover__o_10 {
	opacity: 1;
}

/*
	----------------
	- Other
	----------------
*/
.d_block {
	display: block;
}

.d_inline {
	display: inline;
}

.d_inline-block {
	display: inline-block;
}

.d_none,
.hidden {
	display: none !important;
}

[data-toggle-me] {
	display: none;
}

.h_100p {
	min-height: 100%;
}

.h_100vh {
	min-height: 100vh;
}

.p_cover {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.of_cover {
	-o-object-fit: cover;
		 object-fit: cover;
}

.of_contain {
	-o-object-fit: contain;
		 object-fit: contain;
}

.p_relative {
	position: relative;
}

.bs_cover{
	background-size: cover;
	background-position: 50%;
}

.bs_contain {
	background-size: contain;
}

@media (min-width:  980px){
	.ba_fixed{
		background-attachment: fixed;
	}
}

.o_hidden {
	overflow: hidden;
}

.pe_none {
	pointer-events: none;
}

.pe_auto {
	pointer-events: auto;
}

.transition {
	transition: all 0.15s ease-in-out;
}

/*
	----------------
	- max-width classes
	----------------
*/
.max_50 {
	max-width: 50px;
}

.max_100 {
	max-width: 100px;
}

.max_150 {
	max-width: 150px;
}

.max_200 {
	max-width: 200px;
}

.max_250 {
	max-width: 250px;
}

.max_300 {
	max-width: 300px;
}

.max_350 {
	max-width: 350px;
}

.max_400 {
	max-width: 400px;
}

.max_450 {
	max-width: 450px;
}

.max_500 {
	max-width: 500px;
}

.max_550 {
	max-width: 550px;
}

.max_600 {
	max-width: 600px;
}

.max_650 {
	max-width: 650px;
}

.max_700 {
	max-width: 700px;
}

.max_750 {
	max-width: 750px;
}

.max_800 {
	max-width: 800px;
}

.max_850 {
	max-width: 850px;
}

.max_900 {
	max-width: 900px;
}

.max_950 {
	max-width: 950px;
}

.max_1000 {
	max-width: 1000px;
}

.max_1050 {
	max-width: 1050px;
}

.max_1100 {
	max-width: 1100px;
}

.max_1150 {
	max-width: 1150px;
}

.max_1200 {
	max-width: 1200px;
}

.max_1250 {
	max-width: 1250px;
}

.max_1300 {
	max-width: 1300px;
}

.max_1350 {
	max-width: 1350px;
}

.max_1400 {
	max-width: 1400px;
}

/*
	----------------
	- Margins
	----------------
*/
.mx_auto {
	margin-left: auto;
	margin-right: auto;
}

.ml_auto {
	margin-left: auto;
}

.mr_auto {
	margin-right: auto;
}

._my_1 > * + *,
body .mt_1,
body .my_1 {
	margin-top: var(--s-1);
}

body .mb_1,
body .my_1 {
	margin-bottom: var(--s-1);
}

._mx_1 > * + *,
body .ml_1,
body .mx_1 {
	margin-left: var(--s-1);
}

body .mr_1,
body .mx_1 {
	margin-right: var(--s-1);
}

._my_2 > * + *,
body .mt_2,
body .my_2 {
	margin-top: var(--s-2);
}

body .mb_2,
body .my_2 {
	margin-bottom: var(--s-2);
}

._mx_2 > * + *,
body .ml_2,
body .mx_2 {
	margin-left: var(--s-2);
}

body .mr_2,
body .mx_2 {
	margin-right: var(--s-2);
}

._my_3 > * + *,
body .mt_3,
body .my_3 {
	margin-top: var(--s-3);
}

body .mb_3,
body .my_3 {
	margin-bottom: var(--s-3);
}

._mx_3 > * + *,
body .ml_3,
body .mx_3 {
	margin-left: var(--s-3);
}

body .mr_3,
body .mx_3 {
	margin-right: var(--s-3);
}

._my_4 > * + *,
body .mt_4,
body .my_4 {
	margin-top: var(--s-4);
}

body .mb_4,
body .my_4 {
	margin-bottom: var(--s-4);
}

._mx_4 > * + *,
body .ml_4,
body .mx_4 {
	margin-left: var(--s-4);
}

body .mr_4,
body .mx_4 {
	margin-right: var(--s-4);
}

._my_5 > * + *,
body .mt_5,
body .my_5 {
	margin-top: var(--s-5);
}

body .mb_5,
body .my_5 {
	margin-bottom: var(--s-5);
}

._mx_5 > * + *,
body .ml_5,
body .mx_5 {
	margin-left: var(--s-5);
}

body .mr_5,
body .mx_5 {
	margin-right: var(--s-5);
}

._my_6 > * + *,
body .mt_6,
body .my_6 {
	margin-top: var(--s-6);
}

body .mb_6,
body .my_6 {
	margin-bottom: var(--s-6);
}

._mx_6 > * + *,
body .ml_6,
body .mx_6 {
	margin-left: var(--s-6);
}

body .mr_6,
body .mx_6 {
	margin-right: var(--s-6);
}

._my_7 > * + *,
body .mt_7,
body .my_7 {
	margin-top: var(--s-7);
}

body .mb_7,
body .my_7 {
	margin-bottom: var(--s-7);
}

._mx_7 > * + *,
body .ml_7,
body .mx_7 {
	margin-left: var(--s-7);
}

body .mr_7,
body .mx_7 {
	margin-right: var(--s-7);
}

._my_8 > * + *,
body .mt_8,
body .my_8 {
	margin-top: var(--s-8);
}

body .mb_8,
body .my_8 {
	margin-bottom: var(--s-8);
}

._mx_8 > * + *,
body .ml_8,
body .mx_8 {
	margin-left: var(--s-8);
}

body .mr_8,
body .mx_8 {
	margin-right: var(--s-8);
}

._my_9 > * + *,
body .mt_9,
body .my_9 {
	margin-top: var(--s-9);
}

body .mb_9,
body .my_9 {
	margin-bottom: var(--s-9);
}

._mx_9 > * + *,
body .ml_9,
body .mx_9 {
	margin-left: var(--s-9);
}

body .mr_9,
body .mx_9 {
	margin-right: var(--s-9);
}

._my_section > * + *,
body .mt_section,
body .my_section {
	margin-top: var(--s-section);
}

body .mb_section,
body .my_section {
	margin-bottom: var(--s-section);
}

._mx_section > * + *,
body .ml_section,
body .mx_section {
	margin-left: var(--s-section);
}

body .mr_section,
body .mx_section {
	margin-right: var(--s-section);
}

._my_0 > * + *,
body .mt_0,
body .my_0 {
	margin-top: var(--s-0);
}

body .mb_0,
body .my_0 {
	margin-bottom: var(--s-0);
}

._mx_0 > * + *,
body .ml_0,
body .mx_0 {
	margin-left: var(--s-0);
}

body .mr_0,
body .mx_0 {
	margin-right: var(--s-0);
}

/*
	----------------
	- Padding
	----------------
*/
.pt_1, .py_1, .p_1 {
	padding-top: var(--s-1);
}

.pr_1, .px_1, .p_1 {
	padding-right: var(--s-1);
}

.pb_1, .py_1, .p_1 {
	padding-bottom: var(--s-1);
}

.pl_1, .px_1, .p_1 {
	padding-left: var(--s-1);
}

.pt_2, .py_2, .p_2 {
	padding-top: var(--s-2);
}

.pr_2, .px_2, .p_2 {
	padding-right: var(--s-2);
}

.pb_2, .py_2, .p_2 {
	padding-bottom: var(--s-2);
}

.pl_2, .px_2, .p_2 {
	padding-left: var(--s-2);
}

.pt_3, .py_3, .p_3 {
	padding-top: var(--s-3);
}

.pr_3, .px_3, .p_3 {
	padding-right: var(--s-3);
}

.pb_3, .py_3, .p_3 {
	padding-bottom: var(--s-3);
}

.pl_3, .px_3, .p_3 {
	padding-left: var(--s-3);
}

.pt_4, .py_4, .p_4 {
	padding-top: var(--s-4);
}

.pr_4, .px_4, .p_4 {
	padding-right: var(--s-4);
}

.pb_4, .py_4, .p_4 {
	padding-bottom: var(--s-4);
}

.pl_4, .px_4, .p_4 {
	padding-left: var(--s-4);
}

.pt_5, .py_5, .p_5 {
	padding-top: var(--s-5);
}

.pr_5, .px_5, .p_5 {
	padding-right: var(--s-5);
}

.pb_5, .py_5, .p_5 {
	padding-bottom: var(--s-5);
}

.pl_5, .px_5, .p_5 {
	padding-left: var(--s-5);
}

.pt_6, .py_6, .p_6 {
	padding-top: var(--s-6);
}

.pr_6, .px_6, .p_6 {
	padding-right: var(--s-6);
}

.pb_6, .py_6, .p_6 {
	padding-bottom: var(--s-6);
}

.pl_6, .px_6, .p_6 {
	padding-left: var(--s-6);
}

.pt_7, .py_7, .p_7 {
	padding-top: var(--s-7);
}

.pr_7, .px_7, .p_7 {
	padding-right: var(--s-7);
}

.pb_7, .py_7, .p_7 {
	padding-bottom: var(--s-7);
}

.pl_7, .px_7, .p_7 {
	padding-left: var(--s-7);
}

.pt_8, .py_8, .p_8 {
	padding-top: var(--s-8);
}

.pr_8, .px_8, .p_8 {
	padding-right: var(--s-8);
}

.pb_8, .py_8, .p_8 {
	padding-bottom: var(--s-8);
}

.pl_8, .px_8, .p_8 {
	padding-left: var(--s-8);
}

.pt_9, .py_9, .p_9 {
	padding-top: var(--s-9);
}

.pr_9, .px_9, .p_9 {
	padding-right: var(--s-9);
}

.pb_9, .py_9, .p_9 {
	padding-bottom: var(--s-9);
}

.pl_9, .px_9, .p_9 {
	padding-left: var(--s-9);
}

.pt_section, .py_section, .section, .p_section {
	padding-top: var(--s-section);
}

.pr_section, .px_section, .p_section {
	padding-right: var(--s-section);
}

.pb_section, .py_section, .section, .p_section {
	padding-bottom: var(--s-section);
}

.pl_section, .px_section, .p_section {
	padding-left: var(--s-section);
}

.pt_0, .py_0, .p_0 {
	padding-top: var(--s-0);
}

.pr_0, .px_0, .p_0 {
	padding-right: var(--s-0);
}

.pb_0, .py_0, .p_0 {
	padding-bottom: var(--s-0);
}

.pl_0, .px_0, .p_0 {
	padding-left: var(--s-0);
}

/*
	----------------
	Text Align
	----------------
*/
.ta_center {
	text-align: center;
}

.ta_left {
	text-align: left;
}

.ta_right {
	text-align: right;
}

@media (min-width: 420px) {
	.sm__ta_center {
		text-align: center;
	}
	.sm__ta_left {
		text-align: left;
	}
	.sm__ta_right {
		text-align: right;
	}
}

@media (min-width: 640px) {
	.md__ta_center {
		text-align: center;
	}
	.md__ta_left {
		text-align: left;
	}
	.md__ta_right {
		text-align: right;
	}
}

@media (min-width: 860px) {
	.lg__ta_center {
		text-align: center;
	}
	.lg__ta_left {
		text-align: left;
	}
	.lg__ta_right {
		text-align: right;
	}
}

/*
	----------------
	Typography
	----------------
*/
/* Crop white space above and below text */
@supports (--css: var) {
	.text-crop::before, .format h1::before, .format h2::before, .format h3::before, .format h4::before, .h1::before, .h2::before, .h3::before {
		content: '';
		display: block;
		height: .01px;
		margin-bottom: calc((var(--text-crop-top) - var(--li-he)) * 0.5em);
	}
	.text-crop::after, .format h1::after, .format h2::after, .format h3::after, .format h4::after, .h1::after, .h2::after, .h3::after {
		content: '';
		display: block;
		height: .01px;
		margin-top: calc((var(--text-crop-bottom) - var(--li-he)) * 0.5em);
	}
}

/*
	----------------
	- Text-decoration
	----------------
*/
.tt_uppercase {
	text-transform: uppercase;
}

.tt_lowercase {
	text-transform: lowercase;
}

.tt_none {
	text-transform: none;
}

.td_underline,
._a__td_underline a,
._a-hover__td_underline a:hover {
	text-decoration: underline;
}

.td_none,
._a__td_none a,
._a-hover__td_none a:hover {
	text-decoration: none;
}

/* Faint underlines on links */
.td_faint-underline,
._a__td_faint-underline a {
	position: relative;
}

.td_faint-underline::after,
._a__td_faint-underline a::after {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 100%;
	height: calc(1px + .03em);
	background: currentColor;
	opacity: .3;
	transition: opacity 0.2s ease-in-out;
}

.td_faint-underline:hover::after,
._a__td_faint-underline a:hover::after {
	opacity: .75;
}

.fs_italic {
	font-style: italic;
}

.fs_normal {
	font-style: normal;
}