/*
 * Project:   UMarketing
 * Date:      2009-11-12
/* ---------------------------------------- */

* { margin: 0; padding: 0; }

html { margin: 0 0 1px; font-size: 100.01%; }
body { background: #fff; font-size: 62.5%; }
html,body {
	height: 100%;
}
@media only screen and (max-device-width: 480px) { html { -webkit-text-size-adjust: none; } }

body, textarea, input, select, option, button { color: #666; font-family: "Trebuchet MS","Helvetica Neue",Helvetica,Arial,sans-serif; line-height: 1.23; }
li, dt, dd, p, th, td, caption, pre { font-size: 1.3em; }
ul, ol, dl, p, table, pre, h1, h2, h3, h4, h5, h6 { margin-bottom: 20px; }

a { color: #999; text-decoration: none; }
a:hover, a:focus, a:active, a.active { color: #000; }

ul, ol, dd, blockquote { padding-left: 40px; }
ul ul, ol ol, ul ol, ol ul { margin-bottom: 0; }
li *, li p, li li, dt *, dd *, p *, th *, td * { font-size: 1em; }

img { border: none; -ms-interpolation-mode: bicubic; }
pre { font-family: "Courier New",monospace; white-space: pre-wrap; }
table { border-collapse: collapse; border-spacing: 0; }
button { overflow: visible; padding: 0 10px; cursor: pointer; } button::-moz-focus-inner { padding: 0; border: none; }

hr { overflow: hidden; height: 1px; margin: 15px 0 !important; margin: -5px 0 8px; padding: 0; border: none; background-color: #ccc; color: #ccc; }
*:first-child+html hr { margin: -7px 0 8px !important; }

.offset { position: absolute !important; left: -10001px !important; overflow: hidden !important; }

/* LAYOUT
------------------------------------------- */
#overlay { display: none; position: fixed; z-index: 200; top: 0; left: 0; width: 100%; height: 100%; background: #fff url(../images/loader.gif) 50% 50% no-repeat; }
 * html #overlay { position: absolute; }

/* CORNERS
------------------------------------------- 
#corners { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/1pixel.gif) no-repeat; min-width: 1000px; min-height: 650px; }
html.js #corners { display: none; }
 html.js body.loaded #corners { display: block; }
 #corners span { position: fixed; display: block; width: 100%; height: 100%; min-width: 1000px; min-height: 650px; }
 #corners .a { background: url(../images/1pixel.gif) 100% 0 no-repeat; }
 #corners .b { background: url(../images/1pixel.gif) 0 100% no-repeat; }
 #corners .c { background: url(../images/1pixel.gif) 100% 100% no-repeat; }

* html #corners, * html.js body.loaded #corners, * html #corners span  { position: absolute; display: none; }
------------------------------------------- */

#root { position: relative; z-index: 100; width: 960px; margin: 0 auto; min-height: 100%; }
* html #root { height: 100%; }
html.js #root { display: none; }
 html.js body.loaded #root { display: block; }

 #top { position: relative; height: 133px; }
  #logo { position: absolute; left: 0; top: 18px; width: 70px; height: 116px; margin: 0; }
   #logo a { display: block; width: 100%; height: 100%; background: url(../images/new-logo.png) no-repeat; text-indent: -999em; overflow: hidden; }
/*    #logo a:hover, #logo a:focus, #logo a:active { background-position: 0 100%; } */
  #skip-links { position: absolute; top: 0; left: -10001px; list-style: none; margin: 0; padding: 0; }
   #skip-links li a:focus, #skip-links li a:active { display: block; position: absolute; left: 10001px; top: 0; z-index: 10001; width: 200px; margin: 15px 0 0 15px; padding: 2px 0; background: #333; color: #fff; text-align: center; text-decoration: none; }
 #nav { position: absolute; right:0; top: 12px; list-style: none; margin: 0; padding: 0; }
  #nav li { float: left; font-size: 1.2em; margin: 0 0 0 24px; }
   #nav li a { color: #999; text-decoration: none; }
   #nav li a:hover, #nav li a:focus, #nav li a:active, #nav li a.active { color: #000; }
   #nav li em { position: absolute; left: -10001px; top: -10001px; }
 #content { width: 100%; overflow: hidden;  position: relative;
		padding-bottom: 8em;
}
 * html #content {  background: #fff; clear: both;}
  .wrapper-a { float: right; width: 760px; }
  .work-wrapper { margin-top: 22px;}
  * html .wrapper-a { background: #fff; }
   .main { float: left; width: 630px; padding: 17px 0 0; }
   .main-b { padding: 0; }
   .aside-a { float: right; width: 145px; padding: 17px 0 0; }
  .aside-b { float: left; width: 190px; padding: 17px 0 0 1px; line-height: 1.67;  }  /* 1px right padding fixes some strange text trimming */
 #footer { width: 960px; margin: -34px auto 0 auto; display: none; position: relative; z-index: 300;}
  #footer p { font-size: 1.1em; color: #999; }
   #footer p span { margin: 0 10px; }

  #worksub {margin-left:15px; margin-bottom:5px; margin-top:5px;}
  #worksub li{line-height:1.4em;}
   
/* GENERAL
------------------------------------------- */

/* headers */

h1, h2, h3, h4, h5, h6 { color: #000; font-weight: normal; margin: 0 0 15px; }
h1 { font-size: 3em; }
h2 { font-size: 2.4em; }
 h2 em { font-style: normal; text-decoration: underline;  }
h3 { font-size: 1.8em; margin: 0 0 10px;  }
 h3.slogan { color: #666; margin: -15px 0 15px;  }
 h3.a { color: #666; }
h4 { font-size: 1.6em; }
h5 { font-size: 1.4em; }
h6 { font-size: 1.0em; }

/* containers */

.bio { overflow: hidden; }
 .bio .portrait { float: left; margin: 0 20px 0 0; }

 .bio .description { float: left; width: 460px; }
  .bio .description h2 { font-size: 1.4em; margin: 0; }
  .bio .description .position { font-size: 1.4em; }
  .bio .description blockquote { padding: 0; font-style: italic; }

.intro { color: #999; }
 .intro h2 { color: #999; }
 .intro p { font-size: 1.4em; }
 .intro p.call-to-action { font-size: 1.2em; text-align: center; margin: 30px 0; }
  .intro p.call-to-action a { color: #000; }
  .intro p.call-to-action span { display: -moz-inline-stack; display: inline-block; margin: 0 30px; text-indent: -999em; }

.offices { width: 100%; overflow: hidden; margin: 0 0 30px; }
 .offices .office { float: left; width: 210px; }
  .offices .office h3 { font-size: 1.6em; color: #666; margin: 0 0 5px; }
   .offices .office h3 span { color: #e4002b; }
  .offices .office p { padding: 0 0 0 5px; margin: 0; color: #999;  }
/* forms */

.form-a { }
 .form-a p { width: 100%; overflow: hidden; margin: 0 0 10px; } 
  .form-a label { float: left; width: 60px; text-align: right; margin: 0 10px 0 0; line-height: 20px; }
  .form-a input { width: 284px; height: 16px; padding: 2px 5px; background: url(../images/form-a-field.png) no-repeat; line-height: 1; border: none; font-size: 12px; }
  .form-a textarea { width: 284px; height: 105px; padding: 5px 5px; background: url(../images/form-a-textarea.png) no-repeat; line-height: 1; border: none; font-size: 12px; resize: none; overflow: auto; }
 .form-a p.submit { padding-left: 0px; font-size: 1.2em; width: auto; zoom: 1; }
  .form-a p.submit button { display: block; width: 61px; height: 20px; background: url(../images/form-a-button.png) no-repeat; text-align: center; color: #fff; line-height: 20px; border: none; text-transform: lowercase; }
  .form-a p.submit button:hover,  .form-a p.submit button:focus, .form-a p.submit button:active  { background-position: 0 100%; }

 .form-a .error { width: 230px; padding: 12px 15px 12px 50px; margin: 0 0 15px 70px; color: #fff; font-size: 1.2em; background: #e4002b url(../images/ico-error.png) 10px 50% no-repeat; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
/* tables */

table { }
 table th, table td { padding: 5px 10px; border: 1px solid #ccc; }

/* lists */

ul.a { }
 ul.a li { margin: 0 0 10px; }

ul.b { width: 100%; overflow: hidden; }
 ul.b li { width: 50%; float: left; }
 
/* SPECIFIC
------------------------------------------- */
.aside-b h3 { font-size: 1.2em; margin: 0; text-transform: uppercase; }
.aside-b ul { padding: 0; list-style: none; margin-left: 12px; letter-spacing: 0.0em; } /* side nav */
 .aside-b ul li { font-size: 1.2em; }
  .aside-b ul li ul { padding: 0 0 0 15px; }
   .aside-b ul li ul li { font-size: 1em; }

.contact { width: 100%; overflow: hidden; }
 .contact .col-a { position: relative; float: left; width: 200px; }
 .contact .col-b { float: right; width: 400px; }
 .contact .select-a { width: 170px; height: 20px; padding: 0 0 0 20px; background: url(../images/request-a.png) no-repeat; line-height: 18px; font-size: 1.2em; }
  .contact .select-a a { display: block; height: 100%; padding: 0 5px; background: url(../images/request-a.png) 100% 0 no-repeat; color: #fff; line-height: 18px; white-space: nowrap; }

.dropdown-a { position: absolute; z-index: 1000; left: 20px; top: 17px; width: 170px; padding: 3px 0; margin: 0; background: #797979; list-style: none; border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; -webkit-border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; -moz-border-radius-bottomright: 5px; -webkit-border-bottom-right-radius: 5px; }
 .dropdown-a li { font-size: 1.2em;  }
  .dropdown-a li a { display: block; padding: 3px 5px; color: #fff; white-space: nowrap; }
  .dropdown-a li a:hover, .dropdown-a li a:focus, .dropdown-a li a:active { background: #000; }


 .contact .form-a .col-b .error { width: 230px; margin: 0 0 15px 100px; }
 .contact .form-a .col-b label { width: 90px;  }
 .contact .form-a .col-b p.submit { padding-left: 100px; width: auto; zoom: 1; }

.project-description { }
 .project-description h3 { color: #666; font-style: italic; font-size: 1.2em; margin: 0; letter-spacing: 0.05em; }
 .project-description p { font-size: 1.1em; line-height: 1.6em; letter-spacing: 0.05em; }
 .project-description p.client { font-size: 1.2em; line-height: 1em; margin-top: 10px; color: #ff3333; letter-spacing: 0.08em;}

.work-layout { float:left; position: relative; }
#gallery .large {  }
html.js #gallery .large { background: url(../images/loader.gif) 50% 50% no-repeat; }
 html.js #gallery .large img {  }

#gallery { position:relative; }
#gallery .thumbs { padding: 1px; list-style: none; overflow: hidden; zoom: 1; }
 #gallery .thumbs li { float: left; margin: 0 9px 0 0; }
  #gallery .thumbs li a { display: block; }
   #gallery .thumbs li img { display: block; }
#gallery.client-gallery {
	width: 570px;
	overflow: hidden;
}
#gallery .montage {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 12;
	width: 40px;
	height: 40px;
	display: block;
	overflow: hidden;
	text-indent: -99999px;
	background: url('images/1pixel.gif');
/*	background: #f0f; */
/*	opacity: 0.5; */
}
/*
.work-layout #thumbnail-nav {
display:table;
border:1px solid #000;
padding:2px;
white-space:nowrap;
}
.work-layout #thumbnail-nav ul {
list-style:none;
margin:0;
padding:0;
display:table-row;
white-space:nowrap;
}

.work-layout #thumbnail-nav ul li{
display:table-cell;
}

.work-layout #thumbnails {display:inline-block;}
.work-layout #thumbnails{display:inline; }
.work-layout #thumbnails li{display:inline-block}
.work-layout #thumbnails li{ display:inline;}
#thumbnail-nav ul a{ display:inline-block;}
#thumbnail-nav{text-align:left}
*/
.work-layout #thumbnails {
	list-style: none;
	padding: 0;
	overflow: hidden;
	
}
.work-layout #thumbnails li {
	list-style: none;
	display: block;
	float: left;
	line-height: 57px;
	height: 60px;
	margin-right: 10px;
}
* html .work-layout #thumbnails li,
*+html .work-layout #thumbnails li {
	font-size: 53px;
	line-height: 0;
}
.work-layout #thumbnails li img{
	vertical-align: middle;
	border: 1px solid #c5c5c5;
}
.work-layout #thumbnails li.back-to-client {
	background: url(../images/arrow.gif) no-repeat 0 center;
	width: 32px;
	height: 60px;
	font-size: 0;
	line-height: 60px;
}
* html .work-layout #thumbnails li.back-to-client,
*+html .work-layout #thumbnails li.back-to-client {
	height: 64px;
}
.work-layout #thumbnails li.back-to-client a {
	display: block;
	width: 32px;
	height: 60px;
	overflow: hidden;
	text-indent: -99999px;
}
/*

<div class="greenBorder" style="display: table; height: 400px; #position: relative; overflow: hidden;">

	<div style=" #position: absolute; #top: 50%;display: table-cell; vertical-align: middle;">
		<div class="greenBorder" style="#position: relative; #top: -50%; ">



#widget #widget-right ul li div.bubble {
	border-top: 1px solid #f7f7f7;
	position: absolute;
	left: 16px;
	top: 0;
	width: 201px;
	height: 46px;
	display: table;
	border-collapse: collapse;
	background: #b2b2b2;
}
#widget #widget-right ul li div.arrow {
	position: absolute;
	display: none;
	left: 0;
	top: 0;
	height: 45px;
	width: 16px;
	overflow: hidden;
	background: url(/public/img/arrow.png);
}
body.ie6 #widget #widget-right ul li div.arrow {
	background: transparent;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='public/img/arrow.png', sizingMethod='scale');
}
#widget #widget-right ul li div.bubble p {
	display: table-cell;
	vertical-align: middle;
	border-collapse: collapse;
	text-align: left;
	padding-left: 8px;
	font-size: 12px;
	color: #272727;
	line-height: 15px;
}
*/

#title { display: none; }

/* behind our work navigation */
#bow-nav { width: 100%; overflow: hidden; font-size: 1.4em; line-height: 30px; font-weight: bold; }
#bow-nav em { float:left; color:#666; margin-right:5px; font-style:normal;} 
#bow-nav a { float: left; display: block; padding: 0 5px 0 5px; margin: 0 5px 0 0; height: 30px; color: #d5d5d5; background: #fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
 #bow-nav a.active { float: left; display: block; padding: 0 5px 0 5px; margin: 0 5px 0 0; height: 30px; color: #ff3333; background: #fff; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
 #bow-nav a.next { padding: 0 5px 0 5px; background: #fff }
 #bow-nav span { position: absolute; left: -999em; }
 h3.adjust {
	margin-top: 13px;
}