/*
Theme Name: dev-ac
Theme URI: http://underscores.me/
Author: Andrew Cobley
Author URI: http://underscores.me/
Description: Description
Version: 1.0
License: GNU General Public License
License URI: license.txt
Text Domain: dev-ac
Domain Path: /languages/
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

 dev-ac is based on Underscores http://underscores.me/, (C) 2012-2013 Automattic, Inc.

Resetting and rebuilding styles have been helped along thanks to the fine work of
Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
and Blueprint http://www.blueprintcss.org/
*/
/* --------------
   GENERAL STYLES
   -------------- */

body
{
	background: #f0f0f0;
	font-family: 'Open Sans', sans-serif;
	font-size: 100%;
	color: #1d1d14;
}


p
{
	font-size: 0.875em; /* 14px / 16px */
	line-height: 1.7142857143em; /* 24px / 14px */
	text-align: justify;
}


h1
{
	margin: 0;
	font-size: 1em;
	font-weight: 600;
	float: left;
}

span.site-title-detail
{
	transition: color 1s ease;
}

a.home:hover span.site-title-detail
{
	color: gold;
}

h2, h3
{
	margin: 2.5em 0 1em 0;	
	font-size: 1em;
	font-weight: 600;
	text-transform: uppercase;
}

h3:first-child
{
	margin: 0 0 1em 0;
}

h2
{
	margin: 3em 0;
	font-weight: 400;
	color: #c0c0c6;
}

h5
{
	margin: 0;	
	font-size: 0.625em; /* 10px / 16px */
	font-weight: 400;
	line-height: 2.1em; /* 21px / 10px */
	text-transform: uppercase;
	color: #1d1d14;
	opacity: 0.95;
}

a
{
	color: #1d1d14;
	text-decoration: none;
}

a:visited
{
	color: #1d1d14;
}

p a
{
	font-weight: 600;
}

p a:hover
{
	text-decoration: underline;
}

article:hover h3 a
{
	border-bottom: 2px solid #e6e0e6;
}

article:hover h3 a:hover
{
	border-bottom: 2px solid #1d1d14;
	transition: border-color 2s ease;
}

hr
{
	border: 0;
	height: 1px;
	background: #c6c0c6;
}

img.logo
{
	margin: 0 auto;
	display: block;
}

img.symbol
{
	margin: 0;
	width: 3em;
	height: 3em;
}

img.about-symbol
{
	margin: 0;
	width: 2.5em;
	height: 2.5em;
}

section.main, section.project-archive, article
{
	margin: 1.5em auto;
	max-width: 460px;
}

article.project-summary
{
	min-height: 8em;
}

header
{
	margin: 0;
	padding: 0;
	width: 100%;
}

nav
{
	margin: 0;
	padding: 0;
	display: block;
	float: right;
}

nav ul
{
	margin: 0;
	padding: 0;
	float: right;
	list-style-type: none;
}

nav li
{
	margin-left: 2em;
	font-size: 0.875em;
	float: left;
}

nav#site-navigation li
{
	margin-top: 0.5em;
	font-size: 0.75em; /* 12px / 16px */
	line-height: 2em; /* 24px / 12px */
	text-transform: uppercase;
	letter-spacing: 1px;
	border-color: rgba(0,0,0,0);
}

nav#site-navigation li:hover
{
	border-bottom: 2px solid gold;
	transition: border-color 1s ease;
}

nav#site-navigation li.current-menu-item
{
	border-bottom: 2px solid black;
}

header.feature, header.project-archive-header
{
	margin: 2em 0 2em 0;
}

header.gambit
{
	margin: 0.5em auto;
}

blockquote
{
	margin: 2em 0 2em 0;
	font-size: 1.375em; /* 22px / 16px */
	text-align: center;
}

span.quote-start
{
	margin-top: -0.0em;
	margin-left: -0.5em;
	/*float: left;*/
}

span.quote-start, span.quote-finish
{
	font-size: 1.27272727em; /* 28px / 22px */
	line-height: 1em;
	color: #bcbcbc;
	transition: color 1.5s ease;
}

blockquote footer 
{
	margin: 0;
	font-size: 0.75em;
	color: #1e1e14;
}

blockquote:hover span.quote-start, blockquote:hover span.quote-finish
{
	color: gold;
}

section.featured-project
{
	background: #e6e6e6;
	display: block;
}

section.focus
{
	margin: 1em auto;
}

ul.focus-list
{
	margin: 0;
	padding: 0;
	overflow: hidden;
	box-sizing: border-box;
}

li.focus-item
{
	margin: 0;
	list-style-type: none;
	text-align: center;
	box-sizing: border-box;
}

li.focus-item h3, li.focus-item p
{
	margin: 0;
}

section.buttons
{
	margin: 3em auto;
	text-align: center;
}

