/* Gallery by I Do, I Do web design */

/* Gallery division */
.gallery {
	display:block;
	position:relative;
	margin:15px auto;
}

.bottombar, .topbar {
	/* set dimensions for gallery as required */
	width:460px;
}

.leftbar, .rightbar {
	/* set dimensions for gallery as required */
	height:460px;
}

/* define the space for the big image to sit in */
.gallery .mainImg {
	position:relative;
	height:383px;
	width:383px;
}

/* explicit width on default image to force IE to wrap alternate text */
.gallery .mainImg img {
	width:383px;
	height:383px;
	text-align:center;
	border:none;
}

.bottombar .mainImg{
	/* position as required */
	top:0px;
	left:38px;
}

/* image selection bar containing the thumbnails */
.selectimage {
	display:block;
	position:absolute;
	z-index:5; /* allows text links to be visible when thumb images are off */
}

.bottombar .selectimage {
/*  set dimensions of selection bar as required
	here each thumb is 76 wide with 2 from border and 8 from margins = 86
	so for a maximum of 5 the making bar width is 5*86 = 430 */
	width:448px;
	/* position as required, centre is (gallery width - bar width)/2 = (460-430)/2 = 15 */
	left:15px;
}

/* override to centre selection bar for only 4 thumbnail images */
.bottombar #fourthumbs {
	width:448px;
	left:17px;
}

.bottombar .selectimage {
	/* positions to bottom of containing div */
	top:400px;
}

/* container for each thumbnail */
.selectimage .thumbImg{
	display:block;
	/* fix margin bug in IE6 */ 
	display:inline-block;
	/* Must specifiy size of each thumbnail */
	height:76px;
	width:76px;
	/* float each thumbnail from left */
	float:left;
	margin:4px;
	border:1px solid #DDD; /* colour set to make normal border look transparent against background */
	text-align:center;
	line-height:76px; /* centres text link alternative */
	outline: none; /* removes outline set by javascript focus for safari */
}

.gallery a{
	text-decoration:none;
	border:none;
}
/* hide text link unless images are off */
.gallery a span.textlink{
	position:relative;
	z-index:-1;
}

/* override for two line text link */
.gallery a span.long{
	display:block;
	line-height:normal;
	padding-top:22px;
}

/* individual thumbnail images */
/* fillers specified on links or on a span as required, alternatively left out entirely */

