/*  
Theme Name: Large Scale Design
Theme URI: http://www.largescaledesign.com/
Description: Based on LSD.
Version: 1
Author: Aaron Sonnenshine
Author URI: http://www.largescaledesign.com/


*/



/*
--------------------------------------------------
Global Styles for Large Scale Design
by Aaron Sonnenshine
--------------------------------------------------
*/





* {
	margin: 0;
	padding: 0;
}



body {
	margin: 0px auto 20px auto;
	padding: 0;
	text-align:center;
	font-family: Arial, Helvetica, sans-serif;
	font-size:x-small;
	background: #666 url("../images/bg_body_tile_horiz2.gif") repeat-x top left;
	voice-family: "\"}\""; voice-family:inherit;
	font-size:small;
} html>body {font-size:small;}


/*



--------------------------------------------------

Basic Declarations

--------------------------------------------------



*/





a:link {
	color: #c60;
	text-decoration: none;
	}



a:visited {
	color: #c60;
	text-decoration: none;
	}



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



a:active {
	color: #f90;
	text-decoration: none;
	}



h1 {
	font-size: 2.1em;
	margin: 0 0 .5em 0;
	color:#515151;
	}



h2 {
	font-size: 1.8em;
	margin: 0 0 .5em 0;
	color:#515151;
	}



h3 {
	font-size: 1.4em;
	margin: 0 0 .5em 0;
	color:#515151;
	}



h4 {
	font-size: 1em;
	margin: 0 0 .5em 0;
	color:#515151;
	}

h5 {
	font-size: .8em;
	margin: 0 0 .5em 0;
	color:#515151;
	}
h6 {
	font-size: 1em;
	margin:0;
	padding:0;
	color:#515151;
	}


img { border: none; }


p {
	margin: 0 0 1em 0;
	font-size:1em;
	line-height: 1.2em;
	color:#515151;
	}





ul	{
	font-family: Arial, Helvetica, sans-serif;
	margin:0 0 0 2.2em;
	list-style:square;
	}



li	{
	font-family: Arial, Helvetica, sans-serif;
	margin:0 0 0 0;
	list-style:square;
	font-size:1em;
	color:#515151;
	}



ol	{
	font-family: Arial, Helvetica, sans-serif;
	}



dl {
	margin:0;
	padding:0;
	}

dt {
	margin:0;
	padding:0;
	}

dd {
	margin:0;
	padding:0;
	}


img {
	border: none;
}



/*



--------------------------------------------------

Layout DIVs

--------------------------------------------------



*/





#containerWrapperTop {
	width:824px;
	height:12px;
	margin:0 auto;
	text-align:center;
	background: transparent url("../images/bg_main_top.png") no-repeat center bottom;
}
* html #containerWrapperTop {
	background: transparent url("../images/bg_main_top.gif") no-repeat center bottom;
}


#containerWrapperBottom {
	width:824px;
	height:12px;
	margin:0 auto;
	text-align:center;
	background: transparent url("../images/bg_main_btm.png") no-repeat center top;
}
* html #containerWrapperBottom {
	background: transparent url("../images/bg_main_btm.gif") no-repeat center top;
}


#containerWrapper {
	width:824px;
	
	height:100%;
	margin:0 auto;
	text-align:center;
	
	background:transparent url("../images/bg_main_tile.png") repeat-y center top;
}
* html #containerWrapper {
	background:transparent url("../images/bg_main_tile.gif") repeat-y center top;
}

#container {
	width:780px;
	margin:0 auto;
	text-align:center;
}



#headerWrapper {
	float: left;
	width:780px;
	height:100px;
	margin:0 0 10px 0;
}

#header {
	position:relative;
	bottom:0;
	right:0;
	width:780px;
	height:100px;
	text-align:left;	
}



#contentWrapper {
	float:left;
	width:780px;
}



#content {
	position:relative;
	width: 780px;
	padding: 0 0 10px 0;
	text-align:left;
}