.button, .wpcf7 input.wpcf7-submit, .button:visited
{
	padding: 0.5em 1em;

	font-size: 1em;
	text-align: center;
	color: #e9e9e9;
	text-transform: uppercase;

	cursor: pointer;
	background-color: rgba(30,30,30,0.8);
	border-radius: 4px;
	-moz-border-radius: 4px;
	box-shadow: 0px 1px 2px 0px rgba(20, 20, 20, 0.5);
	-webkit-box-shadow: 0px 1px 2px 0px rgba(20, 20, 20, 0.5);
}

.button:hover, .wpcf7 input.wpcf7-submit:hover
{
	background-color: rgba(20,20,20,0.9) !important;
}

.yellow:hover
{
	color: rgba(255,234,54,1.0);
}

.center
{
	margin: 0 auto;
}

#nav-below
{
	margin: 2em auto 0 auto;
	float: none;
	display: block;
	overflow: hidden;
}

#nav-below h1
{
	display: none;
}

.nav-previous
{
	float: left;
}

.nav-next
{
	float: right;
}

footer
{
	margin: 3em 0 2em 0;
	padding: 0;
	width: 100%;
}

/* Contact Form 7 Styling */

ul#contact
{
	padding: 1em 2em;

	border-radius: 4px;
	-moz-border-radius: 4px;
}

ul#contact li
{
	margin: 1em auto;
	list-style-type: none;
	font-size: 0.875em; /* 14px / 16px */
}

ul#contact li:last-child

{
	text-align: center;
}

.wpcf7 input.wpcf7-text, .wpcf7 textarea.wpcf7-textarea, .wpcf7 input.wpcf7-quiz
{
	width: 100%;
	box-sizing: border-box;

	border: 1px solid #999999;
	background-color: #f6f6f6;
}

.label, .wpcf7-quiz-label
{
	line-height: 2em;
}

.wpcf7 input.wpcf7-submit
{
	border: none;
	/* See .button class */
}

.wpcf7-response-output
{
	color: rgba(255,234,54,0.8);
	background: #1e1e14;
}

.wpcf7-not-valid-tip
{
	color: rgba(255,234,54,0.8);
	background: #1e1e14 !important;
	border: 2px solid rgba(255,234,54,0.8) !important;
}



section.legal
{
	text-align: center;
	font-size: 0.75em; /* 12px / 16px */
}

@media screen and (min-width: 640px)
{

	#container
	{
		margin: 0px auto;
	}


	/* HEADER > 640px */

	header.main
	{
		margin: 0 auto;
		height: 2.5em;
		line-height: 2.5em;
		position: relative;
		z-index: 2;
	}

	header.gambit, section.buttons
	{
		width: 460px;
	}

	/* FEATURED PROJECT */

	section.featured-project
	{
		width: 100%;
		height: 28.75em;
	}

	section.featured-project-info
	{
		padding: 30px 0;
		width: 37%;
		float: left;
		text-align: center;
	}

	section.featured-project-info img.logo
	{
		margin: 0 auto;
		width: 80%;
		height: auto;
	}

	section.featured-project-info p.tagline
	{
		margin: 2em 0 2.5em 0;
		font-size: 1.125em; /* 18px / 16px */
	}

	section.featured-project-image
	{
		position: relative;
		width: 61%; /*69.23076923%;*/
		height: 28.75em;
		float: right;
	}

	section.featured-project-image img.screenshot
	{
		position: absolute;
		top: 0;
		bottom: 0;
		margin: auto;
		width: 100%;
		height: auto;
	}


	/* FEATURE > 640px */

	section.feature
	{
		margin: 0 auto;
		padding-bottom: 1.5em;
		width: 100%;

	}

	header.feature, header.project-archive-header
	{
		margin: 2em 0 2em 0;
	}

	section.feature-main
	{
		margin: 0;
		padding: 0;
	}

	nav#nav-below
	{
		max-width: 460px;
	}


	/* FOOTER > 640px */

	section.about, section.contact, section.legal
	{
		margin: 1.5em auto;
		max-width: 460px;
	}

}


