/* CSS Document */


/* needed for IE to make :active state work first time */
a, a:visited {color:#bbbbbb;text-decoration:underline;}
a:hover {color:#FFFFFF;}

/* common styling for all galleries */
a.gallery, a.gallery:visited {
	display:inline-block;
	display:inline-block;
	color:#000;
	text-decoration:none;
	border:1px solid #000;
	width:90px;
	height:50px;
	float:left;
	margin:4px;
	z-index:50;
	margin-right: 10px;
}
a.slidea {background-image:url(../painting/thumb1.jpg);}
a.slideb {background-image:url(../painting/thumb2.jpg);}
a.slidec {background-image:url(../painting/thumb3.jpg);}
a.slided {background-image:url(../painting/thumb4.jpg);}
a.slidee {background-image:url(../painting/thumb5.jpg);}
a.slidef {background-image:url(../painting/thumb6.jpg);}
a.slideg {background-image:url(../painting/thumb7.jpg);}
a.slideh {background-image:url(../painting/thumb8.jpg);}
a.slidei {background-image:url(../painting/thumb9.jpg);}
a.slidej {background-image:url(../painting/thumb10.jpg);}
a.gallery em, a.gallery span {display:none;}
a.gallery:hover {border:1px solid #fff;}


/* styling for TOP gallery */
#container_top {
	position:relative;
	height:635px;
	margin:1em auto;
}
#container_top img {border:0;}
#container_top .thumbs {position:absolute; left:5px; top:0;}
#container_top a.gallery:hover span {display:block; position:absolute; width:450px; height:50px; top:60px; left:5px; padding:5px; font-style:italic; color:#fff;  z-index:100;}
#container_top a.gallery:hover span:first-line {font-style:normal; font-weight:bold; font-size:1.1em; color:#FFFFFF;}
#container_top a.gallery:active, #container_top a.gallery:focus {
	border:1px solid #000;
	color: #fff;
}
#container_top a.gallery:active em, #container_top a.gallery:focus em {
	display:block;
	position:absolute;
	top:110px;
	left:5px;
	color:#FFFFFF;
	z-index:50;
	text-align: left;
	border: 1px solid #000;
}
#container_top h1 {
	clear:both;
	margin:0;
	padding-top:60px;
	text-align:right;
	font-family: georgia, "times new roman", serif;
	font-size:3em;
	font-weight:normal;
	color:#666666;
	padding-right: 10px;
	font-variant:small-caps;
}
#container_top h1 em {font-size:0.6em; color:#000;font-variant:normal;}

/* styling for BOTTOM gallery */
#container_bottom {position:relative; width:425px; height:425px; background:#d1c8c3; border:1px solid #a49188; margin:1em auto;}
#container_bottom img {border:0;}
#container_bottom .thumbs {position:absolute; left:0; bottom:0;}
#container_bottom a.gallery:hover span {display:block; position:absolute; width:402px; height:50px; top:-45px; left:5px; padding:5px; font-style:italic; color:#fff;  z-index:100;}
#container_bottom a.gallery:hover span:first-line {font-style:normal; font-weight:bold; font-size:1.1em; color:#000;}
#container_bottom a.gallery:active, #container_bottom a.gallery:focus {border:1px solid #000;}
#container_bottom a.gallery:active em, #container_bottom a.gallery:focus em {display:block; position:absolute; width:402px; height:250px; top:-305px; left:5px; padding:5px; color:#000; border:1px solid #3d330f; z-index:50;}
#container_bottom h1 {clear:both; margin:0; padding-top:80px; text-align:center; font-family: georgia, "times new roman", serif; font-size:3em; font-weight:normal; color:#fff;}
#container_bottom h1 em {font-size:0.6em; color:#000;}

/* styling for LEFT gallery */
#container_left {position:relative; width:600px; height:305px; background:#d1c8c3; border:1px solid #a49188; margin:1em auto;}
#container_left img {border:0;}
#container_left .thumbs {width:170px; position:absolute; left:0; top:0;}
#container_left a.gallery:hover span {display:block; position:absolute; width:402px; height:50px; top:265px; left:175px; padding:5px; font-style:italic; color:#fff;  z-index:100;}
#container_left a.gallery:hover span:first-line {font-style:normal; font-weight:bold; font-size:1.1em; color:#000;}
#container_left a.gallery:active, #container_left a.gallery:focus {border:1px solid #000;}
#container_left a.gallery:active em, #container_left a.gallery:focus em {display:block; position:absolute; width:402px; height:250px; top:5px; left:180px; padding:5px; color:#000; border:1px solid #3d330f; z-index:50;}
#container_left h1 {clear:both; margin:0; padding-top:80px; padding-left:250px; width:300px; text-align:center; font-family: georgia, "times new roman", serif; font-size:3em; font-weight:normal; color:#fff;}
#container_left h1 em {font-size:0.6em; color:#000;}

/* styling for RIGHT gallery */
#container_right {position:relative; width:600px; height:305px; background:#d1c8c3; border:1px solid #a49188; margin:1em auto;}
#container_right img {border:0;}
#container_right .thumbs {width:170px; position:absolute; right:0; top:0;}
#container_right a.gallery:hover span {display:block; position:absolute; width:402px; height:50px; top:265px; left:-430px; padding:5px; font-style:italic; color:#fff;  z-index:100;}
#container_right a.gallery:hover span:first-line {font-style:normal; font-weight:bold; font-size:1.1em; color:#000;}
#container_right a.gallery:active, #container_right a.gallery:focus {border:1px solid #000;}
#container_right a.gallery:active em, #container_right a.gallery:focus em {display:block; position:absolute; width:402px; height:250px; top:5px; left:-425px; padding:5px; color:#000; border:1px solid #3d330f; z-index:50;}
#container_right h1 {clear:both; margin:0; padding-top:80px; padding-left:50px; width:300px; text-align:center; font-family: georgia, "times new roman", serif; font-size:3em; font-weight:normal; color:#fff;}
#container_right h1 em {font-size:0.6em; color:#000;}

