/*  Font Family Information
	font-family: 'Amatic SC', cursive;
	font-family: 'Crete Round', serif;
	font-family: 'Cantarell', sans-serif; 
	
	Color Information
	Teal - #0596AB;
	Green - #2A9D42;
	Gray - #464646;
	Red - #F16C5A;
	Orange - #2A9D42;  */
	
body {
	margin: 0px;
	padding: 0px;
	font-family: 'Cantarell', sans-serif; }
	
#overlay {
	height: 110px;
	width: 100%;
	background: url('images/base/pattern-top.png') repeat-x;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 9999;}
	
	
/* === Universal === */
h1, h2, h3 { 
	font-weight: normal;
	margin: 0 0 10px 0; }
h1 { }
h2 {
	font-family: 'Crete Round', serif;
	color: #464646;
	display: block;
	font-size: 24px;
	margin: 0px 0px 15px 0px;
	letter-spacing: .025em; }
h3 { }
p { 
	margin: 0 0 10px 0;
	font-family: 'Cantarell', sans-serif;
	font-size: 13px;
	color: #464646;
	line-height: 20px;}
a { 
	text-decoration: none;}
	
	
/* === Left Sidebar === */
#sidebar {
	width: 260px;
	text-align: right;
	padding: 0px 0px 0px 30px;
	margin-right: 30px;
	position: fixed;
	top: 140px;
	left: 100px;
	z-index: 100;}
.logo { 
	padding: 5px 30px 8px 0px;
	background: url('images/base/logo-border.png') no-repeat right top;}
.logo a { 
	font-family: 'Amatic SC', cursive;
	font-size: 70px;
	color: #464646;
	letter-spacing: .06em;
	line-height: 62px;}
.teal { 
	color: #0596AB;}
	
/* Sidebar Navigation */
nav { 
	margin: 10px 38px 0px 0px;}
nav ul {
	list-style-type: none; }
nav ul { 
	margin: 0px;
	padding: 0px;}
/*nav ul > li {
	margin: 18px 0px; }
nav ul > li > a { 
	font-family: 'Crete Round', serif;
	color: #464646;
	font-size: 20px;
	letter-spacing: .02em;}
nav ul > li > a:hover { 
	color: #F16C5A;}*/
nav ul > li {}
nav ul > li > span {
	font-family: 'Crete Round', serif;
	color: #464646;
	font-size: 14px;
	letter-spacing: .04em;
	display: block;
	margin: 10px 0px 0px 0px;
	padding: 0px 2px;}
nav ul > li > a { 
	font-family: 'Cantarell', serif;
	color: #999999;
	font-size: 12px;
	letter-spacing: .02em;
	padding: 0px 2px;}
nav ul > li > a:hover,
nav ul > li.active > a { 
	color: #363636;
	background: #95DFD2;}
	
nav a#about {
	font-family: 'Crete Round', serif;
	color: #363636;
	font-size: 14px;
	letter-spacing: .04em;
	display: inline-block;
	margin: 30px 0px 0px 0px;
	padding: 0px 2px;}
nav a#about:hover {
	background: #95DFD2;}
	


/* === Main Content === */	
section { 
	width: 700px;
	margin: 0px 0px 0px 0px;
	position: relative;
	top: 140px;
	left: 420px;
	z-index: 100;}
	
	
/* === Home Page === */
#grid {}

#grid .project {
	width: 200px;
	float: left;
	margin: 0px 30px 20px 0px;}
#grid .project img {
	border: 1px dotted #DDDDDD;
	/*padding: 4px;
	background: #EEEEEE;*/}
#grid .project span {
	display: block;
	text-align: center;}
#grid .project .title em {
	font-family: 'Crete Round',serif;
	font-size: 14px;
	font-style: normal;
	letter-spacing: .02em;
	color: #363636;
	padding: 2px 4px;}
#grid .project .description {
	font-family: 'Cantarell', sans-serif;
	font-size: 12px;
	font-style: italic;
	color: #999999;}
#grid .project:hover .title em {
	background: #95DFD2;}
#grid .project:hover img {
	border: 1px dotted #95DFD2;}
	
	
/* === Slider === */
#slideshow-nav {
	font-size: 13px;
	margin: 20px 0px 10px;}
#slideshow-nav a {
	cursor: pointer;
	color: #363636;
	font-style: italic;
	font-size: 13px;
	padding: 0px 2px;}
#slideshow-nav #clicker_r {
	padding-left: 0px;}
