@charset "utf-8";
/* CSS Document */

/* Global reset */

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}


/* Global reset-RESET */
/* The below restores some sensible defaults */

strong { font-weight: bold }
em { font-style: italic }
ol, ul, li { list-style:none }
/** a { position:relative }  Gets links displaying over a PNG background */
a { outline:none } /* Gets rid of Firefox's dashed borders */
a img { border:none } /* Gets rid of IE's blue borders */
br {  height:1px; margin:-1px 0 0 0 }
h1 { font: 1.8em  Arial, Helvetica, sans-serif;}
li { font: 1em Arial, Helvetica, sans-serif; margin:0; }
a { text-decoration:none; color:#fff }

/* Default */

html,body  {font: 12px/1.4em arial, helvetica, verdana, tahoma, verdana, sans-serif; color: #333333; line-height: normal; }
body {		margin: 0;	text-align: center;	background: url(../int/background.gif) top center repeat-y;	}

body#johnhoyland  {		margin: 0;	text-align: center;	background: url(../int/background-black.gif) top center repeat-y; color:#FFF;	}

/* ------------------------------------ */

/* Global Layout Styles */

/* ------------------------------------ */
/* ------------------------------------ */

/* Hidden elements */

/* ------------------------------------ */
	.hidden, .screen_reader, hr { display: none; }

/* ------------------------------------ */
	
/* ---- Typography ---- */	

/* ------------------------------------ */

/* Paragraph default styling */
p { margin: 0 0 15px 0; font-size: 1em; line-height: 1.3em; }
.spacer { margin: 0 0 20px 0; }
.imageleft { float: left; }

/* Default link styling */
a { color: #333333; text-decoration: none; }
a:hover { color: #DB0862; text-decoration: underline; }

#rightcolumn h1 { font-size: 2.1em; font-weight: normal;  margin-bottom: 20px;}
	#home #rightcolumn h1 { font-size: 2.1em; font-weight: normal;  margin: 10px 0;}
#rightcolumn h1 em { font-size: .5em; font-weight: normal; font-style:normal; padding-top: 25px; line-height: 2.1em;  }
#rightcolumn h2 { font-size: 2.1em; font-weight: normal;  margin-bottom: 20px;}
#leftcolumn p { font-size: .9em;}

#rightcolumn a { color: #DB0862;}
#rightcolumn .easay p { text-indent: 20px; margin: 0; padding: 0; line-height: 1.9em;}
	
/* Float element left with a margin */
.floatLeft { float: left; margin: 0 20px 20px 0; }
	
/* Float element right with a margin */
.floatRight { float: right; margin: 0 0 20px 20px; }


.clear {
	clear:both;
	}
	
/* ------------------------------------ */

/* TEMPLATE LAYOUT  */   

/* ------------------------------------ */

#wrapperinner { width: 994px; margin: 0 auto; /* centers content */ position: relative; text-align:left;}
#wrapperheader { width: 974px; margin: 0; float: left; height: 156px; position: relative; z-index: 20; background: #DB0862  url(../int/Header-Logo-Bar.gif) top left  no-repeat ;}
* html #headerwrap { margin: 0 5px; /* width fix for IE6 */ }
.kurt #wrapperheader {  background: #0098CA url(../header-kurt.gif)   top left  no-repeat ;}

#contentwraper { width: 994px;	float: left; position: relative; z-index: 50; text-align: left;	background: transparent; }
#contentinerback {width: 994px; float: left; background: url(../interface/background-black-glow.jpg) no-repeat top center; }
#paddingwraper {width: 974px; float: left; margin: 0 10px; padding: 0; }


#leftcolumn { float: left;	width: 324px;  padding-bottom: 20px;  margin: 10px 0 0 0px; background: url(../int/left-column-back.jpg) right bottom no-repeat; 	 }
#johnhoyland #leftcolumn  { background-image:none; background-color: #010101; color:#CCC;}
#leftcolumn .left { float: left;	width: 44%;  padding-top: 380px; padding-left: 15px;    }
	/*#home #leftcolumn .left { padding-top: 340px;}*/
#leftcolumn .left .addressBox { font-size: .8em; line-height: 1.7em; margin-bottom: 10px;}
#leftcolumn .right { float: right;	width: 46%; padding-bottom: 40px;    }
	/* IE6 alternative not so good looking but works! */
	* html #leftcolumn { background: url(../interface/left-column-back.jpg) top left repeat-y; }
#leftcolumn .right ul {  margin-top: 5px;}
#leftcolumn .right ul li{ line-height: 1.8em; color: #999;  }
#leftcolumn .right ul li em { display: none; font-size: .5em;}
#leftcolumn .right a { border-bottom: 1px dotted #666; color: #666;  }
#leftcolumn .right a:hover { border-bottom: 1px dotted #DB0862; color:#DB0862; text-decoration:none; }
#leftcolumn .right p { margin: 0; padding: 0 0 4px 0;}

#rightcolumn { float: right; width: 638px;	margin: 10px  0 0 0; padding: 0 0 0 0; 	}
#rightcolumn .left { float: left;	width: 73%;    }
#rightcolumn .left img.floatleft { float: left; margin-right: 15px;}
#rightcolumn .right { float: right;	width: 25%;    }
#home #rightcolumn .left h1 { margin: 10px 0 0 0; padding: 0; font-size: 2em; }
#home #rightcolumn .right h1 { margin: 0 0 0 0; padding: 0; font-size: 1.9em; }
#home #rightcolumn .right h2 { margin: 0 0 0 0; padding: 0; font-size: 1.5em; font-weight: normal; }

#home #rightcolumn .right .sub h1 { margin: 22px  0 10px 0; padding: 0; font-size: 1.5em; }
#home #rightcolumn .right .sub img { margin:  0px 0 10px 0;}
#home #rightcolumn .right .sub h2 { margin: 0 0 0 0; padding: 0; font-size: 1.5em; font-weight: normal; }


#home #rightcolumn .left p { margin: 4px 0 ; padding: 0;  }
#rightcolumn form .left { float: left;	width: 25%;    }
#rightcolumn form .right { float: right;	width: 74%;    }
#rightcolumn form br { margin: 0 0 20px 0; }

#rightcolumn .right ul {  margin-top: 5px;}
#rightcolumn .right ul li{ line-height: 1.8em; font-size: .9em; }
#rightcolumn .right li em { font-style:normal; font-size: .8em;}
#rightcolumn .right a { border-bottom: 1px dotted #DB0862; color:#DB0862; }
#rightcolumn .right .noborder a { border-bottom: none; }
#rightcolumn .right li.noborder a img { border-bottom: none; margin-top: 5px; }
#rightcolumn .right a:hover { border-bottom: 1px dotted #666; color: #666; text-decoration:none; }
#artists #rightcolumn .left a { color:#333333;}


#lowerPageSection { 
		width: 974px;
		margin: 10px 10px 0 10px  ;
		padding: 0px 0 0 0 ; 
		float: left;
		position: relative;
		text-align: left;
		background: url(../int/lowerSectionBack.gif)  0 0 no-repeat;
		font-size: .9em; }
#lowerPageSection h3 { font-size: 1.3em; margin-bottom: 5px;}		
#lowerPageSection p { padding: 0; margin: 0; line-height: 1.4em;}
#lowerPageSection a { color: #DB0862;}
		
#lowerleftcolumn { float: left;	width: 324px;  margin: 10px 0 0 0px; padding: 0 0 0 0;  }
#lowerleftcolumn .left { float: left;	width: 44%;   padding-left: 0px;    }
#lowerleftcolumn .right { float: right;	width: 46%;    }

#lowerrightcolumn { float: right; width: 638px;	margin: 10px  0 0 0; padding: 0 0 0 0; 	}
#lowerrightcolumn .left { float: left;	width: 73%;    }
#lowerrightcolumn .left .picLeft { float: left; margin-right: 10px;    }

#lowerrightcolumn .right { float: right;	width: 25%;    }
	
	
	
	#footerwrap {
		color: #CCCCCC;
		width: 974px;
		margin: 20px 10px 0 10px;
		padding: 23px 0px ; 
		float: left;
		position: relative;
		text-align: left;
		font-size: .8em;
		background:url(../int/footer-background.gif) top left no-repeat;
	}
	* html #footerwrap { margin: 0 5px; }
	#johnhoyland #footerwrap { background: url(../int/footer-background-black.gif) top left no-repeat; color: #080808; }
	
	#home #footerwrap { margin: 10px 10px 0 10px;}
	#footerwrap .left { float: left; width: 80%; }
	#footerwrap .right { float: right; width: 158px;}
/* ----------------------------------- */

/* TEMPLATE LAYOUT END  */

/* ------------------------------------ */

/* ------------------------------------ */

/* MAIN NAVIGATION  */

/* ------------------------------------ */

#mainNav {
position: absolute; top: 60px; left: 12px;
margin: 0 ; padding: 0 ; 
width:  145px    /* IE & Moz */
wi\dth: 145px;  /* IE then reads this, Moz doesn't */
z-index: 5;
text-align: left;
}


#nav { background: #000; width: 146px;}
#nav, #nav ul { padding: 0 0 80px 0;  margin: 20px 0 0 0 ;  list-style: none; }

#nav { padding-top: 30px;}
 
#nav a { display: block; color:white; width: 116px; text-decoration: none; font-weight: normal; font-size: 1em;} 
#nav li { /*float: left; */white-space:nowrap; margin: 0 0 0 10px; display:block ; padding: 10px 0; background: #000;  }

#nav li li { display: none; line-height: 1px;}
#nav li ul { display: none; line-height: 1px;}

#mainNav a:hover { color:#DB0862;}

/* ------------------------------------ */

/* MAIN NAVIGATION END  */

/* ------------------------------------ */

/* Publication */
#Publication { width: 460px; padding:0;}
#Publication br { clear:none;}
 #Publication dl {float:left; width: 460px; margin: 10px 0 30px 0; padding: 0; display:inline;   }
 #Publication dt { float:right; width: 270px; margin: 0; padding: 0 0 5px 0; font-size: 1em; text-align:left;}
#Publication dd {  margin: 0 0 0 190px;  padding:0 0px 15px  0 ;  font-size: 1em; line-height: 1.5em;  }
#Publication dl dd.cover {margin:0; width: 190px;}
#Publication dd.cover img { float:left; margin: 0 0px 0 0; padding: 0; width: 170px;  }

/* ArtistWraper */

#ArtistWraper .artistpic { float: left; width: 147px; height: 215px; margin-right: 12px; }
#ArtistWraper .artistpic img { padding-bottom: 5px;}
#ArtistWraper .nameArt  a { color:#333333; padding: 10px 0;}

/* ----------------- */
/* ArtistWraper v2 */

#ArtistWraperv2 .artistpic { float: left; width: 147px; height: 25px; margin-right: 12px; margin-bottom: 20px; border-bottom: 1px dotted #333;}
#ArtistWraperv2 .artistpic img { display: none; }
#ArtistWraperv2 .nameArt  a { color:#333333; padding: 10px 0;}
#ArtistWraperv2 .nameArt  a { text-decoration:none;}

/* ----------------- */

/* ArtistWraper v3 */

#ArtistWraperv3 li.nameArt { float: left; display:block; width: 147px; height: 35px; margin-right: 12px; margin-bottom: 20px; border-bottom: 1px dotted #333; color:#CCC;}
#ArtistWraperv3 li.nameArt em {  display: none;}
#ArtistWraperv3 li.nameArt  img { display: none; }
#ArtistWraperv3 li.nameArt   a { color:#333333; padding: 10px 0;}
#ArtistWraperv3 li.nameArt   a { text-decoration:none;}

/* ----------------- */
/* -- News Pages --*/

.contentHolder { float: left; width:464px;   margin-bottom: 20px;}
.contentHolder br { clear:none;}
.contentHolder img { float: left; padding: 0 20px 30px 0; }
.contentHolder p { padding: 0 0 10px 0; margin: 0;   }




.contentHolder .newscopy { float: left; margin: 0;   width: 250px;}
#rightcolumn .contentHolder h2 {  padding: 0;  margin: 0 0 15px 0; font-size: 1.2em; line-height: 1em; font-weight: bold; color:#333333;   }
.contentHolder a {
	color:#333333;
	text-decoration:underline;
}

/* ------------------------------ */
/*   PAINTINGS ----------------------*/
/* ------------------------------ */

#paintings { }
.paintingThumb { float: left; width: 464px; margin-bottom: 120px;}
.paintingThumb img { float: left; margin-right: 20px; }
#artists .paintingThumb img { float: left; margin-right: 20px; width: 170px; }
#artists .paintingThumb .paintingprice img { float: left; margin-right: 20px; width: 18px; }

.paintingname { float: right; width:160px; text-align: left; margin-top: 5px;}
.paintingtitle { float: right;   width:160px; text-align: left;}
.paintingsize { float: right;  width:160px; text-align: left;}
.paintingprice { float: right;  width:160px; text-align: left;}

#artists .paintingname { float: left; width:200px; text-align: left; margin-top: 5px;}
#artists .paintingtitle { float: left;   width:200px; text-align: left;}
#artists .paintingsize { float: left;  width:200px; text-align: left;}
#artists .paintingprice { float: left;  width:200px; text-align: left;}

/* Old Exhibition Pages */

.exhibitionImg { float: left; width: 464px; margin-bottom: 20px;} 
.imagewrapmd { float: left; width: 220px; margin-bottom: 120px;} 


.imagewrapmd img { float: left; margin-right: 20px; max-width: 220px;}
.exhibitionImgTal ul { float: left; width:160px; text-align: left; margin-top: 5px; margin-left: 20px;}/* */

#exhitionWider { position: relative; left: -800px; top: 80px; width: 780px;}
#exhitionWider p { padding-left: 160px;}
/* New exhibition pages */

.exhibitionImg3 {float: left; width: 464px; margin-bottom: 120px;}
.exhibitionImg3 img { float: left; margin-right: 20px;  width:220px;}
.exhibitionImg3 img.sold {width:20px;}
.exhibitionImg3 .paintingInfo { float: right; width:220px; text-align: left; margin-top: 0px; line-height: 1.3em;}

.exhibitionImg3glider {float: left; width: 464px;  margin-bottom: 120px;}
.exhibitionImg3glider img { float: left; margin-right: 20px;  width:220px;}
.exhibitionImg3glider img.sold {width:20px;}
.exhibitionImg3glider .paintingInfo { float: right; width:220px; text-align: left; margin-top: 0px; line-height: 1.3em;}

.exhibitionImg4 {float: left; width: 464px; margin-bottom: 60px;}
.exhibitionImg4 img { float: left; margin-right: 0;  width:464px;}
.exhibitionImg4 img.sold {width:20px;}
.exhibitionImg4 .paintingInfo { float: left; width:464px; text-align: right; margin-top: 10px; line-height: 1.3em;}
.prevandnext { float: left; width:464px; text-align: right; margin-top: -40px; line-height: 1.3em;}


/* ------------------------------ */
/*   PAINTINGS END ------------------*/
/* ------------------------------ */

/* ------------------------------ */
/*   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: #333333; }
#imageData #imageDetails{ width: 70%; float: left;  text-align: left; color: #c5c5c5;  }	
#imageData #caption strong { font-weight: bold; }
#imageData #caption{ color: #333333;}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em; margin-top: 10px;	}			
#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; }
/* ------------------------------ */
/*   LIGHTBOX END ------------------*/
/* ------------------------------ */

#artists #rightcolumn .left .topofpage a { float: left; margin: 50px 0 0 0;  color:#333;}