#mainContentWrapper 
{
	float:left;
	width:520px;
}
#mainContent
{
	float:right;
	width:520px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	display:inline;
}


#subContentWrapper
{
	float:right;
	width:250px;
}
#subContent 
{
	float:left;
	margin:0 0 10px 0;
	padding:0 0 0 0;
	display:inline;
	width:250px;
}


#footerWrapper {
	float: left;
	width: 780px;
	margin: 10px auto 10px auto;
	padding: 0 0 0 0;
	text-align: left;
}



#footer {
	float: left;
	width:780px;
	margin:0;
	padding:0;
	text-align:left;
}



.clearfix:after {

    content: "."; 

    display: block; 

    height: 0; 

    clear: both; 

    visibility: hidden;
}



.clearfix {display: inline-table;}





/* Hides from IE-mac \*/



* html .clearfix {height: 1%;}



.clearfix {display: block;}



/* End hide from IE-mac */





/*

--------------------------------------------------

Global Graphic

--------------------------------------------------

*/

#header img#logo {
	position:absolute;
	bottom:0px;
	left:8px;
	width:224px;
	height:77px;
}

/*

--------------------------------------------------

Header styles

--------------------------------------------------

*/

#header h1 {
	position:absolute;
	bottom:0px;
	left:10px;

}


/*

--------------------------------------------------

Navigation

--------------------------------------------------

*/




ul#headerNav {
	width:500px;
	margin:0 0 0 0;
	padding:0 0 0 0;
	position:absolute;
	bottom:0;
	left:250px;
	list-style-type: none;
	}


#headerNav li{
	float: left;
	display: inline;

}
#headerNav li a, #headerNav li a:link, #headerNav li a:visited {
	float: left;
	display: block;
	margin:0 10px 0 0;
	padding: .4em 1em .3em 1em;
	border:1px solid #f7f7f7;
	display: inline;

	border-top:1px solid #eee;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #eee;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	font-size: .8em;
	font-weight: bold;
	color: #666;
	background:transparent url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	text-decoration: none;
	}
#headerNav li.current a {
	background:#f1f1f1;
	}

#headerNav li a:hover, #headerNav li a:active, #headerNav li.current a:hover { 
	color: #999;
/*	background: #fff;
	border-top:1px solid #fff;
	border-right:1px solid #fff;
	border-bottom:1px solid #fff;
	border-left:1px solid #fff; */
	}





#screen {
	width:510px;
	margin:0 0 8px 0;
	padding:10px 0 0 10px;
	background:#f7f7f7;
	}

#screen img {
	float:left;
	margin:0;
	padding:0;
	}

#screen ul {
	float:left;
	width:510px;
	margin:0 0 10px 0;
	padding:0;
	list-style-type: none;
	}

#screen li {
	float:left;
	display: inline;
	margin: 0 0 0 0;
	text-transform: uppercase;
	font-family: Arial, Helvetica, sans-serif;
	}

#screen li a, #screen li a:link, #screen li a:visited {
	float: left;
	display: block;
	/* begin stretched out buttons */
	width:165px;
	margin:0 2px 0 0;
	text-align:center;
	/* end stretched out buttons */
	font-size: .8em;
	font-weight: bold;
	color: #fff;
	text-decoration: none;
	background:#ccc;
/*	
	background:transparent url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	border-top:1px solid #eee;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #eee;
*/
	}

#screen li a:hover, #screen li a:active, #screen li#current a { 
	color: #f90;
	background: #fff;
	}

#screen img {
	margin:0 0 10px 0;
}





#primaryNav {
	float:left;
	width:780px;
	line-height:normal;
	border-top:1px solid #fff;
	border-bottom:1px solid #fff;
	background: #ccc;
}

#primaryNav ul {
	margin:0 0 0 20px;
	padding:0;
	list-style:none;
	
}

#primaryNav li {
	float:left;
	background: #ccc;
	margin:0 -1px 0 0;
	
	border-right:1px solid #fff;
	border-left:1px solid #fff;
	white-space: nowrap;
}

