/*Written by Dan Mandle for http://dan.mandle.me*/

* {
	margin: 0;
	padding: 0;
}

/*standard tags*/
body {
	font-family:"Trebuchet MS", Helvetica, Arial, sans-serif;
	background:#8b9190;
	width:1000px;
	font-size:13px;
	margin:auto;
	}
body {
	background:url(images/bgs/textures/lines.jpg) repeat;
}
/* images/bgs/textures/blue_diagnals.jpg
   images/bgs/textures/circles.jpg
   images/bgs/textures/dark_lines.jpg
   images/bgs/textures/diagnal_lines.jpg
   images/bgs/textures/lines.jpg
   images/bgs/textures/lotsasquares.jpg
   images/bgs/textures/tiles.jpg
   images/bgs/textures/yellow_blue_tiles.jpg
   images/bgs/texture.jpg
 */

p {
	margin:5px 0px;
}

a {
	color:#666;
}
a:hover {
	color:#000
}

h1 {
	font-size:x-large;
}

h2 {
	font-size:larger;
}

/*navigation*/
#nav {
	position:relative;
	z-index:100;
	float:right;
	margin:10px 0px -5px 0px;
	color:#FFF;
	font-size:24px;
}
#nav ul{
	list-style:none;
}
#nav ul li{
	float:left;
	padding:0px 10px;
	
	filter:alpha(opacity=75);
	-moz-opacity:0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}
#nav ul li:hover{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}
#nav a {
	text-decoration:none;
	color:#fff;
}
#nav a:visited {
	color:#fff;
}

.list li{
	list-style: disc;
	margin-left: 20px;
}

/*header text*/
#header{
	clear:both;
	font-size:143px;
	color:#FFF;
	z-index:-100;
	margin:0px 0px -45px 5px;
	
	filter:alpha(opacity=60);
	-moz-opacity:0.6;
	-khtml-opacity: 0.6;
	opacity: 0.60;
}
	#header p{
	font-size:14px}

/*main content section*/
#content {
	position:relative;
	margin-bottom:20px;
	z-index:1;
	color:#000;
	font-size:13px;
	width:100%;
	/*If you're reading this, know that I tried really hard to make the box background semitransparent by changing the opcaity in the CSS but it affected the child classes and I couldn't find a way around it so 1px background it is!*/
	background:url(images/1px75.png);
	padding:30px 10px 10px 10px;
	
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	}

#content p {
	
}

/*Resume Page*/
.resume	{
	width:800px;
	margin:auto;
	font-family:"Calibri","Trebuchet MS", Helvetica, Arial, sans-serif;
}
.resume .topRight{
	text-align: right;
	vertical-align: middle;
	height: 75px;
}
.resume .topRight p{
	padding-top: .5em;
}
.resume	p	{
	margin: 0 0 0 15px;
}

.resume h2 {
	font-size: 16pt;
	font-weight: bold;
	margin-top: 10px;

}
.resume h3 {
	font-weight: normal;
	font-size: 14pt;
	margin-left: 15px;
	margin-top: 10px;
}

.resume .skillsList{
	width:110px;
	float: left;
	padding-left: 15px;
}

.resume .skillsItems{

}

.resume .desc	{
	display:block;
	margin-left:2em;
}
.resume .bigger	{
	font-size:20px;
}
.resume .name	{
	float:left;
	font-size: 36pt;
}
resume a {
	color:#000
}
.resume a:hover	{
	color:#999
}

#bio {
	position:absolute;
	left:450px;
	right:140px;
	top:170px;
	float:left;
}

/*Projects Page*/
.proj {
	background-color:#fff;
	float:left;
	width:300px;
	padding:10px;
	margin:5px;
	position:relative;

	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
.proj img {
	height:300px;
	width:300px;
}
.proj object {
	z-index:-50;
}
.proj_grp{
	padding-top:30px;
	clear:both;
}

/*----------- Contact page --------*/
#postcard {
	background:url(images/postcard.png);
	margin:auto;
	margin-top:20px;
	height:525px;
	width:775px;
	padding:10px;
	background-repeat:no-repeat;
}
#postmark {
	position:absolute;
	right: 170px;
	top:110px;
}
#postmarked {
	position:absolute;
	top:30px;
	left:24px;
	font-size:16px;
}

