﻿/* 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:none;
	} 
/* ============================== */

/* SELECTORS ===================== */ 
html {
	width:100%;
	min-width:100%;
	background:#fff;
}
body {
	width:100%;
	min-width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:13px;
	color:#666;
	background:url(../images/bg.gif) repeat left top fixed;
}
a {
	color:#96022c;
	text-decoration:underline;
}
a:hover {
	color:#000;
	text-decoration:none;
}
a:focus {
	outline:none;  /* Removes dotted line around links in Firefox. */ 
} 
h1 {
	padding:23px 30px 0;
	background:url(../images/hdr-bg.jpg) repeat-x left bottom;
	border:solid 1px #ababab;
	border-bottom:none;
	font-size:36px;
	color:#333;
	font-weight:normal;
	line-height:40px;
}
h2 {
	padding:35px 20px 2px;
	background:url(../images/hdr-bg.jpg) repeat-x left bottom;
	border-left:solid 1px #ababab;
	border-right:solid 1px #ababab;
	font-size:24px;
	color:#666;
	font-weight:normal;
	line-height:26px;
}
h2.top {
	border-top:solid 1px #ababab;
}
h3 {
	padding:.75em 0 .5em;
	font-size:18px;
	color:#96022c;
}
h4 {
	padding-bottom:10px;
	font-size:22px;
	color:#96022c;
}
h4 span {
	font-size:16px;
	font-weight:normal;
}
h5 {
	padding:.5em 0;
	font-size:14px;
	color:#96022c;
}
iframe { /* Synoptek Culture page > Flickr slideshow. */
	position:relative;
	z-index:1;
}
input, 
textarea {
	width:210px;
	margin-bottom:10px;
	padding:3px 5px;
	font-family:Helvetica, "Trebuchet MS", sans-serif;
	font-size:12px;
	color:#96022c;
}
p {
	padding-bottom:.75em;
	line-height:1.3em;
}
ol, ul {
	padding:0 0 .5em 30px;
}
li {
	padding-bottom:.5em;
}
/* ============================== */

/* GENERAL STYLES =============== */ 
.clear {
	clear:both;
}
.gradient { display:none;
	position:fixed;
	z-index:1;
	left:0; /* Must have for IE. */
	top:176px;
	width:100%;
	height:520px;
	background:url(../images/bg-gradient.png) repeat-x left top fixed;
}
.wrapper {
	position:relative;
	z-index:2;
	width:960px;
	margin:0 auto;
	padding:220px 0 0; /* Top and bottom need to equal heights of header and footer. */
}
.col-left-wrapper {
	float:left;
	width:640px;
	margin:0 30px 25px 0;
	background:#fff;
	border:solid 1px #fff;
}
.col-left {
	float:left;
	width:578px;
	min-height:250px;
	padding:20px 30px;
	border:solid 1px #c4c4c4;
	border-top:none;
}
*html .col-left { /* IE hack */
	height:250px;
}
.col-left img {
	display:block;
	float:right;
	padding:0 0 10px 20px;
}
.col-right-wrapper {
	float:left;
	width:286px;
	margin-bottom:25px;
	background:#fff;
	border:solid 1px #fff;
}
.col-right {
	padding:20px;
	border:solid 1px #afafaf;
	border-top:none;
}
.col-right .rule-grey {
	height:1px;
	margin-bottom:20px;
	padding-top:20px;
	border-bottom:solid 1px #c4c4c4;
}
.breadcrumbs {
	font-size:11px;
	color:#999;
}
.introText {
	font-size:22px;
	color:#96022c;
}
.content-left {
	float:left;
	width:265px;
	padding-right:40px;
}
.content-right {
	float:left;
	width:265px;
}
.map {
	margin-bottom:15px;
	border:solid 1px #999;
}
.btn {
	width:120px;
	color:#333;
	font-weight:bold;
}
.news {
	font-size:14px;
}
.news a {
	display:block;
	float:left;
	width:495px;
	padding-bottom:10px;
	font-size:14px;
	line-height:1.5em;
}
.news a:visited {
	color:#666;
}
.newsDate {
	clear:left;
	float:left;
	width:50px;
	padding:0 30px 10px 0;
	font-size:14px;
	line-height:1.5em;
}
.rule-grey {
	clear:both;
	height:1px;
	margin-bottom:15px;
	border-bottom:solid 1px #c4c4c4;
}
.textMaroon {
	color:#96022c;
}
.videoThumb {
	padding-top:20px;
}
.videoThumb img {
	border:solid 1px #333;
	cursor:pointer;
}
/* ============================== */

