/*! HTML5 Boilerplate v7.2.0 | MIT License | https://html5boilerplate.com/ */
/* main.css 2.0.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/*.use-this-to-test {
	color: #595959;
}*/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
	line-height: 1.15;
	  /* 1 */
	-webkit-text-size-adjust: 100%;
	  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers.
 */

body {
	margin: 0;
}

/**
 * Render the `main` element consistently in IE.
 */

main {
	display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
	box-sizing: content-box;
	  /* 1 */
	height: 0;
	  /* 1 */
	overflow: visible;
	  /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
	font-family: monospace, monospace;
	  /* 1 */
	font-size: 1em;
	  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */

a {
	background-color: transparent;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
	border-bottom: none;
	  /* 1 */
	text-decoration: underline;
	  /* 2 */
	text-decoration: underline dotted;
	  /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b, strong {
	font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code, kbd, samp {
	font-family: monospace, monospace;
	  /* 1 */
	font-size: 1em;
	  /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub, sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */

img {
	border-style: none;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button, input, optgroup, select, textarea {
	font-family: inherit;
	  /* 1 */
	font-size: 100%;
	  /* 1 */
	line-height: 1.15;
	  /* 1 */
	margin: 0;
	  /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button, input {
	/* 1 */
	overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button, select {
	/* 1 */
	text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button, [type="button"], [type="reset"], [type="submit"] {
	-webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

/**
 * Correct the padding in Firefox.
 */

fieldset {
	padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
	box-sizing: border-box;
	  /* 1 */
	color: inherit;
	  /* 2 */
	display: table;
	  /* 1 */
	max-width: 100%;
	  /* 1 */
	padding: 0;
	  /* 3 */
	white-space: normal;
	  /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
	vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
	overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"], [type="radio"] {
	box-sizing: border-box;
	  /* 1 */
	padding: 0;
	  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
	-webkit-appearance: textfield;
	  /* 1 */
	outline-offset: -2px;
	  /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
	-webkit-appearance: button;
	  /* 1 */
	font: inherit;
	  /* 2 */
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
	display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
	display: list-item;
}

/* Misc
   ========================================================================== */
/**
 * Add the correct display in IE 10+.
 */

template {
	display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
	display: none;
}

/* @group Media Queries */



/* @end */

html {
	color: #424242;
	background: #e6e6e6;
	line-height: 1.6;
	font-family: "EB Garamond", Cambria, Times New Roman, Times, serif;
	font-size: 100%;
	-webkit-font-smoothing: antialiased;
}

/* ## Box Sizing
--------------------------------------------- */

html, input[type="search"] {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

*, *::before, *::after {
	box-sizing: inherit;
}

/* @group Resets & Defaults */

/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * Vendor-prefixed and regular ::selection selectors cannot be combined:
 * https://stackoverflow.com/a/16982510/7133471
 *
 * Customize the background color to match your design.
 */

::-moz-selection {
	background: #b3d4fc;
	text-shadow: none;
}

::selection {
	background: #b3d4fc;
	text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #ccc;
	margin: 1em 0;
	padding: 0;
}

/* ## Objects
--------------------------------------------- */
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

/*audio,*/ canvas, iframe, img, svg, video {
	vertical-align: middle;
}

embed, iframe, img, object, video, .wp-caption {
	max-width: 100%;
}

img {
	height: auto;
}

figure {
	margin: 0;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
	resize: vertical;
}

/* @end */

/* @group Forms and Buttons */

a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .button {
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

form {
	margin: 1rem 0 2rem 0;
}

input, select, textarea {
	background-color: #fff;
	border: 1px solid #b1b1b1;
	color: #424242;
	font-weight: 400;
	padding: .75em;
}

input:focus, textarea:focus {
	border: 1px solid #999;
	outline: none;
}

input[type="checkbox"], input[type="image"], input[type="radio"] {
	width: auto;
}

::-moz-placeholder {
	color: #333;
	opacity: 1;
}

::-webkit-input-placeholder {
	color: #333;
}

button, input[type="button"], input[type="reset"], input[type="submit"], .button {
	background-color: #b87c2d;
	border: 1px solid #b87c2d;
	color: #e9e9e9;
	cursor: pointer;
	font-weight: 700;
	padding: .825em 1.25em;
	text-decoration: none;
	white-space: normal;
	width: auto;
	text-transform: uppercase;
}

button:focus, button:hover, input[type="button"]:focus, input[type="button"]:hover, input[type="reset"]:focus, input[type="reset"]:hover, input[type="submit"]:focus, input[type="submit"]:hover, .button:focus, .button:hover {
	background-color: #2a547f;
	border: 1px solid #2a547f;
	color: #e9e9e9;
}

.button {
	display: inline-block;
}

/* @end */

/* @group Browser Upgrade */

.browserupgrade {
	margin: 0.2em 0;
	background: #ccc;
	color: #000;
	padding: 0.2em 0;
}

/* @end */

/* @group Type */

p, h1, h2, h3, h4, h5, h6, ol, ul, span, em {
	overflow-wrap: break-word;
	word-wrap: break-word;
	-ms-word-break: break-all;
	  /* This is the dangerous one in WebKit, as it breaks things wherever */
	word-break: break-all;
	  /* Instead use this non-standard one: */
	word-break: break-word;
	  /* Adds a hyphen where the word breaks, if supported (No Blink) */
	-ms-hyphens: auto;
	-moz-hyphens: auto;
	-webkit-hyphens: auto;
	hyphens: auto;
}

a {
	color: #b87c2d;
	text-decoration: none;
	transition: all .2s ease-in-out 0s;
}

a:hover {
	color: #2a547f;
}

/* Copy & Lists */

p {
	line-height: 1.6rem;
	margin-top: 0;
	margin-bottom: 1em;
	font-size: 1.25rem;
}

.main ul, .main ol {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
	font-size: 1.25rem;
}

.main ul li, .main ol li {
	margin: .25rem 0;
}

ul li, ol li {
	line-height: 1.5rem;
}

ul ul, ol ul, ul ol, ol ol {
	margin-top: 0;
	margin-bottom: 0;
}

blockquote {
	line-height: 1.5rem;
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}

/* Headings */

h1, h2, h3, h4, h5, h6 {
	font-family: "Libre Baskerville", serif;
	margin: 0;
}

h1, h2, h3 {
	color: #2a547f;
	line-height: 1.4rem;
}

h2, h3, h4 {
	margin-bottom: .8em;
}

h1 {
	font-size: 3rem;
	line-height: 3.5rem;
}

h2 {
	font-size: 1.8rem;
	line-height: 2rem;
}

h3 {
	font-size: 1.6rem;
}

h4 {
	font-size: 1.25rem;
}

h5 {
	font-size: 1rem;
	margin-bottom: .75em;
}

h6 {
	font-size: .75rem;
}

/* Tables */

table {
	margin-top: 1.5rem;
	border-spacing: 0px;
	border-collapse: collapse;
}

table td, table th {
	padding: 0;
	line-height: 33px;
}

.script {
	font-family: "Dancing Script", cursive;
}

.gold {
	color: #8c8433;
}

.center {
	text-align: center;
}

.lead {
	font-size: 1.5rem;
}

.small {
	font-size: 1.125rem;
}

@media all and (min-width: 600px) {
	h2 {
		font-size: 2.2rem;
		line-height: 2.8rem;
	}
	
	.lead {
		font-size: 1.75rem;
		line-height: 1.2;
	}
}

/* @end Type */

/* @group Header */

header {
	background-color: #2a547f;
}

header h1 {
	font-size: 1.25rem;
	text-align: center;
	margin: 0;
	line-height: 1.2;
	color: #e9e9e9;
}

header h1 a {
	display: block;
	color: #e9e9e9;
	padding: .5rem;
}

header h1 a:hover {
	color: #e9e9e9;
	background: #b87c2d;
}

@media all and (min-width: 860px) {
	header {
		display: flex;
		justify-content: center;
		flex-flow: row wrap;
		background-color: #2a547f;
		align-items: stretch;
	}
	
	header h1 a {
		padding: .5rem 1rem;
	}
}

@media all and (min-width: 1040px) {
	header {
		justify-content: space-between;
	}
	
	h1 a {
		height: 64px;
	}
}

/* @end */

/* @group Nav */

a#toggle-menu {
	color: #e9e9e9;
	display: block;
	text-align: center;
	padding: .75rem 0;
	text-transform: uppercase;
}

a#toggle-menu:hover {
	background: #b87c2d;
	color: #e9e9e9;
}

nav ul {
	list-style: none;
	display: none;
	margin: 0;
	padding: 0;
}

nav ul.open {
	display: flex;
	flex-flow: row wrap;
}

nav ul li {
	flex: 1 1 100%;
	border-top: 1px solid #526d89;
}

nav ul li a {
	display: block;
	padding: .5rem .75rem;
	text-transform: uppercase;
	text-align: center;
	color: #e9e9e9;
	font-size: .9rem;
	font-family: "Libre Baskerville", serif;
}

nav ul li a:hover {
	background: #b87c2d;
	color: #e9e9e9;
}

@media all and (min-width: 860px) {
	a#toggle-menu {
		display: none;
	}
	
	nav ul {
		display: flex;
		flex-flow: row nowrap;
	}
	
	nav ul li {
		flex: 1 1 auto;
		border-top: none;
	}
	
	nav ul li a {
		padding: .75rem .75rem;
	}
}

@media all and (min-width: 1040px) {
	nav ul li a {
		padding: 1.25rem .75rem;
		height: 64px;
	}
}

@media all and (min-width: 1180px) {
	nav ul li a {
		padding: 1.25rem 1.25rem;
	}
}

/* @end */

/* @group Banner */

#banner {
	background: url("../img/banner-bg-900.jpg") no-repeat center center;
	background-size: cover;
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	justify-content: center;
	box-shadow: inset 0px 0px 45px #444;
}

#banner .cover {
	flex: 0 1 200px;
}

#banner .title {
	flex: 0 1 300px;
	display: block;
	padding: 1rem 0;
	text-align: center;
	background: rgba(255, 255, 255, 0.6);
}

#banner .title h1 {
	font-size: 2rem;
	line-height: 1.2;
}

#banner .title h2 {
	font-size: 1.125rem;
	color: #424242;
	margin: 0;
	line-height: 1.4;
}

body.front #banner .title h1 {
	display: none;
}

@media all and (min-width: 480px) {
	#banner.internal {
		height: 280px;
	}
	
	#banner .title {
		flex: 1 1 300px;
		padding: .75rem 2.5rem;
	}
	
	#banner .title h1 {
		display: block;
		font-size: 2rem;
		line-height: 2.5rem;
	}
	
	#banner .title h2 {
		font-size: 1.125rem;
	}
	
	body.front #banner .title h1 {
		display: block;
	}
}

