/* Resets default browser CSS.
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
	vertical-align: baseline;
}

/* Remove annoying border on linked images. */
a img { border: none; }

.div {float:left}
.clear { clear:both; }


/* Layout. -------------------------------------------------------------- */

/* hopeful special */
.logo {margin-bottom:4em;}
.logo a:hover{ background-color:#000;}

.footer {color:#666666; float:left; margin:1.5em 0 0 0; line-height:2em; width:100%;}

.topnavigation li {float:right; position:relative; margin-right:-.6em;}
.topnav {color:#CCCCCC; font-size:1.5em; font-weight:bold; line-height:1.1; padding-top:.5em;}
.topnav a:hover {background:#339933;color:#FFFFFF; text-decoration:none;}
.topnav a:active {background:#000;color:#FFFFFF; text-decoration:none;}
.topnav a {color:#CCCCCC; padding:3px 10px 3px 10px; margin:0 0px 0 1px;}
.topnav a:visited {}

.intro, .portlist, .samples{
	background-color:#fff;
	margin-left:-1em;
	width:100%;

	}

.intro {
	float:left; 
	padding: 5em 0em 2em 2em; 
	margin-top:1em;
	}

.portlist {
	float:left;
	margin-top:-.1em;
	padding:1em; 
	}

.seperation {margin-top:3em;margin-bottom:1em;}

.portbox { 
	 background-color:#ddd;
	 float:left;
	 height:16em; 
	 margin: 0 .1em .1em 0; 
	 padding:2em;
	 width:16em;
	 color:#333
	 }
	 
#projectname{ 
	 margin: 0 0 .5em 0; 
	 }

#projectname p{ 
	 margin: 0; 
	 }
	 		 
.portbox a{line-height:1em; color:#000; text-decoration:underline;}

.space{padding-bottom:10em}
.smidge {padding-bottom:3em;}
.zero {height:0;}

.contactbox {
	background-color:#ddd; 
	float:left;
	height:25em;
	margin: 0 .1em .1em 0; 
	padding:2em;
	width:36.11em;
	color:#000
	}

.contactbox:hover { background-Color:#dddddd; color:#000;}


/* Typography. -------------------------------------------------------------- */

/* Default font settings. 
   The font-size percentage is of 16px. (0.75 * 16px = 12px) */
body { 
  color: #999; 
  font-size: 100%;
  font-family: Helvetica, Arial, verdana, sans-serif;
  line-height: 1.5; 
}

h1, h2, h3, h4{
	font-weight:600; 
	font-family:"Helvetica Neue", Helvetica, Arial, "Lucida Grande", Tahoma, Verdana, sans-serif; 
	letter-spacing:-.04em
}

h1 {font-size:2.25em;line-height:1.1; color:#ff6600;}

h2 {font-size:1.9em;line-height:1; color:#999;}

h3,h4 {font-size:1.4em;line-height:1.1;}

h5, h6 {font-weight:200; color:#ff6600;font-family: Arial, "Lucida Grande", Tahoma, Verdana, sans-serif;}

h5 {font-size:1.2em;line-height:1.3}

h6 {font-size:1em;font-weight:regular;line-height:1.25;}

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


.small	{font-size:.9em;margin-bottom:1em;line-height:1.875em;color:#333;margin-top:.5em; font-style:italic;}
.large 	{font-size:1.2em;line-height:2.5em;margin-bottom:1.25em;}
.hide 	{display:none;}
.show 	{display:inherit;}


/* Text elements */

p           { margin: 0 0 1.5em; }
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a:focus, 
a:hover {color:#339933;text-decoration:underline;}
a {color: #339933;text-decoration:none;}

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 				{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


/* Lists */

li ul, 
li ol       { margin: 0; }
ul, ol      { margin: 0; }

ul          { list-style-type: none; }
ol          { list-style-type: none; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}


/* Tables */

table       { margin-bottom: 1.4em; width:100%; }
th          { font-weight: bold; }
thead th 		{ background: #c3d9ff; }
th,td,caption { padding: 4px 10px 4px 5px; }
tr.even td  { background: #e5ecf9; }
tfoot       { font-style: italic; }
caption     { background: #eee; }



/*Gridish set up
-------------------------------------------------------------- */


/* A container should group all your columns. */
.container {
	margin: 0 auto;
	width: 40.3em;
}

/* Body margin for a sensile default look. */
body {   
	background-color:#333;
	margin-top:0;
}


/* -------------------------------------------------------------- 

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms
   
   Usage:
   * For text fields, use class .title or .text
   * For inline forms, use .inline (even when using columns)
   
-------------------------------------------------------------- */

label       { color:#333;}
legend      { font-weight: bold; font-size:1.3em; }


/* Form fields
-------------------------------------------------------------- */

input[type=text], input[type=password], input.text, input.title, textarea, select { 
	background-color:#fff; 
	border:.1em solid #ccc; 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 90%;
	margin:.2em 0 1em 0;
	padding:.5em; 
	width: 95%; 
	}

input[type=text]:focus, input[type=password]:focus,input.text:focus, input.title:focus, input:focus, select:focus, textarea:focus {
	background-color:#eeeeee;
	border:1px solid #333;
	color:#666;
	}

input.title   { font-size:1.5em; }

textarea      { height: 7em;}

input[type=checkbox], input[type=radio], input.checkbox, input.radio { 
	position:relative; top:.25em; 
	}

form.inline { line-height:3; }

form.inline p { margin-bottom:0; }
	
input.error, select.error, textarea.error {
	background:#fff;
	border:.1em solid #FF6600; 
	color:#000;
	margin-bottom:0;
	}
	
span.error {
	background-color:#FF6600;
	color:#FFFFFF; 
	border:.9em solid #FF6600; 
	display:block; 
	font-size:.9em; 
	margin-bottom:1em; 
	margin-right:-.3em; 
	padding:0.2em .5em 0.2em .5em; 
	width:95%}



/* -------------------------------------------------------------- 
   
   Created by Kevin Hale [particletree.com]
   * particletree.com/features/rediscovering-the-button-element

-------------------------------------------------------------- */

/* BUTTONS */

.buttons a, .buttons button, .buttons .neutral{
    display:inline-block;
    margin:.2em 1em 0 0;
    background-color:#ffffff;
    border:.1em solid #fff;

	font-size:1.3em;
	line-height:1.1; 
    text-decoration:none;
	font-weight:700; 
	font-family:"Helvetica Neue", Helvetica, Arial, "Lucida Grande", Tahoma, Verdana, sans-serif; 
	letter-spacing:-.04em;
    color:#339933;
    cursor:pointer;
    padding:0.35em 1.2em 0.35em 1.3em; /* Links */
	}

.buttons button{
    width:auto;
    overflow:visible;
    padding:.2em 1em .2em 1.1em; /* IE6 */
	}
	
.buttons button[type]{
    padding:.2em 1em .2em 1.1em; /* Firefox */
    line-height:1.6em; /* Safari */
	}

*:first-child+html button[type]{
    padding:.2em 1em .2em 1.1em;  /* IE7 */
	}

/* STANDARD */

button:hover, .buttons a:hover{
    background-color:#ffffff;
    color:#336699;
	}

.buttons a:active{
    background-color:#ffffff;
    color:#fff;
	}

/* NUETRAL */

button.neutral, .buttons a.neutral, .buttons .neutral {
    color:#888;
	background-color:#ccc;
	cursor:default;
	}


/* POSITIVE */

button.positive, .buttons a.positive{
    background-color:#ccffcc;
    color:#339933;
	}
	
.buttons a.positive:hover, button.positive:hover{
    background-color:#339933;
    color:#fff;
	}
	
.buttons a.positive:active{
    background-color:#000;
	}


/* NEGATIVE */

.buttons a.negative, button.negative{
    color:#d12f19;
	}
	
.buttons a.negative:hover, button.negative:hover{
    background:#fbe3e4;
    border:.1em solid #fbc2c4;
    color:#d12f19;
	}
	
.buttons a.negative:active{
    background-color:#d12f19;
    border:.1em solid #d12f19;
    color:#fff;
	}