body {
	background-image : url(../images/body.jpg);
	background-position : 400px 0px;
	background-color : #2e3133;
}

.navigation {
	width : 400px;
	height : 480px;
}

	.navigation, .navigation ul.toolbar li a {
		background-image : url(../images/navigation.jpg);
	}

		ul.toolbar li.c1 a { background-position : -52px -152px }
		ul.toolbar li.c2 a { background-position : -152px -152px }
		ul.toolbar li.c3 a { background-position : -252px -152px }
		ul.toolbar li.c4 a { background-position : -52px -252px }
		ul.toolbar li.c5 a { background-position : -152px -252px }
		ul.toolbar li.c6 a { background-position : -252px -252px }
		ul.toolbar li.c7 a { background-position : -52px -352px }
		ul.toolbar li.c8 a { background-position : -152px -352px }
		ul.toolbar li.c9 a { background-position : -252px -352px }

		/* active and hover */

		ul.toolbar li.c1 a.active, ul.toolbar li.c1 a:hover   { background-position :  -52px -493px }
		ul.toolbar li.c2 a.active, ul.toolbar li.c2 a:hover   { background-position : -152px -493px }
		ul.toolbar li.c3 a.active, ul.toolbar li.c3 a:hover   { background-position : -252px -493px }
		ul.toolbar li.c4 a.active, ul.toolbar li.c4 a:hover   { background-position :  -52px -593px }
		ul.toolbar li.c5 a.active, ul.toolbar li.c5 a:hover   { background-position : -152px -593px }
		ul.toolbar li.c6 a.active, ul.toolbar li.c6 a:hover   { background-position : -252px -593px }
		ul.toolbar li.c7 a.active, ul.toolbar li.c7 a:hover   { background-position :  -52px -693px }
		ul.toolbar li.c8 a.active, ul.toolbar li.c8 a:hover   { background-position : -152px -693px }
		ul.toolbar li.c9 a.active, ul.toolbar li.c9 a:hover   { background-position : -252px -693px }

	ul.toolbar li, ul.toolbar li a {
		width : 100px;
		height : 100px;
	}

	ul.toolbar {
		top : 152px;
		left : 52px;
		width : 300px;
		height : 300px;
	}

.content {
	width : 400px;
	background-image : url(../images/body-top.jpg)
}


	.green .content-header { background-image : url(../images/content-header-green.jpg) }
		.green .content-header-wt { background-image : url(../images/content-header-top-green.jpg); }

	.silver .content-header { background-image : url(../images/content-header-silver.jpg) }
		.silver .content-header-wt { background-image : url(../images/content-header-top-silver.jpg); }

	.trans .content-header { background-image : url(../images/content-header-trans.jpg) }
		.trans .content-header-wt { background-image : url(../images/content-header-top-trans.jpg); }

	.gold .content-header { background-image : url(../images/content-header-gold.jpg) }
		.gold .content-header-wt { background-image : url(../images/content-header-top-gold.jpg); }

	.black .content-header { background-image : url(../images/content-header-black.jpg) }
		.black .content-header-wt { background-image : url(../images/content-header-top-black.jpg); }

	.purple .content-header { background-image : url(../images/content-header-purple.jpg) }
		.purple .content-header-wt { background-image : url(../images/content-header-top-purple.jpg); }

	.blue .content-header { background-image : url(../images/content-header-blue.jpg) }
		.blue .content-header-wt { background-image : url(../images/content-header-top-blue.jpg); }

	.brown .content-header { background-image : url(../images/content-header-brown.jpg) }
		.brown .content-header-wt { background-image : url(../images/content-header-top-brown.jpg); }

	.pink .content-header { background-image : url(../images/content-header-pink.jpg) }
		.pink .content-header-wt { background-image : url(../images/content-header-top-pink.jpg); }

	.red .content-header { background-image : url(../images/content-header-red.jpg) }
		.red .content-header-wt { background-image : url(../images/content-header-top-red.jpg); }

	.seabreeze .content-header { background-image : url(../images/content-header-seabreeze.jpg) }
		.seabreeze .content-header-wt { background-image : url(../images/content-header-top-seabreeze.jpg); }
		
	.content-body {
		background-image : url(../images/content-body.jpg)
	}

		.content-body-wt {
			background-image : url(../images/content-body-top.jpg);
		}
		
		.content-body-wb {
			background-image : url(../images/content-body-bottom.jpg);
		}
		
		.content-body-facebook {
			background-image : url(../images/content-body-facebook.jpg);
			height : 453px;
		}

		.content-body-map {
			background-image : url(../images/content-body-map.jpg);
			height : 453px;
		}
		
		.facebook-sideline {
			width : 100px;
		}
		
		.map-excerpt {
			margin-top : 250px;
		}
		
			.list-box { 
				background-image : url(../images/list-box.jpg);
				height : 45px;
			}

			.list-box-splitter { 
				background-image : url(../images/list-box-splitter.jpg);
			}
			
			.dcm-section {
				height : 970px
			}
			
			.item-fix-hg {
				height : 150px;
			}
			
			.item-fix-hg2 {
				height : 250px;
			}
			
			.design-service {
				height : 821px;
				width : 400px;
				background-image : url(../images/design-service.jpg);
			}
			
			.image-holder, .image-holder-caption {
				width : 352px;
			}
			
		
		.widget-120 { width : 120px }
		.widget-160 { width : 160px }
		.widget-platform-show { height : 268px; background-image : url(../images/widget-platform.jpg) }
		.widget-base { background-image : url(../images/widget-bg.jpg) }
		
		
		.iphone-preview {
			background-image : url(../images/iphone-preview.jpg);
		}
		
		.mobile-platform-list { width : 250px;
			
		}
		
		.mobile-sample-app {
			height : 268px;
			background-image : url(../images/mobile-sample-app.jpg);
		}
		
		.profile-mbp {
			background-image : url(../images/mbp-header.jpg);
			height : 121px;
		}
		
		.profile-imac {
			background-image : url(../images/imac-header.jpg);
			height : 121px;
		}