/***********************************************
************************************************

CORE STYLES

************************************************
***********************************************/

div.fluid-width-video-wrapper { margin: 0 auto; }

body.custom article div.section { padding: 4em 1em; }
body.custom article div.section.white { background-color: #fff; }
body.custom article div.section.black { background-color: #333; color: #f5f5f5; }
body.custom article div.section.realblack { background-color: #000; color: #f5f5f5;}
body.custom article div.section.video { background-color: #000; color: #fff; text-align: center; }
body.custom article div.section.video iframe { display: block; margin: 0 auto; }
body.custom article iframe, body.custom article embed, body.custom article object { max-width: 100%; }

body.custom article div.section.video a { color: #fff; border-bottom: 1px solid #555; }

body.custom article footer {
	margin-bottom: 0;
	padding-top: 1em;
}

body.custom article div.footer {
	background-color: #222;
	padding: 2em;
	text-align: center;
}

body.custom article div.footer p, body.custom article div.footer p a {
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #ccc;
	font-size: 14px;
	margin-top: 0;
	line-height: 1.6;
}

body.custom article div.black p a, body.custom article div.realblack p a { color: #fff; }

body.custom article h1 {
	font-weight: normal;
	line-height: 1.1;
	font-size: 2.5em;
	text-align: center;
}

body.custom article h1.small { font-size: 1.75em; }

body.custom article h2 {
	font-weight: normal;
}

body.custom article h1.emph { max-width: 15em; margin-left: auto; margin-right: auto; color: rgb(185, 154, 84); line-height: 1; font-weight: 300; letter-spacing: 1px; line-height: 1.1;}
body.custom article h1.emph.black { color: #555; }
body.custom article h1.emph.black span { color: rgba(0,0,0,0.2); }

body.custom article h1.emph:before {
	content: '';
	display: block;
	margin: 0 auto 1em auto; 
	width: 3em;
	border-top: 2px solid rgba(0,0,0,0.1);
}

body.custom article h1.emph:after{
	content: '';
	display: block;
	margin: 1em auto 0 auto; 
	width: 3em;
	border-top: 2px solid rgba(0,0,0,0.1);
}

body.custom article div.section.black h1.emph:before, body.custom article div.section.realblack h1.emph:before { border-top: 2px solid rgba(255,255,255,0.2); }
body.custom article div.section.black h1.emph:after, body.custom article div.section.realblack h1.emph:after { border-top: 2px solid rgba(255,255,255,0.2); }

body.custom article img.fullimg {
	display: block;
	width: 100%;
	margin: 1em auto;
	max-width: 46rem;
}

body.custom article img.fullimg.real { max-width: none; }

body.custom article figcaption, body.custom article cite { font-style: normal; display: block; max-width: 38rem; margin: 1em auto; }
body.custom article .black figcaption, body.custom article .black cite,
body.custom article .realblack figcaption, body.custom article .realblack cite { color: gray;}


body.custom article hr {
	width: 33%;
	max-width: 15em;
	border: none;
	border-top: 2px solid rgba(0,0,0,0.1);
	margin: 4em auto;
}

body.custom article .realblack hr, body.custom article .black hr {
	border-top-color: rgba(255,255,255,0.25);
}

body.custom article div.clear { clear: both; }

body.custom article div.section.rainbowbreak { background: url(vertgrad.jpg); }

body.custom article div.section.rainbowbreak h1 {
	color: #fff;
	text-shadow: 1px 1px 5px rgba(0,0,0,0.1);
	font-size: 6em;
	letter-spacing: 5px;
	line-height: 3;
	text-align: center;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: 100;
	text-transform: uppercase;
}

body.custom article div.section.title {
	background-color: #222;
	padding-top: 0.5em;
	padding-bottom: 2em;
}

body.custom article div.section.title h1 {
	text-align: left;
	max-width: 38rem;
	margin: 0.5em auto 0.5em auto;
	color: #fff;
	font-size: 3.5em;
	line-height: 1;
	font-weight: 200;
	letter-spacing: 1px;
}

body.custom article div.section.title p, body.custom article div.section.title p a {
	color: #777;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body.custom article div.section.title p a {
	border-bottom: 1px solid rgba(255,255,255,0.1);
}

body.custom article div.section.foreword  {
	background-color: #efefef;
	padding: 2em;
}

body.custom article div.section.foreword p {
	text-align: center;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 0.9em;
}

body.custom article div.section.panel1 h1 {
	max-width: 10em;
	margin: 1em auto;
}

body.custom article figure img { width: 100%; }
body.custom article figure { max-width: 48rem; margin-left: auto; margin-right: auto; }

body.custom article div.vidframe {
	background-color: rgba(255,255,255,0.1);
	padding: 1em;
	max-width: 40em;
	margin: 3em auto;
}

body.custom article a.noborder { border: none; }

body.custom article div.section.wood {
	background: url('woodgrain.jpg') top center;
	background-size: cover;
	color: #fff;
}

body.custom article h2 { text-align: center; font-weight: 600; }

body.custom article blockquote {
	margin: 2em auto;
	font-size: 1.2em;
	max-width: 35em;
	color: rgb(185, 154, 84);
	line-height: 1.5;
}

body.custom article blockquote.centered { text-align: center; }

body.custom article span.fin:after {
	content: ' ◆';
	color: rgba(0,0,0,0.2);
	position: relative;
	top: -0.1em;
}

body.custom article div.black span.fin:after { color: rgba(255,255,255,0.33); }

@media only screen and (max-width: 45em) {
	body.custom article div.section { padding-top: 2em; padding-bottom: 2em; }
	body.custom article h1.emph { font-size: 1.8em;}
	body.custom article div.section.title h1 { font-size: 3.5em; }
	body.custom article div.section.rainbowbreak h1 { font-weight: 200; font-size: 2em; }
}

/***********************************************
************************************************

FOR WHAT SCREENS WANT

************************************************
***********************************************/

body.custom article img.tinycentered {
	display: block;
	margin: 1em auto;
	width: 80%;
	max-width: 15em;
}

body.custom article img.circleborder {
	border-radius: 70em;
	padding: 1em;
	border: 1em solid rgba(0,0,0,0.05);
	margin-bottom: 3em;
}

body.custom article div.section.black img.circleborder {
	border: 1em solid rgba(255,255,255,0.05);
}

body.custom article div.section.white>div.burkestep:first-child:before {
	content: '\201c';
	font-family: 'Times New Roman', Georgia, serif;
	font-size: 7em;
	color: rgba(0,0,0,0.1);
	display: block;
	line-height: 0.75;
	margin-bottom: -0.25em;
	font-style: normal;
}

body.custom article div.burkestep {
	max-width: 27em;
	margin: 0 auto;
	text-align: center;
	margin-bottom: 4em;
}

body.custom article div.burkestep:after {
	content: '';
	display: block;
	width: 10em;
	margin: 4em auto;
	border-bottom: 2px solid rgba(0,0,0,0.1);
}


body.custom article div.section.white>div.burkestep:last-child:after {
	content: '\201d';
	font-family: 'Times New Roman', Georgia, serif;
	font-size: 7em;
	width: auto;
	margin: 0;
	color: rgba(0,0,0,0.1);
	display: block;
	line-height: 2;
	margin-bottom: -1em;
	font-style: normal;
	border: none;
}

body.custom article div.burkestep div img {
	width: 100%;
	margin-bottom: 1.25em;
}

body.custom article div.horseex {
	font-style: italic;
	text-align: center;
}

body.custom article div.horseex img {
	display: block;
	width: 100%;
	max-width: 17em;
	margin: 8em auto 0 auto;
}

body.custom article img.horsesolo {
	width: 100%;
	display: block;
	margin: 2em auto;
	max-width: 300px;
}

body.custom article div.section.strip { overflow-x: hidden; }

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(360deg);
  }
}

body.custom article img.zoopraximg {
	-webkit-animation-name: rotate;
    -webkit-animation-duration: 2.5s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
}

body.custom article div.zooprax p {
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body.custom article div.rainbowbreak.somanyhorses {
	background: url('horseani.gif') center center;
}

body.custom article div.section.rainbowbreak.last {
	min-height: 120em;
}

@media only screen and (max-width: 45em) {
	body.custom article div.section.somanyhorses { background: url(horseani.gif); }
}


/***********************************************
************************************************

FOR THE WEB’S GRAIN

************************************************
***********************************************/

body.custom article div.sm2-360ui {
	display: block;
	margin: 25vh auto 0;
	float: none;
}

body.custom article img.speaker {
	display: block;
	margin: 1em auto 25vh;
	opacity: 0.2;
}

body.custom article div.section.sea {
	padding: 0;
	background-color: #fff;
	height: 100vh;
}

body.custom article div.section.sea img {
	display: block;
	width: 100%;
	margin: 0;
	object-fit: cover;
	height: 100vh;
}

body.custom article div.section.sea figcaption {
	margin-bottom: 0;
}

body.custom article blockquote.koan p {
	font-size: 1.75rem;
	line-height: 1.2;
	text-align: left;
	padding: 0;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (max-width: 850px) {
	body.custom article div.section.sea.last { display: none; }
}


/***********************************************
************************************************

FOR DESIGNING IN THE BORDERLANDS

************************************************
***********************************************/

body.borderlands article { background-color: #f5f5f5; }

body.custom.borderlands article div.section.foreword { background-color: #333; color: #777; }
body.custom.borderlands article div.section.foreword a { border-bottom-color: rgba(255,255,255,0.25); }

body.custom article div.section.parttitle {
	color: #fff;
	text-align: center;
	padding: 2em 0 4em;
	font-size: 2em;
	-webkit-font-smoothing: antialiased;
	background: url('f5-tornedge.png') bottom repeat-x #ad9077;
}

body.custom article div.section.parttitle span {
	color: rgba(0,0,0,0.4);
	display: inline-block;
	padding: 0.25em 0.75em;
	margin-bottom: 0.5em;
	text-transform: uppercase;
	font-size: 66%;
	border-bottom: 1px solid rgba(0,0,0,0.25);
}

body.custom article img.fullimg.limit { max-width: 15em; margin-top: 3em; margin-bottom: 3em; }

body.custom article ul.memos {
	list-style: none;
	margin: 3em auto; padding: 0;
	font-size: 110% !important;
	text-align: center;
}

body.custom article ul.memos strike { color: #aaa; }

body.custom article ul.divlist {
	list-style: none;
	padding: 0;
	text-align: center;
	font-size: 1.75em !important;
	color: #777;
	line-height: 1.2;
}

body.custom article span.line {
	font-size: 2em;
	position: relative;
	top: 0.2em;
	color: #ad9077;
	text-align: center;
}

body.borderlands ul, body.borderlands ol { max-width: 40rem; margin-left: auto; margin-right: auto; }
body.borderlands h2 { margin-top: 4em; }

body.custom article p.idiottitle {
	margin: 0 auto 2em;
	font-style: italic;
	font-size: 1.25em;
	margin-top: -1em;
	color: #777;
	text-align: center;
}

body.custom article div.section.worksamples p {
	text-align: center;
	margin-bottom: 5em;
}

body.custom article div.section.worksamples p:last-child {
	text-align: left;
	font-family: 'Times New Roman', Times, serif;
}

body.custom article p.bigquestion {
	text-align: center;
	font-size: 1.6em;
	margin: 3em auto;
	color: #ad9077;
	-webkit-font-smoothing: antialiased;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

body.borderlands article div.headphones {
	padding: 2em 1em;
	background: #000;
	text-align: center;
	color: #fff;
	font-size: 80%;
	font-family: -apple-system, BlinkMacSystemFont, "Roboto", "Droid Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}