body { 
	font-size: 62.5%; 
	background-color: #F4F4F5; 
	color: #666666;
}

h2 {
	font: normal normal normal 4em/1 "mink ot bold", "Arial Black", sans-serif;
	letter-spacing: -1px;
	color: #333333;
	margin-bottom: 0.3em;
	display: inline;
	margin-right: 25px;
}

h3 {
	font: normal normal normal 2.8em/1 "mink ot bold", "Arial Black", sans-serif;
	letter-spacing: -1px;
	color: #333333;
	margin-bottom: 0.3em;
}

h4 {
	font: normal normal normal 3.6em/1 "mink ot bold", "Arial Black", sans-serif;
	letter-spacing: -0.2px;
	color: #999999;
}

h5 {
	font: normal bold normal 1.4em/1 arial, sans-serif;
	color: #000000;
	letter-spacing: -0.2px;
}

a {
	###font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
	text-decoration: underline;
	color: #009CA8;
}

a:hover {
	text-decoration: none;
	color: #000000;
}

p {
	font: normal normal normal 1.8em/1.2 arial, sans-serif;
	letter-spacing: -0.5px;
	padding-bottom: 10px;
}

.intro-text p {
	font: normal normal normal 2.4em/1.1 arial, sans-serif;
	letter-spacing: -1px;
    margin-bottom: 10px;
}	

h6 {
	font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
}

.contact-spacer {
	color: #666666;
	display: inline;
	padding: 0px 3px 0px 3px;
}

form ul li {
	margin-bottom: 10px;
	font-family: arial, sans-serif;
}

form ul li.faux-label {
	margin-left: 150px;	
}

form ul li label {
	display: block;
	float: left;
	width: 150px;
	font-size: 1.4em;
}

form ul li input, form ul li select, form ul li textarea {
	font-size: 1.4em;
	padding: 5px;
}

#head {
	background-color: #2E2E2E;
	padding: 20px 0 20px;
	height: 100%;
	overflow: hidden;	
}

#head #logo {
	display: none;
}

#head h1 a {
	display: block;
	width: 300px;
	height: 88px;
	background: transparent url('../images/header-logo-text.png') no-repeat;	
	text-indent: -9999px;
}

#head-contact {
	padding-top:28px;
}

#head-contact p {
	font-size: 1.4em;
	line-height: 1.3;
	letter-spacing: 0.2px;
	color: #666666;
}


#head-contact p.get-in-touch {
	font-weight: bold;
	font-style: italic;
	color: #cccccc;
}

.head-email {
	color: #86C340;
	display: inline;
}

.head-phone {
	color: #6FBB67;
	display: inline;

}

#page-heading p {
	
	font: normal normal normal 2.4em/1.1 arial, sans-serif;
	letter-spacing: -1px;
    margin-bottom: 10px;

}

#client-log-in {
	padding-top: 37px;
}

#client-log-in a {
	font: normal bold normal 1.4em/1 arial, sans-serif;
	color: #58B28D;
	letter-spacing: -0.5px;
	text-align: center;
	text-decoration: none;
	background: transparent url('../images/button-large.png') no-repeat;
	width: 140px;
	height: 35px;
	border: none;
	display: block;
	padding-top: 10px;
}

#client-log-in a:hover {
	color: #E6E6E6;
	background: transparent url('../images/button-large-over.png') no-repeat;
}
		
#head-gradient {
	display: block;
	background: url('../images/gradient-line.png') repeat-y center center;
	height: 100%;
	overflow: hidden;
	padding-bottom:5px;
}

#navigation-bar {
	display: block;
	background-color: #2e2e2e;
	height: 100%;
	overflow: hidden;
	padding: 8px 0px;
}

#navigation-buttons ul {
	list-style: none outside none;
}

#navigation-buttons li {
	display: inline;
	float: left;
	margin-right: 30px;	
}

#navigation-buttons li a {
	display: block;
	width: 118px;
	height: 25px;
	font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
	text-decoration: none;
	color: #999999;
	text-align:center;
	padding-top: 5px;
}

#navigation-buttons li.active a,
#navigation-buttons li a:hover {
	background: url('../images/navigation-over.gif') no-repeat;
	color:#F2F2F2;
}

#main {
	display: block;
	background: url('../images/content-top-grad.png') repeat-x;
}	

