.CONTENT .container {
	max-width: 960rem;
	position: relative;
}

.CONTENT li::marker {
	color: var(--dark-purple);
}

.CONTENT:not([data-style="post"]) ul.purple li {
	color: var(--dark-purple);
	font-size: 28px;
	font-weight: 900;
	line-height: 44px;
}

.CONTENT:not([data-style="post"]) ul.purple li::before {
	content: "\2022"; 
	color: var(--blue);
	font-weight: bold;
	display: inline-block;
	width: 1em;
	margin-left: -1em;
}

.CONTENT:not([data-style="post"]) .container ul.purple {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
}

.CONTENT:not([data-style="post"]) .container ul.purple li {
	width: 45%;
	margin-bottom: 15rem;
}

.CONTENT .container.alt-centered {
	text-align: center;
	margin: 0 auto;
}

.CONTENT .deco {
	pointer-events: none;
	display: none;
}

.CONTENT .deco .top-left {
	position: absolute;
	top: -80rem;
	left: -80rem;
	width: 519rem;
	height: 255rem;
	background: no-repeat center / 100%;
}

.CONTENT .deco .bottom-right {
	position: absolute;
	bottom: -80rem;
	right: -80rem;
	width: 378rem;
	height: 228rem;
	background: no-repeat center / 100%;
}

.CONTENT .container h4 + h2 {margin-top: 0.3em;}
.CONTENT .container p:last-child .b-button {margin-top: 0.5em;}

.CONTENT[data-width="12"] .container {max-width: 100%;}
.CONTENT[data-width="10"] .container {max-width: 960rem;}
.CONTENT[data-width="8"] .container {max-width: 760rem;}
.CONTENT[data-width="6"] .container {max-width: 560rem;}



/* heading */

.CONTENT[data-style="heading"] .container {color: var(--dark-purple);}
.CONTENT[data-style="heading"] h1 a:not(:hover),
.CONTENT[data-style="heading"] h2 a:not(:hover),
.CONTENT[data-style="heading"] h3 a:not(:hover),
.CONTENT[data-style="heading"] h4 a:not(:hover),
.CONTENT[data-style="heading"] h5 a:not(:hover),
.CONTENT[data-style="heading"] h6 a:not(:hover) {color: var(--blue);}



/* post */

.CONTENT[data-style="post"] .container {
	margin: 0 auto;
}

.CONTENT[data-style="post"] .share {
	display: none;
	position: sticky;
	width: 60rem;
	height: 250rem;
	top: 170rem;
	margin-top: -500rem;
}

.CONTENT[data-style="post"] .share .heading {
	font-weight: 700;
	color: var(--blue);
	margin-bottom: 5rem;
}

.CONTENT[data-style="post"] .share a {
	display: block;
	box-sizing: border-box;
	background: var(--blue);
	color: var(--white);
	width: 40rem;
	height: 40rem;
	border-radius: 20rem;
	padding: 8rem;
	margin-bottom: 15rem;
	transition: background 0.25s;
}

.CONTENT[data-style="post"] .share a:hover {
	background: var(--pink);
}

.CONTENT[data-style="post"] .author {
	background: var(--light-purple);
	border-radius: 40rem;
	padding: 40rem;
	display: flex;
	margin: 80rem -40rem 0;
	align-items: flex-start;
}

.CONTENT[data-style="post"] .author-bio {
	flex-grow: 1;
}

.CONTENT[data-style="post"] .author-bio  p {
	margin: 0.5em 0;
}

.CONTENT[data-style="post"] .author-image {
	width: 80rem;
	border-radius: 100%;
	overflow: hidden;
	margin-right: 20rem;
}

.CONTENT[data-style="post"] .share + .container {padding-top: calc(500rem - 250rem);}
.CONTENT[data-style="post"] .share {display: block;}

@media screen and (max-width: 960px) {
	.CONTENT[data-style="heading"] .container {text-align: left;}
	.CONTENT[data-style="heading"] .container br {display: none;}

	.CONTENT[data-style="post"] .author {border-radius: 20rem; margin: 40rem 0 0; padding: 20rem; flex-direction: column;}
	.CONTENT[data-style="post"] .author-image {margin: 0 0 20rem 0;}
	.CONTENT[data-style="post"] .share {display: none;}
	.CONTENT[data-style="post"] .share + .container {padding-top: 0;}
}



/* decoration */

@media screen and (min-width: 961px) {
	.CONTENT:not([data-decoration=""]) {position: relative; margin: 80rem 0;}
	.CONTENT:not([data-decoration=""]) .deco {display: block;}
}

.CONTENT[data-decoration="orange-purple"] .deco .top-left {background-image: url(images/deco-top-left-orange.svg);}
.CONTENT[data-decoration="orange-purple"] .deco .bottom-right {background-image: url(images/deco-bottom-right-purple.svg);}

.CONTENT[data-decoration="pink-cyan"] .deco .top-left {background-image: url(images/deco-top-left-pink.svg);}
.CONTENT[data-decoration="pink-cyan"] .deco .bottom-right {background-image: url(images/deco-bottom-right-cyan.svg);}