@charset "UTF-8";

/* Reset (Thanks Eric Meyer) */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	font-weight: normal;
	vertical-align: baseline;
	}
main, article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
	}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q {	quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}

/* Setting Defaults */
sup,sub { font-size: 9px; line-height: 11px; }
sup { vertical-align: super; margin-top: -6px; }
sub { vertical-align: sub; }
small { font-size: 10px; line-height: 12px;	}
nav ul li,
.widget ul li { list-style: none; }
a,a:hover,a:visited {
	text-decoration: none;
	color: #981e32;
	}
a:hover { color: #c60c30; }
strong,b { font-weight: bold; }
em,i { font-style: italic; }
hr { border-width: 3px 0px 0px 0px;
	border-style: dotted;
	border-color: #b6bcbf;
	margin: 10px 0px;
	}
h6,h5,h4,h3,h2,h1 { margin: 0px 0px 3px 0px; letter-spacing: 0em; font-weight: normal; }
h1 { font-size: 26px; line-height: 30px; font-weight: bold; }
h2 { font-size: 18px; line-height: 20px; font-weight: bold;	margin: 5px 0px; }
h3 { font-size: 1.2em; line-height: 1.2em; margin: 10px 0px 5px 0px; text-transform: uppercase;	}
h4 { font-weight: bold;	font-size: 1.1em; line-height: 1.2em; }
p { margin: 0px; padding-bottom: 12px; }
ol li { list-style: decimal; margin: 0px 0px 5px 25px; }
ul { padding: ; }
ul li { list-style: circle; margin: 0px 0px 5px 20px; padding: 0px 0px 0px 0px; }

input {
	outline: none;
	}

/* ! Grid
================================================== */

/* LAYOUT */

body {
	color: #262a2d;
	xfont: 14px/22px "OpenSans","Lucida Grande","Lucida Sans Unicode", "Arial", san-serif;
	font: 14px/22px "Lucida Grande","Lucida Sans Unicode", "Arial", san-serif;
	background: #EEEFF1 url('../images/elements/bg.png') left top repeat-x;
	background: white url('../images/elements/gray-white-south.png') left top repeat-x;
	}
.serif,
body.serif {
	font: 14px/22px "Palatino","Lucida Sans Unicode", "Arial", san-serif;
	}
#binder {
	width: 990px;
	margin: 0px auto;
	position: relative;
	}
main {
	float: right;
	margin-left: 198px;
	width: 792px;
	border: inset 1px pink solid;
	}
#spine {
	width: 198px;
	position: fixed;
	height: 100%;
	min-height: 100%;
	}
section {
	position: relative;
	clear: both;
	}
	
/* !LAYOUTS */
.row {
	width: 100%;
	xmargin-bottom: 5px;
	}
