/* ArtPlate 3 Article UI */
.artplate--article .content-wrapper {
	padding: 1.25rem 1.25rem 6rem 1.25rem;
}

.artplate--article h2, .artplate--article h3, .artplate--article h4, .artplate--article h5, .artplate--article h6, .artplate--article p {margin:0;padding:1.3rem 1.6rem;}
.artplate--article ul, .artplate--article ol, .artplate--article table {margin:0;padding:0;border:0;}

.artplate--article h2 { font-weight: 400; }
.artplate--article h2::after {
	content: "";
	display: block;
	height: 0.125rem;
	width: 16rem;
	background: var(--color-primary-100);
	margin: 0.75rem 0 1.5rem 0;
}

.artplate--article .content { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; }
.artplate--article .content > * { margin: 0 auto; }
@media all and (min-width:1080px) {
	.artplate--article .content { flex-direction: row-reverse; }
	.artplate--article .content figure { min-width: 320px; max-width: 320px; }
	.artplate--article .content section { max-width: 768px; }
}

.artplate--article h1 {font-size:1.4rem;padding:1.6rem;text-align:center;margin:1.6rem 0 0 0;}
.artplate--article h2 {font-size:1.2rem;}
.artplate--article h3 {font-size:1.05rem;}
.artplate--article h4 {font-size:0.9rem;}
.artplate--article h5 {font-size:0.8rem;}
.artplate--article h6 {font-size:0.7rem;}
.artplate--article p {
	font-size:1rem;
	font-weight:200;
	line-height:1.5rem;
}
.artplate--article time {display:block;margin:0 0 2.4rem 0;padding:1.2rem 2.4rem;font-weight:300;font-size:0.9rem;color:#555555;}
.artplate--article figure {position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;margin:1.6rem 0;}
.artplate--article figure svg {width:100%;height:100%;opacity:0;position:relative;z-index:-1;}
.artplate--article figure noscript {width:100%;height:100%;position:absolute;}
.artplate--article figure img {width:100%;height:100%;position:absolute;-webkit-transition:transform 0.5s;-moz-transition:transform 0.5s;-ms-transition:transform 0.5s;-o-transition:transform 0.5s;transition:transform 0.5s;}
.artplate--article blockquote {margin:1.2rem 1.6rem 1.6rem 1.6rem;border-top:2px solid var(--color-accent-100);border-bottom:2px solid var(--color-accent-100);}
.artplate--article ul {padding:0 1.3rem 0 2.8rem;}
.artplate--article ul ul {padding:0 0 0 1.3rem;}
.artplate--article ol {padding:0 1.3rem 0 2.9rem;}
.artplate--article ol ol {padding:0 0 0 1.3rem;}
.artplate--article ul li, .artplate--article ol li {padding:0.5rem 0 0.5rem 1.3rem;}
.artplate--article ul li p, .artplate--article ol li p {padding:0.5rem 0;}
.artplate--article code {background:#E5E5E5;padding:4px 10px;border-radius:4px;}
.artplate--article pre {margin:1.0rem 0 3.2rem 0;white-space:pre-wrap;max-height:400px;overflow:hidden;overflow-y:auto;padding:1.3rem 1.4rem;background:#E5E5E5;}
.artplate--article pre code {display:block;}
.artplate--article table {margin:2.0rem auto;font-size:0.8rem;table-layout:fixed;border-collapse:collapse;border:1px solid var(--color-primary-100);}
.artplate--article table th, .artplate--article table td {padding:10px 16px;border:1px solid var(--color-primary-100);}
.artplate--article table th {background:#E5E5E5;}
.artplate--article table td {background:var(--color-background-100);}
.artplate--article blockquote, .artplate--article blockquote p, .artplate--article code {font-size:0.9rem;}

@media only screen and (min-width:600px) {
	.artplate--article h1 {font-size:1.7rem;}
	.artplate--article h2 {font-size:1.4rem;}
	.artplate--article h3 {font-size:1.2rem;}
	.artplate--article h4 {font-size:1rem;}
	.artplate--article h5 {font-size:0.9rem;}
	.artplate--article h6 {font-size:0.75rem;}
	.artplate--article h2, .artplate--article h3, .artplate--article h4, .artplate--article h5, .artplate--article h6, .artplate--article p {margin:0;padding:1.3rem 3.2rem;}
	.artplate--article p {
		font-size:1.1rem;
		text-indent:3rem;
		line-height:1.6rem;
	}
	.artplate--article blockquote {margin:2.4rem 3.2rem 3.2rem 3.2rem;}
	.artplate--article ul {padding:0 2.0rem 0 4.4rem;}
	.artplate--article ul ul {padding:0 0 0 2.0rem;}
	.artplate--article ol {padding:0 2.0rem 0 4.6rem;}
	.artplate--article ol ol {padding:0 0 0 2.0rem;}
	.artplate--article pre {margin:1.6rem 3.2rem 3.2rem 3.2rem;}
}

@media only screen and (min-width:900px) {
	.artplate--article h1 {font-size:2rem;}
	.artplate--article h2 {font-size:1.55rem;}
	.artplate--article h3 {font-size:1.3rem;}
	.artplate--article h4 {font-size:1.1rem;}
	.artplate--article h5 {font-size:0.95rem;}
	.artplate--article h6 {font-size:0.8rem;}
	.artplate--article h2, .artplate--article h3, .artplate--article h4, .artplate--article h5, .artplate--article h6, .artplate--article p {margin:0;padding:1.3rem 4.8rem;}
	.artplate--article p {
		font-size:1.2rem;
		text-indent:3.5rem;
		line-height:1.7rem;
	}
	.artplate--article blockquote {margin:3.2rem 4.8rem 4.8rem 4.8rem;}
	.artplate--article ul {padding:0 2.8rem 0 5.9rem;}
	.artplate--article ul ul {padding:0 0 0 2.8rem;}
	.artplate--article ol {padding:0 2.8rem 0 6.0rem;}
	.artplate--article ol ol {padding:0 0 0 2.8rem;}
	.artplate--article pre {margin:1.6rem 4.8rem 3.2rem 4.8rem;border-radius:4px;}
	.artplate--article figure {border-radius:6px;}
}

