@import url("reset.css");


/* JUST FOR EASTER */
/* @import url("easter.css"); */


/* Font-Face */
@font-face { font-family: Museo; src: url('type/MuseoSlab100.otf'); }
@font-face { font-family: Museo; font-weight: 300; src: url('type/MuseoSlab300.otf'); }
@font-face { font-family: Museo; font-weight: 500; src: url('type/MuseoSlab500.otf'); }


/* Default HTML 5 Fix */
header, nav, section, article, figure, aside, footer {
	display: block;
	}


/* Main */
body {
	margin: 0px 0px 15px 0px;
	font-family: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
	}

.container {
	width:800px;
	margin:0 auto;
	}

.align_right { float: right; margin: 0px 0px 0px 5px; }
.align_left { float: left; margin: 0px 5px 0px 0px; }

#wrapper {
	min-height: 425px;
	padding: 0px;
	margin: 0px;
	clear: both;
	float: left;
	width: 800px;
	height: auto;
	}
	#downloads #wrapper { min-height: 280px; }

#main_image_head {
	margin: 15px 0px 20px 0px;
	clear: both;
	float: left;
	padding: 0px;
	width: 800px;
	height: 275px;
	}

/* Main Text Styling */
h1 { font-size: 20px; margin-bottom:0.5em; }
h2 { font-size: 18px; }
h3 { font-weight: bold; font-size: 15px; }
h4 { font-size: 14px; }
h5 { font-size: 12px; font-weight:bold; margin-bottom:1.5em; }
h6 { color: #595959; font-size: 13px; font-weight:normal; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin:0; }

p {
	color: #696969;
	line-height: 16px;
	font-size: 11px;
	margin: 0px 0px 15px 0px;
	}

p.bigger { font-style:normal; font-size: 14px; line-height:22px; text-decoration: none; font-weight: normal; color: #979797; }

a:focus, a:hover { color:#000; }
a { color:#009; text-decoration: none; }


a.blue:link, a.blue:active, a.blue:visited, .blue { color: #47ade3; }
a.green:link, a.green:active, a.green:visited, .green { color: #90ad17; }
a.orange:link, a.orange:active, a.orange:visited, .orange { color: #ff8000; }
a.pink:link, a.pink:active, a.pink:visited, .pink { color: #eb4289; }
a.red:link, a.red:active, a.red:visited, .red { color: #eb3a26; }
a.yellow:link, a.yellow:active, a.yellow:visited, .yellow { color: #c0c201; }
a.purple:link, a.purple:active, a.purple:visited, .purple { color: #9663c2; }
a.blue:hover, a.green:hover, a.orange:hover, a.pink:hover, a.red:hover, a.yellow:hover, a.drkred:hover { color: #4c4c4c; }
a.grey:link, a.grey:active, a.grey:visited { font-style: normal; font-weight: normal; color: #7d7d7d; }
.entry p a.drkred { color:#a9203c; font-weight:bold; }

a.grey:hover {
	font-style: normal;
	font-weight: normal;
	color: #b0b0b0;
	/*
	text-shadow: rgb(0, 0, 0) 0px 2px 0px;
	text-shadow: rgba(0, 0, 0, 0.3) 0px 1px 0px;
	*/
	}

strong { font-weight:bold; }
.strike, a.reef.strike {text-decoration: line-through;}

.small { font-size:.8em; margin-bottom:1.875em; line-height:1.875em; }
.large { font-size:1.2em; line-height:2.5em; margin-bottom:1.25em; }

br.clear { clear: both; }

#hide { display: none; }

/* Colour Strip */
#strip { width: 100%; height: 2px; float: left; margin: 0px 0px 15px 0px; padding: 0px; display: block; background: url(../img/strip.png) 0px 0px repeat; }


/* Header */
header {
	float: left;
	margin-bottom: 10px;
	width: 800px;
	height: 175px;
	}
	
	header h1 {
		margin: 0px; padding: 0px;
		float: left;
		width: 270px; height: 170px;
		background: url(../img/planetperki-logo_archer.png) no-repeat 0px 0px;
		text-indent: -9999px;
		}

	header h2, header h2 a:link {
		margin: 0px;
		text-align: right;
		padding: 0px 0px 5px 0px;
		float: right;
		font-weight: normal;
		color: #999999;
		font-size: 12px;
		}


/* Main Navigation */
nav {
	margin: 105px 0px 0px 0px;
	padding: 5px 0px 0px 10px;
	float: right;
	width: 520px;
	height: 35px;
	}
	nav ul {
		padding: 0px;
		margin: 0px;
		float: right;
		}
		nav ul li {
			margin: 0px;
			padding: 10px 0px 10px 0px;
			list-style-type: none;
			display: inline;
			font-family: "Myriad Pro", Myriad, Helvetica, Tahoma, Verdana, Arial, sans-serif;
			}
			nav ul li a {
				margin: 3px 0px 0px 30px;
				text-align: left;
				font-size: 14px;
				font-weight: normal;
				text-decoration: none;
				list-style-type: none;
				display: inline;
				padding: 0px;
				float: left;
				}
				nav ul li a:hover { border-top-color: #e6e6e6; border-top-style: solid; border-top-width: 3px;}


/* Home Slideshow */
.latest_work.slideshow {
	display: inline;
	width: 800px;
	height: 275px;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	float: right;
	position: relative;
	}
	.latest_work.slideshow IMG { position:absolute; top:0; left:0; z-index:8; }
	.latest_work.slideshow IMG.active { z-index:10; }
	.latest_work.slideshow IMG.last-active { z-index:9; }

/* iPhone Slideshow */
.iphone {
	display: inline;
	width: 75px;
	height: 100px;
	overflow: hidden;
	margin: 0px 0px 0px 10px;
	padding: 0px;
	float: right;
	position: relative;
	}
	.iphone.slideshow IMG { position:absolute; top:0; left:0; z-index:8; }
	.iphone.slideshow IMG.active { z-index:10; }
	.iphone.slideshow IMG.last-active { z-index:9; }


/* Home News */
#home_news {
	min-height: 125px;
	padding: 0px;
	margin: 0px;
	clear: both;
	float: left;
	width: 800px;
	height: auto;
	}
	.whatsnew {
		padding: 0px 15px 5px 0px;
		margin: 0px 15px 10px 0px;
		border-right: 1px dotted #dcdcdc;
		min-height: 115px;
		width: 245px;
		float: left;
		}
		.whatsnew h3 {
			font-size: 13px;
			font-weight: normal;
			margin: 0px 0px 10px 0px;
			}
			.whatsnew p, .whatsnew a {
				font-weight: normal;
				margin: 5px 0px 0px 0px;
				font-size: 11px;
				}
	blockquote {
		padding: 10px 0px 0px 0px;
		margin: 0px;
		min-height: 115px;
		width: 245px;
		float: left;
		}
		blockquote h4 {
			font-weight: 100;
			display: inline;
			word-spacing: 1px;
			padding: 0px;
			margin: 0px;
			color: #7f7f7f;
			line-height: 26px;
			font-size: 18px;
			}
			span.quote {
				margin: 10px 20px 0px 0px;
				float: right;
				color: #b3b3b3;
				font-size: 11px;
				}
			span.ampersand {
				font-family: Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
				font-weight: normal;
				font-style: italic;
				font-size: 23px;
				}
			span.speechmarks {
				line-height: 20px;
				display: inline;
				font-size: 20px;
				color: #47ade3;
				font-style: italic;
				font-family: "Adobe Caslon Pro", Baskerville, Georgia, Garamond, Times, serif;
				}


/* About Section */
#about #wrapper section {
	min-height: 425px;
	padding: 0px;
	margin: 0px;
	height: auto;
	display: inline;
	}
	section#about { float: left; width: 800px; }
		section.standout { width: 800px; height: 50px; float: left; display: inline; margin: 10px 0px 60px 0px; }
			section.standout h3.about {
				font-family: "Museo", Myriad Pro, Myriad, Helvetica, Tahoma, Verdana, Arial, sans-serif;
				font-weight: normal; font-size: 23px;
				color: #999;
				padding: 0px; margin: 4px 0px 0px 0px;
				float: left; display: inline;
				line-height: 40px;
				}
				section.standout h3.featured
				.container #wrapper section#about section.standing h3 .green { color: #90ad17; }
				
				p.about { font-style:normal; font-size: 11px; line-height: 26px; text-decoration: none; font-weight: normal; color: #696969; margin: 0px 0px 25px 0px; }
				section#about img { float: left; display: inline; margin: 5px 30px 20px 0px; }

			#about p.bigger {
				font-size: 15px; line-height:22px;
				text-decoration: none;
				font-weight: normal; font-style: normal;
				color: gray;
				}
		#about ul { float: left; margin: 0px 0px 10px 0px; padding: 0px; list-style: none; }
		#about ul li { display: inline; margin-right: 25px; }
			.under {
				margin:0px 5px; padding: 0px;
				font-family: "Museo", Myriad Pro, Myriad, Helvetica, Tahoma, Verdana, Arial, sans-serif;
				border-bottom: 1px dotted #d6d6d6;
				font-size: 15px;
				}
				section#mugshot { float: right; width: 350px; }
					#mugshot img { margin: 0px 0px 10px 0px; float: right; }


/* Portfolio Section */
aside#featured_project { margin: 5px 0px 15px 5px; padding: 0px 0px 0px 15px; width: 300px; height: 550px; border-left: 1px dotted #dcdcdc; float: right; display: inline; }
	aside#featured_project h3 { font-size: 18px; font-weight: normal; }
	aside#featured_project p { font-size: 12px; font-weight: normal; margin: 5px 0px 10px 0px; }
		aside#featured_project a:hover {color: #b8b5a9;}

aside#featured_projects { margin: 5px 0px 15px 5px; padding: 0px 0px 0px 15px; width: 250px; height: 550px; border-left: 1px dotted #dcdcdc; float: right; display: inline; }
	aside#featured_projects h3 { font-size: 18px; font-weight: normal; }
	aside#featured_projects h4 { font-size: 21px; font-weight: normal; }
		aside#featured_projects { font-size: 12px; font-weight: normal; margin: 5px 0px 10px 0px; }
			aside#featured_projects a:hover {color: #b8b5a9;}


nav#portfolio_type {
	margin: 5px 0px 15px 0px; padding: 5px 0px 0px 0px;
	color: #b3b3b3;
	clear: both; float: left;
	border-bottom: 1px solid #f7f7f7;
	border-left: none;
	height: 25px; width: 800px;
	}
	nav#portfolio_type ul { margin: 0px; padding: 0px; float: left; }
	nav#portfolio_type ul li { margin: 0px 20px 0px 0px; padding: 0px; float: left; display: inline; font-size: 12px; }
	nav#portfolio_type ul li a { color: #999999; margin: 0px 10px; padding: 0px; float: left; display: inline; font-size: 12px; }
		nav#portfolio_type ul li.current a { text-decoration: line-through; color: #333333; }
			nav#portfolio_type ul li a:hover { margin: 0px 10px; padding: 0px; float: left; display: inline; font-size: 12px; border: none; }
.portfolio_grid { margin: 5px 0px 5px 0px; float: left; width: 470px; height: auto; display: inline; }
.portfolio_grid ul#portfolio li { list-style:none; }
.portfolio_piece {
	height: 160px; width: 150px;
	margin: 0px; padding: 0px;
	}
.port_item {
	height: 240px; width: 800px;
	margin: 0px 0px 25px 0px; padding: 0px 0px 10px 0px;
	border-bottom: 1px dotted #dcdcdc;
	}

/* Scrolling Portfolio Items */
.port_item #s1, .port_item #s2 {
	overflow:hidden;
	height: 240px; width: 540px;
	float: left; display: inline;
	}
	.img_nav { float: left; display: inline; clear:none; width: 16px; height: 18px; margin: 197px 0px 0px 0px; padding: 0px 0px 0px 9px; }
		.img_nav a { margin: 0px; padding: 0px; font-size: 14px; font-weight: bold; color: #b3b3b3; }
	aside.port_item_description { float: right; display: inline; width: 210px; height: auto; padding: 0px 0px 20px 10px; border-left: 1px dotted #dcdcdc; }
	.port_item h4 { color: #7f7f7f; float: left; display: inline; font-size: 20px; font-family: "Museo", Myriad Pro, Myriad, Helvetica, Tahoma, Verdana, Arial, sans-serif; font-weight: 100; margin: 0px; padding: 0px; line-height: 26px; }
		.port_item p { float: left; display: block; clear: left; font-size: 12px; color: #b3b3b3; }
			.port_item p.what { font-style: italic; font-size: 11px; margin: 5px 0px; padding: 0px; }
			.port_item p.what span { font-family: "Baskerville"; font-style: italic; font-size: 14px; }
	

	.portfolio_piece.left { float: left; }
	.portfolio_piece.center { margin: 0px 10px; float: left;}
	.portfolio_piece.right { float: right; }
	
	.portfolio_piece.mid {margin-bottom: 30px; margin-top: 30px;}
	
		.portfolio_piece p { color: #d6d6d6; line-height: 13px; padding: 0px; margin: 0px; }
		.portfolio_piece a { text-decoration: none; font-weight: normal; padding: 0px; margin: 0px; font-size: 10px; }
			.portfolio_piece a:hover { background-color: #d6d6d6; color: #444; }
		.portfolio_piece h4 { padding: 0px; font-size: 14px; margin: 0px; font-weight: normal; line-height: 13px;}
			.portfolio_piece .reef, aside#featured_project .reef {color: #421a1f;}
			.portfolio_piece .elohymn, aside#featured_project .elohymn {color: #16435c;}
			.portfolio_piece .chaotix {color: #eb4289;}
			.portfolio_piece .squarepeg {color: #6abe7b;}
			.portfolio_piece .tagwalk {color: #00b3d8;}
			.portfolio_piece .barcamp {color: #ed0c79;}
			.portfolio_piece .nix {color: #727272;}
			.portfolio_piece .changinghorses, aside#featured_project .changinghorses {color: #8a6c4b;}
			.portfolio_piece .pencilin,  aside#featured_project .pencilin {color: #554e37;}
			.portfolio_piece .curtislaw, aside#featured_project .curtislaw {color: #a80c35;}
			.portfolio_piece .deaf, aside#featured_project .deaf {color: #1c072b;}
		
		.portfolio_piece img.comingsoon { opacity:0.5; }


/* Downloads Section */
#downloads_main {
	min-height: 270px;
	height: auto;
	clear: both;
	margin: 10px 0px 10px 0px;
	}
	nav#downloads_nav {
		margin: 0px;
		padding: 10px 0px 0px 0px;
		color: #b3b3b3;
		clear: both;
		float: left;
		border-top: 1px dotted #e6e6e6;
		border-left: none;
		min-height: 85px;
		height: auto;
		width: 800px;
		}
		nav#downloads_nav .menu {
			float: left;
			padding: 0px 30px 0px 0px;
			margin: 0px 5px 10px 0px;
			border-right: 1px dotted #d6d6d6;
			font-size: 11px;
			height: auto;
			width: auto;
			}
		nav#downloads_nav .menu.second { margin: 0px 0px 10px 0px; padding: 0px 20px 0px 10px; }
			nav#downloads_nav .menu ul li { padding: 0px; margin: 0px; display: block; }
			nav#downloads_nav .menu ul li a { padding: 0px; margin: 0px; font-size: 12px; display: block; }
				nav#downloads_nav .menu ul li a:hover { border: 0px; }

aside#download_item_description { text-align: right; height: auto; width: 325px; float: right; display: inline; }	
	aside#download_item_description h2 { margin-bottom: 10px; font-size: 14px; }
		aside#download_item_description p { font-size: 12px; }


.lc_image {
	margin: 0px 0px 5px 0px;
	height: 275px;
	width: 800px;
	}
.lc_image_iphone {
	margin: 0px 0px 20px 0px;
	padding: 0px;
	min-height: 275px;
	height: auto;
	width: 800px;
	}
	.lc_image_iphone ul, .lc_image_iphone ul li img { margin: 0px; padding: 0px; }
	.lc_image_iphone ul li.left { margin: 0px 20px 0px 0px; padding: 0px; list-style: none; display: inline; float: left; }
	.lc_image_iphone ul li.right { margin: 0px; padding: 0px; list-style: none; display: inline; float: right; }
	

/* DOWNLOAD COLOURS */
.poker {color: #253e1c;}
.spam {color: navy;}
.carnivapple, .plump {color: #e06925;}
.tabasco {color: #bb2e2c;}
.griseus {color: #4c4c4c;}
.seattlantis {color: #96c1a1;}
.bitof {color: #979797;}
.cardboard {color: #97867a;}
.krispy {color: #a9203c;}
.sunday {color: #91d5eb;}


/* Contact Page Styling inside /css/contact.css */


/* Social Networking Bar */
#socialnetworks {
	margin: 0px;
	padding: 10px 0px 0px 0px;
	color: #b3b3b3;
	clear: both;
	float: left;
	border-top: 1px dotted #e6e6e6;
	width: 800px;
	}
	#socialnetworks a { color: #b3b3b3; }
	

	/* Flickr */
	#flickr {
		min-height: 80px;
		float: right;
		padding: 0px 0px 0px 5px;
		margin: 0px 0px 10px 5px;
		border-left: 1px dotted #d6d6d6;
		font-size: 11px;
		height: auto;
		width: 165px;
		}
		#flickr_imgs {
			width: 165px;
			height: 45px;
			margin: 10px 0px 0px 0px;
			float: right;
			}
		.flickr_badge_image { display: inline; margin-left: 5px; }
			.flickr_badge_image img { width: 50px; height: 44px; display: inline; }
				#flickr h6 a, #flickr a:hover { color: #006dc4; }
				#flickr h6 { margin-left: 5px; }
				#flickr h6 span { color: #c43772; }
	/* Twitter */
	#twitter {
		padding: 0px 5px 0px 5px;
		margin: 0px 5px 10px 0px;
		min-height: 80px;
		float: left;
		font-size: 11px;
		height: auto;
		width: 320px;
		}
		ul#twitter_update_list { list-style: none; }
		#latest_tweet { width: 305px; margin: 10px 0px 0px 0px; }
			#latest_tweet ul li a { display: block; margin: 3px 0px 0px 0px; }
			#latest_tweet ul li span a { display: inline; }
		#twitter_contact h6, #twitter h6 a, #twitter a:hover { color: #47ade3; }
	/* Last.fm */
	#lastfm {
		min-height: 80px;
		float: left;
		margin: 0px 5px 10px 0px;
		padding: 0px 5px 0px 0px;
		border-right: 1px dotted #d6d6d6; 
		font-size: 11px;
		height: auto;
		width: 260px;
		}
		#recently_played { margin: 10px 0px 0px 0px; width: 255px; }
		aside#b_recently_played { margin: 10px 0px 0px 0px; width: 255px; float: left; text-align: left; }
		
			#lastfm_contact h6, #lastfm h6 a, #lastfm a:hover { color: #eb3a26; }
	/* Other Social Networks */
	#othersocialnetworks {
		min-height: 80px;
		float: right;
		padding: 0px 0px 0px 5px;
		margin: 0px 0px 10px 5px;
		border-left: 1px dotted #d6d6d6;
		font-size: 11px;
		height: auto;
		width: 165px;
		}
		#othersocialnetworks h6 { color: #999; }
			#othersocialnetworks h6 span, #othersocialnetworks ul li span { color: #cccccc; font-size: 9px; }
		#othersocialnetworks ul { margin: 5px 0px 0px 0px; padding: 0px; list-style: none; }
		#othersocialnetworks ul li { margin: 5px 10px 0px 0px; padding: 0px; display: inline; float: left; }
			#othersocialnetworks ul li a img { -moz-opacity: 0.7; opacity: 0.7; }
			#othersocialnetworks ul li a:hover img { -moz-opacity: 1; opacity: 1; }


	/* Myspace */
	#myspace_contact h6, #myspace h6 a, #myspace a:hover { color: #004080; }
	/* MSN */
	#msn_contact h6, #msn h6 a, #msn a:hover { color: #777; }
	/* LinkedIn */
	#linkedin_contact h6, #linkedin h6 a, #linkedin a:hover { color: #3d6ab3; }
	/* RSS */
	#rss_contact h6, #rss h6 a, #rss a:hover { color: #ff8000; }

#lastfm h6 a img, #twitter h6 a img, #brightkite h6 a img, #flickr h6 a img { vertical-align: top; margin: 0px 5px 0px 0px; }


/* Footer */
footer {
	margin: 0px 0px 20px 0px;
	padding: 10px 0px 10px 0px;
	clear: both;
	float: left;
	border-top: 1px dotted #e6e6e6;
	width: 800px;
	height: 30px;
	}
	nav#footer {
		border: 0px;
		margin: 0px;
		padding: 0px;
		width: 375px;
		height: 30px;
		}
		footer nav ul li {
			margin: 5px 0px 0px 0px;
			list-style-type: none;
			display: inline;
			padding: 0px;
			}
			footer nav ul li a {
				font-size: 10px;
				font-weight: normal;
				text-decoration: none;
				}
	footer p {
		letter-spacing: 1px;
		color: #b3b3b3;
		font-size: 9px;
		width: auto;
		}
		footer a { float: none; }

/* FACE */
#face { z-index: 0; bottom: auto; left: 5px; position: absolute; height: 50px; width: 50px; }

/* Contact Form Tooltips */
.tooltip{ 
   position: absolute; 
   top: 0; 
   left: 0; 
   z-index: 3; 
   display: none; 
}


/* The CSS Awards */
#cssawards {
    position: absolute;
	top: 10px;
	right: 0px;
	}


/* Blog */
cite.fn { text-transform: uppercase; font-size: 14px; color: #ff0080; }
cite.fn a { text-transform: uppercase; font-size: 14px; color: #3da5d7; }