#main-bottom {
	margin-top: 20px;
	display: block;
	height: 40px;
	background: url('../images/content-bottom-grad.png') repeat-x;
}

#loop-graphic {
	margin-top: 40px;
	margin-bottom: 20px;
	width: 282px;
	height: 282px;
	position: relative;
	top: 15px;
}
	
#home-copy {
	margin-top: 110px;
}	 

#clients {
	display: block;
	background: url('../images/gradient-line.png') repeat-y center center;
	height: 100%;
	overflow: hidden;
	padding-bottom:20px;
}

#clients ul {
	list-style: none outside none;
	margin-top: 40px;
	padding: 0;
}

#clients li {
	display: inline;
}

#clients li a {
	display: block;
	text-indent: -9999px;
	float: left;	
	margin-right: 20px;
	margin-bottom: 15px;
}

#clients li a#client-blossom {
	background: transparent url('../images/clients/logo-blossom.png') no-repeat left center;
width: 61px;
height: 62px;
}

#clients li a#client-blossom:hover {
	background: transparent url('../images/clients/logo-blossom-over.png') no-repeat left center;
width: 61px;
height: 62px;
}	

#clients li a#client-nowthen {
	background: transparent url('../images/clients/logo-nowthen.png') no-repeat left center;
width: 131px;
height: 63px;
}

#clients li a#client-nowthen:hover {
	background: transparent url('../images/clients/logo-nowthen-over.png') no-repeat left center;
width: 131px;
height: 63px;
}

#clients li a#client-goingandcoming {
	background: transparent url('../images/clients/logo-going.png') no-repeat left center;
width: 127px;
height: 56px;
}

#clients li a#client-goingandcoming:hover {
	background: transparent url('../images/clients/logo-going-over.png') no-repeat left center;
width: 127px;
height: 56px;
}

#clients li a#client-hakuba {
	background: transparent url('../images/clients/logo-hakubatv.png') no-repeat left center;
width: 138px;
height: 66px;
}

#clients li a#client-hakuba:hover {
	background: transparent url('../images/clients/logo-hakubatv-over.png') no-repeat left center;
width: 138px;
height: 66px;
}

#clients li a#client-peaceoneday {
	background: transparent url('../images/clients/logo-peace.png') no-repeat left center;
width: 47px;
height: 73px;
}

#clients li a#client-peaceoneday:hover {
	background: transparent url('../images/clients/logo-peace-over.png') no-repeat left center;
width: 47px;
height: 73px;
}

#clients li a#client-power {
	background: transparent url('../images/clients/logo-power.png') no-repeat left center;
width: 300px;
height: 47px;
}

#clients li a#client-power:hover {
	background: transparent url('../images/clients/logo-power-over.png') no-repeat left center;
width: 300px;
height: 47px;
}

#clients li a#client-positive {
	background: transparent url('../images/clients/logo-positive.png') no-repeat left center;
clear:left;
width: 214px;
height: 49px;
}

#clients li a#client-positive:hover {
	background: transparent url('../images/clients/logo-positive-over.png') no-repeat left center;
width: 214px;
height: 49px;
}

#clients li a#client-drago {
	background: transparent url('../images/clients/logo-drago.png') no-repeat left center;
width: 140px;
height: 24px;
}

#clients li a#client-drago:hover {
	background: transparent url('../images/clients/logo-drago-over.png') no-repeat left center;
width: 140px;
height: 24px;
}

#clients li a#client-freedland {
	background: transparent url('../images/clients/logo-freedland.png') no-repeat left center;
width: 218px;
height: 22px;
}

#clients li a#client-freedland:hover {
	background: transparent url('../images/clients/logo-freedland-over.png') no-repeat left center;
width: 218px;
height: 22px;
}

#clients li a#client-golana {
	background: transparent url('../images/clients/logo-golana.png') no-repeat left center;
width: 140px;
height: 26px;
}

#clients li a#client-golana:hover {
	background: transparent url('../images/clients/logo-golana-over.png') no-repeat left center;
width: 140px;
height: 26px;
}

#sign-up {
	background:#2E2E2E;
	padding:20px 0px;
	height:100%;
	overflow: hidden;
}

#newsletter-form label {
	font: normal normal normal 2em/1 "mink ot bold", "Arial Black", sans-serif;
	letter-spacing: -0.2px;
	color: #999999;
	margin-top: 10px;
}

