/* 
  ---------------------------------------
  Downtempo.net 2008 Style Sheet (Master)
  ---------------------------------------

  ---------------
  Univeral Styles 
  ---------------
*/

img, div { behavior: url(css/iepngfix.htc) }  /* transparent PNG fix for IE 8*/

html {
 overflow-y: scroll;   /* forces firefox scrollbar on */
}

body {
	margin: 50px 0 0 0;
	padding: 0;
	background: #F2F2F2;
	font: 100% Helvetica, Arial, sans-serif;
	text-align: center;
	min-width: 962px;
}

a { color: #000000; text-decoration: none; }

h1, h2, h3, h4, input, select, textarea { font-size: 100%; }

h1, h2, h3, h4, div, ul, li, form, select { margin: 0; padding: 0; }

li { margin-bottom: 4px; list-style: none; }

h1, h2 { font-size: 1.31em; line-height: 135%; }

h1 { margin: 15px 0px 0px 15px; font-weight: bold; }

h2 { margin: 0px 0px 0px 15px; font-weight: normal; }

h3 { padding: 15px 15px 10px 15px; font-size: .69em; font-weight: bold; text-transform: uppercase;}

input { width: 130px; background: #FFFFFF; font-size: 1em; }

img, a { border: 0px; outline: none; }

p { margin: 0; padding: 0px 15px 15px 15px; font-size: .81em; line-height: 135%; }

.clear { clear: both; }

.red { color: #C1272D; }
.pink { color: #C19797; }
.green { color: #007D0A; }
.mint { color: #8BB38F; }
.blue { color: #004B91; }
.grey-blue { color: #8195A6; }
.orange { color: #F7931E; }
.lt-orange { color: #efbc82 ; }
.black { color: #000000; }
.grey { color: #666666; }
.white { color: #FFFFFF; }

.bg-red { background-color: #C1272D; }
.bg-green { background-color: #007D0A; }
.bg-blue { background-color: #004B91; }
.bg-orange { background-color: #F7931E; }


/*
  -------------- 
  Wrapper Styles 
  -------------- 
*/

div.wrapper {
	position: relative;
	width: 890px;
	text-align: left;
	margin-left: auto;
	margin-right: auto;
}


/*
  -------------- 
  Crop Styles 
  -------------- 
*/

div.crop {
	position: absolute;
	width: 37px;
	height: 37px;
}

.cropNW {
	background-image: url(../images/cropNW.gif);
	left: -36px;
	top: -36px;
}

.cropNE {
	background-image: url(../images/cropNE.gif);
	right: -36px;
	top: -36px;
}

.cropSW {
	position: absolute;
	background-image: url(../images/cropSW.gif);
	left: -36px;
	top: 447px;
	width: 37px;
	height: 190px;
}

.cropSE {
	background-image: url(../images/cropSE.gif);
	right: -36px;
	top: 600px;
}


/*
  ----------------- 
  Navigation Styles 
  -----------------
*/

div.nav {
	position: relative;
	float: right;
	width: 820px;
	margin-left: 20px;
	background-color: #E6E6E6;
	border-bottom: 1px solid #CCCCCC;
	font-size: 1.5em;
	height: 42px;
}

div.nav ul {
	margin-top: 7px;
	padding: 0;
}

.mac.safari div.nav ul {
	margin-top: 8px;
}

.mac.ff3 div.nav ul {
	margin-top: 11px;
}

div.nav li {
	float: left;
	width: 253px;
	white-space: nowrap;
	position: relative;
	margin-left: 15px;
}

div.nav a { 	
	color: #999999;
	font-weight: bold;
	text-transform: uppercase;
	text-decoration: none;
}


/*
  ----------- 
  Logo Styles 
  -----------
*/

div.logo {
	position: relative;
	width: 50px;
	height: 600px;
	float: left;
}

div.logo img {
	margin-top: 8px;
}

div.bg-logo {
	position: relative;
	width: 306px;
	height: 490px;
	z-index: -1;
	margin-top: 3px;
}

div.bg-logo img {
	left: -40px;
}


/*
  -------------- 
  Content Styles 
  --------------
*/

div.content {
	float: right;
	width: 840px;
	height: 600px;
	margin-top: 15px;
}

div.content .one-column {
	width: 800px;
	height: 519px;
	margin-left: 20px;
	margin-top: 3px;
	float: left;
	background-image: url(../images/features-bg.png);
	padding: 10px;
}

div.wwd {
	margin: -13px 0px 0px -9px;
}

*+html div.wwd {
	margin: 0px 0px 0px -9px;
}

div.content .left {
	width: 540px;
	margin-left: 20px;
	float: left;
}

div.content .left .feature {
	float: left;
	width: 260px;
	height: 260px;
	background-image: url(../images/features-bg.png);
}

*+html div.content .left .feature {
	margin-top: 15px;
}

div.content .left .feature img {
	border: none;
	margin: 0;
	display: inline;
}

ul.news-list {
	font-size: .81em;
	margin: 0 15px 15px 15px;
	line-height: 135%;
}

ul.news-list li {
	margin-bottom: 10px;
}

div.content .right {
	width: 260px;
	margin-left: 20px;
	margin-top: 3px;
	float: right;
}

div.content .right .feature {
	width: 260px;
	height: 260px;
	background-image: url(../images/features-bg.png);
}

div.content .right .case-study {
	width: 260px;
	height: 260px;
	margin-top: 15px;
}

div.read-more {
	text-align: right;
	font-weight: bold;
	font-size: .75em;
	display: block;
	margin: -15px 15px 15px 0px;
}

div.chalkboard-wide {
	margin: 0;
}

*+html div.chalkboard-wide img {
	margin-top: 15px;
}

div.work-images {
	margin: 0;
}

*+html div.work-images {
	margin-top: 15px;
}

a.work-example {
	display: block;
	text-decoration: none;
	width: 100px;
	height: 100px;
	padding: 3px;
	margin: 12px;
	float:left;
}

a.work-example:hover {
	border: 3px solid #8CC63F;
	padding: 0px;
}

.work-example-selected {
	display: block;
	text-decoration: none;
	width: 100px;
	height: 100px;
	margin: 12px;
	float:left;
	border: 3px solid #8CC63F;
}

a.launch-website {
	text-decoration: none;
	font-size: 1.13em;
	color: #000000;
	font-weight: bold;
	margin-left: 15px;
	padding: 0;
}


/*
 * This CSS snippet has been generated by fontsquirrel.com and is based on the work of Paul Irish. 
* 
*/

/*
@font-face {
	font-family: 'OCRA Medium';
	src: url('OCRA.eot');
	src: local('OCRA Medium'), local('OCRA'), url('OCRA.woff') format('woff'), url('OCRA.ttf') format('truetype');
}
*/

/*
  -------------
  Footer Styles 
  -------------
*/

div.footer {
	float: left;
	width: 820px;
	margin-left: 70px;
	margin-top: -45px;
	font-family: 'OCRA Medium', ocrb, monospace;
	text-transform: uppercase;
	font-size: .63em;
}

div.footer img {
	margin-right: 5px;
	vertical-align: middle;
}

div.footer .contact-btn {
	float: right;
	margin: -20px 5px 0 0;
	width: 100px;
	height: 20px;
}

.mac.safari div.footer .contact-btn {
	margin-top: -4px;
}

div.footer a.address {
	text-decoration: none;
}

