@import url('reset.css');
@import url("fonts/League-Gothic/stylesheet.css");

/**!
 * weareabq
 *
 * Main stylesheet for weareabq. Provides basic styles. Plugin specific 
 * styles exist in seperate individual stylesheets. IE and other fallback
 * styles are in other stylesheets.
 *
 * @project		weareabq
 * @version		1.0
 * @package		Main Stylesheet
 * @author		Tony Dewan ( tony{at}abeautifulquestion.com )
 * @media		Screen
 * @copyright	copyright 2010
 *
 * @colordef	#FFFFFF; white
 */


/* ---( globals )------------------------------- */ /** @section Globals */

body{
	font: 14px/1.7 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', sans-serif;
	color: #fff;
	background-color: #1b1b1b;}
	
	.cssgradients body{
		background: rgb(27,27,27) -webkit-gradient(
		    linear,
		    left top,
		    left bottom,
		    color-stop(0.19, rgb(0,0,0)),
		    color-stop(0.61, rgb(27,27,27))
		) top left no-repeat;}
	
#container{
	width: 800px;
	position: relative;
	margin: 0 auto;}
	
strong{font-weight: bold;}
em{font-style:italic;}
	

	
	
/* ---( header )------------------------------- */ /** @section Header */

header{
	display: block;
	width: 100%;
	margin: 120px 0 70px;
	padding: 10px 5px;
	font: 46px/60px 'LeagueGothicRegular',sans-serif;
	border-top: 1px solid #929392;
	border-bottom: 1px solid #929392;}
	
	header h1{
		position: absolute;
		top: -50px;
		left: 545px;
		-moz-user-select: -moz-none;
		-webkit-user-select: none;
		user-select: none;}
		
/* ---( content )------------------------------- */ /** @section Content */

#content p{
	float: left;
	width: 372px;
	padding-right: 55px;}
	
#content p:nth-child(odd){
	padding: 0;}
	
#content h2{
	font-weight: bold;
	color: rgba(255,255,255,0.5);
	
	cursor: default;
	-moz-user-select: -moz-none;
	-webkit-user-select: none;
	user-select: none;}
	
	
	/* ---( content >> contact )------------------------------- */ /** @section Content @subsection Contact */
	
	#contact{
		position: relative;
		float: left;
		width: 800px;		
		margin: 75px 0 0;
		overflow: hidden;}
		
	#contact .placeholder{
		display: block;
		padding: 10px;
		cursor: default;
		top: 24px;
		position: absolute;}
		
			#contact .placeholder span{display: none;}
			#contact .placeholder:hover span{display: inline;}
		
	#contact .button{
		display: block;
		border: none;
		text-transform: uppercase;
		font: 24px 'LeagueGothicRegular',sans-serif;
		position: absolute;
		right: 10px;
/*		top: 35px;*/
		bottom: 5px;
		background: transparent;
		color: #fff;
		cursor: pointer;
		text-shadow: 0 1px 1px rgba(0,0,0,0.3);}
		
		.csstransitions #contact .button{
			-webkit-transition: opacity .25s linear;
			-moz-transition: opacity .25s linear;	/* someday */
			-0-transition: opacity .25s linear;  	/* someday */
			transition: opacity .25s linear;} 		/* someday */
	
		#contact .button:hover,#contact .button[disabled]{
			opacity: 0.25;}
			
			#contact .button[disabled]{cursor: default;}
	
	#contact form{
		background: rgba(255,255,255,0.1);}
		
		.no-rgba #contact form{
			background: #434343;}
	
	#contact #message{
		border: none;
		font: 14px/1.4 'Lucida Grande', 'Lucida Sans', 'Lucida Sans Unicode', sans-serif;
		color: rgba(255,255,255,1);
		width: 730px;
		margin: 12px 0 0 9px;
		border: none;
		background: transparent;}
		
	#contact .msg{
		z-index: 1;
		position: absolute;
		width: 790px;
		padding: 10px 5px;
		font-style: italic;
		font-size: 11px;
		font-weight: bold;
		cursor: default;
		top: 50%;
		background: rgba(39,57,70,0.9);
		text-shadow: 0 1px 1px rgba(0,0,0,0.2);}
		
		#contact .msg.error{
			right: 0;
			top: 65px;
			padding: 5px 10px;
			width: auto;
			cursor: pointer;
			background: rgba(255,0,0,0.3);}
		
		.no-rbga #contact .msg.error{
			background: #A12020;}

	

/* ---( footer )------------------------------- */ /** @section Footer */
footer{
	display: block;
	clear: both;
	font-size: 10px;
	color: rgba(255,255,255,.5);
	padding: 40px 0 50px 0;}
	
	footer #quote{
		display: block;
		font-size: 12px;
		float: right;
		cursor: default;
		text-align: right;}
		
		#quote cite{
			display: block;
			line-height: 1.0;
			font-style: italic;}
			
		#quote blockquote:before{content: '“';}
		#quote blockquote:after{content: '”';}
		
		.csstransitions #quote em{
			-webkit-transition: color .25s linear;
			-moz-transition: color .25s linear;	/* someday */
			-0-transition: color .25s linear;  	/* someday */
			transition: color .25s linear;} 	/* someday */
		
		#quote:hover em{
			color: rgba(255,255,255,.9);}