body {
	margin:0;
	padding:0;
	font-family:arial,sans-serif;
	font-size:100%;
	color:#888;
	background-color:#fff;
	}

/* containers */

div#page {
	position:relative;
	margin:0 auto;
	padding:0;
	width:800px;
	text-align:left;
}

div#header {
	position:relative;
	margin:0;
	padding:10px 0;
	border-bottom:solid 1px #e2e2e2;
}

div#content {
	margin:0;
	padding:0;
}
div#container {
	margin:0;
	padding:0;
}

body.home div#container,
body.about div#container {
	padding:0 0 20px 0;
}

div#menu {
	clear:both;
	margin:0;
	padding:1px 0 0 0;
	border-top:solid 1px #e2e2e2;
}
div#footer {
	margin:0;
	padding:10px 0;
	border-top:solid 1px #e2e2e2;
}

/* end containers */

h1 {
	margin:0;
	padding:0;
}
h1 a {
	display:block;
	margin:0;
	padding:0;
	width:140px;
	height:40px;
	text-indent:-1000em;
	background-image:url(../images/workroom_logo.gif);
	background-repeat:no-repeat;
	background-position:top left;
}
h2 {
	margin:0;
	padding:10px 13px 0px 0px;
	font-size:24px;
	line-height:32px;
	font-weight:normal;
	color:#888;
	background-color:transparent;
	}

body.home h2 {
	clear:both;
}

h3 {
	margin:0 0 3px 0;
	padding:0;
	font-size:18px;
	line-height:22px;
	font-weight:normal;
	color:#009dd9;
	background-color:transparent;
	}

p {
	margin:10px 0;
	padding:0 10px;
	font-size:24px;
	line-height:32px;
	color:#888;
	background-color:transparent;
	}

a {
	color:#009dd9;
	background-color:transparent;
	outline:0;
}	
a:hover {
	color:#333;
	background-color:transparent;
}

body.home div#container a,
body.project div#container p a,
div#footer p a {
	text-decoration:none;
}

div#container p {
	margin:0;
	padding:0 13px 10px 0;
	color:#888;
	background-color:transparent;
}
div#footer p {
	margin:0 0 5px 0;
	padding:0 15px 0 0;
	font-size:10px;
	line-height:14px;
	color:#777;
	background-color:transparent;
	}
div#menu ul,
ul.clients {
	float:left;
	display:block;
	margin:10px 0;
	padding:0;
	width:200px;
	list-style-type:none;
	}
div#menu ul li,
ul.clients li {
	position:relative;
	display:block;
	margin:0;
	padding:0 40px 0 0;
	font-size:12px;
	line-height:15px;
	}
ul.clients li {
	padding:0 30px 10px 0;
}
div#menu ul li.title a {
	padding:0;
	color:#009dd9;
	background-color:transparent;
	}
div#menu ul li.title a:hover {
	color:#009dd9;
	background-color:transparent;
}
* html body li {
	height:1px;
	}
div#menu ul li a,
ul.clients li a {
	font-family:arial,sans-serif;
	font-size:12px;
	line-height:22px;
	color:#888;
	background-color:transparent;
	text-decoration:none;
	}
	
ul.clients li a {
	display:block;
	margin:0;
	line-height:15px;
	color:#009dd9;
}
	
div#menu ul li a:hover,
ul.clients li a:hover {
	color:#333;
	text-decoration:underline;
	}
div#menu ul li.current {
	/* nothing */
}
div#menu ul li.current a,
div#menu ul li.current a:hover {
	font-style:italic;
	color:#333;
	background-color:transparent;
	text-decoration:none;
}


img.main,
div.panel img {
	display:block;
	margin:0;
	padding:0;
}

img.main {
	width:800px;
	height:200px;
}

body.about img.main {
	margin:10px 0 0 0;
}

ul#projects {
	margin:0;
	padding:0;
	list-style-type:none;
}

ul#projects li {
	float:left;
	margin:0 5px 0 0;
}

ul#projects li.last {
	margin:0 !important;
}

ul#projects li a,
ul#projects li a img {
	display:block;
	margin:0;
	padding:0;
	width:196px;
	height:200px;
	border:none;
}

div.project {
	float:left;
	margin:5px 4px 0 0;
	padding:0;
	width:196px;
}

div.last {
	margin:5px 0 0 0;
}

div.project strong {
	display:block;
	margin:5px 0;
}

div.project em {
	font-style:normal;
	font-size:11px;
}