#primaryNav li.first, #primaryNav li#current.first {
	border-left:1px solid #fff;
}

#primaryNav a {
	float:left;
	display:block;
	width:.1em;
	margin:0px;
	padding:10px 18px 8px 18px;
	text-decoration:none;
	font-weight:bold;
	color:#fff;
	white-space: nowrap;
}



#primaryNav > ul a {width:auto;}

    /* Commented Backslash Hack hides rule from IE5-Mac \*/

#primaryNav a {float:none;}

    /* End IE5-Mac hack */

#primaryNav a:hover {
	color:#999;
	background: #fff;
}

#primaryNav #current {
	border-width:0;
	background: #fff;
	border-right:1px solid #fff;
}

#primaryNav #current a {
	color:#ccc;
	background: #fff;
}

#primaryNav li:hover, #primaryNav li:hover a {
	color:#999;
	background: #fff;
}

#primaryNav li:hover a {
	background: #fff;
}


ul#thumbnails {
	float:left;
	width:250px;
	margin:0 0 10px 0;
	padding:10px 0 0 0;
	list-style-type: none;
	background:#f7f7f7;
	}

#thumbnails li {
	display:inline;
}
#thumbnails li a, #thumbnails li a:link, #thumbnails li a:visited {
	float: left;
	margin: 0 0 10px 10px;
	padding:0;
	width:64px;
	height:50px;
	background: transparent;
	border-top:1px solid #eee;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #eee;
	background:#fff url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	}

#thumbnails li a span {
	display:none;
	}

#thumbnails li a:hover, #thumbnails li a:active, #thumbnails li#current a { 
	background: transparent;
	border-top:1px solid #999;
	border-right:1px solid #666;
	border-bottom:1px solid #666;
	border-left:1px solid #999;
	}


ul#thumbnails li#stretchBoards a { background: transparent url("../thumbnails/stretch.gif") no-repeat left top; }
ul#thumbnails li#puropedo a { background: transparent url("../thumbnails/puropedo.gif") no-repeat left top; }
ul#thumbnails li#eightThreeOne a { background: transparent url("../thumbnails/831clothing.gif") no-repeat left top; }
ul#thumbnails li#mbfitness a { background: transparent url("../thumbnails/mbfitness.gif") no-repeat left top; }
ul#thumbnails li#margaritaville a { background: transparent url("../thumbnails/margaritaville.gif") no-repeat left top; }
ul#thumbnails li#ikElectric a { background: transparent url("../thumbnails/ikelectric.gif") no-repeat left top; }
ul#thumbnails li#scea a { background: transparent url("../thumbnails/scea.gif") no-repeat left top; }
ul#thumbnails li#sbh a { background: transparent url("../thumbnails/sbh.gif") no-repeat left top; }
ul#thumbnails li#plantronics a { background: transparent url("../thumbnails/plantronics.gif") no-repeat left top; }
ul#thumbnails li#powerlines a { background: transparent url("../thumbnails/powerlines.gif") no-repeat left top; }
ul#thumbnails li#stepintomore a { background: transparent url("../thumbnails/stepintomore.gif") no-repeat left top; }
ul#thumbnails li#lasviboras a { background: transparent url("../thumbnails/lasviboras.gif") no-repeat left top; }
ul#thumbnails li#sandDollar a { background: transparent url("../thumbnails/sand_dollar.gif") no-repeat left top; }
ul#thumbnails li#ucsfOutdoor a { background: transparent url("../thumbnails/ucsf_outdoor.gif") no-repeat left top; }
ul#thumbnails li#eaSports a { background: transparent url("../thumbnails/easports.gif") no-repeat left top; }









/* Thumbnails Styles */


ul.vanThumbs {
	display:block;
	margin:0 10px 10px 0px;
	padding:10px 0 0 0;
	list-style-type: none;
	}

