* /*Set's border, padding and margin to 0 for all values*/
{
	padding: 0;
	margin: 0;
	border: 0;
}

body, html
{
	font-family: Verdana, Geneva, sans-serif;
	text-decoration: none;
	font-size: 13px;
	color: 000;
}

outer
body
{
	min-width: 760px;
}

h1
{
	color: #39F;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
}

a
{
	color: #39F;
	text-decoration: none;
}

a:hover
{
	color: #690;
	text-decoration: underline;
	font-weight: bold;
}

table a
{
	color: #39F;
	text-decoration: none;
	font-weight: bold;
}

table a:hover
{
	color: #690;
	text-decoration: underline;
	font-weight: bold;
}

.style1
{
	font-family: Verdana, Geneva, sans-serif;
	text-decoration: none;
	font-size: 10px;
	color: #999;
}

.style2
{
	font-family: Verdana, Geneva, sans-serif;
	font-style: italic;
	font-size: 10px;
	color: #333;
}

.style3
{
	font-family: Verdana, Geneva, sans-serif;
	text-decoration: none;
	font-size: 14px;
	color: #0099ff;
}

.imgborder
{
	border: none;
}

.clear
{
	clear: both;
}

#mainContainer
{
	min-height: 700px;
}

* html #mainContainer
{
	height: 700px; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

#header
{
	background: url(../images/header-background.png) repeat-x;
	height: 116px;
}

#header img
{
	margin: 0;
	padding: 0;
	border: none;
	height: 116px;
}

#header2
{
	margin-top: 20px;
	background: url(../images/header-background.png) repeat-x top center;
	height: 250px;
}

#header2 a
{
	text-decoration: none;
	color: #0099ff;
}

#header2 a:hover
{
	text-decoration: underline;
	color: #669900;
}

#header2 img
{
	margin: 0;
	padding: 22px 0 0 0;
	border: none;
}

/**************************
   CONTENT AND COLUMNS
**************************/
.outer
{
	border-left: 177px solid #fff; /*** This is the width and the color for our left column ***/
	border-right: 150px solid #fff; /*** This is the width and the color for our right column ***/
}

* html .outer
{
/*** No need for hacking IE on this layout ***/
}

.inner
{
	width: 100%; 
}
* html .inner
{
/*** No need for hacking IE on this layout ***/
}

/*** div.inner is wider than its container, div.outer, and so overlaps to the right, pushing
div.right into the proper position. IE expands div.outer instead, requiring a Tan hack to avoid 
blowing the layout apart. IE gets the original 100% width as in the Livingstone layout. It blows 
my mind that all this hacking is being caused by the mighty Gecko engine! (shakes head ruefully)
***/

.float-wrap
{
	float: left;
	width: 100%;
	margin-left: -177px; /*** Same length as .outer border-left but with negative value ***/
	background:url(../images/sidebar-logo-left-bg.png) top left repeat-y;
}

* html .float-wrap
{
/*** No need for hacking IE on this layout ***/
}
#content
{
	clear: both;
	float: right;
	margin-right: -177px;  /*** Same length as .outer border-left but with negative value ***/
	width: 100%;
}

* html #content
{
	
}

.contentWrap
{
	clear: both;
	padding: 15px;
}

.contentWrap p
{
	margin: 0;
	padding: 0 0 10px 0;
}

/**************************
       LEFT COLUMN
**************************/
/*** div.left is in div.float-wrap, and when div.float-wrap is neg margined to the left, 
div.left is carried over into the proper position. 
***/

#left
{
	float: left;
	width: 177px;
	min-height: 630px;
	height: auto;
	background: url(../images/sidebar-logo-left-bg.png) repeat-y;
}

#left-content
{
	float: left;
	margin: 0;
	padding: 70px 0 0 0;
	width: 177px;
	height: auto;
	background: url(../images/sidebar-logo-left.png) no-repeat;
}

#left img
{
	margin: 0;
	padding: 0;
	border: 0;
}

#left ul, li
{
	margin: 0;
	padding: 0;
	list-style: none;
}

* html #left
{
	position: relative;  /*** IE needs this  ***/
	height: 250px;
}

/*************************
       RIGHT COLUMN
**************************/

#right
{
	float: right; 
	width: 130px;
	padding: 15px 10px 0 10px;
	min-height: 250px;
	margin-right: -150px; /** This negative margin-right value is the width of the right column + the padding, in this example 130px. ***/
	text-decoration: none;
}

#right p
{
	margin: 0;
	padding: 5px 0 15px 0;
	text-align: center;
	color: #339933;
	font-size: 10px;
	text-decoration: none;
}

* html #right 
{
	height: 250px;
	position: relative;  /*** IE needs this  ***/
}

/**************************
         FOOTER
**************************/
#footer
{
	text-align: center;
}

/**************************
     ARTISTS ON NORTON
**************************/

#art-outer
{
	margin-top: 10px;
	margin-right: 10px;
	padding: 0;
	float: left;
	display: inline;
	width: 400px;
	height: 210px;
	border: solid 1px #3399ff;
}

#art-outer img
{
	margin: 0;
	padding: 0;
	border: none;
}

#art-image
{
	margin: 0;
	padding-top: 5px;
	float: left;
	display: inline;
	width: 150px;
	height: 200px;
}

#art-image img
{
	margin: 0;
	padding: 0;
	border: none;
}

#art-text
{
	margin: 0;
	padding: 10px 5px 0 5px;
	float: left;
	display: inline;
	width: 240px;
	height: 190px;
}

#art-text p
{
	margin: 0;
	padding: 0 0 5px 0;
	font-family: Verdana, Geneva, sans-serif;
	line-height: 16px;
}

#art-text a
{
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-family: Verdana, Geneva, sans-serif;
	color: #39F;
	text-decoration: none;
}

#art-text a:hover
{
	margin: 0;
	padding: 0;
	font-family: Verdana, Geneva, sans-serif;
	color: #693;
}

#art-special
{
	margin-top: 10px;
	margin-right: 10px;
	padding: 0;
	float: left;
	display: inline;
	width: 400px;
	height: 210px;
	border: solid 1px #090;
	background: #ccffcc;
}

#art-special img
{
	margin: 0;
	padding: 0;
	border: none;
}

#art-special p
{
	margin: 0;
	padding: 5px 0 5px 0;
	font-family: Verdana, Geneva, sans-serif;
	line-height: 14px;
	color:  #060;
	text-align: center;
	font-size: 10px;
}

#art-special a
{
	margin: 0;
	padding: 0;
	font-size: 10px;
	font-family: Verdana, Geneva, sans-serif;
	color: #39F;
	text-decoration: none;
}

#art-special a:hover
{
	margin: 0;
	padding: 0;
	font-size: 10px;
	font-family: Verdana, Geneva, sans-serif;
	color: #693;
}

/**************************
 ARTISTS ON NORTON GALLERY
**************************/

#gallery
{
	width: 800px;
	height: 200px;
	border: 1px dashed #ccc;
}

#gallery-image
{
	float: left;
	display: inline;
	width: 125px;
	height: 200px;
}

#gallery-image img
{
	margin: 0;
	padding: 25px 0 0 25px;
	border: none;
}

#gallery-text
{
	float: left;
	width: 675px;
	height: 200px;
}

#gallery-text h1
{
	margin: 0;
	padding: 10px 0 0 20px;
	font-family: Verdana, Geneva, sans-serif;
	color: #39F;
	text-align: left;
	font-size: 14px;
}

#gallery-text p
{
	margin: 0;
	padding: 5px 10px 5px 20px;
	font-family: Verdana, Geneva, sans-serif;
	color: #000;
	text-align: left;
	font-size: 12px;
}

/**************************
         GALLERY
**************************/

#main-gallery
{
	float: left;
	width: 220px;
	height: 200px;
}

#main-gallery p
{
	text-align: center;
}

#main-gallery2
{
	float: left;
	width: 140px;
	height: 240px;
	padding-left: 40px;
}

#main-gallery2 p
{
	text-align: center;
}

/**************************
         LIGHTBOX
**************************/

#lightbox
{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}

#lightbox img
{
	width: auto;
	height: auto;
}

#lightbox a img
{
	border: none;
}

#outerImageContainer
{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}

#imageContainer
{
	padding: 10px;
}

#loading
{
	position: absolute;
	top: 40%; left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}

#hoverNav
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

#imageContainer>#hoverNav
{
	left: 0;
}

#hoverNav a
{
	outline: none;
}

#prevLink, #nextLink
{
	width: 49%;
	height: 100%;
	background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */
	display: block;
}

#prevLink
{
	left: 0;
	float: left;
}

#nextLink
{
	right: 0;
	float: right;
}

#prevLink:hover, #prevLink:visited:hover
{
	background: url(../images/prevlabel.gif) left 15% no-repeat;
}

#nextLink:hover, #nextLink:visited:hover
{
	background: url(../images/nextlabel.gif) right 15% no-repeat;
}

#imageDataContainer
{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
}

#imageData
{
	padding:0 10px;
	color: #666;
}

#imageData #imageDetails
{
	width: 70%;
	float: left;
	text-align: left;
}	

#imageData #caption
{
	font-weight: bold;
}

#imageData #numberDisplay
{
	display: block;
	clear: left;
	padding-bottom: 1.0em;
}	

#imageData #bottomNavClose
{
	width: 66px;
	float: right; 
	padding-bottom: 0.7em;
	outline: none;
}	 	

#overlay
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
}

/**************************
      CONTACT FORM
**************************/

#contact-area
{
	width: 600px;
	margin-top: 25px;
}

#contact-area input, #contact-area textarea
{
	padding: 5px;
	width: 400px;
	font-family: Helvetica, sans-serif;
	font-size: 1.4em;
	margin: 0px 0px 10px 0px;
	border: 1px solid #39F;
}

#contact-area textarea
{
	height: 90px;
}

#contact-area textarea:focus, #contact-area input:focus
{
	border: 1px solid #690;
}

#contact-area input.submit-button
{
	width: 100px;
	float: right;
	margin-right: 73px;
}

label
{
	float: left;
	text-align: right;
	margin-right: 15px;
	width: 100px;
	padding-top: 5px;
	font-size: 80%;
}