* {
padding: 0;
margin: 0;
}

body {
  background: #DFDFDF;
  font-family: 'Gill Sans Light', 'Helvetica Neue UltraLight', Helvetica, 'Arial Narrow';
  color: #FFFFFF;
  height: 100%;
}

#background1 {
  position:absolute;
	width: 89px;
	height: 1100px;
	top:0;
	left:0;
	z-index:1;
  background: url(images/left-gradient.jpg) no-repeat fixed;
}

#background2 {
  position:absolute;
	width: 89px;
	height: 1100px;
	top:0;
	right:0;
	z-index:2;
	background: url(images/right-gradient.jpg) no-repeat fixed 100% 0%;
}

#background3 {
  position:fixed;
	width: 89px;
	height: 100%;
	top:0%;
	left:0;
	bottom:0%;
	z-index:1;
  background: url(images/left-gradient.jpg) no-repeat fixed;
}

#background4 {
	position:fixed;
	width: 89px;
	height: 100%;
	top:0%;
	right:0;
	bottom:0%;
	z-index:2;
	background: url(images/right-gradient.jpg) no-repeat fixed 100% 0%;
	background-color: #F7F7F7;
	background-image: url(images/right-gradient.jpg);
}
#foreground {
	position:absolute;
	height: 50%;
	top:100px;
	right:100px;
	left:40%px;
	bottom:0;
	z-index:4;

}
h1 {
  text-indent: -5000px;
  position:relative;
	left:0%;
	top:0%;
	height: 89px;
	z-index: 9;
	background: url(images/alexdunn.png) no-repeat center top !important;
	background: url(images/alexdunn.gif) no-repeat center top;
}

p {
  z-index:4;
}

/* Note !important hack above so that browsers that do not support png will use gif image. */

#allText {
  position:absolute;
	left:167px;
	top:50px;
	height:195px;
	z-index:4;
	right: 15%;
  color: #000000;
}

.mainText {
  font-size: 18px;
}

.subText {
  font-size: 14px;
}

#indexImage {
  height: 487px;
	position: relative;
	z-index: 5;
	background: url(images/front-page.jpg) no-repeat top center;
}

#mainImage {
  position: relative;
	top:20px;
	z-index:5;
	width: 70%;
	max-width: 700px;
	height: auto;
	display:inline-block;
}
/* Note that 'display:inline-block;' rule fixes bug where image displays at full size in IE6 */

body.verticalimage500 #mainImage {
	width: 50%;
	max-width: 500px;
}

body.verticalimage350 #mainImage{
	width: 35%;
	max-width: 350px;
}

#indexImage .navigation {
	position:absolute;
	top:7px;
	width:50%;
	height:33px;
	z-index:6;
	font-family: "Gill Sans Light", "Helvetica Neue UltraLight", Helvetica, "Arial Narrow";
	word-spacing: 0px;
	left: 50%;
	text-align: right;
	font-size: 24px;
}

a:link {
	color: #FFFFFF;
	text-decoration: none;
}
a:visited {
	color: #FFFFFF;
	text-decoration: none;
}
a:hover {
	color: #CCCCCC;
	text-decoration: none;
}
a:active {
	color: #FFFFFF;
	text-decoration: none;
}

body.about a:link {
	color: #666666;
	text-decoration: underline;
}

body.about a:visited {
	color: #666666;
	text-decoration: underline;
}

body.about a:hover {
	color: #333333;
	text-decoration: underline;
}

body.about a:active {
	color: #666666;
	text-decoration: underline;
}

ul {
margin: 0px;
padding: 0px;
list-style: none;
width: 700px;
float: left;
}

ul li {
float: left;
margin-right: 20px;
}

#horizontal-rule {
	position: fixed;
	left: 1%;
	height: 4px;
	z-index: 7;
	right: 1%;
	bottom: 1%;
	background-color: #333333;
}

#thumbnailgallery {
  position:absolute;
	left:100px;
	top:30px;
	height:320px;
	z-index:6;
	right: 100px;
}

h3 {
color: #333333;
}

.thumbnail {
float: left;
border: 4px solid black;
margin: 0 15px 15px 0;
z-index: 9;
}

.flatline {
float: left;
border: 4px solid black;
margin: 0 15px 15px 0;
z-index: 9;
}