/* Ian Stuart */
#is_img1 {background:url(../images/ianstuart/is_1_th.jpg);}
#is_img2 {background:url(../images/ianstuart/is_2_th.jpg);}
#is_img3 {background:url(../images/ianstuart/is_3_th.jpg);}
#is_img4 {background:url(../images/ianstuart/is_4_th.jpg);}
#is_img5 {background:url(../images/ianstuart/is_5_th.jpg);}
/* Suzanne Neville */
#sn_img1 {background:url(../images/suzanneneville/sn_1_th.jpg);}
#sn_img2 {background:url(../images/suzanneneville/sn_2_th.jpg);}
#sn_img3 {background:url(../images/suzanneneville/sn_3_th.jpg);}
#sn_img4 {background:url(../images/suzanneneville/sn_4_th.jpg);}
#sn_img5 {background:url(../images/suzanneneville/sn_5_th.jpg);}
/* Ritva Westenius */
#rw_img1 {background:url(../images/ritvawestenius/rw_1_th.jpg);}
#rw_img2 {background:url(../images/ritvawestenius/rw_2_th.jpg);}
#rw_img3 {background:url(../images/ritvawestenius/rw_3_th.jpg);}
#rw_img4 {background:url(../images/ritvawestenius/rw_4_th.jpg);}
#rw_img5 {background:url(../images/ritvawestenius/rw_5_th.jpg);}
/* Hollywood Dreams */
#hd_img1 {background:url(../images/hollywooddreams/hd_1_th.jpg);}
#hd_img2 {background:url(../images/hollywooddreams/hd_2_th.jpg);}
#hd_img3 {background:url(../images/hollywooddreams/hd_3_th.jpg);}
#hd_img4 {background:url(../images/hollywooddreams/hd_4_th.jpg);}
#hd_img5 {background:url(../images/hollywooddreams/hd_5_th.jpg);}
/* Benjamin Roberts */
#br_img1 {background:url(../images/benjaminroberts/br_1_th.jpg);}
#br_img2 {background:url(../images/benjaminroberts/br_2_th.jpg);}
#br_img3 {background:url(../images/benjaminroberts/br_3_th.jpg);}
#br_img4 {background:url(../images/benjaminroberts/br_4_th.jpg);}
#br_img5 {background:url(../images/benjaminroberts/br_5_th.jpg);}
/* Mori Lee */
#ml_img1 {background:url(../images/mori_lee/ml_1th.jpg);}
#ml_img2 {background:url(../images/mori_lee/ml_2th.jpg);}
#ml_img3 {background:url(../images/mori_lee/ml_3th.jpg);}
/* Ronald Joyce */
#rj_img1 {background:url(../images/ronaldjoyce/rj_1th.jpg);}
#rj_img2 {background:url(../images/ronaldjoyce/rj_2th.jpg);}
#rj_img3 {background:url(../images/ronaldjoyce/rj_3th.jpg);}
/* Victoria Jane */
#vj_img1 {background:url(../images/victoriajane/vj_1th.jpg);}
#vj_img2 {background:url(../images/victoriajane/vj_2th.jpg);}
#vj_img3 {background:url(../images/victoriajane/vj_3th.jpg);}
/*Augusta Jones */
#aj_img1 {background:url(../images/augustajones/aj_1th.jpg);}
#aj_img2 {background:url(../images/augustajones/aj_2th.jpg);}
#aj_img3 {background:url(../images/augustajones/aj_3th.jpg);}
#aj_img4 {background:url(../images/augustajones/aj_4th.jpg);}
/*enzoani*/
#e_img1 {background:url(../images/enzoani/e_1_th.jpg);}
#e_img2 {background:url(../images/enzoani/e_2_th.jpg);}
#e_img3 {background:url(../images/enzoani/e_3_th.jpg);}
#e_img4 {background:url(../images/enzoani/e_4_th.jpg);}
/* Group A */
#eb_img1 {background:url(../images/designersa/eb_1_th.jpg);}
#st_img3 {background:url(../images/designersa/st_3_th.jpg);}
#rj_img4 {background:url(../images/designersa/rj_4_th.jpg);}
#jp_img1 {background:url(../images/designersb/jp_1_th.jpg);}
#c_img3 {background:url(../images/designersb/c_3_th.jpg);}
/* Bridesmaids */
#b_img1 {background:url(../images/bridesmaids/b_1th.jpg);}
#b_img2 {background:url(../images/bridesmaids/b_2th.jpg);}
#b_img3 {background:url(../images/bridesmaids/b_3th.jpg);}
#b_img4 {background:url(../images/bridesmaids/b_4th.jpg);}
#b_img5 {background:url(../images/bridesmaids/b_5th.jpg);}
/* Prom */
#tf_img1 {background:url(../images/prom/p1th.jpg);}
#tf_img2 {background:url(../images/prom/p2th.jpg);}
#tf_img3 {background:url(../images/prom/p3th.jpg);}
/* Accessories */
#a_img1 {background:url(../images/accessories/a_1th.jpg);}
#a_img2 {background:url(../images/accessories/a_2th.jpg);}
#a_img3 {background:url(../images/accessories/a_3th.jpg);}
#a_img4 {background:url(../images/accessories/a_4th.jpg);}
#a_img5 {background:url(../images/accessories/a_5th.jpg);}
/* Filler */
#filler {background:url(../images/thumb_filler.gif);}
/* Big Image to be displayed from click */
/* display:none stops all big images displaying at once */
.selectimage .bigImg {display:none;}

/* no border around the big image */
.selectimage .bigImg img {
	border:none;
}

/* hover state MUST be different from active & focus for IE to notice state change */
.selectimage a.thumbImg:hover {border:1px solid #999;}

/* border on thumb links as they are used */
.selectimage a.thumbImg:active, .selectimage a.thumbImg:focus {border:1px solid #CCC;}

/* show Big Image on click */
.selectimage a.thumbImg:active .bigImg, .selectimage a.thumbImg:focus .bigImg{
	display:block;
	position:absolute;
 	/* dimensions are optional setting them makes alt text alignment nicer */
	height:383px;
	width:383px;
	line-height:383px;
	text-align:center;
}

.bottombar a.thumbImg:active .bigImg, .bottombar a.thumbImg:focus .bigImg {
	/* position as required */
	top:-400px;
	/* position as required, centre is (bar width - image width)/2 = (430-383)/2 = 23 */
	left:23px;
}

/* override to centre big image when only 4 thumbnail images in selection bar */
.bottombar #fourthumbs a.thumbImg:active .bigImg, .bottombar #fourthumbs a.thumbImg:focus .bigImg {
	left:21px;
}

/* text styles for information when images are not viewable */
.gallery h3, .gallery h4, .gallery em {clear:both; margin:0; padding:0px; text-align:center; font-weight:normal;}
.gallery h3 {font-size:14px;}
.gallery h4 {font-size:12px; font-style:normal;}
.gallery p {text-align:center;}

/* Message text */
.gallery p.selecttext{
	clear:both;
	padding:0;
	text-align:left;
	margin:0 0 0 5px;
}