/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Color Schema
	#Typography
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */
	
	
/* #Color Schema
================================================== */

	a, a:visited,
	#primary-nav a:hover,
	#primary-nav a.active { 
		color: #06aeca; 
	}
		
	.button, button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		background: #06aeca;
	}
	
	
/* #Typography
================================================== */
	
	/* Basic */
	
	body {
		background: #fff;
		font: 15px/24px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		color: #666;
 	}
 	
 	h1, h2, h3, h4, h5, h6 {
		font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
		font-weight: bold;
		color: #444; 
		margin-bottom: 12px; }
	h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
	h1 { font-size: 30px; line-height: 36px; }
	h2 { font-size: 24px; line-height: 30px; }
	h3 { font-size: 18px; line-height: 24px; }
	h4 { font-size: 15px; line-height: 24px; }
	h5 { font-size: 15px; line-height: 24px; color: #aaa; text-transform: uppercase; }
	h6 { font-size: 12px; line-height: 12px; margin-bottom: 0; color: #aaa; text-transform: uppercase; }
	
	/* Elements */
	
	p { margin: 0 0 24px 0; }
	p img { margin: 0; }
	p.lead { font-size: 18px; line-height: 24px; color: #aaa; }

	em { font-style: italic; }
	strong { font-weight: bold; color: inherit; }
	small { font-size: 13px; }
	mark { background: #fafaa0; padding: 0 3px; color: #444; }
	
	pre { white-space: pre-wrap; margin-bottom: 24px; border: 1px solid #eee; color: #444; padding: 11px; font-family: "Courier New", Courier, monospace; font-size: 13px; }
	pre.lineup { margin-top: -12px; padding-bottom: 12px; }
	code { font-family: "Courier New", Courier, monospace; font-size: 13px; line-height: 1em; padding: 3px 2px; background: #eee; border-radius: 5px; -webkit-border-radius: 5px; }
	
	hr { border: solid #eee; border-width: 1px 0 0; clear: both; margin: 11px 0 24px; height: 0; }

		
	/* Links */
	
	a, a:visited { text-decoration: none; outline: 0; -webkit-transition: all .2s; -moz-transition: all .2s; -o-transition: all .2s; transition: all .2s;}
	a:hover, a:focus { color: #aaa; text-decoration: underline; }
	p a, p a:visited { line-height: inherit; }
	
	/*	Blockquotes  */
	
	blockquote, blockquote p { font-size: 18px; line-height: 24px; color: #aaa; font-style: italic; }
	blockquote { margin: 0 0 24px; margin-left: 15px; padding: 6px 0 6px 20px; border-left: 4px solid #eee; }
	blockquote cite { display: block; font-size: 13px; color: #666; }
	blockquote cite:before { content: "\2014 \0020"; }
	blockquote cite a, blockquote cite a:visited { color: inherit; text-decoration: underline; }
	
	/* Lists */
	
	ul, ol { margin-bottom: 24px; }
	li { line-height: 24px; margin-bottom: 0; font-size: 13px; }
	ul.large li { line-height: 24px; font-size: 100%; }
	li p { line-height: 24px; }
	
	/* Buttons */
	
	.button,
	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
		border: 0;
		-moz-border-radius: 5px;
		-webkit-border-radius: 5px;
		border-radius: 5px;
		color: #f8f8f8 !important;
		display: inline-block;
		font-size: 15px;
		line-height: 24px;
		font-weight: bold;
		text-decoration: none;
		text-shadow: none;
		cursor: pointer;
		margin-bottom: 12px;
		padding: 12px 15px;
		font-family: inherit;
	}

	.button:hover,
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
		background: #444;
		border: 0;
		text-decoration: none;
	}
	
	.button:active,
	button:active,
	input[type="submit"]:active,
	input[type="reset"]:active,
	input[type="button"]:active {
		background: #444;
		border: 0;
		text-decoration: none;
	}
	
	.button.big,
	button.big,
	input[type="submit"].big,
	input[type="reset"].big,
	input[type="button"].big {
		padding: 18px 20px;
		font-size: 17px;
	}


/* #Site Styles
================================================== */
	
	.subheader { color: #aaa; margin-top: -6px; padding-bottom: 6px; }
	.row { margin: 0 0 24px; }
	

	/* Logo & Menu */
	
	#header { padding-top: 48px; }
	
	#logo { float: left; height: 96px; }
	#logo img { vertical-align: top; }
	
	#menu { float: right; padding-top: 48px; }
	#menu ul { margin: 0; }
	
	#menu-icon { position: relative; display: none; width: 30px; height: 24px; background: url(../images/menu.png) no-repeat center; cursor: pointer; z-index: 10; -webkit-tap-highlight-color: rgba(0,0,0,0); }
	
	
	#primary-nav li { float: left; margin: 0 20px 0 0; line-height: 24px; font-size: 13px; font-weight: bold; }
	#primary-nav li + li:before { display: inline; content: '\0002F'; color: #eee; padding-right: 20px; }
	#primary-nav a { color: #444; text-decoration: none; text-transform: uppercase; letter-spacing: 0.03em; }
		
	#menu.mobile-menu { float: none; }
	.mobile-menu #menu-icon { display: block; margin: 0 auto; }
	.mobile-menu #primary-nav { overflow: hidden; height: 0; margin-top: 24px; -webkit-transition: height .3s ease; -moz-transition: height .3s ease; -o-transition: height .3s ease; transition: height .3s ease; }
	.mobile-menu #primary-nav ul { padding: 12px 0; background: #282828; }
	.mobile-menu #primary-nav li { float: none; margin: 0; }
	.mobile-menu #primary-nav li:before { display: none; }
	.mobile-menu #primary-nav a { display: block; padding: 6px 30px; color: #aaa; -webkit-tap-highlight-color: rgba(0,0,0,0); }
	.mobile-menu #primary-nav a:hover,
	.mobile-menu #primary-nav a.active { color: #eee; background: #252525; }
	#menu-icon:hover,
	#menu.menu-open #menu-icon { opacity: 0.5!important; }
	
	
	/* Separator */
	
	.separator { clear: both; width: 100%; height: 48px; }
	.separator + .separator:before { content: ""; display: block; margin-left: 10px; width: 40px; height: 1px; background: #eee; }
	.separator + hr { margin: 0; }


	/* Purchase */
	
	.purchase { padding-top: 48px; margin-bottom: 24px; }
	.purchase small { display: block; color: #aaa; padding-bottom: 5px; margin-top: -5px; }
	
	
	/* Info */
	
	p.info { margin: 0 0 12px 0; color: #aaa; font-style: italic; font-family: "Times New Roman", serif; }
	p.info:before { content: ""; display: block; margin-bottom: 11px; width: 25px; height: 1px; background: #eee; }
	
	/* Footer */
	
	#footer { padding: 24px 0; overflow: hidden; }
	#footer .copyright { font-size: 12px; color: #aaa; font-family: Arial, sans-serif; margin-left: 10px; }
	
	
	/* Scroll Top */
	
	#scroll-top { display: none; position: fixed; right: 20px; bottom: 12px; width: 48px; height: 48px; border-radius: 5px; -moz-border-radius: 5px; background: url(../images/up.png) no-repeat center #eee; opacity: 0.8; cursor: pointer; -webkit-tap-highlight-color: rgba(0,0,0,0); }
	#scroll-top:hover { opacity: 1; }
	
	
	/* Features */
	
	.feature { margin: 24px 0; }
	.feature h4 { text-align: left; margin-bottom: 6px; }
	.feature p { font-size: 13px; line-height: 1.6em; }
	.feature .icon { float: left; margin: 2px 15px 0 0; width: 72px; height: 72px; border-radius: 34px; -webkit-border-radius: 34px; }
	.feature .icon.mustache { background: url(../images/objects.png) no-repeat 0 0 #eee; }
	.feature .icon.rocket { background: url(../images/objects.png) no-repeat -72px 0 #eee; }
	.feature .icon.lab { background: url(../images/objects.png) no-repeat -144px 0 #eee; }
	.feature .icon.help { background: url(../images/objects.png) no-repeat -216px 0 #eee; }
	.feature .icon.code { background: url(../images/objects.png) no-repeat -288px 0 #eee; }
	.feature .icon.iphone { background: url(../images/objects.png) no-repeat -360px 0 #eee; }
	
	
	/* Action */
	
	.action { display: block; clear: both; width: 100%; padding: 34px 15px; margin: 72px 0; text-align: center; font-size: 20px; line-height: 30px; font-style: italic; color: #aaa; background: url(../images/back_dark.png); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
	.action.light { background: url(../images/back_light.png); }
	.action a { text-decoration: none; }
	

/* #Page Styles
================================================== */


/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		h1, h2, h3, h4, h5, h6 { text-align: center; }
		#logo { float: none; text-align: center; }
		.separator { height: 24px; }
		.separator:before { display: none !important; }
		.purchase { text-align: center; }
		.header-container { width: 100%; }
		#scroll-top { position: relative; float: right; right: 10px;}
		
		/* Seria plugin specific styles */
		
		.seria-about h3, .seria-caption h3 { text-align: left; }
		.seria-about-list { font-size: 13px; }
	
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/