#newsletter-form button {
	font: normal bold normal 1.4em/1 arial, sans-serif;
	color: #6FBB67;
	letter-spacing: -0.5px;
	background: transparent url('../images/button-small.png') no-repeat;
	width: 100px;
	height: 35px;
	border: none;
	margin-top: 3px;
}

#newsletter-form button:hover {
	color: #E6E6E6;
	background: transparent url('../images/button-small-over.png') no-repeat;
}

#newsletter-form input {
	font: italic normal normal 1.4em/1 "trebuchet ms", sans-serif;
	color: #E6E6E6;
	background: #000000;
	border: none;
	width: 280px;
	padding:10px;
	margin: 0px 10px;
	margin-top: 2px;
	float: left;
}	

#footer {
	background: #1A1A1A;
	overflow: hidden;
	height: 100%;
	padding-top: 40px;
}

#site-map p {
	font-size: 1.4em;
	line-height: 1.3;
	letter-spacing: 0.2px;
	color: #999999;
	margin-bottom: 29px;
}

#site-map h4 {
	margin-bottom: 30px;
}

#site-map a {
	font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
	text-decoration: none;
}

#site-map a:hover {
	color:#F2F2F2;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
	border-bottom-color: #999999;
}

.about-footer a, .about-footer h4 {
	color: #D6E029;
}

.portfolio-footer a, .portfolio-footer h4 {
	color: #86C340;
}

.support-footer a, .support-footer h4 {
	color: #6FBB67;
}

#informational {
	background: #1A1A1A;
}

.footer-keyline {
	padding-top: 40px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #666666;
	margin-bottom: 10px;
}

#footer-logo {
	background: url('../images/footer-logo.gif') no-repeat;
	height:66px;
	padding-bottom: 10px;
}

a#twitter-logo {
	background: url('../images/twitter-logo.png') no-repeat;
	height:66px;
	padding-bottom: 10px;
	
}

a#twitter-logo:hover {
	background: url('../images/twitter-logo-over.png') no-repeat;
}

#footer-details {
	margin-top: 13px;
}

#footer-details p {
	font-size: 1.4em;
	line-height: 1.2;
	letter-spacing: 0.2px;
	color: #666666;
}

#footer-details a {
	font: normal bold normal 1em arial, sans-serif;
	color: #58B28D;
	text-decoration: none;
}

#footer-details a:hover {
	color:#F2F2F2;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
	border-bottom-color: #999999;
}

#footer-details p .footer-strapline {
	color: #999999;
}

/* Article */

#article-content {
	margin-top: 30px;
}

#sub-navigation {
	margin-top: 30px;
}

#sub-navigation ul {
	list-style: none outside none;
	display:block;
	background: url('../images/sub-nav-box.gif') repeat-y right 0px;
}

#sub-navigation li.first {
	background: url('../images/sub-nav-box-top.gif') no-repeat right top;
}

#sub-navigation li.last {
	background: url('../images/sub-nav-box-bottom.gif') no-repeat right bottom;
}
	
#sub-navigation li.first a:hover {
	color: #FFFFFF;
	background: transparent url('../images/sub-nav-top-over.png') no-repeat left center;
}

#sub-navigation li.last a:hover {
	color: #FFFFFF;
	background: transparent url('../images/sub-nav-bottom-over.png') no-repeat left center;
}

#sub-navigation li a {
	display: block;
	font: normal bold normal 1.4em/3 arial, sans-serif;
	letter-spacing: 0.2px;
	text-decoration: none;
	text-indent: 30px;
	color: #999999
}

#sub-navigation li a:hover {
	color: #FFFFFF;
	background: transparent url('../images/sub-nav-middle-over.png') no-repeat left center;
}

#first-text-column, #second-text-column {
	margin-top: 30px;
	margin-bottom: 20px;
}

.breadcrumb {
	display: block;
	color: #777777;
	font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
	margin-bottom: 1em;
}

.breadcrumb a {
	color: #777777;
	font: normal bold normal 1em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
}

.breadcrumb a:hover {
	color: #000000;
}

.current-breadcrumb {
	color: #333333;
}

.text-spacer {
	margin: 0 0.2em;
}

/*  Portfolio  */

