html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}

*{
	-webkit-box-sizing:	border;
	-webkit-box-sizing:	border-box;
	-moz-box-sizing:	border;
	-moz-box-sizing:	border-box;
	box-sizing:			border-box;
}
	:focus{outline: none}
	:link, :visited{
		-webkit-transition:	color .25s linear, border .25s linear, background-color .25s linear;
		-moz-transition:	color .25s linear, border .25s linear, background-color .25s linear;
		-ms-transition:		color .25s linear, border .25s linear, background-color .25s linear;
		-o-transition:		color .25s linear, border .25s linear, background-color .25s linear;
		transition:			color .25s linear, border .25s linear, background-color .25s linear;
	}


/** Custom typefaces */
@font-face{
	font-family: "CKitchenIcons";
	src:url("fonts/CKitchenIcons.eot?-rvx2rl");
	src:url("fonts/CKitchenIcons.eot?#iefix-rvx2rl") format("embedded-opentype"),
		url("fonts/CKitchenIcons.woff?-rvx2rl") format("woff"),
		url("fonts/CKitchenIcons.ttf?-rvx2rl") format("truetype"),
		url("fonts/CKitchenIcons.svg?-rvx2rl#CKitchenIcons") format("svg");
	font-weight: normal;
	font-style: normal;
}

[class^="icon-"], [class*=" icon-"]{
	font-family: CKitchenIcons;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: geometricPrecision;
}

.icon-chef::before			{content:	"\e609";	}
.icon-clock::before			{content:	"\23f2";	}
.icon-down::before			{content:	"\2193";	}
.icon-heart::before			{content:	"\2764";	vertical-align: -.05em}
.icon-page::before			{content:	"\2399";	}
.icon-reorder::before		{content:	"\2630";	}
.icon-search::before		{content:	"\1f50e";	}
.icon-star::before			{content:	"\2606";	}
.icon-star-fill::before		{content:	"\2605";	}
.icon-triangle-down::before	{content:	"\25bc";	}
.icon-triangle-up::before	{content:	"\25b2";	}
.icon-up::before			{content:	"\2191";	}
.icon-squares::before		{content:	"\e600";	}
.icon-edit::before			{content:	"\e601";	}
.icon-profile::before		{content:	"\e602";	}
.icon-twitter::before		{content:	"\e603";	}
.icon-next-circled::before	{content:	"\29c1";	}
.icon-export::before		{content:	"\2386";	}



/*=============================================================================*
	1. ELEMENTS
===============================================================================*/

a:link,
a:visited{
	color: inherit;
	text-decoration: none;
}
	a:hover{
		text-decoration: underline;
	}

label{
	cursor: pointer;
}

abbr[title]{
	border: none;
}

section{
	margin: 1em 0;
}

figure{
	margin: 0;
}
	figure > img{
		max-width: 100%;
	}

	figure.x2 > img{
		max-width: 50%;
		width: auto;
	}

/** Tables */
table{
	margin: 1em 0;
}
	caption{
		font: bold 1.5em "futura-pt", sans-serif;
		text-align: left;
		margin: 0 0 1em;
	}

	th, td{
		border: 1px solid #897ebc;
		border-width: 0 0 1px;
		background-color: #f3f2f8;
		font-weight: normal;
		vertical-align: middle;
		text-align: left;
		padding: .25em .5em;
	}

	tr:nth-child(2n+1) > td{
		background-color: #dbd8eb;
	}



/** Headings */
h1,	.h1,
h2,	.h2{
	font: 1.45em/1.1em "futura-pt", sans-serif;
	margin: 0 0 .25em;
}

h3, .h3{
	font: bold 1.3em/1.1em "futura-pt", "Helvetica Neue", Helvetica, sans-serif;
	margin: .25em 0;
}


/** Thick, chunky headings - used in legal documents as well as showcase/product lists */
h4,	.h4{
	font: bold 1.125em/1em "futura-pt", "Helvetica Neue", Helvetica, sans-serif;
	text-transform: uppercase;
	margin: 0;
}


