/* / / / / / Reset / / / / / */

html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, blockquote, pre, form, fieldset, table, th, td, a img { font-family: "helvetica neue", helvetica, arial, sans-serif; margin: 0; padding: 0; border: 0; }

body {
    background: #FFF url(../images/body_bg.gif) repeat-x;
    font-size: 15px;
    line-height: 18px;
    color: #b5b5b5;
}

#shell { width: 950px; margin: 0 auto; }

/* / / / / / Logo and Top Navigation / / / / / */

h1#logo { float: left; height: 101px; width: 323px; margin-top: 60px; display: block; background: url(../images/tracksuit_logo.gif) no-repeat; text-indent: -4000px; }

#nav {
	float: right; 
	display: inline; 
	font-size: 28px; 
	color: #fff; 
	text-transform: lowercase; 
	font-weight: normal; 
	margin-top: 20px;
	padding: 0 0 0 180px;
}

#nav ul li {
   display:block;
   float:left;
   list-style-type:none;
   padding-left: 15px;
}

#nav ul li a {
   display:block;
   float:left;
   list-style-type:none;
   padding-left: 15px;
}


/* / / / / / Content / / / / / */

p { padding: 0 0 12px 0; width: 400px; text-align: left; }

.frame { background:#eee; border:1px solid #ccc; padding:5px; }

h2 { font-size: 32px; color: #b5b5b5; padding-bottom: 40px; text-align: left; }

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

.left { float: left; display: inline; }
.right { float: right; display: inline; margin: 0 85px 0 0; }

#work { clear: both; padding: 85px 0 0 45px; background: url(../images/work.png) no-repeat; width: 949px; height: 532px; }

#horizontal_container { width: 875px; height: 410px; }

		
.accordion_content { overflow: hidden; }
	
.accordion_content p {
	padding: 5px 10px 15px 10px;
}
			
.horizontal_accordion_toggle {
	/* REQUIRED */
	float: left;	/* This make sure it stays horizontal */
	/* REQUIRED */
	display: block;
	height: 410px;
	width: 59px;
	background-color: #b5b5b5;
	cursor: pointer;
	margin: 0 1px 0 1px;
}

.horizontal_accordion_toggle_active { background-color: #ed2e35; }

.horizontal_accordion_content {
	/* REQUIRED */
	height: 400px;	/* We need to define a height for the accordion as it stretches the width */
	float: left;	/* This make sure it stays horizontal */
	/* REQUIRED */
	overflow: hidden;
}
			
.horizontal_accordion_content p { padding: 5px 10px 15px 10px; }
					
#about { clear: both; padding: 100px 0 0 45px; background: url(../images/about.png) no-repeat; width: 949px; height: 549px; }

/* / / / / / Contact / / / / / */

#contact { clear: both; padding: 100px 0 0 45px; background: url(../images/contact.png) no-repeat; width: 949px; height: 546px; }
dl.contact-form { margin: 2px 0; padding: 0; text-align: left; font-weight: bold; }
.contact-form dt { clear: both; width: 70px; float: left; margin: 0; padding: .5em; height: 30px; }
.contact-form dd { float: left; margin: 0; padding: .5em; height: 30px; }
.contact { background:#eee; border:1px solid #ccc; padding:5px; margin-bottom: 10px; }
#contact ul li { font-size: 16px; margin-left: 50px; line-height: 30px; }
ul li#email { list-style-image: url(../images/email_16.png); vertical-align: middle; }
ul li#twitter { list-style-image: url(../images/twitter_16.png); }
ul li#flickr { list-style-image: url(../images/flickr_16.png); }
ul li#word { list-style-image: url(../images/wordpress_16.png); }

/* / / / / / Footer / / / / / */

#footer { clear: both; height: 34px; border-top: solid 1px #b5b5b5; }
.footertext { color: #b5b5b5; font-size: 11px; padding-top:5px; text-align: center; }