/*
	Flexible Color Schemes with RGBa
	Global Styles
	Zach Dunn (www.buildinternet.com) / Spring 2010
*/

/*
	Color Palette
	-----------------------
	Teal 			#208274
	Key Lime 		#DEF088
	Burnt Orange	#C45D2B
	Gold			#C89531
	Cool Blue		#7491D3
*/

*{margin:0; outline:0; padding:0; border:0;}

	body{background:#DEF088;}
	
	#wrapper{margin:0px auto 20px auto; width:960px;}
	
	/* Fonts & Typography */
		p, h1, h2{font-family:Arial, 'Helvetica Neue', Helvetica, sans-serif;}
			
			h1{text-align:center; margin:20px 0px;}
			h2{padding:20px 0px 10px 20px;}
			p{font-size:12px; padding:20px;}
			#wrapper > p, h1{text-shadow:0px 1px 0px rgba(255,255,255,.5); color:rgba(0,0,0, .75); text-align:center;}
				#wrapper > p a{color: rgba(255,255,255, .9);}	
	
	/* Page Structure */
	#main{clear:both; width:960px;}
		#content{float:left; width:650px; overflow:hidden; height:500px;}
			#content p{line-height:1.6em; padding:0px 20px 15px 20px;}
		#sidebar{float:left; width:250px; height:100%; margin-left:20px}
			#sidebar div{margin-bottom:20px; height:225px;}
			#sidebar p{line-height:1.6em;}
		#footer{width:auto; clear:both; text-align:center; margin-top:10px;}
		
	.clear{clear:both; display:block; height:8px;}
	
/* 
	--------------------------------------------------------
	This is the beginning of what you'll probably care about
	--------------------------------------------------------
*/
	
	/* Generic box shadow */
	.box{-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .25); -moz-box-shadow: 0px 0px 5px rgba(0,0,0,.25);}
	
	/* Values for white base */
	.light{background: rgba(255,255,255, .3); border:1px solid rgba(255,255,255,.45);}
	.lighter{background: rgba(255,255,255, .6); border:1px solid rgba(255,255,255,.45);}
		.light p{text-shadow:0px 1px 0px rgba(255,255,255, .5);}
		.lighter p{text-shadow:0px 1px 0px rgba(255,255,255, .7);}
		.light a, .lighter a{color: rgba(0, 0, 0, .9);}
		
	/* Values for black base */
	.dark{background: rgba(0, 0, 0, .3); border:1px solid rgba(0, 0, 0,.2);}
	.darker{background: rgba(0, 0, 0, .6); border:1px solid rgba(0, 0, 0,.2);}
		.dark p{color:#FAFAFA; text-shadow:0px 1px 0px rgba(255,255,255, .2);}
		.darker p{color:#FAFAFA; text-shadow:0px 1px 0px rgba(255,255,255, .5);}
		.dark a, .darker a{color: rgba(255,255,255, .9);}
	
/* 
	--------------------------------------------------------
	Everything below here is for color switcher only.
	--------------------------------------------------------
*/
	.colorchange{background:#222; width:240px; margin:0 auto; color:#FFF; text-align:center; -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .5); -moz-box-shadow: 0px 0px 5px rgba(0,0,0, .5); clear:both; border-bottom:1px solid rgba(0,0,0,.8);}

		ul.colorlist{list-style:none; background:#222; padding:0px 20px 20px 20px; overflow:hidden;}
			.colorlist li{float:left; display:inline; width:40px; width:40px; height:40px; overflow:hidden; text-indent:-9999px;}
				.colorlist li a{display:block; height:100%;}
				
			/* Individual Colors */
			.teal{background:#208274;}
			.keylime{background:#DEF088;}
			.orange{background:#C45D2B;}
			.coolblue{background:#C89531;}
			.gold{background:#7491D3;}