/* HEADER ======================= */ 
.hdr {
	position:fixed;
	z-index:3;
	top:0;
	left:0; /* Must have for IE. */
	width:100%;
	min-width:100%;
	height:176px;
	background:#fff;
}
.hdr-top {
	position:relative;
	width:960px;
	height:104px;
	margin:25px auto 0;
}
.hdr-logo a {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:139px;
	height:87px;
}
.hdrLinks {
	float:right;
	width:300px;
	text-align:right;
}
.hdrLinks a {
	display:block;
	padding-right:35px;
	background-image:url(../images/icons.gif);
	background-repeat:no-repeat;
	color:#6d6d6d;
	text-decoration:none;
	line-height:30px;
}
.hdrLinks a:hover {
	color:#96022c;
}
.hdrLink-support {
	background-position:right top;
}
.hdrLink-careers {
	background-position:right -30px;
}
.hdrLink-contact {
	background-position:right -60px;
}
.hdr .rule-grey {
	margin-bottom:0;
}
/* ============================== */

/* TOP NAV ====================== */ 
.topNav-wrapper {
	height:50px;
	padding-bottom:13px;
	background:url(../images/footerheader-bg.png) repeat-x left bottom;
	border-top:solid 1px #fff;
}
ul.topNav {
	width:960px;
	margin:-1px auto 0;
	padding:0;
	list-style:none;
}
ul.topNav li {
	position:relative;
	float:left;
}
ul.topNav a {
	display:block;
	float:left;
	background-image:url(../images/topNav.gif);
	background-repeat:no-repeat;
	text-decoration:none;
}
.topNavLink {
	height:50px;
}
.topNav-index a {
	width:80px;
	background-position:left top;
}
.topNav-index a:hover,
.topNav-index .menuhover /* Keeps active state when hovering on children. */ {
	background-position:left -50px;
}
#index .topNav-index a /* Indicates active page. */ {
	background-position:left -100px;
}
.topNav-consulting a {
	width:156px;
	background-position:-80px top;
}
.topNav-consulting a:hover,
.topNav-consulting .menuhover {
	background-position:-80px -50px;
}
#consulting .topNav-consulting a {
	background-position:-80px -100px;
}
.topNav-dev a {
	width:288px;
	background-position:-236px top;
}
.topNav-dev a:hover,
.topNav-dev .menuhover {
	background-position:-236px -50px;
}
#dev .topNav-dev a {
	background-position:-236px -100px;
}
.topNav-IT a {
	width:186px;
	background-position:-524px top;
}
.topNav-IT a:hover,
.topNav-IT .menuhover {
	background-position:-524px -50px;
}
#IT .topNav-IT a {
	background-position:-524px -100px;
}
.topNav-work a {
	width:140px;
	background-position:-710px top;
}
.topNav-work a:hover,
.topNav-work .menuhover {
	background-position:-710px -50px;
}
#work .topNav-work a {
	background-position:-710px -100px;
}
.topNav-about a {
	width:110px;
	background-position:-850px top;
}
.topNav-about a:hover,
.topNav-about .menuhover {
	background-position:-850px -50px;
}
#about .topNav-about a {
	background-position:-850px -100px;
}
/* Dropdown menu */
ul.topNav ul {
	display:none;
	position:absolute;
	top:51px;
	left:-13px;
	width:176px;
/*	opacity:0;*/
	padding:0;
	background:url(../images/dropdown.png) no-repeat center bottom;
	list-style:none;
}
ul.topNav .topNav-consulting ul {
	left:-5px;
}
ul.topNav .topNav-IT ul {
	left:5px;
}
ul.topNav .topNav-dev ul {
	left:50px;
}
ul.topNav ul li {
	position:relative;
	padding:0;
}
ul.topNav ul li a {
	display:block; 
	width:130px;
	margin:0 13px;
	padding:6px 10px;
	background:none; 
	color:#454545;
}
ul.topNav ul li a:hover {
	background:#fff;
	color:#96022c;
}
/**/
/* ============================== */

/* RIGHT NAV ====================== */ 
.rightNav {
	padding:0;
	list-style:none;
	font-size:14px;
}
.rightNav li {
	position:relative;
}
.rightNav a {
	display:block;
	padding:0 0 .25em 20px;
	text-decoration:none;
}
.rightNav a:hover {
	background:url(../images/arrow.gif) no-repeat left center;
}
.rightNav .selected {
	background:url(../images/arrow-on.gif) no-repeat left center;
	font-weight:bold;
}
/* ============================== */