@media all and (min-width: 768px) {
	#banner {
		background: url("../img/banner-bg-1280.jpg") no-repeat center center;
		background-size: cover;
		height: 480px;
		flex-flow: row nowrap;
	}
	
	#banner.internal {
		height: 280px;
	}
	
	#banner .cover {
		flex: 0 1 200px;
	}
	
	#banner .title h1 {
		font-size: calc(3vw + 1.5rem);
		line-height: calc(3vw + 2rem);
	}
	
	#banner .title h2 {
		font-size: 1.25rem;
	}
}

@media all and (min-width: 1024px) {
	#banner.internal {
		height: 280px;
	}
	
	#banner .title {
		flex: 0 0 auto;
	}
	
	#banner .title h1 {
		font-size: 4.25rem;
		line-height: 4.5rem;
	}
	
	#banner .title h2 {
		font-size: 1.25rem;
	}
}

@media all and (min-width: 1280px) {
	#banner {
		background: url("../img/banner-bg-1960.jpg") no-repeat center center;
		background-size: cover;
	}
}

@media all and (min-width: 1960px) {
	#banner {
		background: url("../img/banner-bg-2400.jpg") no-repeat center center;
		background-size: cover;
	}
}

@media all and (min-width: 2401px) {
	#banner {
		background: url("../img/banner-bg-4000.jpg") no-repeat center center;
		background-size: cover;
	}
}

