/*CSS*/

html, body {
	height:100%;
	font-family: Verdana, Arial, Helvetica;
	font-size:10px;
	color:#666666;
	padding:0;
	margin:0;
	text-align:left;
}

img {
	border:0;
}

#wrapper {
	width:850px;
	text-align:left;
	/*background-color:white;*/
}

#header {
	float:left;
	position:relative;
	top:0;
	margin-bottom:10px;
}

#container {
	width:850px;
	background-position:top right;
	background-repeat:no-repeat;
	margin-top:50px;
}

#container .flag {
	float:right;
	margin-top:6px;
	margin-bottom:20px;
}

#externalLinks {
	float:right;
	margin-right:-163px;
	width:157px;
	position:relative;
	top:60px;
	right:0;
	text-align:left;
	background-image: url(../img/bkgd_shoutOut.png);
	background-position:right;
	background-repeat:repeat-y;
}

#externalLinks h2 {
	text-align:left;
	font-size:10px;
	font-weight:bold;
	color:#666666;
	margin-left:18px;
	margin-top:20px;
}

#container #externalLinks p {
	font-family: Verdana, Arial, Helvetica;
	font-size:10px;
	color:#666666;
	margin-left:18px;
	margin-right:8px;
}

#mainContent {
	width:518px;
	background-color:white;
	background-image: url(../img/bkgd_mainContent.jpg);
	background-repeat:repeat-y;
}

#headerLogo {
	float:left;
}

#callouts {
	float:right;
}

#calloutFlickr {
	margin-right:25px;
	margin-top:8px;
}

#calloutIllustration {
	margin-right:45px;
	margin-top:6px;
}

#contact {
	width:432px;
}

#contact, #news, #portfolio, #identity, #interactive {
	float:left;
}

#contact, #news {
	border-top:1px dashed silver;
	width:435px;
	font-family:Verdana, Arial, Helvetica;
	font-size:10px;
	color:#666666;
	padding:10px 35px 10px 50px;
	line-height:15px;
}

#contactTable {
	width:350px;
	text-align:right;
}

#contactTable div.left {
	text-align:left;
	margin-left:6px;
}

#contactTable td {
	height:30px;
}

#contactTable input.textInput {
	width:245px;
	height:20px;
	padding-left:5px;
	border:1px solid #bfbfbf;
	color:#666666;
	font-family:Verdana, Arial, Helvetica;
	font-size:10px;
}

#contactTable textarea.textInput {
	width:245px;
	height:75px;
	padding-left:5px;
	border:1px solid #bfbfbf;
	color:#666666;
	font-family:Verdana, Arial, Helvetica;
	font-size:10px;
}

#contact h1, #news h1, #portfolio h1, #portfolio h2 {
	font-size:10px;
	font-weight:bold;
	color:#666666;
}

#news h2 {
	font-size:10px;
	font-weight:bold;
	color:#999999;
	margin-bottom:-5px;
}

#news p, #portfolio p {
	color:#999999;	
}

#portfolio {
	line-height:15px;
}

#portfolio h1 {
	padding:15px 20px 10px 50px;
	border-top:1px dashed silver;
}

#interactive {
	padding:0 35px 50px 50px;
}

#identity {
	padding:0 35px 50px 50px;
	border-top:1px dashed silver;
}

#interactive div, #identity div {
	margin-bottom:55px;
}

#portfolio div h2 {
	color:#999999;
}

#interactive h3, #identity h3 {
	font-size:10px;
	margin-bottom:0;
}

#interactive p, #identity p {
	margin-top:2px;
}

#interactive div img, #identity div img {
	float:left;
	background-color:#f1f1f2;
	padding:5px;
	margin-right:10px;
	margin-bottom:20px;
	border:1px #cececf solid;
}

#interactive div img:hover{
	background-color:#f1f1f2;
	padding:5px;
	margin-right:10px;
	margin-bottom:20px;
	border:1px #ff6633 solid;
}

#contact a:link,
#contact a:visited,
#externalLinks a:link, 
#externalLinks a:visited,
#news a:link,
#news a:visited,
#portfolio a:link,
#portfolio a:visited {
	text-decoration:none;
	color:#ff6633;
}

#portfolio div {
	clear:both;
}

.clear {
	clear:both;
}