/* FOOTER ======================= */ 
.footer-wrapper {
	width:100%;
	height:51px;
	padding-top:14px;
	background:url(../images/footerheader-bg.png) repeat-x left top;
	border-bottom:solid 1px #fff;
}
.footer {
	width:960px;
	height:51px;
	margin:0 auto;
	color:#545454;
	line-height:51px;
}
.footer a {
	padding-left:20px;
}
.footer img {
	vertical-align:middle;
}
.footer-left {
	float:left;
	width:610px;
	font-size:12px;
}
.footer-right {
	float:left;
	width:350px;
	text-align:right;
	font-size:11px;
}
#footer-locations
{
	width: 960px;
	margin: 5px auto;
}
#footer-orange, #footer-la, #footer-boise
{
	float: left;
	width: 318px;
	
}
#footer-orange, #footer-la
{
	border-right: 1px #C4C4C6 solid;
	
}
.footer-address {
	margin-left: 20px;
}
#footer-orange div.footer-address {
	margin-left: 0;
}
.footer-address h3{
	margin-top: 0;
}

/* ============================== */

/* JSHOWOFF IMAGE ROTATOR ====== */
#features {
	position: relative;
	overflow: hidden;
	width: 960px;
	height: 426px;
}
.jshowoff {
	width: 960px;
	height:426px;
	margin-bottom:25px;
}
.jshowoff div {	
	width:960px;
	height:426px;
}
.jshowoff img {
	float:left;
	width:640px;
	height:426px;
	padding-right:30px;
}
.jshowoff p {
	font-size: 18px;
	color: #d7b7bf;
	line-height:1.5em;
}
.jshowoff strong {
	display:block;
	padding:30px 0;
	font-size:26px;
	color:#fff;
	line-height:1.3em;
}
/* Pagination */
.jshowoff p.jshowoff-slidelinks {
	position:absolute;
	bottom:0;
	left:670px;
	margin: 0;
	padding: 0;
}
.jshowoff-slidelinks a {
	display: block;
	float: left;
	width:6px;
	height:18px;
	margin:0 6px 0 0;
	background:#ad8691;
	border:1px solid #fff;
	color:#ad8691;
	text-decoration: none;
	font-size: 1px;
}
.jshowoff-slidelinks a:hover {
	background:#fff;
	color:red;
}
.jshowoff-slidelinks a.jshowoff-active, 
.jshowoff-slidelinks a.jshowoff-active:hover {
	color:#96022c;
	background:#96022c;
}
/**/
.jshowoff-pausetext {
	color: #fff;
}
/* ============================== */

/* PORTFOLIO ==================== */

#webwork {
	background-image:url('../images/webwork-bg.jpg');height:457px; width: 615px; margin-left: 10px; position: relative; overflow:hidden;	
}
#webwork ul {
	
	list-style-type: none;
}
ul#webwork-nav {
	left: 47px;
	top: 375px;
	margin: 0;
	padding: 0;
	position: absolute;
	z-index: 2;

}
ul#webwork-nav li{
	background-image: none;
	float: left;
	margin: 0 30px 0 0;
	padding: 0;
}
ul#webwork-nav li a {
	display: block;
	text-indent: -9999px;
	border-bottom: 0 none;
}
ul#webwork-nav li#webwork-nav-plan a {
	background: transparent url('../images/webwork-nav-plan.png') no-repeat scroll 0 0;
	height: 18px;
	width: 38px;
}

ul#webwork-nav li#webwork-nav-plan a:hover,
ul#webwork-nav li#webwork-nav-plan.webwork-selected a {
	background: transparent url('../images/webwork-nav-plan.png') no-repeat scroll 0 -18px;
}

ul#webwork-nav li#webwork-nav-build a {
	background: transparent url('../images/webwork-nav-build.png') no-repeat scroll 0 0;
	height: 18px;
	width: 39px;
}
ul#webwork-nav li#webwork-nav-build a:hover,
ul#webwork-nav li#webwork-nav-build.webwork-selected a {
	background: transparent url('../images/webwork-nav-build.png') no-repeat scroll 0 -18px;
}

ul#webwork-nav li#webwork-nav-operate a {
	background: transparent url('../images/webwork-nav-operate.png') no-repeat scroll 0 0;
	height: 18px;
	width: 62px;
}
ul#webwork-nav li#webwork-nav-operate a:hover,
ul#webwork-nav li#webwork-nav-operate.webwork-selected a {
background: transparent url('../images/webwork-nav-operate.png') no-repeat scroll 0 -18px;

}
#webwork-viewlive {
	position:absolute;
	right: 45px;
	top: 365px;
	z-index:2;
}
#webwork-gallery {
	width: 520px; 
	height: 320px;
	margin: 26px 0 0 47px;
	overflow: scroll; 
	position: absolute;
	padding: 0;	
}
#webwork-gallery ul#webwork-slides li{
	margin: 0 0 0 0;
	padding: 0;
	float: left;
}
#webwork-gallery ul#webwork-slides {
	margin: 0;
	list-style: none;
	padding: 0;
}

