/** CSS RESET **/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, 
legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; 
font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align:baseline;}
:focus {outline: 0;}
body {line-height: 1; color: black; background: white;}
ol, ul {list-style: none;}
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}

/** DUMBCROSSFADE **/
.dumbCrossFade {
	width:210px;
	height:210px;
	display:block;
	cursor:pointer;
	border:none;
	position:relative;
}
.dumbCrossFade .dumbItem {
	display:none;
	position:absolute;
	top:0;
	left:0;
	margin-top: 26px;
	border:none;
}
.dumbCrossFade .dumbItem img {
	border:none;
}
.dumbCrossFade * {
	border:none;
	text-decoration:none;
}

/** GLOBAL **/
body, p, a, li, h1, h2, h3, h4 {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	color: #959595;
	text-decoration: none;
}
p {
	font-size: 12px;
	line-height: 17px;
}
body {
	background: #f5f5f5 url(../img/bkgrnd.jpg) repeat-x;
}
#page-effect {
	display: none;
}
.wrapper {
	margin: 0 auto;
	text-align: center;
	width: 950px;
	overflow: hidden;
}
.clear {
	clear: both;
}
.fogleft, .fogright {
	display: block;
	width: 124px;
	height: 370px;
	z-index: 5;
	position: absolute;
	margin-top: 140px;
}
.fogleft {
	background: url(../img/fogleft.png) no-repeat 0 0;
}
.fogright {
	background: url(../img/fogright.png) no-repeat 0 0;
	margin-left: 826px;
} 


/** HEADER **/
.header {
	padding: 42px 0 0 282px;
	background: url(../img/foggy_header.jpg) no-repeat;
	height: 136px;
}
.header li:first-child {
	margin-left: 0;
}
.header li {
	float:left;
	margin-right: 26px;
}
.header a {
	display: block;
	text-decoration: none;
}
.linkmargin {
	padding-top: 35px;
	text-transform: uppercase;
	font-size: 12px;
	margin-right: 3px;
}
.linkmargin:hover {
	color: #6c6c6c;
}


/** HOME **/
#homecontent, #companycontent {
	margin-left: 100px;
}
#homeintro {
	padding: 38px 16px 12px 20px;
}
#homeintro p {
	letter-spacing: .25px;
}
#intro-header {
	font-size: 34px;
	line-height: 32px;
	font-weight: bold;
	margin-bottom: 2px;
}
.linkbox:first-child {
	margin-left: 100px;
}
.linkbox {
	cursor: pointer;
}
.homeboxes {
	padding: 38px 12px 12px 12px;
}
.imgcarousel li {
	padding: 12px 12px 38px 12px;
}
.homeboxes, .imgcarousel li {
	text-decoration: none;
	margin-left: 10px;
	display: block;
	text-align: left;
	float:left;
	width: 210px;
	background-color: #fff;
	height: 236px;
}
.imgcarousel li:first-child {
	/*margin-left: -11px;*/
	margin-left: 0;
} 
.homeboxes h2 {
	text-transform: uppercase;
	float: left;
	font-weight: bold;
	font-size: 18px;
}
.linkbox p {
	float: right;
	font-weight: bold;
	font-size: 20px;
}
.homecompany {
	margin-top: 8px
}


/** WORK **/

/** new carousel **/
div.sc_menu {
  /* Set it so we could calculate the offsetLeft */
  position: relative;
  height: 286px;
  width: 950px;
  /* Add scroll-bars */
  overflow: auto;
}
ul.sc_menu {
  display: block;
  height: 286px;
  width: 3200px;
  padding: 0 80px;
  margin: 0;
  text-align: center; /* this is creating new text alignment issues */
  background: url('navigation.png');
  list-style: none;
}
/** mine (for the carousel) **/
.sc_menu ul li{
	padding: 12px 12px 44px 12px;
	text-decoration: none;
	margin-left: 10px;
	display: block;
	text-align: left;
	float:left;
	width: 210px;
	background-color: #fff;
	height: 100%;
}
.sc_menu ul li:first-child {
	margin-left: 0;
}
.sc_menu ul li a{
	display:block;
	border:0px;
}
.sc_menu ul li a img{
	display:block;
	border:0px;
}
.sc_menu ul li img{
	display:block;
	border:0px;	
}
.sc_menu ul li a{ 
	display:block;
}
.sc_menu img{
	margin-bottom: 14px;
}
.sc_menu p {
	color: #a7a7a7;
	margin-bottom: -1px;
}
.sc_menu p span{
	color: #9e9e9e;
	font-weight: bold;
	text-transform: uppercase;
	margin-right: 1px;
}
.sc_menu ul li.rightliminwidth, .sc_menu ul li.leftliminwidth {
	background-color: transparent;
}
.sc_menu ul li.rightliminwidth {
	width: 265px;
}
.sc_menu ul li.leftliminwidth {
	width: 230px;
}
.marginwhacked {
	margin-left: -955px;
}
.marginfixed {
	margin-left: 0;
}

