/*
	Style.css by Joshua Gatcke
*/

body{
margin:0;
padding:0;
background:#fff;
color:#666;
font-size:1em;
font-family: Arial, verdana, sans-serif;
font-weight:normal;
line-height:150%;
text-align:center;
background: -moz-linear-gradient(top, #efefef 0%, #ffffff 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#ffffff)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#ffffff',GradientType=0 ); /* ie */
background-attachment: fixed;
}

#notice-print{display:none;}

#wrap{
width:500px;
margin:50px auto 50px auto;
}

#big-me{
float:left;
border:5px solid #fff;
-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
margin:0 0 0 -175px;
-moz-transform:rotate(-15deg);
-webkit-transform:rotate(-15deg);
position: relative;
top:40px;
left:20px;
}

h1{
font-family: 'Josefin Slab', georgia, serif;
font-size:5em;
font-weight:normal;
line-height:120%;
margin: 0 0 0 0;
text-shadow: 0px -1px 2px #ccc;
}

h2{
font-family: 'Josefin Slab', georgia, serif;
font-size:3em;
font-weight:normal;
line-height:120%;
margin:100px 0 0 0;
text-shadow: 0px -1px 2px #ccc;
}

h3{
font-family: 'Josefin Slab', georgia, serif;
font-size:2em;
font-weight:normal;
line-height:120%;
margin:60px 0 0 0;
text-shadow: 0px -1px 2px #ccc;
}

p{
margin:10px 0 25px 0;
padding:0;
text-align: justify;
letter-spacing: normal;
line-height:160%;
}

ul{

}

	li{
	text-align:left;
	}

ul.list-big{
margin:20px 0;
padding:0;
}

.list-big li{
list-style-type:none;
margin:0;
padding:20px 0;
text-align:center;
border-bottom:1px dotted #ccc;
}

	.list-big li h3{margin-top:20px;}
	.list-big li p{text-align:center;}
	
blockquote{
padding:0 0 0 0;
margin:20px 0 30px 0;
}

	blockquote p{
	font-size:0.9em;
	line-height:150%;
	font-style: italic;
	margin:0;
	text-indent: -0.5em;
	}

	blockquote p:first-line{
	font-weight:bold;
	}
	
	blockquote span{
	font-size:0.8em;
	text-align:center;
	}
	
ul#interests{
margin:0;
padding:0;
}

	ul#interests li{
	float:left;
	padding:10px 10px;
	border:1px solid #ccc;
	margin:2px;
	list-style-type:none;
	}
	
#contact{
width:100%;
margin:25px 0;
}

	#contact td{border-bottom:1px dotted #ccc;}
	#contact .right{padding-right:10px;color:#999;}
	
.clearer{font-size:1px;height:1px;clear:both;line-height:1px;}
.right{text-align:right;}
.left{text-align:left;}
.center{text-align:center;}
a img{border:0;}
a,a:active{color:#5DA900;}
a:visited{color:#336200;}
a:hover{}
.pagebreak{page-break-after:always;}

#portfolio{
margin-top:20px;
text-align:center;
}

	#portfolio a{
	display:block;
	border:5px solid #fff;
	margin:0 -270px 60px 0;
	float:left;
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	background:#fff;
	width:350px;
	}

	#portfolio a img{
	border:none;
	width:100%;
	float:left;
	}
	
	.first{position:relative;top:0;}
	.second{position:relative;top:20px;}
	.third{position:relative;top:40px;}
	
.photos{
margin:20px 0;
}

	.photos a{
	display:block;
	float:left;
	background:#fff;
	border:5px solid #fff;
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.2);
	margin:0 -50px 30px 0;
	position:relative;
	top:0;
	-moz-transform:rotate(-5deg);
	-webkit-transform:rotate(-5deg);
	}
	
	.photos a img{
	padding:0;
	float:left;
	}
	
ul.skillz{
margin:0;
padding:0;
border-top:1px dotted #ccc;
}

	ul.skillz li{
	text-align:center;
	list-style-type:none;
	border-bottom:1px dotted #ccc;
	margin:0;
	padding:7px 0;
	font-size:0.9em;
	}
	
#byline{
font-size:0.7em;
color:#999;
line-height:150%;
margin:50px 0;
padding-top:30px;
border-top:1px dotted #ccc;
}

	#byline a{color:#888;}

/*--------------------------TUTORIALS-------------------------*/
code{color:#000;}
code,pre{text-align:left;}
.note{border:1px solid gold;background:lightyellow;padding:10px 20px;font-size:0.8em;line-height:150%;}
.note code{font-size:1.2em;margin-left:10px;}

.tutorial img{
border:2px solid #efefef;
margin:0;
padding:5px;
background:#fff;
}

a.btn{
background: #5DA900; /* old browsers */
background: -moz-linear-gradient(top, #5DA900 0%, #3B8400 100%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5DA900), color-stop(100%,#3B8400)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5DA900', endColorstr='#3B8400',GradientType=0 ); /* ie */
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
border:1px solid #4D8F01;
position:relative;
top:0;
left:0;
padding:10px;
color:#fff;
font-weight: bold;
text-decoration:none;
text-align:center;
text-shadow:1px 1px 2px #4D8F01;
} a.btn:hover{background:#5DA900;}

a.alt{
background: #7DB9E8; /* old browsers */
background: -moz-linear-gradient(top, #7DB9E8 0%, #0283E5 98%); /* firefox */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7DB9E8), color-stop(98%,#0283E5)); /* webkit */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7DB9E8', endColorstr='#0283E5',GradientType=0 ); /* ie */
text-shadow:1px 1px 2px #0283E5;
border:1px solid #0283E5;
} a.alt:hover{background:#7DB9E8;}

.tutorial table{
width:100%;
border-collapse: collapse;
}

	.tutorial td{
	padding:5px;
	border-bottom: 1px dotted #ccc;
	font-size:0.9em;
	}
	
	.tutorial td.right{
	border-right:1px dotted #ccc;
	}