/* @end */

/* @group Structure */

section {
	padding: 2rem 0.5rem;
}

.wrap {
	width: 100%;
}

.flex {
	display: flex;
	flex-flow: row wrap;
}

@media all and (min-width: 768px) {
	section {
		padding: 3rem 1rem;
	}
}

@media all and (min-width: 1280px) {
	section {
		padding: 4rem 0;
	}
	
	section#content {
		padding: 0 0 4rem 0;
	}
	
	.wrap {
		width: 1280px;
		padding: 0;
		margin: 0 auto;
	}
	
	.wrap.tight {
		width: 1080px;
	}
}

/* @end */

/* @group General Styles */

.dark {
	background-color: #242424;
	color: #e9e9e9;
}

.dark p, .dark h2, .dark h3, .dark h4, .dark h5, .dark h6 {
	color: #e9e9e9;
}

.dark a {
	color: #e6c498;
}

.dark a:hover {
	color: #72a0d0;
}

.superimpose {
	position: absolute;
	z-index: 1000;
	width: 100%;
	padding: .5rem;
}

.cover {
	box-shadow: 0 0 20px rgba(29, 29, 29, 0.5);
	transform: rotate(-1.5deg);
	margin-right: -.25rem;
	display: inline-block;
}

footer {
	padding: 1rem 0;
	border-top: 1px solid #595959;
}