.row .column {
	position: relative;
	background: #e7e9ea;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e7e9ea', endColorstr='#dcdfe0'); /* for IE */
	background: -webkit-gradient(linear, left top, right top, from(#e7e9ea), to(#dcdfe0)); /* for webkit browsers */
	background: -moz-linear-gradient(left,  #e7e9ea,  #dcdfe0); /* for firefox 3.6+ */
	display: table-cell;
	display: block;
	vertical-align: top;
	overflow: visible;
	z-index: auto;
	float: left;
	}
.row .column {
	min-height: 198px;
	box-shadow: inset -2px -2px 1px rgba(137,137,137,0.1);
	}
	
/* GRID */

/* !Single */
.row.single .column {
	width: 100%;	
	min-height: 250px;
	display: block;
	}

/* halves */
.row.halves .column { width: 396px; }
.fluid .row.halves .column { width: 50%; }
	
/* thirds */
.row.thirds .column { width: 264px; }
.fluid .row.thirds .column { width: 33%; }
.fluid .row.thirds .column.two { width: 34%; }

/* quarters */
.row.quarters .column { width: 198px; }
.fluid .row.quarters .column { width: 25%; }

/* eighths */
.row.eighths .column { width: 99px; }
.fluid .row.eighths .column { width: 12.5%; }

/* ninths */
.row.ninths .column { width: 99px; }
.fluid .row.ninths .column { width: 12.5%; }

/* twelfths */
.row.twelfths .column { width: 66px; }
.fluid .row.twelfths .column { width: 8.33334%; }
	
/* Triptych */
.row.triptych .column { width: 198px; }
.row.triptych .column.two { width: 396px; }

/* Margin */
.row.margin .column.one { width: 594px; }
.row.margin .column.two { width: 198px; }
.fluid .row.margin .column.one { width: 75%; }
.fluid .row.margin .column.two { width: 25%; }

/* Sidebar */
.row.sidebar .column.one { width: 528px; }
.row.sidebar .column.two { width: 264px; }
.fluid .row.sidebar .column.one { width: 67%; }
.fluid .row.sidebar .column.two { width: 33%; }

/* Nested */

/* halves and halves */
.row.halves .halves .column { width: 198px; }
.fluid .row.halves .halves .column { width: 50%; }

/* halves and thirds */
.row .column.thirds .column { width: 132px; }
.row.quarters .thirds .column { width: 66px; }
.fluid .row .column.thirds .column { width: 33%; }
.fluid .row .column.thirds .column.two { width: 34%; }

/* Spineless Severed */
.row.fifths .column { width: 198px; }
.fluid .row.fifths .column { width: 20%; }

/* Fifteenths */
.one-fifteenth { width: 66px; }
.three-fifteenths, .one-fifth { width: 198px; }
.six-fifteenths, .two-fifths { width: 396px; }
.nine-fifteenths, .three-fifths { width: 594px; }
.twelve-fifteenths, .four-fifths { width: 792px; }
.fifteen-fifteenths, .five-fifths { width: 990px; }

.panel {
	position: absolute;
	z-index: 5000;
	}
.quarters .panel.doublewide,
.fifths .panel.doublewide {
	width: 396px;
	xborder: 1px pink solid;
	}
.fifths .panel.doublehigh {
	height: 396px;
	}


/* ------------------- */

#grid {
	display: none;
	}
.grid #grid {
	position: absolute;
	width: 990px;
	left: 0;
	top: 0;
	display: block;
	height: 3000px;
	z-index: 9999;
	background: transparent url('../images/elements/grid.png') repeat-y left top;
	}
.grid.grid12 #grid {
	background: transparent url('../images/elements/grid12.png') repeat-y left top;
	}
.grid section.row::before {
	display: block;
	background: #5e6a71;
	padding: 0px 0px;
	text-indent: 5px;
	opacity: .5;
	position: absolute;
	right: 0px;
	width: 75px;
	z-index: 99;
	visibility: visible;
	height: auto;
	color: white;
	font-size: 10px;
	}
.grid .row.eighths::before { content: "eighths"; }
.grid .row.twelfths::before { content: "twelfths"; }
.grid .row.quarters::before { content: "quarters"; }
.grid .row.single::before { content: "single"; }
.grid .row.halves::before { content: "halves"; }
.grid .row.sidebar::before { content: "sidebar"; }
.grid .row.triptych::before { content: "triptych"; }
.grid .row.thirds::before { content: "thirds"; }
.grid .row.margin::before { content: "margin"; }
	
/* Column Numbering */
.column::after { 
	color: white;
	background-color: #b6bcbf;
	padding: 5px 10px;
	position: absolute;
	right: 0; bottom: 0;
	}
.column.one::after { content:"1"; }
.column.two::after { content:"2"; }
.column.three::after { content:"3"; }
.column.four::after { content:"4"; }
.column.five::after { content:"5"; }
.column.six::after { content:"6"; }
.column.seven::after { content:"7"; }
.column.eight::after { content:"8"; }
.column.nine::after { content:"9"; }
.column.ten::after { content:"10"; }
.column.eleven::after { content:"11"; }
.column.twelve::after { content:"12"; }

/* Column Measurements */
.column::before { 
	color: black;
	padding: 2px 4px;
	position: absolute;
	opacity: .2;
	font-size: 10px;
	top: 0;	left: 0;
	width: 95%;
	margin: 0px auto;
	text-align: center;
	}