.vanThumbs li {
	display:inline;
}
.vanThumbs li a, .vanThumbs li a:link, .vanThumbs li a:visited {
	float: left;
	margin: 0 0 10px 10px;
	padding:5px 0 12px 0;
	width:70px;
	border-top:1px solid #eee;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #eee;
	background:#f7f7f7 url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	}

.vanThumbs li a img {
	display:block;
	text-align:center;
	margin:0 auto 0 auto;
	}
.vanThumbs li a span {
	display:none;
	}

.vanThumbs li a:hover, .vanThumbs li a:active, .vanThumbs li#current a { 
	background: #fff;
	border-top:1px solid #999;
	border-right:1px solid #666;
	border-bottom:1px solid #666;
	border-left:1px solid #999;
	}









/*

--------------------------------------------------

Text Styles

--------------------------------------------------

*/

#subContent p {

}
#mainContent h1 {
	margin:0;
	padding:.4em .4em .1em 10px;
	font-weight:bold;
	text-transform:uppercase;
	font-family: Arial, Helvetica, sans-serif;
	background:#ddd;
	color:#666;
}
#mainContent p, 
#mainContent h2, 
#mainContent h3, 
#mainContent h4, 
#mainContent h5 
{
	margin-right:10px;
	margin-left:0;
}

#mainContent .business {
	float:left;
	width:240px;
	margin:10px 0 0 10px;
	font-size:.8em;
	display:inline;
}
#home #mainContent .business {
	margin-top:10px;
}
#flashContent {
	float:right;
	width:250px;
	margin:10px 10px 0 0;
	display:inline;
}
#mainContent .clientList {
	float:right;
	width:200px;
	margin:0 0 0 10px;
	padding:10px;
	background:#f7f7f7;
	display:inline;
}
#friends #mainContent p {
	width:300px;
	margin:10px;
	font-size:.8em;
}
#mainContent .clientList p {
	font-size:.8em;
	color:#ccc;
}
#mainContent .clientList ul {
	font-size:.8em;
	color:#ccc;
}

#mainContent .clientList h2 {
	display:block;
	margin:0 0 .5em 0;
	font-weight:bold;
	text-transform:uppercase;
	font-family: Arial, Helvetica, sans-serif;
	color:#666;
	font-size:.8em;
}
#mainContent h2 {
	font-size:1em;
	color:#666;
	font-weight:bold;
	text-transform:uppercase;
	font-family: Arial, Helvetica, sans-serif;
 }
#mainContent h3 {
	font-size:.8em;
 }
#mainContent h4 {
	font-size:16px;
 }




#subContent p, 
#subContent h2, 
#subContent h3, 
#subContent h4, 
#subContent h5 
{
	margin-right:10px;
	margin-left:10px;
}


#subContent h2, #mainContent h1 {
	clear:both;
	display:block;
	font-size:.8em;
	margin:0 0 .5em 0;
	padding:.4em 0 .2em 10px;
	font-weight:bold;
	text-transform:uppercase;
	font-family: Arial, Helvetica, sans-serif;
	background:transparent url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	border-top:1px solid #f1f1f1;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #f1f1f1;
	color:#999;
}
#subContent a.url {
	display:block;
	margin:0 0 1em 10px;
	color:#369;
	font-size:.8em;
	text-decoration:underline;
}
#subContent a.url:hover {
	text-decoration:none;
}
#subContent ul.technology {
	margin:0 0 1em 25px;
}
#subContent ul.technology li {

}

.projectLink {
	display:block;
	padding:4px 0;
	margin:0 0 0 10px;
	font-size:.8em;
}

#footer {
	font-size:10px;
	font-weight:bold;
	text-transform:uppercase;
	font-family: Arial, Helvetica, sans-serif;
	background:#fff;
	border:none;
	color:#ccc;
}

a.validator {
	float:right;
	margin:0 0 0 1px;
	padding:2px 4px;
	background:#f7f7f7;
}


