body
{
	margin: 0px;
	font-family: 'ProximaNova', Myriad, Calibri, sans-serif;
	font-size: 100%;
	text-rendering: optimizeLegibility;
	color: rgb(70, 70, 70);
	background-color: rgb(240, 240, 240);
}


/* =============================================================================
   Typefaces
   ========================================================================== */


/*
 * MyFonts Webfont Build ID 827355, 2011-05-30T18:25:42-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Proxima Nova Regular
 * URL: http://new.myfonts.com/fonts/marksimonson/proxima-nova/regular/
 * Foundry: Mark Simonson
 * Copyright: Copyright (c) Mark Simonson, 2005. All rights reserved.
 * License: http://www.myfonts.com/viewlicense?1056
 * Licensed pageviews: 20,000/month
 * CSS font-family: ProximaNova-Regular
 * CSS font-weight: normal
 * 
 * Webfont: Proxima Nova Bold
 * URL: http://new.myfonts.com/fonts/marksimonson/proxima-nova/bold/
 * Foundry: Mark Simonson
 * Copyright: Copyright (c) Mark Simonson, 2005. All rights reserved.
 * License: http://www.myfonts.com/viewlicense?1056
 * Licensed pageviews: 20,000/month
 * CSS font-family: ProximaNova-Bold
 * CSS font-weight: normal
 * 
 * Webfont: Proxima Nova Italic
 * URL: http://new.myfonts.com/fonts/marksimonson/proxima-nova/regular-it/
 * Foundry: Mark Simonson
 * Copyright: Copyright (c) Mark Simonson, 2005. All rights reserved.
 * License: http://www.myfonts.com/viewlicense?1056
 * Licensed pageviews: 20,000/month
 * CSS font-family: ProximaNova-RegularIt
 * CSS font-weight: normal
 * 
 * (c) 2011 Bitstream Inc
*/

@font-face 
{
	font-family: 'ProximaNova';
	src: url('../typefaces/eot/style_148510.eot'); /* IE9 Compat Modes */
	src: url('../typefaces/eot/style_148510.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('../typefaces/woff/style_148510.woff') format('woff'), /* Modern Browsers */
	     url('../typefaces/ttf/style_148510.ttf')  format('truetype'); /* Safari, Android, iOS */
	font-weight: normal;
	font-style: normal;
}

@font-face 
{
	font-family: 'ProximaNova';
	src: url('../typefaces/eot/style_148514.eot'); /* IE9 Compat Modes */
	src: url('../typefaces/eot/style_148514.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('../typefaces/woff/style_148514.woff') format('woff'), /* Modern Browsers */
	     url('../typefaces/ttf/style_148514.ttf')  format('truetype'); /* Safari, Android, iOS */
	font-weight: bold;
	font-style: normal;
}

@font-face 
{
	font-family: 'ProximaNova';
	src: url('../typefaces/eot/style_148548.eot'); /* IE9 Compat Modes */
	src: url('../typefaces/eot/style_148548.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
	     url('../typefaces/woff/style_148548.woff') format('woff'), /* Modern Browsers */
	     url('../typefaces/ttf/style_148548.ttf')  format('truetype'); /* Safari, Android, iOS */
	font-weight: normal;
	font-style: italic;
}


/* =============================================================================
   Headers
   ========================================================================== */


/* For the main title at the top of the page */
h1
{
	text-align: center;
	font-size: 1.3125em; /* 21px */
	font-weight: normal;
	color: white;
	background-color: #666699;
	padding: 0.35em;
	margin: 0em;
	margin-bottom: 1.4em;
	border-bottom: 0.6em solid #CCCC99;
}

/* For the descriptions within each client-box */
h2
{
	font-size: 1.0em;
	margin: 0em; /* Set all to zero, first */
	margin-bottom: 1.6em;
	clear: both;
}

/* This is specifically for secondary text within an H2, such as "more detail" */
h2 strong
{
	float: right;
	font-weight: normal;
}


/* =============================================================================
   Content bits
   ========================================================================== */


/* The main page area */
div#content
{
	margin-left:  auto;
	margin-right: auto;
	padding-bottom: 2.5em;
	max-width: 690px;
}

/* For images in general */
img
{
	border-width: 0em;
}

/* Ordinary paragraphs */
p
{
	font-size: 1.0em;
	background-color: transparent;
	line-height: 1.4;
	margin-top: 0em;
	margin-bottom: 1.6em;
}

/* For the W3C "Validate" logos */
a.validate
{
	display: block;
	float: right;
	clear: right;
	background-color: transparent;
	margin: 0em; /* Just to be sure */
	
	/* This compensates for the line-height of the adjacent text so that
		the logos still visually line up. */
	margin-top:    0.25em; 
	margin-bottom: 0.35em;
	width: 88px;
}

	a.validate img
	{
		width: 88px;
		height: 31px;
	}

/* Link styling */
a
{
	text-decoration: none;
}

	/* And, link-hovering styling */
	a:focus,
		a:hover
	{
		text-decoration: underline;
	}
	
	a.screenshot:focus,
		a.screenshot:hover
	{
		text-decoration: none;
	}
	
	/* -------------------------------------------------------
	   hCard bits
	   ------------------------------------------------------- */
	
	span.fn,
		span.adr,
		span.street-address,
		span.tel
	{
		display: block;
	}


/* =============================================================================
   Client-Specific bits
   ========================================================================== */


/* For each client-section */
section.client
{
	clear: both;
	border-top: 1px dashed black;

	padding-top: 1.6em;
	padding-bottom: 0em;
	padding-right: 0.9em;
	padding-left: 0em;

	margin: 0em; /* Just to be sure */
	margin-top: 2.6em;
	margin-bottom: 0em;
}

	/* For the descriptions within each client-box */
	section.client h2
	{
		font-size: 1.0em;
		margin: 0em; /* Set all to zero, first */
		margin-bottom: 1.2em;
		clear: both;
	}

	/* For the individual screenshots */
	section.client img
	{
		display: inline;
		margin-left: 1.25em;
		margin-right: 0em;
		margin-top: 0.9em;
		margin-bottom: 0em;
		width: 200px;
		height: 198px;
	}
	

/* =============================================================================
   Styles for site-specific pages, such as Wieck Media
   ========================================================================== */


/* Code elements out on its own get special styling */
code
{
	display: block;
	border: 1px dashed black;
	padding: 1.0em;
	background-color: rgb(245,245,245);
	margin-bottom: 1.6em;
}

/* Code elements within a paragraph can just look normal */
p code
{
	display: inline;
	border: none;
	padding: 0em;
	margin: 0em;
	background-color: transparent;
	border-bottom: 1px dotted #999;
}

/* Courtesy ALA - http://www.alistapart.com/stories/practicalcss/ */
abbr, acronym, .help
{
	border-bottom: 1px dotted #333;
	cursor: help;
}