html {
background: url('../images/bg.gif') repeat-x
}

body, p {
font-family: arial, sans-serif;
color: #656561;
text-align: left;
line-height: 18px;
font-size: 11px;
}

body, html {
margin: 0px;
padding: 0px;
}

/*general*/

#container {
width: 950px;
padding: 50px 0px 0px 50px; 
}

.separator {
background-image: url('../images/dottedline.gif');
height: 1px;
line-height: 1px;
overflow: auto;
clear: both;
width: 230px;
position: absolute;
left: 755px;
top: 116px;
} 

.dottedline {
background-image: url('../images/dottedline2.gif');
height: 1px;
line-height: 1px;
overflow: auto;
clear: both;
margin: 0px 0px 30px 0px;
} 

.clearfloat {
clear: both;
line-height: 0px;
font-size: 0px;
height: 0px;
overflow: auto;
}

h1 {
display: none;
}

#web, #print, #identity, #other {
margin-bottom: 10px;
margin-top: 10px;
width: 500px;
}

a img {
border: none;
}

/*header*/


a#fullyfunctional span {
display: none;
}

a#fullyfunctional {
display: block;
width: 233px;
height: 96px;
background: url('../images/fullyfunct.gif') no-repeat 0 0;
position: absolute;
left: 711px;
top: 0px;
}

a#fullyfunctional:hover{ 
background-position: -233px 0px;
}

#header ul li, #identity-image ul li {
list-style-type: none;
}

#header ul {
float: right;
position: absolute;
top: 130px;
left: 710px;
width: 220px;
}

#header {
overflow: visible;
clear: both;
margin-bottom: 50px;
}

ul#nav li {
display: inline;
}

ul#nav li a {
font-family: arial, sans-serif;
color: #CFBD2B;
letter-spacing: 1px;
text-align: left;
text-decoration: none;
line-height: 20px;
font-size: 13px;
padding: 2px 5px 2px 5px;
}

ul#nav li a:hover {
color: #000;
background: #CFBD2B;
padding: 2px 5px 2px 5px;
}

ul#nav li a.selected {
color: #000;
background: #CFBD2B;
padding: 2px 5px 2px 5px;
}


.cheezburger {
font-family: arial, sans-serif;
font-weight: normal;
font-size: 13px;
text-align: left;
line-height: 25px;
letter-spacing: 1px;
color: #CFBD2B;
margin-bottom: -18px;
width: 415px;
}

.intro {
font-family: georgia, serif;
font-weight: normal;
font-size: 19px;
text-align: left;
line-height: 28px;
color: #FFF;
width: 415px;
}


/*web*/

.web-image {
float: left;
position: relative;
left: -20px;
width: 713px;
clear: both;
}

.web-description {
float: right;
overflow: visible;
position: relative;
left: -70px;
top: -6px;
}

/*print*/

.print-image {
float: right;
width: 713px;
}

.print-description, #print-description-sklar {
float: left;
overflow: visible;
position: relative;
left: 2px;
}

/*typography general*/

h1 {
font-family: georgia, serif;
font-weight: normal;
font-size: 30px;
text-align: left;
color: #CFBD2B;
}

h2 {
font-family: georgia, serif;
font-weight: normal;
font-size: 19px;
text-align: left;
line-height: 21px;
color: #000;
margin-bottom: -7px;
}

h2 a {
font-family: georgia, serif;
font-weight: normal;
font-size: 19px;
text-align: left;
line-height: 21px;
color: #000;
margin-bottom: -7px;
text-decoration: none;
}

h2 a:hover {
color: #000;
text-decoration: none;
border-bottom: 1px dotted #000;
}

a {
font-family: arial, sans-serif;
color: #000;
text-align: left;
text-decoration: none;
clear: both;
width: 230px;
outline: none;
}

a:hover {
text-decoration: underline;
}

.web-description, .print-description, #print-description-sklar p {
font-family: arial, sans-serif;
color: #656561;
text-align: left;
line-height: 18px;
font-size: 11px;
width: 175px;
}

.poplinks a {
font-family: arial, sans-serif;
font-size: 13px;
color: #000;
text-align: left;
text-decoration: none;
line-height: 20px;
background: #FFF;
padding: 2px 5px 2px 5px;
margin-left: -3px;
}

.poplinks a:hover {
color: #FFF;
background: #000;
text-decoration: none;
padding: 2px 5px 2px 5px;
}

.toplinks a {
position: relative;
left: 850px;
padding: 0px 0px 5px 10px;
line-height: 0px;
}

.toplinks a:hover {
text-decoration: overline;
}


/*identity*/

#identity img {
float: left;
}

#identity a {
font-family: arial, sans-serif;
font-size: 13px;
color: #000;
text-align: left;
text-decoration: none;
line-height: 20px;
background: #FFF;
padding: 2px 5px 2px 5px;
position: relative;
left: 10px;
top: 6px;
}

#identity a:hover {
color: #FFF;
background: #000;
text-decoration: none;
padding: 2px 5px 2px 5px;
}

/*logos*/

#logogrid ul li {
display: inline;
list-style-type: none;
}

#logogrid-bottom ul li {
display: inline;
list-style-type: none;
}


#logogrid {
width: 930px;
height: 170px;
background: #fff;
text-align: left;
position: relative;
top: 20px;
}

#logogrid-bottom {
width: 930px;
height: 110px;
background: #fff;
text-align: left;
position: relative;
}

.logos span {
display: none;
}

#logo1 {
display: block;
width: 108px;
height: 112px;
background: url('../images/identity/crystallized.gif') no-repeat 0 0;
position: absolute;
left: -8px;
}