div.project a {
	display:block;
	margin:0 10px 0 0;
	padding:10px 0;
	font-size:12px;
	line-height:18px;
	text-decoration:none;
	color:#888;
	background-color:transparent;
}

div.project a:hover {
	color:#333;
}

div.project img {
	display:block;
	margin:0 0 10px 0;
	padding:0;
	width:176px;
	height:85px;
	border:none;
	background-image:url(../images/loading.gif);
	background-repeat:no-repeat;
	background-position:center center;
}

div.contacts {
	float:right;
	margin:10px 0 0 20px;
	padding:10px 0 0 10px;
	width:180px;
}

div.contacts p {
	font-size:13px;
	line-height:18px;
}

form {
	margin:0;
	padding:13px 0;
}

form#loginform {
	display:none;
	position:absolute;
	top:40px;
	right:5px;
	margin:0;
	padding:10px;
	width:300px;
	height:150px;
	color:#888;
	background-color:#fff;
	border:solid 1px #666;
	z-index:2000;
}

label,
input,
textarea {
	float:left;
	clear:left;
	width:560px;
	margin:0 0 5px 0;
	font-size:16px;
	line-height:24px;
}

form#loginform label,
form#loginform input {
	margin:0 0 3px 0;
	padding:0;
	width:295px;
	font-size:16px;
	line-height:20px;
}

label {
	color:#888;
}

input {
	margin:0 0 10px 0;
	border:solid 1px #ccc;
}

input.button {
	margin:5px 0;
	width:auto;
	border:none;
	cursor:pointer;
}

input.send {
	padding:0;
	width:75px;
	height:28px;
	text-indent:-1000em;
	color:#333;
	background-color:transparent;
	background-image:url(../images/send.gif);
	background-repeat:no-repeat;
	background-position:top left;
}

p.notice {
	margin-top:15px !important;
	padding-top:16px !important;
	width:570px;
	background-image:url(../images/dots.gif);
	background-repeat:repeat-x;
	background-position:top left;
}

form#loginform input.login {
	padding:0;
	width:75px;
	height:28px;
	text-indent:-1000em;
	color:#333;
	background-color:transparent;
	background-image:url(../images/login.gif);
	background-repeat:no-repeat;
	background-position:top left;
}


form#loginform input.cancel {
	clear:none;
	margin-left:5px;
	padding:0;
	width:75px !important;
	height:28px;
	text-indent:-1000em;
	color:#333;
	background-color:transparent;
	background-image:url(../images/cancel.gif);
	background-repeat:no-repeat;
	background-position:top left;
}

textarea {
	border:solid 1px #ccc;
}

label.required {
	color:#f00;
}

a#login {
	position:absolute;
	top:20px;
	right:8px;
	font-size:12px;
	line-height:20px;
	text-decoration:none;
}

a#login:hover {
	text-decoration:underline;
}

div.column {
	float:left;
	margin:0;
	padding:0;
	width:200px;
}

div.clear {
	clear:both;
}

body.home div.panel a {
	position:relative;
	display:block;
	margin:0;
	padding:0;
}

div.panel a img {
	display:block;
	margin:0;
	padding:0;
	border:none;
}

div.panel a span.caption {
	position:absolute;
	bottom:5px;
	left:0px;
	display:none;
	margin:0;
	padding:10px 0;
	width:800px;
	font-size:13px;
	line-height:20px;
	color:#009ad9;
	background-color:#fff;
}

div.panel a:hover span.caption {
	display:block;
}

/* cycle styles */

div.slides,
div.panel {
	margin:0;
	padding:0;
	width:800px;
	height:390px;
	overflow:hidden;
}

div.slides {
	background-image:url(../images/loading.gif);
	background-repeat:no-repeat;
	background-position:center center;
}

body.projects div.slides,
body.projects div.slides div.panel {
	height:348px;
}

div.panel {
	color:#666;
	background-color:#fff;
}

/* cycle pager controls */

.pager {
	position:absolute;
	top:420px;
	right:5px;
	margin:0;
	padding:0;
	z-index:1000;
}

.pager a {
	float:left;
	display: block;
	margin:0 2px 0 0;
	padding:0;
	height:20px;
	width:20px;
	font-size:13px;
	line-height:20px;
	font-weight:bold;
	text-align:center;
	background:transparent;
	color:#89c1d6;
	background-color:#fff;
	text-decoration: none;
	}

.pager a:hover {	
	color:#009dd9;
	background-color:#fff;
}

.pager a.activeSlide {
	background-color: #009dd9;
	color: #fff;
}