.project-box {
	background: #333333;
	margin-top: 30px;
	height: 300px;
	overflow: hidden;
}

.project-box-inner {
	padding: 10px 10px 10px 10px;
}

.project-box-inner a{
	font: normal bold normal 1.4em/1.3 arial, sans-serif;
	letter-spacing: 0.2px;
	text-decoration: underline;
	color: #009CA8;
}

.project-box p {
	display: inline;
	padding-left: 3px;
}

.project-box a {
	display: block;
	padding-top: 5px;
}

.project-box a:hover {
	color: #F2F2F2;
}

.project-box .view-project-link {
	display: inline;
}

.project-box p, .view-project-link {
	color: #ffffff;
	text-decoration: none;
	font: normal normal normal 2.1em/1.2 arial, sans-serif;
	letter-spacing: -0.5px;
}

.project-box img {
	padding-bottom: 5px;
}

.project-box .view-project-link:hover {
	color: #BBBBBB;
	text-decoration: none;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
}

/*  Portfolio project  */

.project-web-link {
	font: normal normal normal 2.1em/1.2 arial, sans-serif;
	letter-spacing: -0.5px;
}

#previous-button, #next-button {
	font: normal bold normal 1.4em/1 arial, sans-serif;
	color: #009CA8;
	letter-spacing: -0.5px;
	text-align: center;
	text-decoration: none;
	background: transparent url('../images/button-small.png') no-repeat;
	width: 100px;
	height: 35px;
	border: none;
	display: block;
	padding-top: 10px;
	margin-right: 20px;
	float: right;
	position: relative;
	bottom: 8px;
}

#previous-button:hover, #next-button:hover {
	color: #E6E6E6;
	background: transparent url('../images/button-large-over.png') no-repeat;
}

#choose-project-button {
	font: normal bold normal 1.4em/1 arial, sans-serif;
	color: #009CA8;
	letter-spacing: -0.5px;
	text-align: center;
	text-decoration: none;
	background: transparent url('../images/button-choose.png') no-repeat;
	width: 196px;
	height: 35px;
	border: none;
	display: block;
	padding-top: 10px;
	float: right;
	position: relative;
	bottom: 8px;
}

#choose-project-button:hover {
	color: #333333;
	background: transparent url('../images/button-choose-over.png') no-repeat;
}


#slideshow-controls {
	background: url('../images/slideshow-panel.png') repeat-y;
	height: 53px;
	margin-bottom: 30px;
}

.slide-container1 {

	margin: 15px 0;

}

.slide-button {
	background: transparent url('../images/button-slide.png') no-repeat;
	width: 31px;
	height: 31px;
	float: left;
	text-indent: -9999px;
	margin-left: 10px;
	margin-top: 10px;
}

.slide-button:hover {
	background: transparent url('../images/button-slide-over.png') no-repeat;
}

#slideshow-controls h5 {
	display: inline;
	padding-left: 15px;
	position: relative;
	top: 20px;
}

#features {
	list-style: none inside url('../images/bullet.gif');
	position: relative;
	bottom: 5px;
	padding-bottom: 20px;
}

#features li {
	font: normal normal normal 1.8em/2 arial, sans-serif;
	letter-spacing: -0.5px;
}

#software-stack li a#logo-modx {
	text-indent: -9999px;
	background: transparent url('../images/soft-logos/logo-modx.gif') no-repeat;
	width: 92px;
	height: 23px;
	display: block;
	margin-top: 20px;
}

#software-stack li a#logo-modx:hover {
	background: transparent url('../images/soft-logos/logo-modx-over.gif') no-repeat;
}

#software-stack li a#logo-sugar {
	text-indent: -9999px;
	background: transparent url('../images/soft-logos/logo-sugar.gif') no-repeat;
	width: 130px;
	height: 22px;
	display: block;
	margin-top: 30px;
}

#software-stack li a#logo-sugar:hover {
	background: transparent url('../images/soft-logos/logo-sugar-over.gif') no-repeat;
}

#software-stack li a#logo-magento {
	text-indent: -9999px;
	background: transparent url('../images/soft-logos/logo-magento.gif') no-repeat;
	width: 91px;
	height: 25px;
	display: block;
	margin-top: 30px;
}

#software-stack li a#logo-magento:hover {
	background: transparent url('../images/soft-logos/logo-magento-over.gif') no-repeat;
}