.single .column::before { content:"\2190 792 \2192"; }
.sidebar .column.one::before { content:"\2190 528 \2192"; }
.sidebar .column.two::before,
.thirds .column::before { content:"\2190 264 \2192"; }
.margin .column.one::before { content:"\2190 594 \2192"; }
.margin .column.two::before,
.quarters .column::before,
.triptych .column.one::before,
.triptych .column.three::before { content:"\2190 198 \2192"; }
.halves .column::before,
.triptych .column.two::before { content:"\2190 396 \2192"; }

.nested::before {
	display: block;
	background: #5e6a71;
	padding: 0px 0px;
	text-indent: 5px;
	opacity: .2;
	position: absolute;
	text-align: left;
	left: 0px;
	width: 75px;
	top: 60px;
	z-index: 99;
	visibility: visible;
	height: auto;
	color: white;
	font-size: 10px;
	content:"nested" !important;
	}

/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */

section:after {
	content: "\0020";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}

/* #Clearing
================================================== */

/* Self Clearing Goodness */
main:after,
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0; }
.row:after,
.clearfix:after {
  clear: both; }
.row,
.clearfix {
  zoom: 1; }

/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}
    
/* !Palette ============================================ */

.column.orange { background: #b67024; }
.column.oranger { background: #da7000; }
.column.orange-darker { background: #7f4f1f; }
.column.orange-darkest { color: #d6af86; background: #482c0d; }
.column.orange-lighter { background: #d6af86; }
.column.orange-lightest { background: #f4e9de; }

.column.gold { background: #c7aa5b; }
.column.golder { background: #fbc13b; }
.column.gold-darker { background: #7f4f1f; }
.column.gold-darkest { background: #482c0d; }
.column.gold-lighter { background: #7f4f1f; }
.column.gold-lightest { background: #482c0d; }

.column.gold { background: #c7aa5b; }
.column.grayer, .column.grayr { background: #5e6a71; }
.column.gold-darker { background: #7f4f1f; }
.column.gold-darkest { background: #482c0d; }
.column.gold-lighter { background: #7f4f1f; }
.column.gold-lightest { background: #482c0d; }


/* #Basic Styles
================================================== */

.cf:before,
.cf:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.cf:after {
    clear: both;
}

/* #Images */

	img.scale-with-grid {
		max-width: 100%;
		height: auto; }

/* Tabs */
ul.tabs {
	display: block;
	xbackground: #eceeef;
	}
ul.tabs li {
	display: block;
	float: left;
	margin-right: 1px;
	white-space: nowrap;
	}
ul.tabs li a {
	padding: 6px 12px;
	display: table-cell;
	vertical-align: middle;
	background: #eceeef;
	border-right: 1px #bdbfc0 solid;
	border-bottom: 2px #d6d8d9 solid;
	}
ul.tabs li.active a {
	xborder-left-color: white;
	}
ul.tabs li a:hover {
	-webkit-transition: background .3s ease-in-out;
	background: #d6d8d9;
	}
ul.tabs li.active a {
	background: white;
	border-bottom: 2px white solid;
	xfont-weight: bold;
	}

/*////////////////////////*/
/* BUTTONS */

.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	background: #eee; /* Old browsers */
	background: #eee -moz-linear-gradient(top, rgba(255,255,255,.2) 0%, rgba(0,0,0,.2) 100%); /* FF3.6+ */
	background: #eee -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.2)), color-stop(100%,rgba(0,0,0,.2))); /* Chrome,Safari4+ */
	background: #eee -webkit-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Chrome10+,Safari5.1+ */
	background: #eee -o-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* Opera11.10+ */
	background: #eee -ms-linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* IE10+ */
	background: #eee linear-gradient(top, rgba(255,255,255,.2) 0%,rgba(0,0,0,.2) 100%); /* W3C */
	border: 1px solid #aaa;
	border: none;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	color: #444;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	text-decoration: none;
	text-shadow: 0 1px rgba(255, 255, 255, .75);
	cursor: pointer;
	margin-bottom: 0px;
	line-height: normal;
	padding: 6px 8px;
	}

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover {
	color: #222;
	background: #ddd; /* Old browsers */
	background: #ddd -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */
	background: #ddd -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */
	background: #ddd -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */
	background: #ddd -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */
	background: #ddd -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */
	background: #ddd linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */
	border: 1px solid #888;
	border-top: 1px solid #aaa;
	border-left: 1px solid #aaa; }

.button:active,
button:active,
input[type="submit"]:active,
input[type="reset"]:active,
input[type="button"]:active {
	border: 1px solid #666;
	background: #ccc; /* Old browsers */
	background: #ccc -moz-linear-gradient(top, rgba(255,255,255,.35) 0%, rgba(10,10,10,.4) 100%); /* FF3.6+ */
	background: #ccc -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.35)), color-stop(100%,rgba(10,10,10,.4))); /* Chrome,Safari4+ */
	background: #ccc -webkit-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Chrome10+,Safari5.1+ */
	background: #ccc -o-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* Opera11.10+ */
	background: #ccc -ms-linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* IE10+ */
	background: #ccc linear-gradient(top, rgba(255,255,255,.35) 0%,rgba(10,10,10,.4) 100%); /* W3C */ }

.button.full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
	width: 100%;
	padding-left: 0 !important;
	padding-right: 0 !important;
	text-align: center; }
		
button.functional,
button.glassine {
	border: none;
	padding: 0px;
	margin: 0px;
	background: transparent;
	border-radius: 0px;
	}

/* Fix for odd Mozilla border & padding issues */
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
	}

/*////////////////////////*/
/* FORMS */

	/* This could be a wee bit controversial */
	form,fieldset,input,textarea,legend,label {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		}
	form {
		margin-bottom: 5px;
		padding: 10px;
		}
	fieldset {
		margin-bottom: 5px;
		padding: 0px;
		}
	input[type="text"],
	input[type="password"],
	input[type="email"],
	textarea,
	select {
		border: 1px solid #ccc;
		padding: 6px 4px;
		outline: none;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
		border-radius: 2px;
		color: #777;
		margin: 0;
		background: #fff; }
	select {
		padding: 0; }
	input[type="text"]:focus,
	input[type="password"]:focus,
	input[type="email"]:focus,
	textarea:focus {
		border: 1px solid #aaa;
 		color: #444;
 		-moz-box-shadow: 0 0 3px rgba(0,0,0,.2);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,.2);
		box-shadow:  0 0 3px rgba(0,0,0,.2); }
	textarea {
		min-height: 60px; }
	label,
	legend {
		font-weight: bold;
		font-size: 13px;  }
	select {
		 }
	input[type="checkbox"] {
		display: inline; }
	label span,
	legend span {
		font-weight: normal;
		font-size: 13px;
		color: #444; }

fieldset {
	position: relative;
	}
	
/* MISC */
code textarea,
code textarea:focus {
	width: 100%;
	padding: 15px;
	height: auto;
	color: white;
	background-color: rgba(0,0,0,0.5);
	}

/* SYMBOLS |||||||||||||||||||||||||||||||||||||||||||| */

@font-face {
  font-family: "SSSocialCircle";
  src: url('ss-social-circle.eot');
  src: url('ss-social-circle.eot?#iefix') format('embedded-opentype'),
       url('ss-social-circle.woff') format('woff'),
       url('ss-social-circle.ttf')  format('truetype'),
       xurl('ss-social-circle.svg#SSSocialCircle') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* This triggers a redraw in IE to Fix IE8's :before content rendering. */
html:hover [class^="ss-"]{-ms-zoom: 1;}

.ss-icon, .ss-icon.ss-social-circle,
[class^="ss-"]:before, [class*=" ss-"]:before,
[class^="ss-"].ss-social-circle:before, [class*=" ss-"].ss-social-circle:before,
[class^="ss-"].right:after, [class*=" ss-"].right:after,
[class^="ss-"].ss-social-circle.right:after, [class*=" ss-"].ss-social-circle.right:after {
  font-family: "SSSocialCircle";
  font-style: normal;
  font-weight: normal;
  text-decoration: none;
  text-rendering: optimizeLegibility;
  white-space: nowrap;
  /*-webkit-font-feature-settings: "liga"; Currently broken in Chrome >= v22. Falls back to text-rendering. Safari is unaffected. */
  -moz-font-feature-settings: "liga=1";
  -moz-font-feature-settings: "liga";
  -ms-font-feature-settings: "liga" 1;
  -o-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
}

[class^="ss-"].right:before,
[class*=" ss-"].right:before{display:none;content:'';}

.ss-facebook:before,.ss-facebook.right:after{content:''}.ss-twitter:before,.ss-twitter.right:after{content:''}.ss-linkedin:before,.ss-linkedin.right:after{content:''}.ss-googleplus:before,.ss-googleplus.right:after{content:''}.ss-appdotnet:before,.ss-appdotnet.right:after{content:''}.ss-zerply:before,.ss-zerply.right:after{content:''}.ss-reddit:before,.ss-reddit.right:after{content:''}.ss-steam:before,.ss-steam.right:after{content:''}.ss-tumblr:before,.ss-tumblr.right:after{content:''}.ss-wordpress:before,.ss-wordpress.right:after{content:''}.ss-blogger:before,.ss-blogger.right:after{content:''}.ss-posterous:before,.ss-posterous.right:after{content:''}.ss-quora:before,.ss-quora.right:after{content:''}.ss-youtube:before,.ss-youtube.right:after{content:''}.ss-vimeo:before,.ss-vimeo.right:after{content:''}.ss-vine:before,.ss-vine.right:after{content:''}.ss-letterboxd:before,.ss-letterboxd.right:after{content:''}.ss-flickr:before,.ss-flickr.right:after{content:''}.ss-instagram:before,.ss-instagram.right:after{content:''}.ss-500px:before,.ss-500px.right:after{content:''}.ss-etsy:before,.ss-etsy.right:after{content:''}.ss-pinterest:before,.ss-pinterest.right:after{content:''}.ss-svpply:before,.ss-svpply.right:after{content:''}.ss-readmill:before,.ss-readmill.right:after{content:''}.ss-dropbox:before,.ss-dropbox.right:after{content:''}.ss-pinboard:before,.ss-pinboard.right:after{content:''}.ss-delicious:before,.ss-delicious.right:after{content:''}.ss-dribbble:before,.ss-dribbble.right:after{content:''}.ss-behance:before,.ss-behance.right:after{content:''}.ss-github:before,.ss-github.right:after{content:''}.ss-octocat:before,.ss-octocat.right:after{content:''}.ss-stackoverflow:before,.ss-stackoverflow.right:after{content:''}.ss-paypal:before,.ss-paypal.right:after{content:''}.ss-kickstarter:before,.ss-kickstarter.right:after{content:''}.ss-foursquare:before,.ss-foursquare.right:after{content:''}.ss-yelp:before,.ss-yelp.right:after{content:''}.ss-skype:before,.ss-skype.right:after{content:''}.ss-rdio:before,.ss-rdio.right:after{content:''}.ss-spotify:before,.ss-spotify.right:after{content:''}.ss-lastfm:before,.ss-lastfm.right:after{content:''}.ss-soundcloud:before,.ss-soundcloud.right:after{content:''}.ss-link:before,.ss-link.right:after{content:'🔗'}.ss-phone:before,.ss-phone.right:after{content:'📞'}.ss-mail:before,.ss-mail.right:after{content:'✉'}.ss-like:before,.ss-like.right:after{content:'👍'}.ss-rss:before,.ss-rss.right:after{content:''}.ss-share:before,.ss-share.right:after{content:''}.ss-apple:before,.ss-apple.right:after{content:''}.ss-microsoft:before,.ss-microsoft.right:after{content:''}.ss-windows:before,.ss-windows.right:after{content:''}.ss-android:before,.ss-android.right:after{content:''}.ss-blackberry:before,.ss-blackberry.right:after{content:''}

/* Legacy */
.ss-fivehundredpx:before,.ss-fivehundredpx.right:after{content:''}