#webwork-desc h3 {
	border-bottom: 1px #ACAAAB solid;
	margin-bottom: 10px;
	padding-bottom: 5px;
}
#webwork-desc blockquote {
	background: transparent url('../images/webwork-l-quote.png') left top no-repeat;
}
#webwork-desc blockquote p {
	padding: 0 48px;
	background: transparent url('../images/webwork-r-quote.png') right bottom no-repeat;
	font-size: 18px;
}

/* ============================== */
/* TAB PANEL ==================== */
.shadetabs {
	padding:0 0 30px;
	list-style-type: none;
	text-align: left; /*set to left, center, or right to align the menu as desired*/
}
.shadetabs li {
	float:left;
	width:70px;
	margin:0 6px 20px;
	padding:0;
	text-align:center;
	font-size:11px;
	color:#666;
}
.shadetabs li a {
	display:block;
	width:70px;
	height:70px;
	position:relative;
	z-index:1;
	border:1px solid #545454;
	background-image:url(../images/thumbs-executives.jpg);
	background-repeat:no-repeat;
}
.shadetabs li.britt a {
	background-position:left top;
}
.shadetabs li.britt a:hover,
.shadetabs li.britt a.selected, /*selected main tab style */
.shadetabs li.britt a.selected:hover { /*selected main tab style */
	background-position:left bottom;
}
.shadetabs li.whiton a {
	background-position:-70px top;
}
.shadetabs li.whiton a:hover,
.shadetabs li.whiton a.selected, /*selected main tab style */
.shadetabs li.whiton a.selected:hover { /*selected main tab style */
	background-position:-70px bottom;
}
.shadetabs li.codorniz a {
	background-position:-140px top;
}
.shadetabs li.codorniz a:hover,
.shadetabs li.codorniz a.selected, /*selected main tab style */
.shadetabs li.codorniz a.selected:hover { /*selected main tab style */
	background-position:-140px bottom;
}
.shadetabs li.stripling a {
	background-position:-210px top;
}
.shadetabs li.stripling a:hover,
.shadetabs li.stripling a.selected, /*selected main tab style */
.shadetabs li.stripling a.selected:hover { /*selected main tab style */
	background-position:-210px bottom;
}
.shadetabs li.becker a {
	background-position:-280px top;
}
.shadetabs li.becker a:hover,
.shadetabs li.becker a.selected, /*selected main tab style */
.shadetabs li.becker a.selected:hover { /*selected main tab style */
	background-position:-280px bottom;
}
.shadetabs li.ditsworth a {
	background-position:-350px top;
}
.shadetabs li.ditsworth a:hover,
.shadetabs li.ditsworth a.selected, /*selected main tab style */
.shadetabs li.ditsworth a.selected:hover { /*selected main tab style */
	background-position:-350px bottom;
}
.shadetabs li.sanchez a {
	background-position:-420px top;
}
.shadetabs li.sanchez a:hover,
.shadetabs li.sanchez a.selected, /*selected main tab style */
.shadetabs li.sanchez a.selected:hover { /*selected main tab style */
	background-position:-420px bottom;
}
.tabcontent {
	display:none;
	clear:both;
}
.tabcontent ul {
	padding-left:15px;
}
.tabcontent li {
	padding:5px 0 0;
}
.exec-left {
	float:left;
	width:175px;
	padding-right:30px;
}
.exec-left ul {
	padding-bottom:20px;
}
.exec-right {
	float:left;
	width:370px;
}
.tabcontent-photo {
	float:left;
	width:175px;
	margin:0 20px 20px 0;
}
.tabcontent-photo div {
	width:175px;
	height:175px;
	background-image:url(../images/executives.jpg);
	background-repeat:no-repeat;
	border:1px solid #545454;
}
.photo-britt {
	background-position:left top;
}
.photo-whiton {
	background-position:-175px top;
}
.photo-codorniz {
	background-position:-350px top;
}
.photo-stripling {
	background-position:-525px top;
}
.photo-becker {
	background-position:-700px top;
}
.photo-ditsworth {
	background-position:-875px top;
}
.photo-sanchez {
	background-position:-1050px top;
}
@media print {
.tabcontent {
	display:block !important;
}
}
/* ============================== */

/* VIDEO LIGHTBOX =============== */
/* the overlayed element */
.simple_overlay {
	display:none;
	top:50px;
	z-index:10000;
	background-color:#333;
	width:830px;	
	height:480px;
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(../images/close.png);
	background-repeat:no-repeat;
	position:absolute;
	right:-20px;
	top:-20px;
	cursor:pointer;
	height:40px;
	width:40px;
	z-index:9;
}
/* styling for elements inside overlay */
	.details {
		position:absolute;
		top:0;
		left:0;
		padding:15px;
		background:#333;
		font-size:11px;
		color:#fff;
		width:800px;
		z-index:8;
	}
	
	.details h3 {
		color:#aba;
		font-size:15px;
		margin:0 0 -10px 0;
	}
/* ============================== */