.clearboth {
  clear: both;
}

h2 {
	position:absolute;
	left: 144px;
	height:39px;
	z-index:9;
	bottom: 1%;
	right: 144px;
	background-image: url(images/taxt%20tab.gif);
	_background-image: url(images/taxt%20tab.gif);
	background-repeat: no-repeat;
	background-position: center;
	line-height:2.1em;
	text-align: center;
	font-size: 14px;
}

h4 {
	position:absolute;
	left: 144px;
	height:39px;
	z-index:9;
	bottom: 1%;
	right: 144px;
	background-image: url(images/taxt%20tab%20extra%20long.gif);
	_background-image: url(images/taxt%20tab.gif);
	background-repeat: no-repeat;
	background-position: center;
	line-height:2.1em;
	text-align: center;
	font-size: 11px;
}
* html h2 {
  width: 282px;
	left:33%;
	right:33%;
}


/* Note underscore hack above so that older browsers show gif image rather than png. */

#leftArrow {
	position:fixed;
	left:1%;
	width:40px;
	height:33px;
	z-index:9;
	bottom: 1%;
}

#rightArrow {
  position:fixed;
	left:5%;
	width:40px;
	height:33px;
	z-index:9;
	bottom: 1%;
}

#picholder {
  position:fixed;
	left:20%;
	width:40px;
	height:33px;
	z-index:9;
	bottom: 50%;
}

#home {
  position:fixed;
	width:40px;
	height:33px;
	z-index:9;
	right: 1%;
	bottom: 1%;
}

#gallery {
  position:fixed;
	width:40px;
	height:33px;
	z-index:9;
	right: 4%;
	bottom: 1%;
	padding: 0 1%;
}

#detail {
  position:fixed;
	width:40px;
	height:33px;
	z-index:9;
	right: 8%;
	bottom: 1%;
	padding: 0 1%;
}

#detail1 {
  position:fixed;
	width:40px;
	height:33px;
	z-index:9;
	right: 12%;
	bottom: 1%;
	padding: 0 1%;
}

#detail2 {
  position:fixed;
	width:40px;
	height:33px;
	z-index:9;
	right: 16%;
	bottom: 1%;
	padding: 0 1%;
}

#bottombackgroundleft {
	position:fixed;
	left:0%;
	width:60%;
	height:1%;
	z-index:5;
	bottom: 0px;
	background-image: url(images/spliced-background-left.jpg);
	background-repeat: repeat-y;
	background-color: #D7D7D7;
}

* html #bottombackgroundleft {
  display:none;
}

#bottombackgroundright {
	position:fixed;
	width:60%;
	height:1%;
	z-index:6;
	right: 0%;
	bottom: 0%;
	background-image: url(images/spliced-background-right.jpg);
	background-repeat: repeat-y;
	background-position: right;
}


* html #bottombackgroundright {
  display:none;
}

/* Fixes for IE 6 and lower */

* html #background1 {
  background-attachment: scroll;
}

* html #background2 {
  background-attachment: scroll;
}

* html h2, * html #horizontal-rule, * html #leftArrow, * html #rightArrow, * html #home, * html #gallery, * html #bottombackgroundleft, * html #bottombackgroundright {position: absolute;
top:expression(eval(document.compatMode &&
document.compatMode=='CSS1Compat') ?
documentElement.scrollTop
+(documentElement.clientHeight-this.clientHeight) 
: document.body.scrollTop
+(document.body.clientHeight-this.clientHeight));}


/* FORM STYLES */ 

body.contact #wrapper {
  margin-left: 17%;
	margin-right: 17%;
	margin-top: 90px;
	margin-bottom: 10px;
}

body.contact fieldset {
  border: 0px transparent;
  background: #DFDFDF;
}

body.contact table {
  background: #DFDFDF;
}

body.contact p {
 color: black;
}

body.contact label {
  color: black;
	z-index: 10;
}

body.contact input[type="text"] {
  width: 200px;
}

textarea {
  width: 300px;
  height: 100px;
}

input:focus, textarea:focus {
  background: #ffc;
}

input[type="text"], textarea {
  border-top: 2px solid #999;
  border-left: 2px solid #999;
  border-bottom: 1px solid #ccc;
  border-right: 1px solid #ccc;
}