/*! X-rayHTML - v2.0.0 - 2015-09-15
* https://github.com/filamentgroup/x-rayhtml
* Copyright (c) 2015 ; Licensed MIT */

/*! X-rayHTML - v1.0.3 - 2015-09-08
* https://github.com/filamentgroup/x-rayhtml
* Copyright (c) 2015 ; Licensed MIT */

.xrayhtml {
	border: 1px solid rgba(0,0,0,.1);
	border-radius: .3em;
	margin: 1.5em 0 2.5em 0;
	padding: 2em 1em;
	position: relative;
}
.xrayhtml:before {
	content: "Example";
	text-transform: uppercase;
	letter-spacing: 1px;
	font: .75em sans-serif;
	color: rgba(0,0,0,.5);
	background-color: #fff;
	position: absolute;
	top: -.5em;
	padding-left: .5em;
	padding-right: .5em;
	left: 1.333333333em; /* 16px */
	z-index: 3;
}
.xrayhtml[data-title]:before {
	content: "Example: " attr(data-title);
}
.xrayhtml.method-flip:before {
	background-color: rgba(255,255,255,.6);
}
.xrayhtml .source-panel {
	background: #f7f7f7;
	margin-top: 2em;
	tab-size: 2;
}
.xrayhtml .source-panel pre {
	margin: 0;
}
.xrayhtml .source-panel code {
	white-space: pre-wrap;
}
.xrayhtml.method-flip .source-panel {
	margin-top: 0;
	border-radius: 0.3em;
}
.xrayhtml.method-inline .source-panel {
	//margin: 2em -1em -2em -1em !important; /* Prism style override. */
	border-top: 1px solid rgba(0,0,0,.1);
	border-radius: 0 0 .3em .3em;
}
.xrayhtml pre {
	padding: 16px;
	margin: 0 !important; /* Prism style override. */
	border-radius: 0 0 .3em .3em;
}
.xrayhtml code {
	white-space: pre-wrap !important; /* Prism style override. */
}

.xrayhtml.antipattern {
	border-color: #C9282D;
}
.xrayhtml.antipattern:before {
	color: #d75e72;
	font-weight: 700;
	content: "Do Not Use";
}
.xrayhtml.antipattern[data-title]:before {
	content: "Do Not Use: " attr(data-title);
}