body{background:#fff ;}
#wrapper{margin:0 auto;width:960px;padding:36px 0;background-color:#fff;position:relative;}
#primary{position:relative;float:left;width:550px;border-right:1px dotted #8B9298;padding-right:5px;}
#secondary{width:190px;position:relative;float:left;border-right:1px dotted #8B9298;padding-left:5px;}
#third{width:200px;position:relative;float:right;}

/*.col{width:144px;padding-right:10px;border-right:1px dotted #8B9298;float:left;margin-right:10px;}*/
.col{width:155px;padding-right:10px;float:left;margin-right:10px;}
.span-2{width:468px;float:right;}
.last{margin-right:0;border:0;padding-right:0;}
.grid-1{width:224px;padding:10px 10px 10px 0;border-right:1px dotted #8B9298;border-bottom:1px dotted #8B9298;float:left;}
.grid-2{width:224px;padding:10px 10px 10px 10px;border-right:1px dotted #8B9298;border-bottom:1px dotted #8B9298;float:left;}
.grid-3{width:224px;padding:10px 0 10px 10px;border-right:0;border-bottom:1px dotted #8B9298;float:left;}
.bottom{border-bottom:0;}
#header{padding-bottom:20px;margin-bottom:40px;border-bottom:1px solid #919195;}
#index #header {margin-bottom:0;}
#header a.logo{display:block;background:url('/images/logo2.gif') no-repeat 0 0;width:240px;height:24px;outline:0;padding:0;}

.container{width:516px;padding:0;margin:0 0 20px 0;clear:both;}
.container .sub{width:102px ;float:left;margin:0;padding:0;}
.container .main{float:right;width:594px;margin:0;padding:0;}
.container .main .col{width:286px;}
.container .main .last{margin-right:0;border:0;padding-right:0;}
.container2{width:594px;margin:0;padding:0;clear:both;}
.container2 .main2{width:482px;float:right;margin:0;padding:0;}
.container2 .sub2{width:102px;float:left;margin:0;padding:0;}

/* ---------------- NAVIGATION ------------------- */
ul#nav{position:absolute;top:36px;right:0;z-index:100;}
ul#nav li{float:left;list-style-type:none;position:relative;list-style-image:none;list-style-type:none;margin-left:0;}
ul#nav li a{height:22px;display:block;text-indent:-9999px;outline:none;float:left;padding:0;}
ul#nav li img{float:left;}
li.what a:hover{background-position:-27px -42px}
body#what li.what a{background-position:-4px -87px;width:127px;}
li.work a:hover{background-position:-50px -42px}
body#work li.work a{background-position:-33px -87px;width:99px;}
/*li.about a{background:url(images/about.png) no-repeat -52px 3px;width:80px;}*/
li.about a:hover{background-position:-52px -42px}
body#about li.about a{background-position:-32px -87px;width:99px;}
li.blog a{background:url('/images/latest.gif') no-repeat -43px 3px;width:89px;}
li.blog a:hover{background-position:-43px -42px}
body#blog li.blog a{background-position:-20px -87px;width:112px;}
li.contact a:hover{background-position:-35px -42px}
body#contact li.contact a{background-position:-10px -87px;width:121px;}

/* ---------------- BREADCRUMB ------------------- */
ul#breadcrumb{text-align:right;font-size:11px;position:absolute;right:0;top:80px;}
ul#breadcrumb li{list-style-type:none;display:inline; padding: 0; margin: 0 5px 0 0;}
ul#breadcrumb li a{}
.banner ul#breadcrumb {position:relative;top:-20px;right:0;margin:0;}

/* ---------------- SIDEBAR SUBNAV ------------------- */
#sub-nav ul {}
#sub-nav ul li {list-style-image: none; list-style-type: none; margin: 0; padding: 0;}
#sub-nav ul li a {background: #fff; padding: 5px 5px; display: block; font: normal small-caps bold 12px/1.5em helvetica, sans-serif;}
#sub-nav ul li a:hover {color:#15759B; background: #C0D1D9;}
#sub-nav ul li.current a, #sub-nav ul li.current a:hover {color: #000; }


	
/* ---------------- BANNER ------------------- */
#banner{border-bottom:3px solid #333;margin-bottom:20px; padding: 0;}
#banner img {padding: 0; margin: 0; border: 0;}


/* ---------------- TYPOGRAPHY ------------------- */
.smaller {font-size: 90%;}
body{font:normal normal normal 14px/1.5em "Helvetica Neue", Arial, Helvetica, sans-serif;color:#4d4d4d;}
#secondary{font-size:12px;}
.sub,.sub2{color:#000;}
.sub p,.sub ul,.sub2 p,.main2{font-size:12px;}
#third{font-size:12px;}
.sub,.sub2{color:#000;}
.sub p,.sub ul,.sub2 p,.main2{font-size:12px;}
#banner h1{background:#333;font:normal normal normal 24px / 1.6em helvetica,sans-serif;color:#C0D1D9;display:inline;padding:6px 3px;}
img.h1{margin-bottom:10px;}
h1, .description p { color:#000;margin:0 0 20px 0;font-size:20px;line-height:1.5em;}
#blog h1{margin:0; line-height: 1.2em; margin-bottom: 20px;}
h1.underline {border-bottom: 1px solid #919195; margin: 0 0 10px 0;}
h2{color:#000;margin:0;font-weight:bold;font-size:14px; margin-bottom: 0px;}
.red{color:#FF0000;margin:0;font-weight:bold;font-size:14px; margin-bottom: 0px;}
h3{color:#000;margin:0 0 10px 0;font-weight:normal;font-size:12px;line-height:1.4em;}
h4{background:#333;font:normal normal normal 24px/1.5em helvetica,sans-serif;color:#C0D1D9;display:inline;padding:4px 0;letter-spacing:.1em;}
code{background:#333;color:#ccc;padding:6px; display: block;}
a{color:#15759B;text-decoration:none;outline:none;padding:0px;}
a:hover{background:#15759B;color:#fff;}
#banner a:hover {background:none;}
a:focus{outline:none}
a.img{padding:0;}
a:hover.img{background-color:transparent;text-decoration:none;}
.warn {color: #ED1E79;}
ul{margin-bottom:20px;}
ul li{list-style:circle;margin-left:15px;}

.container .main h1{margin-top:0;}
.container .main .col ul{margin:0 0 20px 0;}
.container .main .col ul li{list-style-type:none;list-style-image:none;margin:0;}
.container .sub ul{margin:0 0 10px 0;}
.container .sub ul li{list-style-type:none;list-style-image:none;margin:0;}
.highlight{background:#FCF9B9;}
.nerdery ul li a:hover{text-decoration:underline;color:#15759B;}


/* ---------------- MISC DESIGN ELEMENTS ------------------- */
hr{height:1px;background-color:#8B9298;color:#8B9298;border:0;clear:both;margin:10px 0 20px 0;}
hr.lite {height:1px;background-color:#eee;color:#eee;border:0;clear:both;margin:10px 0 20px 0;}
.clear{clear:both;height:1%;}
.main2 hr{margin:0 0 10px 0;height:2px;border-bottom:1px dotted #8B9298;background-color:#fff;color:#fff;}
#primary .main img.left { float: left; margin: 0 15px 10px 0; }
#primary .main img.right { float: right; margin: 0 0 10px 15px; }
.sfondo{background: transparent url(/images/sfondo.png) repeat-y center;}

/* ---------------- STICKIES ------------------- */
div.sticky-blue{width:144px;height:250px;padding:20px 10px 10px 10px;overflow:hidden;background:transparent url(/images/blue.png) no-repeat top left;position:relative;}
div.sticky-beige{width:144px;height:250px;padding:20px 10px 10px 10px;overflow:hidden;background:transparent url('/images/beige.png') no-repeat top left;position:relative;}
div.sticky-yellow{width:144px;height:250px;padding:20px 10px 10px 10px;overflow:hidden;background:transparent url(/images/yellow.png) no-repeat top left;position:relative;}
div.sticky-nav{position:absolute;right:10px;bottom:0;}
div.sticky-giant{background:#fef8c3;border:1px solid #d7cc68;}
.sticky-giant div.warn ul {margin: 10px 0 0 10px;}
div.sticky-blue h1, div.sticky-beige h1, div.sticky-yellow h1 { color:#000;margin:0 0 10px 0;font-weight:bold;font-size:14px; }
div.sticky-blue h1 a, div.sticky-beige h1 a, div.sticky-yellow h1 a { color:#000; }
div.sticky-blue h1 a:hover, div.sticky-beige h1 a:hover, div.sticky-yellow h1 a:hover { background:none; }

/* ---------------- Featured carousel STICKIES ------------------- */
#featured-nav{position:relative;}
#featured-nav .buttons{position:absolute;right:0;bottom:10px;}
#featured {position: relative;}
#featured li{width:144px;margin-left:0;margin-bottom:10px; position: relative;}

/* ---------------- Featured carousel OUR WORK IMGS ------------------- */
#work #featured{border:5px solid #E2DFD3;margin-bottom:20px;padding:0px;}
#work #featured ul{padding:0;margin:0; position: relative;}
#work #featured li{width:580px;margin:0px;padding:0;}
#work #featured li img{padding:5px 5px 0 5px;margin:0;}
#work #featured-nav .buttons{position:absolute;right:0;bottom:9px;}
#work p.screenshot{color:#4d4d4d;}
#work p.screenshot strong{color:#000;}
#work p.screenshot span{color:#000;font-weight:bold;}

/* ---------------- The Latest ------------------- */
#secondary ul.latest li{margin-bottom:10px;list-style-type:none;list-style-image:none;margin-left:0px; text-align:left;}
#secondary ul.latest li p{margin:0;}
#secondary ul.latest li p.date{color:#919195;}
#third ul.latest li{margin-bottom:0px;list-style-type:none;list-style-image:none;margin-left:0px; text-align:left;}
#third ul.latest li p{margin:0;}
#third ul.latest li p.date{color:#919195;}

.categories ul,.archives ul{margin:0;}
.categories,.archives{font-size:11px;line-height:1.2em;}
.categories ul li,.archives ul li{margin-bottom:0;list-style-type:none;list-style-image:none;margin-left:0px;display:block;position:relative;border-bottom:1px solid #eee;}
.categories ul li span,.archives ul li span{position:absolute;right:0;color:#4d4d4d;}
#pageBlog .main img{border:10px solid #E2DFD3;float:right;margin-left:10px;}

/* ---------------- IMAGES ------------------- */

img.frame{border:0px solid #E2DFD3; padding: 0px;}
a:hover img.frame{border:0px solid #C0D1D9;}
#secondary a img.frame{border:0px solid #E2DFD3;}
#secondary a:hover img.frame{border:0px solid #C0D1D9;}
#secondary img.left{margin:0 4px 0px 0; padding: 0;}
#secondary img.last{margin:0 0 0px 0;}
#secondary #portraits {position:relative; height: 326px;}
#secondary img.portrait {border:5px solid #E2DFD3; padding: 5px; position:absolute;}
#secondary img#portrait2{display: none;}
/* ---------------- Beep Boops ------------------- */
#secondary ul.beepboop img{display: none;}

#secondary ul#phwitter.beepboop li {padding:8px 8px 16px 8px;display:block; background: #E2DFD3 url('/images/beige.png') no-repeat bottom right;}
#secondary ul#phwitter.beepboop li span.twitter_link {font-size:70%}

/* ---------------- Footer ------------------- */
#footer{border-top:3px solid #333;clear:both;margin:20px 0;padding-top:10px;}
#footer p{font-size:12px;margin:0;}

/* ---------------- TOOL TIPS ------------------- */
#tooltip{position:absolute;z-index:3000;border:1px solid #111;background-color:#000;padding:5px 10px;color:#FCF9B9;}
#tooltip h3,#tooltip div{margin:0;color:#FCF9B9;font:normal normal normal 12px/1.5em helvetica,sans-serif;margin:0;text-transform:none;}

/* ---------------- Adwords table ------------------- */

table#adwords  {width: 516px;}
table#adwords th {border: 0; text-align: left;border-bottom: 1px dotted #8B9298; color: #000; font-weight:bold;font-size:14px; padding-bottom: 0;}
table#adwords td {border: 0; border-bottom: 1px solid #eee;}

table#coladwords  {width: 180px;}
table#coladwords th {border: 0; text-align: left;border-bottom: 1px dotted #8B9298; color: #000; font-weight:bold;font-size:14px; padding-bottom: 0;}
table#coladwords td {border: 0; border-bottom: 1px solid #eee;}

/*------------------------------------------------------*/
#mytable {
	width: 516px;
	padding: 0;
	margin: 0;
}

caption {
	padding: 0 0 5px 0;
	width: 516px;	 
	font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	text-align: right;
}

th {
	font: bold 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #4f6b72;
	border-right: 1px solid #C1DAD7;
	border-bottom: 0px solid #C1DAD7;
	border-top: 0px solid #C1DAD7;
	letter-spacing: 2px;
	text-transform: uppercase;
	text-align: center;
	padding: 6px 6px 6px 12px;
	background: #CAE8EA url(/images/bg_header.jpg) no-repeat;
}

th.nobg {
	border-top: 0;
	border-left: 0;
	border-right: 1px solid #C1DAD7;
	background: none;
	text-align:center
}

td {
	border-right: 1px solid #C1DAD7;
	border-bottom: 1px solid #C1DAD7;
	background: #fff;
	padding: 3px 3px 3px 6px;
	color: #4f6b72;
}


td.alt {
	background: #F5FAFA;
	color: #797268;
}

th.spec {
	border-left: 0px solid #C1DAD7;
	border-top: 0;
	background: #fff url(/images/bullet1.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
}

th.specalt {
	border-left: 0px solid #C1DAD7;
	border-top: 0;
	background: #f5fafa url(/images/bullet2.gif) no-repeat;
	font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #797268;
}
