/* viewport */
@-ms-viewport {
	width: device-width;
	zoom: 1;
	min-zoom: 1;
	user-zoom: zoom;
}
@viewport {
	width: device-width;
	zoom: 1;
	min-zoom: 1;
	user-zoom: zoom;
}


/* fonts */
@font-face {
	font-family: 'OpenSansEmbedded';
	src: url('../fonts/opensans-regular.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSansEmbedded';
	src: url('../fonts/opensans-italic.woff') format('woff');
	font-weight: 400;
	font-style: italic;
}
@font-face {
	font-family: 'OpenSansEmbedded';
	src: url('../fonts/opensans-bold.woff') format('woff');
	font-weight: 700;
	font-style: normal;
}
@font-face {
	font-family: 'NexaBlackEmbedded';
	src: url('../fonts/nexa-black.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'NexaLightEmbedded';
	src: url('../fonts/nexa-light.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'NexaBoldEmbedded';
	src: url('../fonts/nexa-bold.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}
@font-face {
	font-family: 'NexaScriptEmbedded';
	src: url('../fonts/nexa-script.woff') format('woff');
	font-weight: 400;
	font-style: normal;
}


/* reset and general styles */
*, *::before, *::after {
	margin: 0;
	padding: 0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	background: #181818;
	color: #f4f4f4;
	font-family: 'OpenSansEmbedded', 'Avenir Next', 'Avenir', 'Segoe UI', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif;
	line-height: 1.2;
	font-size: 20px;
	overflow-x: hidden;
}
img {
	-ms-interpolation-mode: bicubic;
}
article, aside, details, figcaption, figure, footer, .headerPost, hgroup, main, nav, .sectionContent, summary {
	display: block;
}
sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
a {
	color: inherit;
}
h1, h2 {
	font-size: 1em;
	font-weight: normal;
}


/* container */
section, aside, footer, main > div {
	z-index: 1;
	position: relative;
	overflow: hidden;
}


/* page header */
.headerPage {
	z-index: 1;
	position: relative;
	width: 100%;
	top: 0;
	left: 0;
	margin: 6vw 0 0 0;
}
.headerPage h1 {
	max-width: 768px;
	font-family: 'NexaBlackEmbedded', sans-serif;
	font-size: 60px;
	text-transform: uppercase;
	padding: 0.4em 0 0.1em 0;
	margin: 0 auto 0 auto;
	line-height: 1;
	text-align: center;
}
@media (max-width: 830px) {
	.headerPage h1 {
		max-width: 100%;
		padding: 0 4% 0 4%;
		font-size: 7.5vw;
	}
}
@media (max-aspect-ratio: 1/1) {
	.headerPage {
		margin: 12vw 0 0 0;
	}
	.headerPage h1 {
		padding: 0.8em 0 0.6em 0;
	}
}


/* home page header */
.headerHome {
	z-index: 0;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 33.33vw;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.headerHome + * {
	margin-top: 33.33vw;
}
.headerHome h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 54.9vw;
	height: 9.7vw;
	margin: -5vw 0 0 -27.45vw;
	background: url('../img/logo-big-light.svg') top left no-repeat;
	background-size: 100% 100%;
	overflow: hidden;
	font-size: 1px;
	color: rgba(0, 0, 0, 0);
}
.headerHome[data-scheme="dark"] h1 {
	background-image: url('../img/logo-big-dark.svg');
}
.headerHome p {
	font-size: 1.75vw;
	line-height: 1.5;
	position: absolute;
	bottom: 1em;
	left: 50%;
	right: 0;
	text-align: center;
	width: 54.9vw;
	margin: 0 0 0 -27.45vw;
}
@media (min-aspect-ratio:3/1) {
	.headerHome {
		position: absolute;
	}
}
@media (max-aspect-ratio:1/1) {
	.headerHome {
		height: 50vw;
	}
	.headerHome + * {
		margin-top: 50vw;
	}
	.headerHome h1 {
		width: 60.39vw;
		height: 10.67vw;
		margin: -5.5vw 0 0 -30.195vw;
	}
	.headerHome p {
		width: 60.39vw;
		margin-left: -30.195vw;
	}
}
@media (max-width: 640px) {
	.headerHome p {
		font-size: 3vw;
		width: 92vw;
		margin-left: -46vw;
	}
}
@media (max-width: 479px) {
	.headerHome p {
		font-size: 3.6vw;
	}
}


/* .headerPost */
.headerPost {
	z-index: 0;
	position: fixed;
	top: 0;
	left: 0;
	font-size: 7vw;
	width: 100%;
	height: 50vw;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
}
.headerPost + * {
	margin-top: 50vw;
}
.headerPost > div {
	position: absolute;
}
.headerPost h1 {
	padding: 0 0 0.75vw 0;
}
.headerPost span {
	display: block;
	margin: 0 0 1.05vw 0;
	padding: 0.25em 0 0 0;
	line-height: 0.65;
	white-space: nowrap;
}
.headerPost p {
	margin: 1vh 0 0 0;
	font-size: 0.25em;
	line-height: 1.5;
	font-style: italic;
}
.headerPost p span {
	white-space: nowrap;
}
.headerPost > ul {
	display: none;
}
@media (min-aspect-ratio:2/1) {
	.headerPost {
		position: absolute;
	}
}
@media (max-aspect-ratio:1/1) {
	.headerPost {
		height: 100vw;
	}
	.headerPost + * {
		margin-top: 100vw;
	}
}
@media (max-width: 640px) {
	.headerPost p {
		font-size: 3vw;
	}
}
@media (max-width: 479px) {
	.headerPost {
		font-size: 9vw;
	}
	.headerPost p {
		font-size: 3.6vw;
	}
	.headerPost span {
		margin: 0 0 1.35vw 0;
	}
}


/* content area */
.sectionContent {
	font-size: 75px;
	line-height: 1.6;
	padding: 3vmin 0 5vmin 0;
}
.sectionContent strong {
	font-weight: bold;
	font-style: normal;
}
.sectionContent em {
	font-weight: normal;
	font-style: italic;
}
.sectionContent iframe {
	max-width: 100%;
	display: block;
	margin: 0 auto 0 auto;
	border: none;
}
.sectionContent > p, .sectionContent > h2, .sectionContent > ul, .sectionContent > ol, .sectionContent > blockquote p, .sectionContent > form {
	font-size: 19px;
	max-width: 768px;
	margin: 0 auto 1em auto;
}
.sectionContent > p.quote {
	text-indent: -0.34em;
}
.sectionContent > ul, .sectionContent > ol, .sectionContent > blockquote p {
	padding: 0 40px 0 40px;
}
html.js .sectionContent > blockquote p {
	-webkit-transform: translateY(30px);
	transform: translateY(30px);
	opacity: 0;
}
html.js .sectionContent > blockquote.on p {
	-webkit-transition: -webkit-transform 0.75s ease-out 0.5s, opacity 0.75s linear 0.5s;
	transition: transform 0.75s ease-out 0.5s, opacity 0.75s linear 0.5s;
	-webkit-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
}
.sectionContent > ul, .sectionContent > ol {
	list-style: none;
	clear: left;
}
.sectionContent > ul li::before {
	content: '\2022';
	display: inline-block;
	width: 1em;
	margin-left: -1em;
}
.sectionContent > ol {
	counter-reset: li;
}
.sectionContent > ol li::before {
	content: counter(li);
	display: inline-block;
	width: 1em;
	margin-left: -1.5em;
    margin-right: 0.5em;
    text-align: right;
}
.sectionContent > ul li, .sectionContent > ol li {
	margin: 0 0 1em 0;
	counter-increment: li
}
.sectionContent > blockquote {
	margin: 0.5em auto 0.5em auto;
	padding: 0.5em 0 0.5em 0;
	clear: both;
	font-style: italic;
}
.sectionContent > blockquote p {
	font-size: 27px;
	text-indent: -0.32em;
	margin-bottom: 0;
}
.sectionContent > blockquote p::before {
	content: '\201C';
}
.sectionContent > blockquote p:last-child:after {
	content: '\201D';
}
.sectionContent > blockquote.twitter-tweet {
	background: none !important;
	color: inherit !important;
}
.sectionContent > blockquote.twitter-tweet p {
	font-size: 18px;
}
.sectionContent > blockquote.twitter-tweet p::before {
	content: '';
}
.sectionContent > blockquote.twitter-tweet p:last-child:after {
	content: '';
}
.sectionContent > table {
	font-size: 19px;
	margin: 2em auto 2em auto;
	border-collapse: separate;
	border-spacing: 2px;
	border: none;
}
.sectionContent > table caption {
	font-size: 14px;
	padding: 12px 12px 14px 12px;
	font-style: italic;
	text-align: left;
	caption-side: bottom;
}
.sectionContent > table th, .sectionContent > table td {
	text-align: left;
	vertical-align: top;
	font-size: 1em;
	border: none;
	background: rgba(140, 140, 140, 0.2);
	padding: 0.5em 0.6em 0.6em 0.6em;
	line-height: 1.2;
}
.sectionContent > table thead th {
	vertical-align: bottom;
}
.sectionContent > table tbody th {
	text-align: right;
}
.sectionContent > h2 {
	font-weight: bold;
	margin: 1.5em auto 1em auto;
	line-height: 1;
	clear: both;
}
.sectionContent > h2:first-child {
	margin-top: 0;
}
.sectionContent > h2 strong, .sectionContent > h2 em {
	font-weight: inherit;
	font-style: inherit;
}
.sectionContent > hr {
	color: transparent;
	width: 100%;
	height: 1px;
	border: none;
	background: transparent;
	border-top: 1px dashed #808080;
	margin: 0.5em 0 0.5em 0;
	clear: both;
	opacity: 0.25;
}
.sectionContent > .figure {
	margin: 0.5em auto 0.5em auto;
	clear: both;
	text-align: center;
}
.sectionContent > .figure iframe {
	width: 768px;
	max-width: 100%;
	max-height: 100vw;
}
.sectionContent > .figure + .figure {
	margin-top: -0.5em;
}
.sectionContent > .figure.center {
	max-width: 768px;
}
.sectionContent > .figure.left, .sectionContent > .figure.right {
	margin: 0 auto 0 auto;
}
.sectionContent > .figure.left figure {
	max-width: 40%;
	float: left;
	margin: 0.1em 0.25em 0.25em 0;
}
.sectionContent > .figure.right figure {
	max-width: 40%;
	float: right;
	margin: 0.1em 0 0.25em 0.2em;
}
.sectionContent > .figure img {
	display: block;
	width: 100%;
	height: auto;
}
html.js .sectionContent > .figure.left figure, html.js .sectionContent > .figure.right figure {
	overflow: hidden;
}
html.js .sectionContent > .figure.left.on img, html.js .sectionContent > .figure.right.on img {
	-webkit-transition: -webkit-transform 0.75s ease-out 0.5s, opacity 0.75s linear 0.5s;
	transition: transform 0.75s ease-out 0.5s, opacity 0.75s linear 0.5s;
}
html.js .sectionContent > .figure.left img {
	-webkit-transform: translateX(-30px);
	transform: translateX(-30px);
	opacity: 0;
}
html.js .sectionContent > .figure.left.on img {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}
html.js .sectionContent > .figure.right img {
	-webkit-transform: translateX(30px);
	transform: translateX(30px);
	opacity: 0;
}
html.js .sectionContent > .figure.right.on img {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	opacity: 1;
}
.sectionContent > .figure figcaption {
	font-size: 14px;
	padding: 12px 12px 14px 12px;
	font-style: italic;
	text-align: left;
}
.sectionContent > .figure figcaption span {
	display: block;
	max-width: 768px;
	margin: 0 auto 0 auto;
}
.sectionContent > form input {
	display: block;
	font-size: 1em;
	font-family: inherit;
	color: #000000;
	border: 2px solid #808080;
	background: #ffffff;
	-webkit-appearance: none;
	appearance: none;
	padding: 0.5em;
	width: 100%;
	max-width: 480px;
	margin: 0.5em 0 0.5em 0;
}
.sectionContent > form button {
	display: block;
	font-size: 1em;
	font-family: inherit;
	font-weight: bold;
	color: #ffffff;
	border: 2px solid #808080;
	background: #808080;
	-webkit-appearance: none;
	appearance: none;
	padding: 0.5em;
	width: 200px;
	margin: 0.5em 0 0.5em 0;
	cursor: pointer;
}
.sectionContent > p.sectionContentMeta {
	clear: both;
	overflow: hidden;
	margin-top: 2.5em;
	margin-bottom: 0;
	padding-right: 180px;
	line-height: 1.2;
}
.sectionContent > p.sectionContentMeta:first-child {
	margin-top: 0;
}
.sectionContent > p.sectionContentMeta span {
	font-style: italic;
	margin-right: 5px;
	display: inline-block;
	vertical-align: top;
}
.sectionContent > p.sectionContentSocial {
	margin-bottom: 0;
	height: 0;
	text-align: right;
}
.sectionContent > p.sectionContentMeta:first-child + p.sectionContentSocial {
	margin-bottom: 1em;
}
.sectionContent > p.sectionContentSocial iframe {
	display: inline-block;
	vertical-align: top;
	margin-top: -25px;
}
.sectionContent > p.sectionContentSocial iframe:first-child {
	margin-right: 5px;
}
.sectionContent > p.sectionContentMeta.sectionContentMetaSponsored span {
	display: block;
}
.sectionContent > p.sectionContentMeta.sectionContentMetaSponsored + p.sectionContentSocial iframe {
	margin-top: -30px;
}
@media (max-width: 830px) {
	.sectionContent > p, .sectionContent > h2, .sectionContent > .figure figcaption, .sectionContent > form, .sectionContent > table caption {
		max-width: 100%;
		padding-left: 4%;
		padding-right: 4%;
	}
	.sectionContent > ul, .sectionContent > ol, .sectionContent > blockquote p {
		max-width: 100%;
		padding: 0 10% 0 10%;
	}
	.sectionContent > .figure.left figure, .sectionContent > .figure.right figure {
		max-width: 50%;
	}
}
@media (max-width: 640px) {
	.sectionContent {
		font-size: 10vw;
	}
	.sectionContent > p, .sectionContent > ul, .sectionContent > ol, .sectionContent > form {
		font-size: 3.6vw;
	}
	.sectionContent > table {
		font-size: 3vw;
	}
	.sectionContent > blockquote p {
		font-size: 5.4vw;
	}
	.sectionContent > blockquote.twitter-tweet p {
		font-size: 15px;
	}
	.sectionContent > .figure figcaption, .sectionContent > table caption {
		font-size: 11px;
		padding-top: 10px;
		padding-bottom: 12px;
	}
	.sectionContent > p.sectionContentMeta span {
		display: block;
	}
	.sectionContent > p.sectionContentSocial iframe {
		margin-top: -8vw;
	}
}


/* articles list */
.sectionList {
	min-height: 50vh;
	overflow: hidden;
}
.sectionList ul {
	margin: 10px auto 10px auto;
	list-style: none;
	padding-left: 4%;
	padding-right: 4%;
	max-width: 768px;
}
.sectionList li {
	width: 100%;
	float: left;
	padding: 5px 0 5px 0;
}
.sectionList a {
	display: block;
	position: relative;
	overflow: hidden;
	background: #ffffff;
	text-decoration: none;
	line-height: 1.2;
	font-size: 15px;
	outline: 1px solid rgba(140, 140, 140, 0.33);
}
.sectionList[data-scheme="dark"] a {
	background: #000000;
}
.sectionList li.best a:before {
	content: '';
	position: absolute;
	right: 5px;
	bottom: 7px;
	width: 25px;
	height: 28px;
	background: url('../img/best.svg') no-repeat;
	background-size: 100% 100%;
}
.sectionList li.new a:before {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 36px;
	height: 36px;
	background: url('../img/new.svg') no-repeat;
	background-size: 100% 100%;
}
.sectionList li.sponsored a:before {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	width: 60px;
	height: 14px;
	background: url('../img/sponsored.svg') no-repeat;
	background-size: 100% 100%;
}
.sectionList img {
	width: 136px;
	height: 100px;
	float: left;
}
.sectionList strong {
	position: absolute;
	left: 148px;
	top: 9px;
	right: 6px;
	font-weight: bold;
	letter-spacing: -0.03em;
}
.sectionList span {
	position: absolute;
	left: 148px;
	bottom: 8px;
	right: 6px;
	font-style: italic;
	white-space: nowrap;
	word-wrap: normal;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sectionList li.new span, .sectionList li.best span {
	right: 32px;
}
.sectionList li.sponsored span {
	right: 62px;
}
@media (max-width: 400px) {
	.sectionList a {
		font-size: 14px;
	}
}
@media (max-width: 370px) {
	.sectionList a {
		font-size: 12px;
	}
}
@media (min-width: 660px) {
	.sectionList li {
		width: 49.99%;
		padding-right: 5px;
	}
	.sectionList li:nth-child(2n) {
		padding-right: 0;
		padding-left: 5px;
	}
	.sectionList a {
		font-size: 12px;
	}
}
@media (min-width: 800px) {
	.sectionList li {
		width: 49.99%;
		padding-right: 5px;
	}
	.sectionList li:nth-child(2n) {
		padding-right: 0;
		padding-left: 5px;
	}
	.sectionList ul {
		padding-left: 0;
		padding-right: 0;
		max-width: 768px;
	}
	.sectionList a {
		font-size: 15px;
	}
}


/* scheme */
*[data-scheme="light"] {
	background-color: #f4f4f4;
	color: #181818;
}
.sectionContent[data-scheme="light"] > ul, .sectionContent[data-scheme="light"] > ol, .sectionContent[data-scheme="light"] > .figure figcaption, .sectionContent[data-scheme="light"] > table caption {
	color: #505050;
}
*[data-scheme="dark"] {
	background-color: #181818;
	color: #f4f4f4;
}
.sectionContent[data-scheme="dark"] > ul, .sectionContent[data-scheme="dark"] > ol, .sectionContent[data-scheme="dark"] > .figure figcaption, .sectionContent[data-scheme="dark"] > table caption {
	color: #d0d0d0;
}
.sectionContent[data-scheme="light"] > .figure figure, .sectionContent[data-scheme="light"] > blockquote, .sectionContent[data-scheme="light"] > table caption {
	background: #ffffff;
}
.sectionContent[data-scheme="dark"] > .figure figure, .sectionContent[data-scheme="dark"] > blockquote, .sectionContent[data-scheme="dark"] > table caption {
	background: #000000;
}
/* improve contrast */
*[data-contrast="yes"]::before {
	content: '';
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background: rgba(32, 32, 32, 0.4);
}
*[data-contrast="yes"][data-scheme="light"]::before {
	background: rgba(240, 240, 240, 0.4);
}
/* colours */
main[data-highlight-color="red"] .headerPost span[data-highlight="yes"], main[data-highlight-color="red"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="red"] .sectionContent a, main[data-highlight-color="red"] .sectionContent > ul li::before, main[data-highlight-color="red"] .sectionContent > ol li::before, main[data-highlight-color="red"] .sectionContent > blockquote {
	color: #ff4040;
}
main[data-highlight-color="green"] .headerPost span[data-highlight="yes"], main[data-highlight-color="green"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="green"] .sectionContent a, main[data-highlight-color="green"] .sectionContent > ul li::before, main[data-highlight-color="green"] .sectionContent > ol li::before, main[data-highlight-color="green"] .sectionContent > blockquote {
	color: #60a060;
}
main[data-highlight-color="blue"] .headerPost span[data-highlight="yes"], main[data-highlight-color="blue"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="blue"] .sectionContent a, main[data-highlight-color="blue"] .sectionContent > ul li::before, main[data-highlight-color="blue"] .sectionContent > ol li::before, main[data-highlight-color="blue"] .sectionContent > blockquote {
	color: #4090b0;
}
main[data-highlight-color="orange"] .headerPost span[data-highlight="yes"], main[data-highlight-color="orange"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="orange"] .sectionContent a, main[data-highlight-color="orange"] .sectionContent > ul li::before, main[data-highlight-color="orange"] .sectionContent > ol li::before, main[data-highlight-color="orange"] .sectionContent > blockquote {
	color: #e09050;
}
main[data-highlight-color="teal"] .headerPost span[data-highlight="yes"], main[data-highlight-color="teal"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="teal"] .sectionContent a, main[data-highlight-color="teal"] .sectionContent > ul li::before, main[data-highlight-color="teal"] .sectionContent > ol li::before, main[data-highlight-color="teal"] .sectionContent > blockquote {
	color: #40a0a0;
}
main[data-highlight-color="purple"] .headerPost span[data-highlight="yes"], main[data-highlight-color="purple"] .sectionContent[data-highlight="yes"] > h2, main[data-highlight-color="purple"] .sectionContent a, main[data-highlight-color="purple"] .sectionContent > ul li::before, main[data-highlight-color="purple"] .sectionContent > ol li::before, main[data-highlight-color="purple"] .sectionContent > blockquote {
	color: #9070c0;
}
/* fonts */
span[data-font="light"], .sectionContent[data-font="light"] > h2 {
	font-weight: normal;
	font-family: 'NexaLightEmbedded', sans-serif;
}
span[data-font="bold"], .sectionContent[data-font="bold"] > h2 {
	font-weight: normal;
	font-family: 'NexaBoldEmbedded', sans-serif;
}
span[data-font="black"], .sectionContent[data-font="black"] > h2 {
	font-weight: normal;
	font-family: 'NexaBlackEmbedded', sans-serif;
}
span[data-font="script"], .sectionContent[data-font="script"] > h2 {
	font-weight: normal;
	font-family: 'NexaScriptEmbedded', sans-serif;
}
span[data-font="script"] + span {
	margin-top: -0.15em;
}
/* caps */
span[data-caps="yes"], .sectionContent[data-caps="yes"] > h2 {
	text-transform: uppercase;
}
span:not([data-caps="yes"]):not([data-font="script"]) + span[data-caps="yes"] {
	margin-top: 1.75vw;
}
@media (max-width: 479px) {
	span:not([data-caps="yes"]):not([data-font="script"]) + span[data-caps="yes"] {
		margin-top: 2.25vw;
	}
}
/* horizontal alignment */
.headerPost[data-horizontal="left"], .sectionContent[data-horizontal="left"] > h2 {
	text-align: left;
}
.headerPost[data-horizontal="left"] > div {
	left: 4%;
	right: 0;
}
.headerPost[data-horizontal="left"] p {
	width: 50%;
}
.headerPost[data-horizontal="center"], .sectionContent[data-horizontal="center"] > h2 {
	text-align: center;
}
.headerPost[data-horizontal="center"] > div {
	left: 2%;
	right: 2%;
}
.headerPost[data-horizontal="center"] p {
	width: 67%;
	margin-left: auto;
	margin-right: auto;
}
.headerPost[data-horizontal="right"], .sectionContent[data-horizontal="right"] > h2 {
	text-align: right;
}
.headerPost[data-horizontal="right"] > div {
	left: 0;
	right: 4%;
}
.headerPost[data-horizontal="right"] p {
	width: 50%;
	margin-right: 0;
	margin-left: auto;
}
/* size */
span[data-size="small"], .sectionContent[data-size="small"] > h2 {
	font-size: 0.4em;
}
span[data-size="medium"], .sectionContent[data-size="medium"] > h2 {
	font-size: 0.67em;
}
span[data-size="large"], .sectionContent[data-size="large"] > h2 {
	font-size: 1em;
}
span[data-size="xlarge"], .sectionContent[data-size="xlarge"] > h2 {
	font-size: 1.5em;
}
/* tracking */
span[data-tracking="tight"], .sectionContent[data-tracking="tight"] > h2 {
	letter-spacing: -0.075em;
}
span[data-tracking="loose"], .sectionContent[data-tracking="loose"] > h2 {
	letter-spacing: 0.075em;
}
span[data-tracking="xloose"], .sectionContent[data-tracking="xloose"] > h2 {
	letter-spacing: 0.225em;
}
/* vertical alignment */
.headerPost[data-vertical="bottom"] > div, .headerPost[data-vertical="split"] > div {
	bottom: 0.3em;
}
.headerPost[data-vertical="top"] > div, .headerPost[data-vertical="split"] > div {
	top: 0.9em;
}
.headerPost[data-vertical="top"][data-horizontal="center"] > div, .headerPost[data-vertical="split"][data-horizontal="center"] > div {
	top: 0.7em;
}
.headerPost[data-vertical="split"] p {
	position: absolute;
	bottom: 0;
}
.headerPost[data-vertical="split"][data-horizontal="right"] p {
	right: 0;
}
.headerPost[data-vertical="split"][data-horizontal="center"] p {
	left: 16.5%;
}
@media (max-aspect-ratio: 1/1) {
	.headerPost[data-vertical="top"] > div, .headerPost[data-vertical="split"] > div, .headerPost[data-vertical="top"][data-horizontal="center"] > div, .headerPost[data-vertical="split"][data-horizontal="center"] > div {
		top: 1.5em;
	}
}


/* navigation */
nav {
	font-size: 10vw;
}
nav h2 {
	position: fixed;
	font-size: 1em;
	top: 0;
	left: 3.8%;
	margin: 0 0 0 -1.5vh;
}
nav h2 a {
	font-size: 1em;
	display: block;
	padding: 1.5vh;
}
nav h2 a span {
	display: block;
	width: 2.32em;
	height: 0.28em;
	color: rgba(0, 0, 0, 0);
	background: url('../img/logo-small-light.svg') left top no-repeat;
	background-size: auto 100%;
	overflow: hidden;
}
nav[data-scheme="dark"] h2 a span {
	background-image: url('../img/logo-small-dark.svg');
}
nav div {
	z-index: 3;
	position: fixed;
	font-size: 1em;
	top: 0;
	left: 3.8%;
	margin: 0 0 0 -1.5vh;
	padding: 1.5vh;
	line-height: 0.28em;
}
nav div iframe {
	vertical-align: top;
}
nav p {
	z-index: 3;
	position: fixed;
	font-size: 1em;
	top: 0;
	right: 4%;
	margin: 0 -1.5vh 0 0;
}
nav p label {
	display: block;
	padding: 1.5vh;
	cursor: pointer;
	-webkit-filter: drop-shadow(1px 1px 0 rgba(244, 244, 244, 0.5));
	filter: drop-shadow(1px 1px 0 rgba(244, 244, 244, 0.5));
}
nav[data-scheme="dark"] p label {
	-webkit-filter: drop-shadow(1px 1px 0 rgba(24, 24, 24, 0.5));
	filter: drop-shadow(1px 1px 0 rgba(24, 24, 24, 0.5));
}
nav p label > span {
	display: block;
	position: relative;
	width: 0.26em;
	height: 0.26em;
	overflow: hidden;
	color: rgba(0, 0, 0, 0);
}
nav p label > span > span {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 20%;
	background: #181818;
	-webkit-transition: -webkit-transform 0.3s, top 0.5s;
	transition: transform 0.3s, top 0.5s;
}
nav[data-scheme="dark"] p label > span > span {
	background: #f4f4f4;
}
nav p label > span > span:nth-child(2) {
	top: 40%;
}
nav p label > span > span:nth-child(3) {
	top: 80%;
}
nav input#navToggle:checked + ul + p label > span > span {
	box-shadow: none;
}
nav input#navToggle:checked + ul + p label > span > span:nth-child(1) {
	top: 40%;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
nav input#navToggle:checked + ul + p label > span > span:nth-child(2) {
	-webkit-transform: scaleX(0.05);
	transform: scaleX(0.05);
}
nav input#navToggle:checked + ul + p label > span > span:nth-child(3) {
	top: 40%;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}
nav input#navToggle {
	display: none;
}
nav ul {
	z-index: 2;
	position: fixed;
	top: 0;
	right: -230px;
	width: 220px;
	height: 100vh;
	background: #f4f4f4;
	color: #181818;
	border-left: 2px solid rgba(128, 128, 128, 0.5);
	font-size: 16px;
	list-style: none;
	padding: 5vh 0 0 0;
	-webkit-transition: right 0.5s;
	transition: right 0.5s;
}
nav[data-scheme="dark"] ul {
	background: #181818;
	color: #f4f4f4;
}
nav ul li:first-child {
	padding-top: 20px;
}
nav ul a {
	text-decoration: none;
	display: block;
	padding: 10px 0 10px 20px;
	font-weight: bold;
	text-transform: uppercase;
}
nav ul a:hover {
	background: #ffffff;
}
nav[data-scheme="dark"] ul a:hover {
	background: #000000;
}
nav input#navToggle:checked + ul {
	right: 0;
}
@media (max-width: 540px) {
	nav {
		font-size: 18vw;
	}
}
@media (min-width: 1200px) {
	nav {
		font-size: 120px;
	}
}
@media (max-height: 370px) {
	nav ul a {
		padding-top: 5px;
		padding-bottom: 5px;
	}
}


/* footer */
body > footer ul {
	padding: 30px 10px 26px 10px;
	font-size: 15px;
	color: #808080;
	text-align: center;
}
body > footer li {
	display: inline-block;
	margin: 0 6px 0 6px;
	white-space: nowrap;
}
body > footer li:first-child a {
	text-decoration: none;
}


/* kaching */
html[data-type="_kaching"] .sectionContent {
	pointer-events: none;
	background: none;
	padding-top: 20px;
}
.kaching {
	pointer-events: auto;
	position: relative;
	line-height: 1.6;
	border-top: 1px dashed #808080;
	border-bottom: 1px dashed #808080;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}
.sectionContent .kaching {
	margin: 7vmin 0 7vmin 0;
}
.kaching a {
	color: inherit !important;
}
.kaching > h2 {
	position: relative;
	z-index: 1;
	padding: 8px 5px 0 5px;
	text-align: center;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 4px;
	line-height: 1.1;
}
.kaching > div {
	position: relative;
	z-index: 1;
	max-width: 768px;
	margin: 0 auto 0 auto;
	overflow: hidden;
	padding: 32px 0 18px 0;
	padding: 6vmin 0 4vmin 0;
}
.kaching > div > *:first-child {
	margin-top: 0;
}
.kaching p, .kaching > div h2, .kaching ul, .kaching ol {
	font-size: 19px;
	margin: 0 0 1em 0;
}
.kaching ul, .kaching ol {
	margin-left: 1.5em;
}
.kaching > div h2 {
	font-weight: bold;
	text-transform: uppercase;
}
.kaching > div h2 a {
	display: inline-block;
	text-decoration: none;
	padding: 7px 14px 7px 14px;
	border: 2px solid currentColor;
	margin: 0 0 4px 0;
	vertical-align: top;
}
.kaching strong {
	font-weight: bold;
	font-style: normal;
}
.kaching em {
	font-weight: normal;
	font-style: italic;
}
.kaching .figure {
	margin: 0.5em auto 0.5em auto;
	clear: both;
}
.kaching .figure + .figure {
	margin-top: -0.5em;
}
.kaching .figure.center {
	width: 50%;
}
.kaching .figure.left, .kaching .figure.right {
	margin: 0 auto 0 auto;
}
.kaching .figure.left figure {
	max-width: 45%;
	float: left;
	margin: 0.1em 0.25em 0.25em 0;
}
.kaching .figure.right figure {
	max-width: 45%;
	float: right;
	margin: 0.1em 0 0.25em 0.2em;
}
.kaching .figure img {
	display: block;
	width: 100%;
	height: auto;
}
.kaching[data-horizontal="center"] form p {
	width: 100%;
}
.kaching input {
	appearance: none;
	-webkit-appearance: none;
	font-size: 1em;
	font-family: inherit;
	padding: 8px 0 8px 7px;
	background: #ffffff;
	color: #000000;
	border: 2px solid #808080;
	margin: 0 0 4px 0;
	width: 16em;
	vertical-align: top;
}
.kaching input[type="submit"] {
	padding: 8px 16px 8px 16px;
	text-transform: uppercase;
	font-weight: bold;
	cursor: pointer;
	background: transparent;
	color: inherit;
	width: auto;
	border: 2px solid currentColor;
}
.kaching[data-horizontal="center"] p, .kaching[data-horizontal="center"] > div h2 {
	text-align: center;
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}
.kaching[data-horizontal="center"] ul, .kaching[data-horizontal="center"] ol {
	max-width: 600px;
	margin-left: auto;
	margin-right: auto;
}
@media (max-width: 830px) {
	.kaching > div {
		max-width: 92%;
	}
}
@media (max-width: 640px) {
	.kaching p, .kaching > div h2, .kaching ul, .kaching ol {
		font-size: 3.6vw;
	}
	.kaching > h2 {
		font-size: 9px;
		letter-spacing: 3px;
		padding: 6px 5px 4px 5px;
	}
}
html.js .kaching[data-horizontal="left"] > div {
	-webkit-transform: translateX(200%);
	transform: translateX(200%);
}
html.js .kaching[data-horizontal="left"][data-view="1"] > div {
	-webkit-transform: translateX(0);
	transform: translateX(0);
	-webkit-transition: -webkit-transform 0.5s ease-out 0.5s;
	transition: transform 0.5s ease-out 0.5s;
}
html.js .kaching[data-horizontal="center"] > div {
	-webkit-transform: scaleY(0.01);
	transform: scaleY(0.01);
	-webkit-transform-origin: 0% 100%;
	transform-origin: 0% 100%;
}
html.js .kaching[data-horizontal="center"][data-view="1"] > div {
	-webkit-transform: scaleY(1);
	transform: scaleY(1);
	-webkit-transition:  -webkit-transform 0.5s ease-out 0.5s;
	transition: transform 0.5s ease-out 0.5s;
}


/* contribly */
.sectionContent > .contribly-contribute {
	display: block;
	max-width: 798px;
	margin: 24px auto 0 auto;
}
.sectionContent > .contribly-contribute * {
	font-family: 'OpenSansEmbedded', 'Avenir Next', 'Avenir', 'Segoe UI', 'Lucida Grande', 'Lucida Sans Unicode', sans-serif !important;
	line-height: 1.6 !important;
	font-size: 19px !important;
}