#slideshow-nav a:hover {
	color: #999999;}
	
/* Image Slider */
.slider {
	margin: 0px;
	padding: 0px;}
.slider span {
	font-family: 'Crete Round', serif;
	letter-spacing: .02em;
	font-size: 18px;
	padding: 10px 0px 10px 2px;}

/* Video Slider */
#slide_frame {
    height: auto;
    overflow: hidden;
    position: relative;
    width: 700px;
    height: 565px;
    border: 1px dotted #DDDDDD;}
#slide_block {
    position: relative;}
.slide_unit {
	float: left;
    width: 700px;
    height: 565px;}
.slide_unit span {
	font-family: 'Crete Round', serif;
	letter-spacing: .02em;
	font-size: 18px;
	padding: 10px 0px 10px 10px;}



/* === Single Project Page === */
#single {}
#single .title {
	font-family: 'Crete Round', serif;
	font-size: 24px;
	display: block;
	letter-spacing: .04em;
	color: #363636;
	margin: 0px 0px 15px 0px;}
#single .title a {
	font-family: 'Cantarell', sans-serif;
	font-size: 13px;
	letter-spacing: .01em;
	display: inline-block;
	float: right;
	color: #999999;
	font-style: italic;
	position: relative;
	top: 9px;
	padding: 0px 2px 0px 2px;}
#single .title a:hover {
	background: #95DFD2;
	color: #FFFFFF;}
#single p {
	width: 600px;}
#single p a {
	color: #363636;
	font-style: italic;}
#single p a:hover {
	color: #999999;}


article {
	padding-bottom: 20px;}
	
	
	
/* === About Page === */
.callout {	
	margin: 0px 0px 35px 0px;}
.callout span {
	display: block;
	font-family: 'Crete Round', serif;
	font-size: 30px;
	letter-spacing: .03em;
	line-height: 30px;
	margin: 0px 0px 21px 0px;}
.callout span.orange {
	color: #464646;}
.callout span.blue {
	color: #464646;}
.callout span.pink {
	color: #0596AB;}

#about p {}
#about a {
	color: #363636;
	font-style: italic;}
#about a:hover {
	color: #999999;}
#about #julia {
	float: right;
	margin: 0px 0px 10px 30px;}



/* === Resume === */
h1 {
	font-family: 'Crete Round', serif;
	font-size: 20px;
	display: block;
	letter-spacing: .04em;
	color: #363636;
	margin: 0px 0px 15px 0px;}
#resume {
	color: #363636;}
#resume .resume_section {
	margin: 20px 0px 30px;}
#resume .box {
	margin: 0px 0px 18px;
	font-size: 14px;}
#resume .title {
	text-transform: uppercase;
	font-weight: bold;}
#resume .title span {
	text-transform: none;
	font-weight: normal;
	font-style: italic;
	font-size: 12px;
	text-align: center;
	display: inline-block;
	float: right;
	position: relative;
	top: 2px;}
#resume .specifics span {
	font-weight: bold;}
#resume .specifics ul {
	list-style-image: url('images/base/bullet.png');
	margin: 5px 0px 0px 1em;
	padding: 0px 0px 0px 1em;
	width: 85%;}
#resume .specifics ul li {
	margin: 0px 0px 5px 0px;
	line-height: 1.4em;}
	
#resume #skills {
	padding-bottom: 50px;
	width: 100%;}
#resume #skills ul {
	list-style-image: none;
	list-style-type: none;
	margin: 5px 0px 0px .5em;
	font-style: italic;}
#resume #skills span {
	display: block;}
#resume #skills .col {
	width: 20%;
	float: left;
	margin: 0px 20px 0px 0px;}
#resume #skills .col2 {
	width: 40%;
	float: left;}
#resume #skills .col2 .title {}
#resume #skills .col2 span {
	display: block;
	margin: 0px 0px 3px;}
#resume #skills .col2 div#other {
	margin: 59px 0px 0px 0px;}
	
	
	
	
/* === Footer === */
footer {
	display: inline-block;
	position: fixed;
	right: 10px;
	bottom: 10px;
	padding: 4px;}
footer a {
	font-size: 12px;
	font-style: italic;
	color: #999999;}
footer a:hover {
	color: #FFFFFF;
	background: #95DFD2;}
	
	
	
	
	
	
	
/* === Clearfix === */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;}
.clearfix {
	display: inline-block;}
html[xmlns] .clearfix {
	display: block;} 
* html .clearfix {
	height: 1%;}