/** COMPANY **/
.companyheader {
	width: 694px;
	text-align: center;
	margin: 0 auto;
	padding: 15px 10px 15px 10px;
}
.companyheader h1 {
	text-transform: uppercase;
	text-align: left;
	font-size: 31px;
	font-weight: bold;
	color:#a7a7a7;
}
.companyheader h1 span {
	color:#dadada;
}

/** ACCORDION **/
#accord-wrapper {
	width: 694px;
	height: 100%;
	margin: auto;
	text-align: left;
	overflow: auto;
	padding: 15px 20px 20px 20px;
	background-color: #fff;
}
.accordionButton:first-child {
	border: none;
}
.accordionButton {
	background: url(../img/numbers.gif) no-repeat top left;
	padding: 12px 10px;
	width: 673px;
	float: left;
	background: #f4f4f4;
	border-top: 1px solid #dadada;
	cursor: pointer;
	font-size: 13px;
	font-weight: bold;
}
.accordionButton span {
	color: #c6c6c6;
	margin-right: 5px;
}
.accordionContent {	
	width: 627px;
	float: left;
	display: none;
	overflow: visible;
	font-size: 12px;
	line-height: 20px;
	background: #ececec url(http://ghost.zinkspeak.com/img/accord_bkgrnd.jpg) repeat-x top;
	padding: 30px 33px;
}
.accordionContent img {
	float:left;
	margin-right: 15px;
}

/** FOOTER **/
#footer {
	margin-top: 12px;
	height: 24px;
	width: 100%;
	background-color: #605e5f;
	z-index: 10;
	position: absolute;
}
#contact li {
	color: #cacaca;
	float: left;
	margin-right: 10px;
	font-size: 12px;
}
#contact li a {
	color: #cacaca;
}
#contact li span {
	text-transform: uppercase;
	font-weight: bold;
}
.containerwrap {
	margin: 0 auto;
	text-align: center;
	width: 950px;
	height: 100%
}
#contact {
	margin-left: 226px;
	padding-top: 6px;
}
#contact a:hover {
	color: #fff;
}

/** Coda slider **/
/* Most common stuff you'll need to change */
	
	/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
	.coda-slider-no-js .coda-slider { height: 100%; overflow: auto !important; }
	
	/* Change the width of the entire slider (without dynamic arrows) */
	.coda-slider, .coda-slider .panel { width: 950px } 
	
	/* Change margin and width of the slider (with dynamic arrows) */
	.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 950px }
	.coda-slider-wrapper.arrows .coda-slider { margin: 0 10px }
	
	/* Preloader */
	.coda-slider p.loading { padding: 20px; text-align: center }

/* Don't change anything below here unless you know what you're doing */
	/* Tabbed nav 
	.coda-nav ul { clear: both; display: block; margin: auto; overflow: hidden }
	.coda-nav ul li { display: inline }
	.coda-nav ul li a { background: #000; color: #fff; display: block; float: left; margin-right: 1px; padding: 3px 6px; text-decoration: none }*/
	
	/* Miscellaneous */
	.coda-slider-wrapper { clear: both; overflow: auto; scrollbar: hidden; }
	.coda-slider { float: left; overflow: hidden; position: relative }
	.coda-slider .panel { display: block; float: left }
	.coda-slider .panel-container { position: relative }
	.coda-nav-left, .coda-nav-right { float: left }
	.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }

