body {
	background-color: #000;
	text-align: center;
	margin: 0 auto;
	padding: 0;	
}

#connectionspg #interior {
	background-image: url(../images/connectionsbg.jpg);
}

#interior {
	position: relative;
	width: 806px;
	height: 562px; 
	background-image: url(../images/intbg.jpg);
	text-align: center;
	margin: 0 auto;
	padding: 0;	
}

#interiorpad {
	height: 45px;
}

#thumbs {
	position: absolute;
	top: 71px; left: 47px;
	width: 263px; height: 452px;
}

.canvas {
	position: absolute;
	top: 70px;
	left: 305px;
	width: 445px;
	height: 445px;
	margin: 0;
	padding: 0;	
	display: none;
}

.canvas div {
	position: relative;
	width: 445px;
	height: 445px;
	margin: 0 auto;
	padding: 0;	
	text-align: center;
	display: table-cell;
	vertical-align: middle;
}

.canvas div img {
	vertical-align: middle;
}

* html .canvas div {
	font-family: monospace;
	font-size: 400px;
	line-height: 0px;
	padding: 0;
	height: 0;	
}

#copyright, #misc {
	color: #777;
	padding-bottom: 15px;
	width: 806px;
	text-align: center;
	margin: 0 auto;
	position: relative;
}

#copyright table {
	letter-spacing: 5px;
	text-align: center;
	margin: 0 auto;
	border-collapse: separate;
	border-spacing: 20px 0px;
}

#copyright a { border: none; text-decoration: none; color: #777; }
#copyright a:selected { border: none; text-decoration: none; color: #777; }
#copyright a:hover { border: none; text-decoration: none; color: #ffcc00; }

.undertxt, pre {
	font-size: 13px;
	font-family: garamond, baskerville, "baskerville old face", "hoefler text", "Bookman Old Style", "Times New Roman", Times, Palatino, serif;
	letter-spacing: 7px;
	padding-top: 2px;
	font-variant: small-caps;
}

pre {
	font-size: 12px;
	font-family: garamond, baskerville, "baskerville old face", "hoefler text", "Bookman Old Style", "Times New Roman", Times, Palatino, serif;
	letter-spacing: 4px;
	padding-top: 2px;
}


.sm { position: absolute; border: none; width: 100px; height: 100px; }
.lg { border: none; }
.cp {
  border: none;
  display: none;
  position: absolute;
	top: -37px;
	left: 308px;
	width: 445px;
	height: 18px;
	margin: 0 auto;
	text-align: center;
}

#sm1 { top: 0px; left: 0px; }
#sm2 { top: 0px; left: 116px; }
#sm3 { top: 116px; left: 0px; }
#sm4 { top: 116px; left: 116px; }
#sm5 { top: 233px; left: 0px; }
#sm6 { top: 233px; left: 116px; }
#sm7 { top: 350px; left: 0px; }
#sm8 { top: 350px; left: 116px; }

#nav {
	position: absolute;
	height: 31px;
	width: 711px;
	top: 38px;
	left: 36px;
}
	
#menu a {
   position: absolute;
   height: 31px;
   top: 0px; 
   text-decoration: none;
   border: none;
}

#menu a   { border: none; text-decoration: none; }
#menu a i { visibility: hidden; }

a#home			    { left: 0px; width: 73px; }
a#music		      { left: 86px; width: 73px; }
a#dance			    { left: 175px; width: 73px; }
a#theatre		    { left: 268px; width: 89px; }
a#concept		    { left: 371px; width: 89px; }
a#artefacts	    { left: 478px; width: 104px; }
a#connections		{ left: 603px; width: 123px; }

a#home:hover		    { background-image: url("../images/menubar/hover1.jpg"); }
a#music:hover		    { background-image: url("../images/menubar/hover2.jpg"); }
a#dance:hover		    { background-image: url("../images/menubar/hover3.jpg"); }
a#theatre:hover	    { background-image: url("../images/menubar/hover4.jpg"); }
a#concept:hover		  { background-image: url("../images/menubar/hover5.jpg"); }
a#artefacts:hover	  { background-image: url("../images/menubar/hover6.jpg"); }
a#connections:hover { background-image: url("../images/menubar/hover7.jpg"); }

body#musicpg a#music             { background-image: url("../images/menubar/selected2.jpg"); }
body#dancepg a#dance             { background-image: url("../images/menubar/selected3.jpg"); }
body#theatrepg a#theatre         { background-image: url("../images/menubar/selected4.jpg"); }
body#conceptpg a#concept         { background-image: url("../images/menubar/selected5.jpg"); }
body#artefactspg a#artefacts     { background-image: url("../images/menubar/selected6.jpg"); }
body#connectionspg a#connections { background-image: url("../images/menubar/selected7.jpg"); }

#copyright a { border: none; text-decoration: none; color: #777; }
#copyright a:selected { border: none; text-decoration: none; color: #777; }
#copyright a:hover { border: none; text-decoration: none; color: #ffcc00; }

#inspired {
	position: absolute;
	top: 70px;
	left: 420px;
	width: 300px;
	height: 449px;
	text-align: left;
}

#inspired h2 {
	text-align: left;
}

#clients {
	position: absolute;
	left: 15px;
	width: 190px;
}
 
#clients pre { font-variant: small-caps; }

.heading {
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 16px;
	font-family: garamond, baskerville, "baskerville old face", "hoefler text", "Bookman Old Style", "Times New Roman", Times, Palatino, serif;
	text-decoration: underline;
	line-height: 30px;
	padding: 0;
	text-align: left;
}

.bodytext {
	text-align: left;
	color: #333333;
	font-size: 14px;
	font-family: garamond, baskerville, "baskerville old face", "hoefler text", "Bookman Old Style", "Times New Roman", Times, Palatino, serif;
}

.notes {
	padding-bottom: 10px;
	letter-spacing: .25em;
	font-size: 12px;
	font-family: garamond, baskerville, "baskerville old face", "hoefler text", "Bookman Old Style", "Times New Roman", Times, Palatino, serif;
	text-decoration: none;
	text-align: left;	
}

#artefacts .notes {
	width: 700px;
	margin: 0 auto;
	color: #333;
	text-align: justify;
	letter-spacing: .15em;
}

.notes a {
	text-decoration: none;
	color: #999999;
}

.holder {
	position: absolute;
	left: 150px;
	top: 150px;
	margin: 10px;
}



#connectionspg #thumbs {
	position: absolute;
	top: 74px;
	left: 52px;
	width: 263px;
	height: 452px;
  margin: 0;
	padding: 0;		
}

#left-pane {
	width: 225px;
	height: 440px;
}


#bio {
	position: absolute;
	top: 73px;
	left: 310px;
	width: 455px;
	height: 446px;
	margin: 0;
	padding: 0;	
}

#right-pane {
	width: 458px;
	height: 442px;
}

.scroll-pane {
	overflow: auto;
	float: left;
	background-color: #000;
	color: #cc6600;
	margin: 0 auto;
	width: 100%;
	padding: 0;	
}

.scroll-pane h1, #misc h1 {
	font-size: 16px;
	color: #FFFFFF;
}

#right-pane p {
	text-align: justify;
	margin-left: 20px;
	margin-right: 20px;
}

#left-pane p {
	text-align: left;
	margin-left: 20px;
	margin-right: 20px;
}

a.jScrollArrowUp {
	background: url(../images/basic_arrow_up.gif) no-repeat 0 0;
}
a.jScrollArrowUp:hover {
	background-position: 0 -15px;
}
a.jScrollArrowDown {
	background: url(../images/basic_arrow_down.gif) no-repeat 0 0;
}
a.jScrollArrowDown:hover {
	background-position: 0 -15px;
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	background-position: 0 -30px;
}

#misc {
	color: #777777;
	width: 830px;
	text-align: center;
	margin: 0 auto;
	padding: 0 px;
	position: absolute;
	top: 530px;
	left: 0px;
	background: url(../images/connectionsbg_strip.jpg) top left repeat-y;
}

#linksleft {
	position: relative;
	float: left;
	top: 0px;
	left: 47px;
	width: 345px;
	background-color: none;
	padding-bottom: 15px;
	color: #333;
}

#linksright {
	position: relative;
	float: right;
	top: 0px;
	right: 47px;
	width: 345px;	
	background-color: none;
	padding-bottom: 15px;	
	color: #333;
}

#linksleft div, #linksright div { padding-bottom: 6px; }

#connectionspg #misc a { border: none; text-decoration: none; color: #777; }
#connectionspg #misc a:selected { border: none; text-decoration: none; color: #777; }
#connectionspg #misc a:hover { border: none; text-decoration: none; color: #ffcc00; }

#connectionspg #copyright { display: none; }