footer p {
	margin: 0;
	font-size: 1rem;
}

.popup-container {
	display: flex;
	flex-flow: row nowrap;
}

.popup-container div:first-child {
	flex: 0 0 38%;
	margin-right: 10%;
}

.popup-container div:last-child {
	flex: 0 0 52%;
}

/* @end */

/* @group Interior Pages */

section#content {
	padding: 0;
}

section#content .main {
	padding: 2rem 0.5rem;
}

#book {
	display: none;
}

@media all and (min-width: 480px) {
	section#content .main {
		padding: 2rem 1rem;
	}
}

@media all and (min-width: 768px) {
	#book {
		display: block;
		padding: 4rem 2rem;
		border-right: 1px solid rgba(71, 68, 65, 0.3);
		text-align: center;
	}
	
	#book .cover {
		margin-bottom: 2rem;
	}
	
	section#content {
		padding: 0;
		display: flex;
		flex-flow: row nowrap;
	}
	
	section#content .sidebar {
		flex: 0 0 300px;
	}
	
	section#content .main {
		flex: 0 1 1180px;
		padding: 1rem 2rem 4rem 2rem;
	}
}

/* @end */

/* @group Search Menu */

#menu {
	list-style: none;
	padding: 0;
	margin: 0;
}

#menu a {
	text-transform: uppercase;
}

#menu.front {
	display: flex;
	align-items: stretch;
	flex-flow: row wrap;
}

#menu.front li {
	padding: 0;
	position: relative;
	margin-bottom: 1rem;
	flex: 1 1 100%;
}

#menu.front li i {
	font-size: 1.5rem;
	line-height: .8;
}

#menu.side {
	list-style: none;
	padding: 0;
	margin: 0;
}

#menu.side a {
	display: block;
	padding: .5rem .75rem;
	font-size: 1.125rem;
	line-height: 1.25;
}

#menu.side a i {
	position: relative;
	margin-right: .25em;
	font-size: 1rem;
}

#menu.side li {
	background: rgba(107, 102, 98, 0.15);
	border-bottom: 1px solid rgba(71, 68, 65, 0.3);
	transition: all .3s ease .125s;
	padding: 0;
}

#menu.side .active {
	border-right-color: transparent;
	background: none;
}

@media all and (min-width: 600px) {
	#menu.front li {
		flex: 1 1 50%;
	}
	
	#menu.side a {
		text-align: center;
	}
}

@media all and (min-width: 768px) {
	#menu.front {
		margin-top: 3rem;
	}
	
	#menu.front li {
		flex: 0 0 47%;
		margin-right: 3%;
		margin-left: 3%;
		padding: 0 0 0 4.5rem;
	}
	
	#menu.front li:nth-of-type(2n+1) {
		margin-left: 0;
	}
	
	#menu.front li:nth-of-type(2n) {
		margin-right: 0;
	}
	
	#menu.front li i {
		position: absolute;
		left: 0;
		top: 0;
		font-size: calc(3vw + 1rem);
	}
	
	#menu.side li {
		border-right: 1px solid rgba(71, 68, 65, 0.3);
		background: rgba(107, 102, 98, 0.15);
		border-bottom: 1px solid rgba(71, 68, 65, 0.3);
		transition: all .3s ease .125s;
		padding: 0;
	}
	
	#menu.side a {
		padding: 1rem 1rem;
		font-size: 1.25rem;
		text-align: left;
	}
	
	#menu.side a i {
		font-size: 1em;
		margin-top: .125em;
	}
}