@media screen and (min-width: 780px)
{

	#container
	{
		width: 100%;
		min-width: 780px;
		/*max-width: 960px; /* 780px (960px w/feature) */
	}	

	header.main, section.focus
	{
		width: 780px;
	}

	.inner-wrap
	{
		position: relative;
		margin: 0 auto;
		width: 780px;
		overflow: hidden;
	}

	section.focus
	{
		margin-bottom: 3em;
	}

	li.focus-item
	{
		width: 240px;
		float: left;
	}

	li.focus-item:first-child
	{
		margin-right: 30px;
	}

	li.focus-item:last-child
	{
		margin-left: 30px;
	}

	li.focus-item div.image-wrap
	{
		position: relative;
		width: 240px;
		height: 160px;
	}

	div.image-wrap img
	{
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
		width: auto;
		max-width: 238px;
		height: auto;
		max-height: 154px;
	}

	img.side
	{
		margin-top: -1.8em;
		margin-left: -4.25em;
		padding-bottom: 1em;
		float: left;
		text-align: right;
	}

	section.project-info, section.note-info
	{
		margin-left: -160px;
		padding-bottom: 1em;
		width: 140px;
		float: left;
		text-align: right;
	}


	section.project-info h5.status
	{
		margin-top: 1.4em; /* 14px / 10px */
	}

	section.project-info h5.tools
	{
		margin-top: 2.1em;
	}

	section.project-info ul
	{
		margin: 0;
		list-style-type: none;
	}

	section.project-info p, section.project-info li
	{
		margin: 0;
		font-size: 0.75em; /* 12px / 16px */
		line-height: 1.75em; /* 21px / 12px */
		font-weight: 400;
		float: none;
	}

	section.project-content, section.note-content
	{
		padding-top: 1.8em;
	}


	/* FOOTER > 780px */

	footer.main
	{
		width: 780px;
	}

	aside.about-symbol
	{
		margin: 18px 0 0 -74px;
		padding: 0.25em;
		width: 48px;
		height: 48px;
		float: left;
		text-align: right;
	}

}

@media screen and (min-width: 640px) and (max-width: 780px)
{

	#container
	{
		width: 98%;
		min-width: 640px;
		max-width: 780px;
	}

	header.main
	{
		width: 100%;
	}

	footer.main
	{
		width: 100%;
	}

}

@media screen and (max-width: 780px)
{

	article.project-summary
	{
		margin-bottom: 4em;
		text-align: center;
	}

	article.project-summary h3
	{
		margin: 0;
		font-size: 1.5em; /* 16px / 16px */
	}

	img.side
	{
		margin: 0 auto;
		padding-bottom: 0.5em;
		display: block;
	}	

	section.project-info
	{
		margin: 0 0 1em 0;
		width: 100%;
		float: left;
		text-align: center;
	}

	section.project-info h5
	{
		margin: 1.4em 0 0 0; /* 14px / 10px */
	}

	section.project-info h5.first
	{
		margin: 1.0em 0 0 0; /* 10px / 10px */
	}

	section.project-info ul
	{
		margin: 0 auto;
		padding: 0;
		height: 1.5em;
		float: none;
		text-align: center;
	}

	section.project-info p, p.small, section.project-info li
	{
		margin: 0;
		font-size: 0.75em; /* 12px / 16px */
		line-height: 1.75em; /* 21px / 12px */
		font-weight: 400;
	}

	section.project-info li
	{
		padding: 0 0.5em;
		display: inline-block;
		float: none;
		background: #969096;
	}



	/* FOOTER < 780px */

	aside.about-symbol
	{
		margin: 21px 0 -14px 0;
		width: 100%;
		height: 48px;
		text-align: center;
	}
}


@media screen and (max-width: 640px)
{
	body
	{
		padding: 0 20px;
	}

	#container
	{
		margin: 10px auto;
		/*width: 96%;*/
	}

	header.main
	{
		margin: 0;
		width: 100%;
	}

	h1
	{
		font-size: 3em;
		font-weight: 600;
	}

	h2
	{
		margin: 2em 0;
		font-size: 2em;
	}

	h1, h2
	{
		text-align: center;
		float: none;
	}

	span.site-title-detail
	{
		color: gold;
	}

	nav, nav ul, nav ul li
	{
		float: none;
	}

	nav ul
	{
		text-align: center;
	}

	nav ul li
	{
		margin: 0 1em;
		padding: 0;
		font-size: 1.5em;
		display: inline-block;
	}

	nav ul li a
	{
		font-size: 1.25em;
	}

	section.featured-project
	{
		margin: 0 -20px 0 -20px;
		padding: 0 20px 20px 20px;
	}

	.inner-wrap
	{

	}

	section.featured-project-info
	{
		width: 100%;
		margin: 1em auto;
	}

	section.featured-project-info img.logo
	{
		max-width: 40%;
		height: auto;
	}

	section.featured-project-info p.tagline
	{
		text-align: center;
	}

	section.featured-project-info .button
	{
		margin: 0 auto;
		width: 10em;
		display: block;
	}

	section.featured-project-image
	{
		margin: 1em 0;
		width: 100%;
	}

	section.featured-project-image img.screenshot
	{
		margin: 0 auto;
		max-width: 82%;
		height: auto;
		display: block;
	}

	section.feature
	{
		margin: 0;
		padding: 0;
		width: 100%;
	}

	.logo
	{
		max-width: 90%;
		height: auto;
	}

	li.focus-item:not(:last-child)
	{
		margin-bottom: 3em;
	}

	li.focus-item img
	{
		width: 240px;
		height: 160px;
	}

	li.focus-item a p
	{
		margin: 0 auto;
		width: 18em;
	}

	article.project-summary p
	{
		margin: 0.5em 2em;
		text-align: left;
	}

	section.project-info p
	{
		margin: 0;
		text-align: center;
	}

	section.note-content
	{
		margin: 4em 0;
	}

}