/** Bold, uppercased headings: typically nested deeply inside lengthy documents. */
h5,	.h5{
	font: bold 1em Helvetica, Arial, sans-serif;
	text-transform: uppercase;
	margin: 0;
}
	h5 + p{
		margin-top: .5em;
	}


/** Discrete headings formatted as bold, inline text: used in lengthy documents where formatting and document outline aren't necessarily consistant. */
h6,	.h6{
	font: bold 1em Helvetica, Arial, sans-serif;
}
	h6, h6 + p	{display:	inline	}
	h6::after	{content:	"."		}
	h6 + p::after{
		content: "";
		display: block;
		clear: both;
		line-height: 0;
		margin-bottom: 1em;
		height: 0;
	}

	h5 + h6::before{
		content: "";
		display: block;
		margin-top: .75em;
		clear: both;
	}



p:last-child{
	margin-bottom: 0;
	padding-bottom: 1em;
}
	p.h2:last-child{
		padding-bottom: .25em;
	}



/** Lists */
ul, ol{
	margin: 0 1em 1em;
	padding: 0;
}
	li{
		padding: 0;
		margin: .5em 0 0 .5em;
	}
		li > p{
			margin-top: .25em;
		}

dl{
	margin: 0 0 1em;
}
	dt{
		text-transform: uppercase;
		font-weight: bold;
	}

	dd{
		margin: 0 2em .5em;
	}


/** Form elements */
button, .btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
	padding: .75em 1em;
	font: bold .75em sans-serif;
	text-transform: uppercase;
	display: inline-block;
	text-align: center;
	border: 0;

	-webkit-border-radius:	.5em;
	-moz-border-radius:		.5em;
	border-radius:			.5em;
}
	.btn.big{
		font-size: 1.1em;
		margin-bottom: .5em;
		padding: .75em 1.5em;
		display: inline-block;
	}

	input.emboss,
	button.emboss,
	.btn.emboss{
		border: 1px solid #433280;
		-webkit-border-radius:	.35em;
		-moz-border-radius:		.35em;
		border-radius:			.35em;

		-webkit-box-shadow:	inset 1px -1px 0 #877bb5, inset -1px -1px 0 #877bb5;
		-moz-box-shadow:	inset 1px -1px 0 #877bb5, inset -1px -1px 0 #877bb5;
		box-shadow:			inset 1px -1px 0 #877bb5, inset -1px -1px 0 #877bb5;
	}

select{
	border-width: 1px;
	border-style: solid;
	background-color: #fff;
}

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




