/* ezeegallery.css 
   by 4LevelWebs http://www.fourlevel.com
   copyright 2006
   Theme: Juniper
*/


/*-----------------------------------------------------------------------------
 The body has a top margin of 30px. This can be adjusted bigger or smaller.
 A textyred background is applied and set to fixed.
*/
body {
	background-color: #666;
	margin: 30px 0 0 0;
	padding: 0;
	background-image: url(Juniper/images/bg_main3.jpg);
	background-attachment: fixed;
}


/*-----------------------------------------------------------------------------
 The masthead div stretches the width of the browser. It has a background image
 applied of the horizontal bar. A height is set and padding.
*/
#masthead {
	margin: 0;
	height:36px;
	padding: 8px 0 4px 0;
	color: #FFF;
	background-color: #D8D6CA;
	background-image: url(Juniper/images/bg_masthead.jpg);
	border-bottom: 0px solid #FFF0AA;
}


/*-----------------------------------------------------------------------------
 The Thumbnails styles.
 The norm state has a top/bottom border and a background image applied.
 The over state has a top/bottom border and a background image applied.
 The down state has a top/bottom border and a background color of white applied.
*/
.thumbNorm {/* Norm state*/
	margin: 0px 0px 0px 0px;
	padding: 5px;
	/*background-color: #D7CAC4;*/
	background-image: url(Juniper/images/thumb_norm.jpg);
	border-top: 1px solid #FFF;
	border-right: 0px solid #BCA69C;
	border-bottom: 1px solid #BCA69C;
	border-left: 0px solid #BCA69C;
}
.thumbOver {/* Over state*/
	margin: 0px 0px 0px 0px;
	padding: 5px;
	/*background-color: #D7CAC4;*/
	background-image: url(Juniper/images/thumb_over.jpg);
	border-top: 1px solid #FFF;
	border-right: 0px solid #BCA69C;
	border-bottom: 1px solid #BCA69C;
	border-left: 0px solid #BCA69C;
}
.thumbDown {/* Down state*/
	margin: 0px 0px 0px 0px;
	padding: 5px;
	background-color: #FFF;
	border-top: 1px solid #FFF;
	border-right: 0px solid #BCA69C;
	border-bottom: 1px solid #BCA69C;
	border-left: 0px solid #BCA69C;
}


/*-----------------------------------------------------------------------------
 The Nav Links styles.
 The norm state has a tan background with black text.
 The over state has a and purple background with white text.
 The down state has a and yellow background with black text.
 All borders are set for a bevel button effect.
*/
.linksNorm {/* Norm state*/
	color: #fff;
	text-decoration: none;
	background-color: #E3DAD6;
	border-top: 1px solid #EFEBE9;
	border-right: 1px solid #B59D95;
	border-bottom: 1px solid #B59D95;
	border-left: 1px solid #EFEBE9;
	margin: 0;
	padding: 0 10px;
}
.linksOver {/* Over state*/
	color: #FFF;
	text-decoration: none;
	background-color: #9999CC;
	border-top: 1px solid #CBCBE4;
	border-right: 1px solid #5959AC;
	border-bottom: 1px solid #5959AC;
	border-left: 1px solid #CBCBE4;
	margin: 0;
	padding: 0 10px;
}
.linksDown {/* Down state*/
	color: #000;
	text-decoration: none;
	background-color: #FFE88C;
	border-top: 1px solid #FFF3C4;
	border-right: 1px solid #BB9600;
	border-bottom: 1px solid #BB9600;
	border-left: 1px solid #FFF3C4;
	margin: 0;
	padding: 0 10px;
}


/*-----------------------------------------------------------------------------
 The thumbnavlinks div contains the nav links. Font styles, and padding.
 A 1px top and bottom border is applied to the top and bottom of this div.
 The font weight and size for the nav links is determined here.
 A background image gives the recessed look behind the nav links.
*/
#thumbnavLinks {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	margin: 0;
	padding: 1px 400px 1px 400px;
	color: #FFF;
	background-color: #8F8F8F;
	background-image: url(Juniper/images/bg_thumbnavlinks.jpg);
	border-top: 1px solid #666;
	border-bottom: 1px solid #FFF;
}


/*-----------------------------------------------------------------------------
 The thumbnavlinks <a> tags.
 This rule determines the size of the nav link "buttons" effect.
 An 15px padding left/right for padding the button horizontally. Larger numbers make the buttons wider.
*/
#thumbnavLinks a {
	padding: 0 15px;
	margin: 0;
}


/*
 The Gallery Title div. Determines how the Title text will be displayed.
 This div is positioned "absolute", meaning it will always stay put.To move this div
 you can select it in Dreamweaver Design View and move it with your mouse or keyboard arrows,
 or via the settings in the Property Inspector.
*/
#gallerytitle {
	position:absolute;
	left:38px;
	top:81px;
	z-index:1;
	color: #FFF;
	margin:0;
	padding: 0 10px;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 5px;
	width: 110px;
}


/*-----------------------------------------------------------------------------
 The container div holds the fullsize image. To reposition the full size image, 
 select this div in Design View and move it to the desired location.
 This div is positioned "absolute", meaning it will always stay put.To move this div
 you can select it in Dreamweaver Design View and move it with your mouse or keyboard arrows,
 or via the settings in the Property Inspector.
*/
#container {
	position:absolute;
	left:270px;
	top:106px;
	width:130px;
	z-index:1;
	margin: 0;
	padding: 0;
	border:0px solid #FFFFFF;
	/*background-color: #E2DEC2;*/
}


/*-----------------------------------------------------------------------------
 The div that contains the big "full" image.
*/
#fullimage {
	position:relative;
	left:0px;
	top:0px;
	width:130px;
	z-index:1;
	margin: 0;
	padding: 0;
}


/*-----------------------------------------------------------------------------
 The thumbimages div contains the thumb images. a 1px top border of white and a 5px bottom yellow border.
 Padding - 20px top/bottom.
 Background image provides the smooth look for this div.
*/
#thumbimages {
	position:absolute;
	left:10px;
	top:99px;
	width:250px;
	z-index:1;
	margin: 0;
	padding: 20px 0;
	border-top: 1px solid #FFF;
	border-right: 0px solid #FFF;
	border-bottom: 5px solid #FFE88C;
	border-left: 0px solid #FFF;
	background-color: #7A7A7A;
	background-image: url(Juniper/images/bg_thumbimages.jpg);
	height: 857px;
}


/*-----------------------------------------------------------------------------
The wait div. 
 This div is positioned "absolute", meaning it will always stay put.To move this div
 you can select it in Dreamweaver Design View and move it with your mouse or keyboard arrows,
 or via the settings in the Property Inspector.
 This div contains the "Image Loading" message. You can change this text to whatever you like
 in the gallery page ( code view ).
*/
#wait {
	position:absolute;
	left:616px;
	top:83px;
	z-index:100;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: normal;
	margin: 0;
	padding: 0 0 0 10px;
	color: #FFF;
	visibility: visible;
}


/*-----------------------------------------------------------------------------
 This style is applied directly to the full image.It's purpose is to provide a border around the full image.
 Adjust to suit the borders thickness and border style if desired.
*/
.imgwrap {
	margin: 0;
	padding: 5px;
	background-color: #FFF;
	border-top: 1px solid #FFF;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	border-left: 1px solid #FFF;
}


/*-----------------------------------------------------------------------------
The caption div styles. Simple font styles. Border on only 3 sides.
*/
#caption {
	font-family: Verdana, Arial, Helvetica, sans-serif; 
	font-size: 11px;
	text-align: left;
	letter-spacing: 3px;
	margin: 0;
	padding: 3px 6px 3px 6px;
	color: #FFF;
}


/*-----------------------------------------------------------------------------
 The caption text is encased in a <p> tag. No margin and 2px padding. 10px padding on the left.
*/
#caption p {
	margin: 0;
	padding: 2px 2px 2px 10px;
}