#footer a {
	color:#aaa;
}
#footer .vcard {
	float:left;
	border-left:1px solid #eee;
	margin:0 0 0 4px;
	padding:0 0 0 4px;
}
#footer .copyright 
{
	float:left;
	margin:0;
	padding:0;
}
#footer .vcard div {
	display:inline;
	margin:0;
	padding:0;
}
form#contactForm {
}
form#contactForm fieldset {
	padding:10px;
	color:#ccc;
	border-color:#ccc;
}

form#contactForm legend {
	padding:10px;
	color:#515151;
}


form#contactForm input#name, 
form#contactForm input#phone, 
form#contactForm input#email, 
form#contactForm input#comment, 
form#contactForm textarea 
{
	border-top:1px solid #ccc;
	border-right:1px solid #eee;
	border-bottom:1px solid #eee;
	border-left:1px solid #ccc;
	background: #f7f7f7;
	color:#006699;
	display:block;
	margin:0 0 4px 0;
}

form#contactForm input#name { width:220px; }
form#contactForm input#phone { width:120px; } 
form#contactForm input#email { width:220px; } 

form#contactForm input#submitButton {
	padding:.4em .8em;
	background:#fff url("../images/bg_header_tile_horiz_btm.gif") repeat-x left bottom;
	border-top:1px solid #eee;
	border-right:1px solid #ccc;
	border-bottom:1px solid #ccc;
	border-left:1px solid #eee;
}

form#contactForm select 
{
	background: #f7f7f7;
	color:#000;
	display:block;
	margin:0 0 4px 0;
}

form#contactForm textarea {
	width:250px;
	height:100px;
}

form#contactForm label {
	display:block;
	font-size:.8em;
	color:#515151;
}
div.contactText {
	float:left;
	width:220px;
	margin:0 0 0 10px;
	display:inline;
}
div.contactText p {
	font-size: .8em;
	color:#515151;
}
div.contactFormContainer {
	float:right;
	width:270px;
	display:inline;
}
ul.news {
	margin:0 0 1em 1.8em;

}
ul.news li {
	margin:0 5em 1em 0;

}

#home #content { background: transparent url("../images/bg_home.jpg") no-repeat left top; }

/* fix IE for Mac */

#swap {visibility:visible;}


/*

--------------------------------------------------

Slideshow Styles

--------------------------------------------------

*/
#thumbs {
	float:left;
	background:#ccc;
	width:100%;
	border-top:1px solid #fff;
	border-bottom:1px solid #666;
}

#thumbs ul {
	float:left;
	width:100%;
	margin:10px 0;
}
#thumbs li {
	float:left;
	display:block;
}
#thumbs li a {
	float:left;
	display:block;
	margin:0 5px;
	width:70px;
	height:70px;
	background:#f7f7f7;
	border:1px solid;
	border-color:#666;
}
#thumbs li a:hover {
	background:#fff;
}
#thumbs li a img {
	display:block;
	text-align:center;
	margin:0 auto;
	padding:4px 0;
}

#mainImage {
	width:500px;
	margin:0 0 10px 0;
	padding:10px;
	background:#f7f7f7;
}

div.slideshow {
	float:left;
	position:relative;
}
div.slideshow div {
	top:0px;
	left:0px;
	position: absolute;
}
div.slideshow p {
  padding-top: 9px;
}
div.slideshow ul {
	display:block;
	width:100%;
	height:70px;
	text-align:center;
	margin:0 auto 10px auto;
	padding:0;
	background:#ccc;

	top:10px;
	left:0px;
	position: absolute;

}
div.slideshow ul a {
  background-position: 50% 50%;
  cursor: pointer;
  display: block;
  height: 60px;
  margin-right: 5px;
  opacity: 0.5;
  width: 60px;
}
div.slideshow ul a.active,
div.slideshow ul a:hover {
  opacity: 1;
}
div.slideshow ul li {
  float: left;
  list-style: none;
  margin:0 0 0 0;
}
li a.next { 
	background:transparent url("../images/next.gif") no-repeat 50% 50%;
	right:0px;
	position: absolute;
	
}
li a.prev {
	background:transparent url("../images/prev.gif") no-repeat 50% 50%;
}