/** Purple gradient common to buttons and navigation elements */
.shaded-links a,
.shaded, button, .btn,
input[type="submit"],
input[type="reset"],
input[type="button"]{
	color: #fff !important;
	background: #462a82 url("../img/common/bg_menu.png") repeat-x;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #877bba), color-stop(50%, #67549e), color-stop(100%, #462a82));
	background: -webkit-linear-gradient(top,	#877bba 0%, #67549e 50%, #462a82 100%);
	background: -moz-linear-gradient(top,		#877bba 0%, #67549e 50%, #462a82 100%);
	background: -ms-linear-gradient(top,		#877bba 0%, #67549e 50%, #462a82 100%);
	background: -o-linear-gradient(top,			#877bba 0%, #67549e 50%, #462a82 100%);
	background: linear-gradient(to bottom,		#877bba 0%, #67549e 50%, #462a82 100%);
}
	.shaded-links a:hover,
	button:hover, .btn:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover,
	.shaded-links a.selected, a.btn.selected{
		text-decoration: none;
		background: #281161 url("../img/common/bg_menu_sel.png") repeat-x;
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #867ab9), color-stop(51%, #56458e), color-stop(100%, #281161));
		background: -webkit-linear-gradient(top,	#867ab9 0%, #56458e 51%, #281161 100%);
		background: -moz-linear-gradient(top,		#867ab9 0%, #56458e 51%, #281161 100%);
		background: -ms-linear-gradient(top,		#867ab9 0%, #56458e 51%, #281161 100%);
		background: -o-linear-gradient(top,			#867ab9 0%, #56458e 51%, #281161 100%);
		background: linear-gradient(to bottom,		#867ab9 0%, #56458e 51%, #281161 100%);
	}

	.shaded.sideways{
		background: #7f76b8 url("../img/grad/shaded-sideways.png") repeat-y 100% 0;
		background: -webkit-gradient(linear, left top, right top, color-stop(0%, #8078b7), color-stop(47%, #62569d), color-stop(73%, #54458f), color-stop(100%, #463480));
		background: -webkit-linear-gradient(left,	#8078b7 0%, #62569d 47%, #54458f 73%, #463480 100%);
		background: -moz-linear-gradient(left,		#8078b7 0%, #62569d 47%, #54458f 73%, #463480 100%);
		background: -ms-linear-gradient(left,		#8078b7 0%, #62569d 47%, #54458f 73%, #463480 100%);
		background: -o-linear-gradient(left,		#8078b7 0%, #62569d 47%, #54458f 73%, #463480 100%);
		background: linear-gradient(to right,		#8078b7 0%, #62569d 47%, #54458f 73%, #463480 100%);
	}



/*=============================================================================*
	2. PROJECT-SPECIFIC
===============================================================================*/

/** Content areas with white backgrounds */
.white{
	background-color: #fff;
	color: #332a86;
}

/** Calligraphic text that we can't embed with @font-face because of licensing restrictions. Ah well. */
.curly{
	text-indent: -9999px;
	text-align: left;
	background-repeat: no-repeat;
	background-position: 0 50%;
}
	.curly > img{
		max-width: 100%;
		display: block;
	}
	
	h2.curly > img{
		max-height: 1.8em
	}


/** Chamfered navy-blue boxes displayed in sidebars */
.bluebox{
	padding: .75em .5em .5em;
	background: #443180;
	color: #fff;
	-webkit-border-radius:	.6em;
	-moz-border-radius:		.6em;
	border-radius:			.6em;
}
	.bluebox > .h3,
	.bluebox > h3{
		text-align: center;
		font-weight: normal;
		font-size: 2em;
		line-height: 1em;
		margin-top: 0;
	}

	.bluebox > .white{
		padding: .35em .75em;
		-webkit-border-radius:	.6em;
		-moz-border-radius:		.6em;
		border-radius:			.6em;
	}

	.bluebox > .white ~ .white{
		margin-top: .5em;
	}


/** Window-fitting content row */
.fill,


/** List of products, categories, or items. */
.showcase{
	margin: 1em -1em;
}
	.showcase > *{
		border-color: #7067a0;
		border-style: solid;
		border-width: 1px 0 0;
		position: relative;
		padding: 1.25em;
	}
		.showcase > *::after{
			display: block;
			clear: both;
			content: "";
		}

		.showcase a,
		.showcase a:hover{
			text-decoration: none;
		}

		/** Image representing this entry */
		.showcase > * > img,
		.showcase > * > figure{
			max-width: 7em;
			float: right;
			margin: 0 0 2em 1em;
		}
			.showcase > * > figure img{
				width: 100%;
				display: block;
				height: auto;
			}

		/** Entry titles */
		.showcase > * > h3{
			font-weight: bold;
			font-size: 1.4em;
			text-transform: uppercase;
		}

		/** Short descriptions for each item */
		.showcase > * > p{
			margin: .75em 0;
		}

		.showcase .permalink{
			font: 1.2em "futura-pt", sans-serif;
			text-transform: lowercase;
		}

	/** Dividers */
	.showcase > hr{
		border: none;
		border-bottom: 1px solid #7067a0;
		clear: both;
		padding:	0 0 .5em;
		margin-bottom:  .5em;

		/** Hide dividers by default on mobile. */
		display: none;
	}


/** Showcase formatting, laid horizontally (generally suitable for footers) */
.showcase.columns{
	margin: 0
}
	.showcase.columns > *{
		border-top: none;
	}
		.showcase.columns > *::after{
			content: none;
		}

		.showcase.columns > * > img,
		.showcase.columns > * > figure{
			float: none;
			margin: 0 auto;
		}

/** "Showcases" displayed against white-coloured backgrounds use a different layout than usual. */
.white .showcase a:link,
.white .showcase a:visited{
	color: inherit;
}


/** Social icons */
.fb, .tw, .gp{
	display: inline-block;
	vertical-align: top;
	font-size: 26px;
	width:	1em;
	height:	1em;
	background: url("../img/social-icons.png");
	text-align: left;
	text-indent: -9999px;
}
	.tw	{background-position: 0 -200%}
	.gp	{background-position: 0 -400%}


/** Curved edges capping off regions with white backgrounds. */
.bowl{
	height: 0;
	width: 100%;
	padding-top: 5%;
	background-repeat: no-repeat;
	background-position: 50% 100%;
	position: relative;
	display: block;
	z-index: 150;
	clear: both;

	-webkit-box-sizing:	content;
	-webkit-box-sizing:	content-box;
	-moz-box-sizing:	content;
	-moz-box-sizing:	content-box;
	box-sizing:			content-box;

	-webkit-background-size:	cover;
	-khtml-background-size:		cover;
	-moz-background-size:		cover;
	-ms-background-size:		cover;
	-o-background-size:			cover;
	background-size:			cover;
}
	.bowl.convex	{background-image: url("../img/convex.png")}
	.bowl.concave	{background-image: url("../img/concave.png")}



/** Statistics box holding action links and specifications (e.g., recipe name, requirements, statistics and skill level) */
.statbox{
	color: #fff;
	padding: 1.25em;
	margin: 0 auto 1em;
	position: relative;

	-webkit-border-radius:	.5em;
	-moz-border-radius:		.5em;
	border-radius:			.5em;

	background: #8076b9 url("../img/grad/statbox.png") repeat-y top right;
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, #837cb9), color-stop(100%, #443182));
	background: -webkit-linear-gradient(left,	#837cb9 0%, #443182 100%);
	background: -moz-linear-gradient(left,		#837cb9 0%, #443182 100%);
	background: -ms-linear-gradient(left,		#837cb9 0%, #443182 100%);
	background: -o-linear-gradient(left,		#837cb9 0%, #443182 100%);
	background: linear-gradient(to right,		#837cb9 0%, #443182 100%);
}
	.page-tabs + .statbox{
		margin-top: 0 !important;
	}

	.statbox a:link,
	.statbox a:visited{
		color: inherit;
	}

	.statbox .h2,
	.statbox h2{
		border-bottom: 1px solid #7b72b2;
		font-size: 1.5em;
		font-weight: bold;
		padding-bottom: .25em;
		margin-bottom: .25em;
	}

	/** Recipe stats (cooking times, skill level, etc) */
	.stats > dl{
		margin: 0;
	}
		.stats > dl > dt{
			text-transform: none;
			display: inline-block;
			vertical-align: top;
			width: 30%;
		}

		.stats > dl > dd{
			display: inline;
			margin: 0;
		}
			.stats > dl > dd::after{
				content: "";
				display: block;
				clear: both;
			}

			.skill-meter{
				font-size: 1.4em;
			}
				.skill-meter::after{
					font-size: 1.3em;
					font-weight: normal;
					vertical-align: bottom;
				}
		
		.statbox .icon-clock{
			margin-right: .35em;
			font-size: 1.2em;
		}

	/** Action links */
	.page-actions{
		margin-top: 1em;
	}
		.page-actions > li{
			position: relative;
			margin-top: .5em;
		}
			.page-actions > li:first-child{
				margin-top: 0;
			}

			.page-actions > li > a{
				margin-left: -.5em;
			}
				.page-actions > li > a > i{
					display: inline-block;
					vertical-align: -.1em;
					text-align: center;
					font-size: 1.5em;
					width: 1.5em;
				}


	/** Page action tabs (e.g., "Save to My Kitchen") */
	.page-tabs{
		text-align: right;
		padding-right: 1em;
	}
		.page-tabs > a{
			background: #a29061;
			display: inline-block;
			vertical-align: bottom;
			padding: .35em 1em .15em;
			font-weight: bold;
			line-height: 1.75em;

			-webkit-border-radius:	.5em .5em 0 0;
			-moz-border-radius:		.5em .5em 0 0;
			border-radius:			.5em .5em 0 0;
		}
			.page-tabs > a:link,
			.page-tabs > a:visited,
			.page-tabs > a:hover{
				color: #fff;
				text-decoration: none;
				white-space: nowrap;
			}

			/** Loveheart */
			.page-tabs .icon-heart{
				padding-right: .5em;
				font-size: 1.4em;
			}
				.page-tabs .icon-heart::before{
					vertical-align: -.15em;
				}

				.page-tabs .red{
					color: #cc0d0d;
				}

	.statbox + h3{
		margin-top: 1em;
	}

	/** Statbox tweakpoints */
	@media screen and (min-width: 37.5em){
		.stats{
			margin-top: .8em;
			display: table;
			width: 100%;
		}
			.stats > *{
				display: table-cell;
				vertical-align: top;
			}
			.stats > dl{
				max-width: 50%;
			}
				.stats > dl > dt{
					width: 20%;
				}
			.stats > .page-actions{
				width: 32%;
			}
			.stats .icon-next-circled{
				font-size: 1.2em;
				margin-left: .2em;
			}
	}

	@media screen and (min-width: 64em){
		.statbox{
			margin: 1em -1.5em 0;
			padding: .25em 1.5em 1.35em;
		}
	}


/** Recipe skill meter */
.skill-meter{
	display: inline-block;
	font: 1.1em CKitchenIcons;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: geometricPrecision;
}
	.skill-meter.easy::after	{content: "\e609"}
	.skill-meter.medium::after	{content: "\e609\e609"}
	.skill-meter.hard::after	{content: "\e609\e609\e609"}

/** Rating stars */
.rating{
	display: inline-block;
	font: 1.1em CKitchenIcons;
	position: relative;
}
	.rating::after		{content: "☆☆☆☆☆";}
	.rating.x1::after	{content: "★☆☆☆☆";}
	.rating.x2::after	{content: "★★☆☆☆";}
	.rating.x3::after	{content: "★★★☆☆";}
	.rating.x4::after	{content: "★★★★☆";}
	.rating.x5::after	{content: "★★★★★";}


/** Pagination bars */
.pagination{
	text-align: center;
	padding: .5em 0;
}
	.pagination > strong,
	.pagination > a{
		display: inline-block;
		text-align: center;
		vertical-align: top;
		border: 1px solid transparent;
		padding: .25em .55em;

		font: bold 1.175em/1.5em sans-serif;
		height: 2em;

		-webkit-border-radius:	.25em;
		-moz-border-radius:		.25em;
		border-radius:			.25em;
	}
	.pagination > a{
		border-color: #ddd;
	}
		.pagination > a:hover{
			background-color: #f0f0f0;
			border-color: #ccc;
			text-decoration: none;
			color: #392d5f
		}

	.pagination > .page-count{
		display: block;
		padding-bottom: .5em;
	}

/** Scalable stamp: suitable for starbursts. */
.stamp{
	position: relative;
	display: inline-block;
	text-align: center;
}
	.stamp > img{
		position: absolute;
		width: 100%;
		height: auto;
		display: block;
		top: 50%;
		margin-top: -50%;
	}
	.stamp > span{
		display: inline-block;
		position: relative;
		z-index: 20;
		padding: 0 .5em;
	}


/** Compact DL-list formatting for legality pages */
dl.compact > dt,
dl.compact > dd{
	display: inline;
	padding: 0;
	margin: 0;
}
	dl.compact > dd::after{
		content: "";
		display: block;
		clear: both;
	}
	
	dl.compact > dd.full{
		display: block;
	}



/*=============================================================================*
	3. COMPONENTS & WIDGETS
===============================================================================*/

.control					{	display: none				}
.menu.control:checked ~ ul	{	max-height: 0 !important;	}



/** Styled dropdown container */
@media not screen and (min-width: 64em){
.styled-dropdown{
	color: #000;
	font: 1em/2em Arial, Helvetica, sans-serif;
	display: inline-block;
	vertical-align: top;
	position: relative;
	height: 2em;
}
	.styled-dropdown h2,
	.styled-dropdown a,
	.styled-dropdown .label{
		text-decoration: none;
		font: 1em/2.2em sans-serif;
		height: 2.4em;
		padding: 0 3em 0 .5em;
		margin: 0;

		white-space: nowrap;
		text-overflow: ellipsis;
		overflow: hidden;
	}
		.styled-dropdown h2:hover,
		.styled-dropdown a:hover{
			background-color: #eee;
		}


	/** Placeholder/default text */
	.styled-dropdown > h2{
		display: block;
		background-color: #fff;
		-webkit-border-bottom-left-radius: 0;
		-webkit-border-bottom-right-radius: 0;
		-moz-border-radius-bottomleft: 0;
		-moz-border-radius-bottomright: 0;
		border-bottom-left-radius: 0;
		border-bottom-right-radius: 0;
	}


	/** Hidden dropdown label */
	.styled-dropdown > .menu.disclosure{
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 2em;
		z-index: 200;
		text-align: right;
		cursor: pointer;
	}
		/** Disclosure arrow */
		.styled-dropdown > .menu.disclosure::after{
			color: #000;
			content: "\25b2";
			width: 2.2em;
			font: .65em/3em CKitchenIcons;
			display: inline-block;
			vertical-align: top;
			text-align: left;
		}
	
		.styled-dropdown > .menu.control:checked ~ .menu.disclosure::after{
			content: "\25bc";
		}



	/** Styled options */
	.styled-options{
		position: absolute;
		overflow: hidden;
		width: 100%;
		list-style: none;
		top: 0;
		margin: 0;
		padding: 2em 0 0;
		min-height: 2em;
		max-height: 30em;
		z-index: 90;
	}
		.styled-options li,
		.styled-options ul{
			margin: 0;
			padding: 0;
			list-style: none;
		}
			/** Actual links themselves */
			.styled-options a,
			.styled-options .label{
				opacity: 1;
				display: block;
				background-color: #fff;
			}
				.menu.control:checked ~ .styled-options a,
				.menu.control:checked ~ .styled-options .label{
					opacity: 0;
				}


		/** Selected menu entry */
		.styled-options li.selected,
		.styled-options li.current{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			background-color: #fff;
			z-index: 999;
			opacity: 1 !important;
		}
			.styled-options li.selected a,
			.styled-options li.current a{
				opacity: 1 !important;
			}


		/** Don't show the placeholder item when menu's closed. */
		.styled-options li.selected.placeholder,
		.styled-options li.current.placeholder{
			display: none;
		}

		/** Second level of subnavigation */
		.styled-options ul li > a{
			text-indent: 1em;
		}


	/** Set border-radii to be inheritable. */
	.styled-options,
	.styled-options > li,
	.styled-dropdown h2,
	.styled-options li.selected > a,
	.styled-options li.current > a{
		-webkit-border-radius:	inherit;
		-moz-border-radius:		inherit;
		border-radius:			inherit;
	}

	.styled-options li:last-child > a,
	.styled-dropdown > .menu.control:checked ~ h2{
		-webkit-border-bottom-left-radius:	inherit;
		-webkit-border-bottom-right-radius:	inherit;
		-moz-border-radius-bottomleft:		inherit;
		-moz-border-radius-bottomright:		inherit;
		border-bottom-left-radius:			inherit;
		border-bottom-right-radius:			inherit;
	}


	/** Use transitions on this dropdown menu */
	.styled-options.trans{
		-webkit-transition:	.2s ease-out max-height;
		-moz-transition:	.2s ease-out max-height;
		-ms-transition:		.2s ease-out max-height;
		-o-transition:		.2s ease-out max-height;
		transition:			.2s ease-out max-height;
	}
		.styled-options.trans a,
		.styled-options.trans .label{
			-webkit-transition:	.2s linear opacity;
			-moz-transition:	.2s linear opacity;
			-ms-transition:		.2s linear opacity;
			-o-transition:		.2s linear opacity;
			transition:			.2s linear opacity;
		}
}
	/** Hidden HTML select node used for touch-based devices. */
	.styled-dropdown > select{
		display: none;
	}
		@media screen and (max-device-width: 25em){
			.js .styled-dropdown > select{
				position: absolute;
				display: block;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				z-index: 999;
				opacity: 0;
			}
		}


/** Rollout accordion */
.accordion{
	margin: 1em -1.25em 0;
	clear: both;
}
	.accordion > *{
		border-top: 1px solid #332a86;
		margin: 0;
	}
		.accordion > * > .disclosure{
			font: 1.5em/1em "futura-pt", sans-serif;
			position: relative;
			display: block;
			padding: .5em;
			color: #332a86;
			margin: 0;
		}
			.accordion > * > .disclosure > label{
				display: block;
				padding: .45em .35em;
			}
				.accordion > * > .disclosure > label::after{
					content: "↑";
					color: #3d2b76;
					font: 1em CKitchenIcons;
					position: absolute;
					display: block;
					top: 50%;
					right: .65em;
					margin-top: -.5em;
				}

		.accordion > * > .content{
			overflow: hidden;
			position: relative;

			-webkit-transition:	.3s ease max-height;
			-moz-transition:	.3s ease max-height;
			-ms-transition:		.3s ease max-height;
			-o-transition:		.3s ease max-height;
			transition:			.3s ease max-height;

			/** Horizontal padding needs to match .accordion's negative margin */
			padding: 0 1.25em;

			/** Value should be fine-tuned in JavaScript based on content. */
			max-height: 999em;
			max-height: 100vh;
		}
			.accordion > * > .content::after{
				content: "";
				display: block;
				clear: both;
				height: 1em;
			}

	/** Opened accordion section */
	.accordion > * > .control:checked ~ .content{
		max-height: 0 !important;
	}
		.accordion > * > .control:checked ~ .disclosure > label::after{
			content: "↓";
		}





/*=============================================================================*
	4. CLASSES
===============================================================================*
/** Styling classes */
.bold		{	font-weight: bold !important;			}
.small		{	font-size: .75em;						}
.caps		{	text-transform: uppercase !important;	}
.no-caps	{	text-transform: none !important;		}


/** Structural classes */
.align_c.narrow{
	max-width: 45%;
	margin-left: auto;
	margin-right: auto;
}

.centre{
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.nonvisual{
	clip: rect(0 0 0 0);
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	position: absolute;
	border: 0;
	padding: 0;
}


.table,
.columns{
	display: table;
	width: 100%;
	vertical-align: middle;
}
	.table > *{
		display: table-row;
		vertical-align: inherit;
	}

	.columns > *,
	.table > * > *{
		display: table-cell;
		vertical-align: inherit;
	}

	.columns > .narrow,
	.table > * > .narrow{
		width: 25%;
	}

	.columns > .wide,
	.table > * > .wide{
		width: 75%;
	}
	.x2 > *{
		width: 50%;
	}


ul.horizontal,
ul.horizontal > li{
	list-style: none;
	display: inline-block;
	vertical-align: top;
	padding: 0;
	margin: 0;
}

ul.plain,
ol.plain,
.plain > li{
	list-style: none;
	padding: 0;
	margin: 0;
}



/** "Pinches" a row of inline elements to the same line. Useful for columns and slideshows. */
.pinch		{white-space: nowrap}
.pinch > *	{white-space: normal}


/** Helper classes */
.hidden{display: none !important;}
@media screen and (min-width: 37.5em)		{	.desktop-hide	{display: none !important;	}}
@media not screen and (min-width: 37.5em)	{	.handheld-hide	{display: none !important;	}}
@media not screen and (min-width: 64em)		{	.desktop-only	{display: none !important;	}}
@media screen and (min-width: 37.5em)		{	.handheld-only	{display: none !important;	}}
@media not screen and (min-width: 37.5em), screen and (min-width: 64em){.tablet-only{display: none !important;}}

.clear,
.clear::before,
.clear::after{
	clear: both;
	display: block;
	content: "";
}

.circle{
	-webkit-border-radius:	50%;
	-moz-border-radius:		50%;
	border-radius:			50%;
}

.centred{
	margin-left: auto;
	margin-right: auto;
	display: block
}

.align_l	{text-align: left}
.align_r	{text-align: right}
.align_c	{text-align: center}
.float_l	{float:	left}
.float_r	{float:	right}
.vtop		{vertical-align: top}
.vmid		{vertical-align: middle}
.vbottom	{vertical-align: bottom}

.bl, .br, .tl, .tr	{position: absolute !important}
	.tl	{top:		0;	left:	0}
	.tr	{top:		0;	right:	0}
	.bl	{bottom:	0;	left:	0}
	.br	{bottom:	0;	right:	0}


/** Strips any generated content from the element */
.no-gen::before,
.no-gen::after{
	content: none !important;
}


/** CSS3 helper classes */
.trans-all,
.trans-all-children > *,
.trans-all-grandchildren > * > *{
	-webkit-transition:		.4s all ease;
	-moz-transition:		.4s all ease;
	-ms-transition:			.4s all ease;
	-o-transition:			.4s all ease;
	transition:				.4s all ease;
}
	.trans-all.slow,
	.trans-all-children.slow > *,
	.trans-all-grandchildren.slow > * > *{
		-webkit-transition-duration:	.6s;
		-moz-transition-duration:		.6s;
		-ms-transition-duration:		.6s;
		-o-transition-duration:			.6s;
		transition-duration:			.6s;
	}

	.trans-all.fast,
	.trans-all-children.fast > *,
	.trans-all-grandchildren.fast > * > *{
		-webkit-transition-duration:	.2s;
		-moz-transition-duration:		.2s;
		-ms-transition-duration:		.2s;
		-o-transition-duration:			.2s;
		transition-duration:			.2s;
	}

.bowl,
.xform-reset,
.xform-reset-children > *{
	-webkit-transform:	translate(0);
	-khtml-transform:	translate(0);
	-moz-transform:		translate(0);
	-ms-transform:		translate(0);
	-o-transform:		translate(0);
	transform:			translate(0);

	-webkit-backface-visibility:	hidden;
	-moz-backface-visibility:		hidden;
}

.bg-contain,
.fb, .tw, .gp,
#logo, #logo > a{
	-webkit-background-size:	contain !important;
	-khtml-background-size:		contain !important;
	-moz-background-size:		contain !important;
	-ms-background-size:		contain !important;
	-o-background-size:			contain !important;
	background-size:			contain !important;
}

.bg-fit-x,
.fb, .tw, .gp, .curly{
	-webkit-background-size:	100% auto !important;
	-khtml-background-size:		100% auto !important;
	-moz-background-size:		100% auto !important;
	-ms-background-size:		100% auto !important;
	-o-background-size:			100% auto !important;
	background-size:			100% auto !important;
}

.bg-fit-y{
	-webkit-background-size:	auto 100%;
	-khtml-background-size:		auto 100%;
	-moz-background-size:		auto 100%;
	-ms-background-size:		auto 100%;
	-o-background-size:			auto 100%;
	background-size:			auto 100%;
}

.bg-at-border{
	-webkit-background-origin:	border;
	-webkit-background-origin:	border-box;
	-khtml-background-origin:	border-box;
	-moz-background-origin:		border;
	-moz-background-origin:		border-box;
	-ms-background-origin:		border-box;
	-o-background-origin:		border-box;
	background-origin:			border-box;
}