.expand-text-primary {
	position: relative;
}
.expand-text-primary button {
	display: none;
	margin: 20px auto;
}
.expand-text-primary button.see-more {
	padding: 10px;
	border-radius: 3px;
	background-color: var(--color2);
	font-family: var(--saans-heavy);
	color: var(--white);
	font-size: 13px;
}

@media (max-width: 40em) {
	.expand-text-primary.mobile .text-mask {
		max-height: 420px;
		overflow: hidden;
		position: relative;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.mobile .text-mask:after {
		content: '';
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 25%;
		background: linear-gradient(transparent, white);
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.active.mobile .text-mask:after {
		pointer-events: none;
	}
	.expand-text-primary.mobile.active .text-mask:after {
		opacity: 0;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.mobile button {
		display: block;
	}
}

@media (min-width: 40.063em) and (max-width: 64em) {
	
	.expand-text-primary.tablet .text-mask {
		max-height: 420px;
		overflow: hidden;
		position: relative;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.tablet .text-mask:after {
		content: '';
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 25%;
		background: linear-gradient(transparent, white);
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.tablet.active .text-mask:after,
	.expand-text-primary.tablet.active .text-mask p:after {
		opacity: 0;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.tablet button {
		display: block;
	}
}

@media (min-width: 64.063em) {
	.expand-text-primary.desktop .text-mask {
		max-height: 420px;
		overflow: hidden;
		position: relative;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.desktop .text-mask:after {
		content: '';
		position: absolute;
		left: 0;
		bottom: 0;
		width: 100%;
		height: 25%;
		background: linear-gradient(transparent, white);
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.desktop.active .text-mask:after,
	.expand-text-primary.desktop.active .text-mask p:after {
		opacity: 0;
		-webkit-transition: all 250ms ease-in-out;
		-moz-transition: all 250ms ease-in-out;
		-o-transition: all 250ms ease-in-out;
		transition: all 250ms ease-in-out;
	}
	.expand-text-primary.desktop button {
		display: block;
	}
}