#logo1:hover{ 
background-position: -108px 0px;
}

#logo2 {
display: block;
width: 183px;
height: 152px;
background: url('../images/identity/oceandrive.gif') no-repeat 0 0;
position: absolute;
left: 168px;

}

#logo2:hover{ 
background-position: -183px 0px;
}

#logo3 {
display: block;
width: 108px;
height: 112px;
background: url('../images/identity/tickledpink.gif') no-repeat 0 0;
position: absolute;
left: 390px;
}

#logo3:hover{ 
background-position: -108px 0px;
}


#logo4 {
display: block;
width: 152px;
height: 71px;
background: url('../images/identity/blinklogic.gif') no-repeat 0 0;
position: absolute;
left: 570px;
}

#logo4:hover{ 
background-position: -152px 0px;
}

#logo5 {
display: block;
width: 108px;
height: 112px;
background: url('../images/identity/pnim.gif') no-repeat 0 0;
position: absolute;
left: 778px;
}

#logo5:hover{ 
background-position: -108px 0px;
}


#logo6 {
display: block;
width: 105px;
height: 75px;
background: url('../images/identity/hmagazine.gif') no-repeat 0 0;
position: absolute;
left: 0px;
}

#logo6:hover{ 
background-position: -105px 0px;
}

#logo7 {
display: block;
width: 105px;
height: 75px;
background: url('../images/identity/invivo.gif') no-repeat 0 0;
position: absolute;
left: 182px;

}

#logo7:hover{ 
background-position: -105px 0px;
}

#logo8 {
display: block;
width: 142px;
height: 49px;
background: url('../images/identity/cunningham.gif') no-repeat 0 0;
position: absolute;
left: 378px;
}

#logo8:hover{ 
background-position: -142px 0px;
}

#logo9 {
display: block;
width: 121px;
height: 56px;
background: url('../images/identity/nofuture.gif') no-repeat 0 0;
position: absolute;
left: 582px;
}

#logo9:hover { 
background-position: -121px 0px;
}

#logo10 {
display: block;
width: 150px;
height: 68px;
background: url('../images/identity/dysfunction.gif') no-repeat 0 0;
position: absolute;
left: 778px;
}

#logo10:hover { 
background-position: -150px 0px;
}

/*other illustration*/

.dia {
float: left;
position: relative;
top: -18px;
padding: 0px 15px 0px 0px;
}

.illustration {
position: relative;
width: 940px;
left: 10px;	
}

.illustration span {
display: none;
}

#illgrid ul li, #illgrid-bottom ul li {
display: inline;
list-style-type: none;
}

#illgrid, #illgrid-bottom {
width: 930px;
height: 183px;
background: #fff;
text-align: left;
position: relative;
}


#ill1 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/wow.jpg') no-repeat 0 0;
position: absolute;
left: -26px;
}

#ill2 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/fortiva.jpg') no-repeat 0 0;
position: absolute;
left: 165px;
}

#ill3 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/stapler-hand.jpg') no-repeat 0 0;
position: absolute;
left: 356px;
}

#ill4 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/audability-dia.jpg') no-repeat 0 0;
position: absolute;
left: 547px;
}

#ill5 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/icct.jpg') no-repeat 0 0;
position: absolute;
left: 738px;
}

#ill6 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/singlelink.jpg') no-repeat 0 0;
position: absolute;
left: -26px;
}

#ill7 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/audability.jpg') no-repeat 0 0;
position: absolute;
left: 165px;
}

#ill8 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/robbie.jpg') no-repeat 0 0;
position: absolute;
left: 356px;
}

#ill9 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/stapler.jpg') no-repeat 0 0;
position: absolute;
left: 547px;
}

#ill10 {
display: block;
width: 183px;
height: 183px;
background: url('../images/other/asimo.jpg') no-repeat 0 0;
position: absolute;
left: 738px;
}

#ill1:hover, #ill2:hover, #ill3:hover, #ill4:hover, #ill5:hover, #ill6:hover, #ill7:hover, #ill8:hover, #ill9:hover, #ill10:hover{ 
background-position: -183px 0px;
}







/*column*/

#column {
width: 950px;
background: #fff;
text-align: left;
position: relative;
top: -10px;
}

h2.title {
margin-bottom: 25px;
}

h2.four {
font-family: georgia, serif;
font-weight: normal;
font-size: 19px;
text-align: left;
line-height: 28px;
color: #000;
margin-top: 27px;
}

h2.white {
text-align: right;
color: #FFF;
margin-bottom: 25px;
text-align: right;
padding: 0px 26px 0px 0px;
}

ul#textlist {
position: relative;
left: -38px;
width: 207px;
}

.four {
position: absolute;
left: 0px;
width: 210px;
top: 22px;
}

.four-two {
position: absolute;
top: 13px;
left: 251px;
width: 225px;
}

.four-three {
position: absolute;
width: 200px;
top: 13px;
left: 490px;
}

.four-black {
position: absolute;
background: #000;
width: 230px;
top: -7px;
left: 720px;
padding: 23px 0px 30px 0px;
}


ul#nav-bottom li a {
font-family: arial, sans-serif;
color: #CFBD2B;
letter-spacing: 1px;
text-align: left;
text-decoration: none;
line-height: 23px;
font-size: 13px;
padding: 2px 5px 2px 5px;
}

ul#nav-bottom li a:hover {
color: #000;
background: #CFBD2B;
padding: 2px 5px 2px 5px;
}

ul#nav-bottom {
list-style-type: none;
text-align: right;
margin-bottom: 105px;
padding: 0px 20px 0px 0px;
}