@media all and (min-width: 1024px) {
	#menu.front li i {
		font-size: 3.25rem;
	}
}

/* @end Menu */

/* @group Samples */

#samples {
	position: relative;
	padding-left: 0;
	padding-right: 0;
}

#slider {
	position: relative;
	padding: 2rem 0 3rem 0;
}

.tns-controls {
	position: absolute;
	bottom: 25px;
	width: 100%;
}

.tns-nav {
	text-align: center;
	padding: 0;
	position: absolute;
	width: 100%;
	bottom: 0;
}

.tns-nav > [aria-controls] {
	width: 12px;
	height: 12px;
	padding: 0;
	margin: 0 5px;
	border-radius: 50%;
	background: #999;
	border: 0;
}

.tns-nav > [aria-controls]:hover {
	background: #e9e9e9;
}

.tns-nav > .tns-nav-active {
	background: #e9e9e9;
}

.tns-controls [aria-controls] {
	background: none;
	border: 0;
	color: #999;
	font-size: 1.5rem;
	position: absolute;
}

.tns-controls [aria-controls]:hover {
	color: #e9e9e9;
}

.tns-controls button:first-of-type {
	left: 30%;
	padding: 0;
}

.tns-controls button:last-of-type {
	right: 30%;
	padding: 0;
}

.tns-lazy-img {
	opacity: 1 !important;
}

ul.samples-slider {
	padding: 0 40px;
	margin: 0;
	list-style: none;
}

ul.samples-slider li {
	position: relative;
}

ul.samples-slider a {
	display: block;
	height: 100%;
	width: 100%;
	color: #bfbfbf;
	transition: color .2s ease-in-out 0s;
}

ul.samples-slider a:hover {
	color: #e9e9e9;
}

ul.samples-slider i {
	position: absolute;
	bottom: 4%;
	font-size: 2rem;
	opacity: .6;
	transition: opacity .2s ease-in-out 0s;
	cursor: pointer;
}

ul.samples-slider i.fa-play-circle {
	left: 5%;
}

ul.samples-slider i.fa-info-circle {
	right: 5%;
}

ul.samples-slider i:hover {
	opacity: 1;
}

ul.samples-slider span {
	position: absolute;
	display: block;
	width: 96%;
	margin: 0 2%;
	top: 5%;
	font-size: 1rem;
	text-align: center;
	font-family: "Libre Baskerville", serif;
	background: rgba(0, 0, 0, 0.5);
}

@media all and (min-width: 600px) {
	ul.samples-slider span {
		font-size: 1.25rem;
	}
}

/* @end */

/* @group Buy */

ul.buy-links {
	list-style: none;
	padding: 0;
}

ul.buy-links li {
	margin-bottom: .5rem;
}

ul.buy-links a {
	font-size: 1.5rem;
}

/* @end */

/* @group Show / Hide content */

.switch ul, .switch ol {
	list-style-position: inside;
	padding-left: 0;
	margin: 0;
}

.collapser {
	list-style: none;
}

.collapser i {
	font-size: 1rem;
}

/*hidden content*/

.switch, .collapser .show-hide {
	opacity: 0;
	overflow: hidden;
	height: 0;
	transition: all .3s ease-in-out .125s;
}

/*show with jQuery*/

.switch.visible, .collapser .show-hide.visible {
	opacity: 1;
	overflow: visible;
	height: auto;
}

.show-hide.visible {
	margin: .5rem 0 .5rem .5rem;
}

.show-hide.visible li {
	margin: .25rem 0;
}

.show-hide.visible li ul, .show-hide.visible li ol {
	margin-left: .5rem;
}

@media all and (min-width: 768px) {
	.show-hide.visible {
		margin: .75rem 0 .75rem 1.5rem;
	}
	
	.show-hide.visible li {
		margin: .25rem 0;
	}
	
	.show-hide.visible li ul, .show-hide.visible li ol {
		margin-left: 1rem;
	}
}

/* @end show/hide */

/* @group Species Page */

.species-gallery {
	margin: 2rem 0;
}