/* email address */
.emailAddress {
	float:left;
	display:inline;
	width:350px;
	height:50px;
	background: transparent url("../images/email_address.gif") no-repeat center center;

}






/* 
-----------------------
 Basic Declarations
-----------------------
*/


form {
	display:block;
}

fieldset {
	display:block;
	padding:0 10px 20px 10px;
	margin:0 0 0 0;
	border:1px solid #ccc;
}

legend {
	float:left;
	color:#515151;
	margin:10px 0 10px 0;
	padding:0 2px;
}

legend span {
	float:left;
	color:#515151;
}

input {
	display:block;
	font-size:11px;
}
select {
	display:block;
	font-size:11px;
}

input[type=hidden] {
	display:none;
}

label {
	display:block;
	font-size:11px;
	color:#515151;
}

form p {
	display:block;
	margin:0 0 0 0;
}

/* 
-----------------------
 Form - Required
-----------------------
*/

span.required {
	color:#ff5400;
}

/* 
-----------------------
 Form DIV Declarations
-----------------------
*/

.fieldText {
	float:left;
	display:inline; /* fix ie double-margin bug */
	width:auto;
	margin:0 10px 10px 0;
}

.fieldTextArea {
	display:block;
	margin:0 0 10px 0;
}

.fieldSelect {
	float:left;
	display:inline; /* fix ie double-margin bug */
	width:auto;
	margin:0 10px 10px 0;
	padding:1px;
}

.fieldCheckbox {
	display:block;
	width:100%;
	margin:0 0 10px 0;
}

.fieldCheckboxes {
	margin:0 0 10px 0;
}

.fieldRadioButtons {
	margin:0 0 10px 0;
}

.fieldSubmit {
	margin:10px 0 10px 0;
}

.standalone {
	float:none;
	display:block;
}

/* 
--------------------------
 Form - Text Input
--------------------------
*/

.fieldText input {
	border:1px solid;
	border-color:#999 #ccc #ccc #999;
	background:#f1f1f1;
	padding:2px;
}

/* 
--------------------------
 Form - TextArea
--------------------------
*/

.fieldTextArea textarea {
	border:1px solid;
	border-color:#999 #ccc #ccc #999;
	background:#f1f1f1;
}

/* 
--------------------------
 Form - Select
--------------------------
*/

.fieldSelect select {
	border:1px solid;
	border-color:#999 #ccc #ccc #999;
	background:#f1f1f1;
}

/* 
--------------------------
 Form - Checkbox (single)
--------------------------
*/

.fieldCheckbox input {
	display:inline;
}

.fieldCheckbox label {
	display:inline;
}



/* 
-----------------------
 Form - Checkboxes
-----------------------
*/

.fieldCheckboxes ul {
	list-style:none;
	margin:0 0 0 10px;
}

.fieldCheckboxes li {
	list-style:none;
	margin:0 0 1px 0;
	padding:0;
}

.fieldCheckboxes li input {
	display:inline;
	margin:0 4px 0 0;
	width:12px;
	height:12px;
}

.fieldCheckboxes li label {
	display:inline;
}


/* 
-----------------------
 Form - Radio Buttons
-----------------------
*/

.fieldRadioButtons ul {
	list-style:none;
	margin:0 0 0 10px;
}

.fieldRadioButtons li {
	list-style:none;
	margin:0 0 0 0;
}

.fieldRadioButtons li input {
	display:inline;
}

.fieldRadioButtons li label {
	display:inline;
}


/* 
--------------------------
 Form - Error
--------------------------
*/
ul.formErrorList  {
	list-style:square;
	margin:0 0 1em 2em;
}
.formErrorList li {
	list-style:square;
	color:#ff4500;
}




/* 
--------------------------
 Form - Specifics
--------------------------
*/
#companyName {
	width:380px;
}
#url {
	width:380px;
}
#budget {
	width:380px;
}


#fieldsetSubmit {
	border:none;
}
#submitButton {
	font-size:18px;
	padding:2px 8px;
	
}