/**CSS STYLES**/
/**GENERAL**/
body{
background: #d8d6bf url(../images/bg.jpg) repeat-x scroll top center;
color: #6a6753;}

a{color: #F1792D;}
em{font-weight: bold;}
.border { /*border: 3px solid #6BA314;*/ padding: 20px;}  /*see http://www.lateralcode.com/cool-css3-effects/ for css3 effects */
.border2{ border: 8px solid #FFF;}
.divider{
background: url(../images/divider.jpg) repeat-x scroll 0 0;
height: 2px;
margin: 50px 0;}
.upper{ margin-top: 19px;}
p.info {display: none;}

/*******CONTAINERS*************/
#wrapper{
margin: 0 auto 40px;
overflow: hidden;
position: relative;
width: 960px;}

#header{
background: transparent;
height: 70px;
margin-bottom: 40px;
position: relative;
width: 100%;}

.box{
min-height:350px;
overflow: auto;
padding-top: 54px;
width: 800px;}



/***********HEADERS************/
.lancashire{
background: url(../images/lancashirebg.jpg) no-repeat scroll 74px 3px;}

.upholstery{
background: url(../images/upholsterybg.jpg) no-repeat scroll 74px 3px;}

.gekko{
background: url(../images/gekkobg.jpg) no-repeat scroll 74px 3px;}

.performance{
background: url(../images/performancebg.jpg) no-repeat scroll 74px 3px;}

.allinmagic{
background: url(../images/allinmagicbg.jpg) no-repeat scroll 74px 3px;}

.wigstudio{
background: url(../images/wigstudiobg.jpg) no-repeat scroll 74px 3px;}

h1#logo{
background: transparent url(../images/logo.png) no-repeat scroll 0 0;
float: left;
height: 97px;
text-indent: -9999px;
width: 431px;}

h1#logo a{
height: 104px;
width: 451px;}

.strap{
height: 175px;
margin-bottom: -8px;
position: relative;
text-indent: -9999px;
width: 950px;}

.home {background: url(../images/strap.jpg) no-repeat scroll 0 0;}
.branding{background: url(../images/brandingstrap.jpg) no-repeat scroll 0 0;}
.websites{background: url(../images/websitestrap.jpg) no-repeat scroll 0 0;}
.graphics{background: url(../images/graphicstrap.jpg) no-repeat scroll 0 0;}
.composite{background: url(../images/compositestrap.jpg) no-repeat scroll 0 0;}


h3.branding{
background: url(../images/headers.jpg) no-repeat scroll -4px 0;
height: 37px;
text-indent: -9999px;
width: 128px;}

h3#current{
background: url(../images/current.jpg) no-repeat scroll 0 0;
height: 59px;
text-indent: -9999px;
width: 836px;}

h3.websites{
background: url(../images/headers.jpg) no-repeat scroll -134px 0;
height: 37px;
text-indent: -9999px;
width: 154px;}

h3.graphics{
background: url(../images/headers.jpg) no-repeat scroll -293px 0;
height: 37px;
text-indent: -9999px;
width: 196px;}
	
h3.composite{
background: url(../images/headers.jpg) no-repeat scroll -495px 0;
height: 37px;
text-indent: -9999px;
width: 128px;}
	
h3.contact{
background: url(../images/headers.jpg) no-repeat scroll -633px 0;
height: 37px;
text-indent: -9999px;
width: 156px;}

h3.links{
background: url(../images/headers2.jpg) no-repeat scroll 0 0;
height: 37px;
text-indent: -9999px;
width: 93px;}

h3.articles{
background:url(../images/headers2.jpg) no-repeat scroll -100px 0;
height: 37px;
text-indent: -9999px;
width: 129px;}

h3.cv{
background:url(../images/headers2.jpg) no-repeat scroll -247px 0;
height: 37px;
text-indent: -9999px;
width: 42px;}

h3.testimonials{
background:url(../images/headers2.jpg) no-repeat scroll -303px 0;
height: 37px;
text-indent: -9999px;
width: 200px;}

/********NAVIGATION***********/

ul#nav{
float:right;
margin-top: 34px;}

ul#nav li, ul#links li{
display: inline;
float: left;
font-weight: lighter;
margin-right: 14px;}

ul#nav a{
color: #FFF;
text-decoration: none;}

ul#links a{
color:#676552;
text-decoration: none;}



/******************THUMBS********************/

#thumb_box, .bot{
min-height: 300px;
margin: 0 auto 20px;
overflow: hidden;
padding-left: 10px;
position: relative;}

#thumb_box ul{
list-style-type : none;}

#thumb_box li{
float: left;
height: 264px;
position: relative;
width: 230px;}


#thumb_box li span, #thumb_box li.website span, #thumb_box li.graphic span, #thumb_box li.composite span{
line-height: 18px;
left: 5px;
position: absolute;
top: 169px;
width: 214px;}

#thumb_box li.branding{
background: url(../images/branding.jpg) no-repeat scroll 0 0;}

#thumb_box li.website{
background: url(../images/website.jpg) no-repeat scroll 0 0;}

#thumb_box li.graphic{
background: url(../images/graphic.jpg) no-repeat scroll 0 0;}

#thumb_box li.composite{
background: url(../images/composite.jpg) no-repeat scroll 0 0;}


#thumb_box a{text-decoration:none;}


.current, .portfolio{
overflow: hidden;
position: relative;}

	
.current p, .portfolio p{
font-size: 16px;
position: absolute;
right: 79px;
top: 110px;
width: 350px;}


.video{
height: 263px;
position: absolute;
right: -22px;
top: 282px;
width: 350px;
z-index: 300;}


/****form****/
#form{ 
margin-top: 18px;
padding-left: 10px;
width:400px;}

#form input, #form textarea{
background: #6A6753;
color: #FFF;
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius: 5px 5px 5px 5px;
border-radius: 5px;
font-size: 14px;
padding:10px;
margin: 0 0 20px;
width: 250px;}

#form label {
color:#6A6753;
display: block;
float: left;
font-size: 16px;
font-weight: bold;
margin: 5px 25px 0 0;
text-align: left;
width:60px; }

#form label.error{
color: red;
font-size: 10px;}


#form input#button1{
cursor: pointer;
float: left;
margin-right: 13px;
border: medium none;
bottom: 0px;
background: transparent url(../images/contactbutton.jpg) no-repeat scroll 0 0;
width: 128px;
height: 37px;
position: absolute;
left:386px;
text-indent: -9999px;
overflow: hidden;
font-size: 0px; display:block; line-height: 0px; /*these last three ppties are so text doesnt display in ie*/}

#form input#button1:hover{
background-position: 0 -37px;}

#form input:focus, #form textarea:focus{
border: 2px solid #6A6753;}
.rounded{-moz-border-radius: 10px;
-webkit-border-radius: 10px;}
.border{ border: 4px solid #000;}


/************JAVASCRIPT COUPON**************/
#coupon{
background:url(../images/callback.png) 0 bottom no-repeat;
cursor:pointer;
left:370px;
opacity:0.8;
position:absolute;
top:254px;
width: 640px;
}

.closed{ height:99px; }

.open{ height:333px; }