#postcard #address {
	position:absolute;
	right:150px;
	top:258px;
	height:300px;
	width:310px;
	font-size:20px;
	line-height:2.7em;
}
#social img{
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
	
	margin-right:15px;
}
#social img:hover{
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
}
/*-------form-------*/
#postcard .error, #postcard .accept {
	position:absolute;
	left:125px;
	top:30px;
	margin:40px 15px 0 0;
}
#postcard .error {
	color:#F00;
	font-weight:bold;
}

#postcard .accept {
	color:#0C0;
}

fieldset {
  margin-bottom: 10px;
  width:350px;
  margin-top:32px;
}
fieldset ol {
  margin: 0;
  padding: 0;
}
fieldset li {
  list-style: none;
  padding: 5px;
  margin: 0;
}
legend {
  padding: 0 2px;
  font-weight: bold;
}
label {
  display: inline-block;
  line-height: 1.8;
  vertical-align: top;
  width:120px;
}
input, select {
	width:200px;
}

input, textarea, select {
  border:1px solid #aaaaaa;
  padding:2px;
  background:#ffffff url(images/inputBg.gif) top left no-repeat;
  margin-top:2px;
}

input.checkbox {
  width:15px;
  background:none;
  border:0;
}

input.radio_button {
  width:15px;
  background:none;
  border:0;
}

input:hover, textarea:hover, select:hover {
  border:1px solid #888888;
}

input:active, textarea:active, select:active {
  border:1px solid #888888;
}

input.submit {
	padding:10px;
	width:auto;
}

input.submit:hover {
  
  cursor: pointer;
}

textarea {
  width:200px;
  height: 200px;
}

textarea.deep {
  height:350px;
}

textarea.shallow {
  height:50px;
}

.LV_invalid {
	color:#F00;
	font-weight:bold;
	display:block;
}
.LV_valid {
	display:none;
}
.ver {
	border:1px solid #aaaaaa;}
/* ------------------------------------------
PROGRESSIVE ENHANCEMENT: PURE CSS SPEECH BUBBLES
by Nicolas Gallagher
- http://nicolasgallagher.com/progressive-enhancement-pure-css-speech-bubbles/

http://nicolasgallagher.com
http://twitter.com/necolas

Created: 02 March 2010
Version: 1.01

Dual licensed under MIT and GNU GPLv2 © Nicolas Gallagher 
------------------------------------------ */
/* Rectangle-border style with curve
------------------------------------------ */

.rectangle-speech-border {
	position:relative; 
	padding:20px 15px; 
	margin:1em 0 3em;
	border:10px solid #5a8f00; 
	/*text-align:center;
	color:#333;*/
	background:#5a8f00; 

	/* css3 */
	-moz-border-radius:20px;
	-webkit-border-radius:20px;
	border-radius:20px;
}

.rectangle-speech-border a {
	color:#fff;
}

/* creates larger curve */
.rectangle-speech-border:before {
	content:"\00a0"; 
	position:absolute; 
	z-index:999; 
	bottom:-40px; 
	left:50px; 
	width:50px; 
	height:30px;
	border-style:solid; 
	border-width:0 10px 10px 0; 
	border-color:#5a8f00; 
	background:transparent;

	/* css3 */
	-moz-border-radius-bottomright:80px 50px;
	-webkit-border-bottom-right-radius:80px 50px;
	border-bottom-right-radius:80px 50px;
}

/* creates smaller curve */
.rectangle-speech-border:after {
	content:"\00a0"; 
	position:absolute; 
	z-index:10; 
	bottom:-40px; 
	left:50px; 
	width:20px; 
	height:30px; 
	border-style:solid; 
	border-width:0 10px 10px 0; 
	border-color:#5a8f00; 
	background:transparent;

	/* css3 */
	-moz-border-radius-bottomright:40px 50px; 
	-webkit-border-bottom-right-radius:40px 50px; 
	border-bottom-right-radius:40px 50px; 
}

/* creates a small circle to produce a rounded point where the two curves meet */
.rectangle-speech-border>:first-child:before {
	content:"\00a0"; 
	position:absolute; 
	z-index:1; 
	bottom:-40px; 
	left:45px; 
	width:10px; 
	height:10px;
	background:#5a8f00;

	/* css3 */
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
}

/* creates a white rectangle to cover part of the oval border*/
.rectangle-speech-border>:first-child:after {
	content:"\00a0"; 
	position:absolute; 
	z-index:1; 
	bottom:-10px; 
	left:76px; 
	width:24px; 
	height:15px; 
	/*background:#fff; /* to get rid of the box line in teh speach break out */
}