.species-gallery .caption {
	font-size: 1rem;
	font-style: italic;
	margin: .25em 0 .5em 0;
	text-align: center;
}

/*
.species-name span {
	display: block;
}
.meta {
}*/
/* Next/Prev species page */

.page-nav {
	list-style: none;
	padding: 0;
	font-size: 1.25rem;
	margin: 3rem 0;
}

.page-nav li {
	background: #d7d7d7;
}

.page-nav li a {
	padding: 1rem;
	display: block;
	color: #242424;
	text-align: center;
}

.page-nav li a:hover {
	background: #b87c2d;
	color: #e9e9e9;
}

@media all and (min-width: 480px) {
	.species-gallery {
		display: flex;
	}
	
	.species-gallery img {
		max-height: 440px;
		padding: .5rem;
		border: 1px solid #b1b1b1;
	}
	
	.species-gallery div {
		margin-right: 2%;
	}
	
	.species-gallery div:last-of-type {
		margin-right: 0;
	}
	
	.species-gallery .caption {
		margin: .5em;
	}
}

@media all and (min-width: 600px) {
	/*.species-name span {
		display: inline-block;
	}*/
	
	.page-nav {
		display: flex;
		justify-content: space-between;
		font-size: 1.5rem;
	}
	
	.page-nav li a {
		padding: 1rem 1.25rem;
	}
}

@media all and (min-width: 1024px) {
	/*.species-name {
	display: flex;
	justify-content: space-between;
}*/
}

/* @end */
/* ==========================================================================
   Print styles.
   Inlined to avoid the additional HTTP request:
   https://www.phpied.com/delay-loading-your-print-css/
   ========================================================================== */

@media print {
	*, *:before, *:after {
		background: transparent !important;
		color: #000 !important;
	    /* Black prints faster */
		-webkit-box-shadow: none !important;
		box-shadow: none !important;
		text-shadow: none !important;
	}
	
	a, a:visited {
		text-decoration: underline;
	}
	
	a[href]:after {
		content: " (" attr(href) ")";
	}
	
	abbr[title]:after {
		content: " (" attr(title) ")";
	}
	  /*
	     * Don't show links that are fragment identifiers,
	     * or use the `javascript:` pseudo protocol
	     */
	
	a[href^="#"]:after, a[href^="javascript:"]:after {
		content: "";
	}
	
	pre {
		white-space: pre-wrap !important;
	}
	
	pre, blockquote {
		/*border: 1px solid #999;*/
		page-break-inside: avoid;
	}
	  /*
	     * Printing Tables:
	     * https://web.archive.org/web/20180815150934/http://css-discuss.incutio.com/wiki/Printing_Tables
	     */
	
	thead {
		display: table-header-group;
	}
	
	tr, img {
		page-break-inside: avoid;
	}
	
	p, h2, h3 {
		orphans: 3;
		widows: 3;
	}
	
	h2, h3 {
		page-break-after: avoid;
	}
}

/* Eathan's updated table css */

table {
	margin: 1.5rem 0;
	width: 100%;
	max-width: 100%;
	border-top:#ccc 1px solid;
	border-bottom:#ccc 1px solid;
	font-size: 1.125rem;
	border-collapse: collapse;
}
table td,
table th {
  line-height: 1.75rem;
  padding: .5rem;
}
table th {
	border-bottom: 1px solid #a7a7a7;
	border-right: 1px solid #e0e0e0;
	text-align: left;
	background: #ededed;
}
table th:first-child {
	text-align: left;
	padding-left:1rem;
	border-left:#ccc 1px solid;
}
table th:last-child, table td:last-child {
	border-right:#ccc 1px solid;
}
table td:first-child {
	text-align: left;
	padding-left:1rem;
	border-left:#ccc 1px solid;
}
table td {
	border-bottom:1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	background: #fafafa;
}
table tr:nth-child(2n) td {
	background: #f6f6f6;
}
table tr:last-child td {
	border-bottom:0;
}
table tr:hover td {
	background: #f2f2f2;
}


/* Audio controls */

/*audio,*/
canvas,
progress,
video {
  display: inline-block; /* 1 */
  vertical-align: baseline; /* 2 */
}

/*
audio:not([controls]) {
  display: none;
  height: 0;
}

#audio {
	margin-bottom: 2em;
}
*/