/* Added code *//*only sets wrapper of the main page thumbnails - doesn't affect the opened animated image box with description 
#OverallWrapper {
	width: 600px; 
}*/
/*Force Vertical Scrollbar in non-IE browsers*/
html, body {
	height: 100.1%;
}

/*Font-Family for entire Gallery*/
.j1JAG01 {
	font-family: Arial, Helvetica, sans-serif;
}

/*ROOT WRAPPER DO NOT EDIT*/
.j1JAG01 .j1JAG_wrapper {
	position:relative;
	overflow: hidden;
}

/*Styles for Popup Box for Text Content Slides*//*#Can't see what this affects - it's for text content slides only;*/
#j1JAG_box.j1JAG01 #j1JAG_cnt {
	background-color: #000000; 
	color: #CCCCCC;
	padding: 1.25em;
	font-size: 0.8em;
	line-height: 1.5em;
	border: 1px solid #000000;
}
#j1JAG_box.j1JAG01 #j1JAG_cnt a, 
#j1JAG_box.j1JAG01 #j1JAG_cnt a:visited {
	color: #CCCCCC;
}
#j1JAG_box.j1JAG01 #j1JAG_cnt a:hover {
	color: #3399FF;
}
/*Popup Box: Set border around main box*//*This is the main, large image container. The actual size is determined by the size of the images inserted. 640px wide is a good size*//*You also get a nice effect in the slideshow if an image is a different size to the others - the viewer resizes nicely around it*/
.j1JAG01 #j1JAG_container {
	padding: 0 15px 15px 15px; /*this is around the main image, inside the small outer border*/
	background-image: url(img/j1JAG01_gradient.jpg); /*repeating bg image around the inserted images */
	background-repeat: repeat-x;
	background-color: #FFFFFF; /*Sets the colour in the padding around the image, marries with bg image above */
	overflow: hidden;
	border-top: 3px solid #FFFFFF; /*this is a small nearly unseen border around the main image box*/
	border-right: 3px solid #444444; /*all originally 1px*/
	border-bottom: 3px solid #222222;
	border-left: 3px solid #FFFFFF;
}
/*CSS3 Code for container */
.j1JAG01 #j1JAG_container {
	margin-right: 10px;
	margin-bottom: 10px;
	-moz-box-shadow: 6px 6px 10px #000; /* Firefox */  
	-webkit-box-shadow: 6px 6px 10px #000; /* Safari, Chrome */  
	box-shadow: 6px 6px 10px #000; /* CSS3 */  
}
/*Adjust padding if toolbar is hidden*/
.j1JAG01 #j1JAG_container.hideToolbar {
	padding: 15px;
	background-image: none !important;
}
/* The Animation box - Set Background Color ONLY *//* This is what shows as the main image box loads it stays underneath the image and reshows momentarily when images autoplay*/
#j1jag_abox.j1JAG01 {
	background-color: #FFFFFF; 
	background-image: url(img/YnotArtBGText.png); /*url(img/j1JAG01_abox.jpg);*/
	background-repeat:no-repeat;/*Added to go with new text Ynotart bg image*/
	background-position:center; /* Added */
	
}
/* The page overlay - Edit existing properties: Opacity, Filter, and BG Color ONLY *//* This is the opaque background which shows behind the picture show content - greying the rest of screen out. */
#j1jag_overlay.j1JAG01 {
	opacity: .80;
	filter: alpha(opacity=80);
	background-color: #333333;
}

/*Description, Caption,  and Counter*/

/*Hide Description and Links in Dreamweaver Design View*/
.j1jag_link, .j1jag_description {display: none;}

/*
Wrapper for Description, Caption,  and Counter
*//*This is the text area right under the main animated image box, effectively part of the box's lower padding. If you use popup desc., with no counter this is for Caption under image only */
#j1JAG_box.j1JAG01 #j1JAG_info {
	padding: 0px;
	background-color: #ffffff;
	font-size: 0.7em;
	color: #000000;
	text-align:center;/*Added - centers the caption under the image*/
}
/*Padding-Right matches the padding on the Full-Size image outer container.*/
#j1JAG_box.j1JAG01 #j1JAG_desc {
	padding: 3px 0 6px 0;
	zoom: 1;
	font-size: .9em;
}
#j1JAG_box.j1JAG01 #j1JAG_desc p {
	margin: 6px 0 12px 0;
}
#j1JAG_box.j1JAG01 #j1JAG_desc a, 
#j1JAG_box.j1JAG01 #j1JAG_desc a:visited,
#j1JAG_descboxW.j1JAG01 a,
#j1JAG_descboxW.j1JAG01 a:visited {
	color: #0099FF;
}
#j1JAG_box.j1JAG01 #j1JAG_desc a:hover,
#j1JAG_descboxW.j1JAG01 a:hover {
	color: #CCCCCC;
	text-decoration: none;
	background-color: #000000;
}
/*Description in Separate Popup Option*/
#j1JAG_descboxW.j1JAG01 {
	  /*top: 190px !important;*/
	  left: 720px !important;
}
#j1JAG_descboxW.j1JAG01 #j1JAG_descboxInner {
	width: 220px;
	border-top: 1px solid #FFFFFF;
	border-right: 3px solid #000000;
	border-bottom: 3px solid #000000;
	border-left: 1px solid #FFFFFF;
	background-color:#444444;
	padding:2px;
}
/*CSS3 code for descbox*/
#j1JAG_descboxW.j1JAG01 #j1JAG_descboxInner {
	margin-right:6px;
	margin-bottom:6px;
	-moz-box-shadow: 3px 3px 5px #000; /* Firefox */  
 	-webkit-box-shadow: 3px 3px 5px #000; /* Safari, Chrome */  
 	box-shadow: 3px 3px 5px #000; /* CSS3 */  
}
#j1JAG_descboxW.j1JAG01 #j1JAG_descbox {
	color: #bbbbbb;
	padding:10px;
	background-color:#000000;
	font-size:0.75em;
	line-height:1.5em;
}
/*Padding-Right matches the padding on the Full-Size image outer container.*/
.j1JAG01 #j1JAG_caption {
	font-size: 1em;
	font-weight:bold;
	color: #000000;
	padding: 8px 0 0 0;
	zoom: 1;
}
#j1JAG_box.j1JAG01 #j1JAG_counter {
	font-size: 0.9em;
	padding: 3px 0 0 0;
	zoom: 1;
}
/*Full-Size Image*/
/*Full-Size Image Inner Container (Hugs Image)*/
#j1JAGfsim {
	border: 1px solid #000;
	background-color:#111111;
	-moz-box-shadow: 5px 5px 5px #666; /* Firefox */  
	-webkit-box-shadow: 5px 5px 5px #666; /* Safari, Chrome */  
	box-shadow: 5px 5px 5px #666; /* CSS3 */  
}

/*Loading Image*/
#j1JAG_loading {
	display:none;
	width:78px;
	height:8px;
	/*background-image: url(img/j1jag_loading.gif);*/
}

/*Clear Floats*/
.j1jag_clearfloat {
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 0px;
}

/*TOC and Help Popup Boxes*/
/*Table of Contents and Help Popup Boxes Common Styles*/
/*Header text is in the Javascript file, search 'Table of Contents'*/
#j1JAG_tocbox.j1JAG01, #j1JAG_helpbox.j1JAG01 {
	width:180px;/*Originally 240px*/
	overflow:auto;
	font-size: 0.75em;
	color: #000000;
	padding: 0;
	background-image: url(img/j1JAG01_tocHelpbox.png);
	border: 4px solid #FFFFFF;
}	
/* CSS3 Code for TOC Boxes */
#j1JAG_tocbox.j1JAG01, #j1JAG_helpbox.j1JAG01 {
	-moz-box-shadow: 6px 6px 6px #666; /* Firefox */  
	-webkit-box-shadow: 6px 6px 10px #666; /* Safari, Chrome */  
	box-shadow: 6px 6px 6px #666; /* CSS3 */  
}
/*Help Box and TOC Box Closers*/
#j1JAG_tocbox.j1JAG01 a, #j1JAG_helpbox.j1JAG01 a {
	display: block;
	padding: 3px 6px;
	background-color: #FFFFFF;
	color: #000000;
	font-weight: bold;
	text-decoration: none;
}
#j1JAG_tocbox.j1JAG01 a:hover, #j1JAG_helpbox.j1JAG01 a:hover {
	background-color: #757575;
	color: #FFFFFF;
}
/*Help Popup Box specific styles*/
#j1JAG_helpbox.j1JAG01 {
	width:300px;
}
#j1JAG_helpbox.j1JAG01 ul {
	margin: 8px 18px 18px 18px;
	padding: 0;
	list-style-type: none;
}
#j1JAG_helpbox.j1JAG01 p {
	font-size: 1.2em;
	font-weight: bold;
	margin: 0 0 14px 0;
	color: #000000;
	letter-spacing: 0.2em;
	padding: 8px 18px;
}
#j1JAG_helpbox.j1JAG01 li {
	margin: 0 16px 6px 16px;
}
/*TOC Popup Box specific styles*/
#j1JAG_tocbox.j1JAG01 ol {
	margin-left: 1.2em;
	padding-left: 1.2em;
}
#j1JAG_tocbox.j1JAG01 li {
	margin: 0 16px 0px 16px;
}
#j1JAG_tocbox.j1JAG01 p {
	font-size: 1em;
	font-weight: bold;
	letter-spacing: 0.15em;
	margin: 0;
	padding: 6px 18px;
}
/*TOC Link Styles*/
#j1JAG_tocbox.j1JAG01 ol a {
	color: #000000;
	padding: 3px 6px;
	display: block;
	background-color: transparent;
}
#j1JAG_tocbox.j1JAG01 ol a:hover {
	color: #FFFFFF;
	background-color: #666666;
	text-decoration: none;
}
#j1JAG_tocbox.j1JAG01 ol a.down {
	color: #999999;
	background-color: #000000;
	text-decoration: none;
}
/* Toolbar */
.j1JAG01 #j1JAG_toolbar {
	position: relative;
	overflow:hidden;
	padding: 0;
	height: 30px;
}
.j1JAG01 #j1JAG_toolbar img {
	border: 0;
}
.j1JAG01 #j1JAG_toolbar a {
	background-repeat: no-repeat;
	height: 30px;
	display: block;
}
/*TOC Toolbar Icon*/
.j1JAG01 #j1JAG_toolbartoc {
	position: absolute;
	top: 0;
	left: 0px;
}
.j1JAG01 #j1JAG_toc {
	background-image: url(img/j1JAG01_toc.jpg);
	width: 30px;
}
/*VCR Controls*/
#j1JAG_vcr ul li {
	list-style-type: none;
}
.j1JAG01 #j1JAG_vcr {
	margin: 0 auto;
	width: 100px;
}
.j1JAG01 #j1JAG_vcr ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
	display: block;
}
.j1JAG01 #j1JAG_vcr ul li {
	float: left;
	display: block;
	list-style-type: none;
}
.j1JAG01 #j1JAG_first {
	background-image: url(img/j1JAG01_first.jpg);
	width: 20px;
}
.j1JAG01 #j1JAG_prev {
	background-image: url(img/j1JAG01_prev.jpg);
	width: 20px;
}
.j1JAG01 #j1JAG_toolbar .j1JAG_pause {
	background-image: url(img/j1JAG01_pauseplay.jpg);
	width: 20px;
	background-position: 0px -60px;
}
.j1JAG01 #j1JAG_toolbar .j1JAG_play {
	background-image: url(img/j1JAG01_pauseplay.jpg);
	width: 20px;
}
.j1JAG01 #j1JAG_next {
	background-image: url(img/j1JAG01_next.jpg);
	width: 20px;
}
.j1JAG01 #j1JAG_last {
	background-image: url(img/j1JAG01_last.jpg);
	width: 20px;
}
/*HELP Toolbar Icon*/
.j1JAG01 #j1JAG_toolbarhelp {
	position: absolute;
	top: 0px;
	right: 26px;
}
.j1JAG01 #j1JAG_help {
	background-image: url(img/j1JAG01_help.png);
	width: 49px;
}
/*Close Toolbar Icon*/
.j1JAG01 #j1JAG_toolbarclose {
	position: absolute;
	right: 0px;
	top: 0px;
}
.j1JAG01 #j1JAG_close {
	background-image: url(img/j1JAG01_close.jpg);
	width: 29px;
}
/*Toolbar Hovers and Utilities*/
.j1JAG01 #j1JAG_toolbar a:hover, .j1JAG01 #j1JAG_toolbar a:focus, .j1JAG01 #j1JAG_toolbar a.down {
	background-position: 0px -30px;
}
.j1JAG01 #j1JAG_toolbar .j1JAG_pause:hover,
.j1JAG01 #j1JAG_toolbar .j1JAG_pause:focus {
	background-position: 0px -90px;
}
.j1JAG01 #j1JAG_toolbar .j1JAG_play:hover,
.j1JAG01 #j1JAG_toolbar .j1JAG_play:focus {
	background-position: 0px -30px;
}
#j1JAG_toolbar i {
	display: none;
}

/*Trigger Links*//*The small thumbnails which trigger the larger overlay thumbnails and the main image display when clicked*//* This section is the overall div container for the thumbnails */
.j1JAG01 .j1JAG_trigs {
	padding:5px;
	border:2px solid #fff;
	/*background-image:url(img/thumbs_bg_blue.png);*/  /* slightly darker, reddish */
	/*background-image:url(img/noteBG.png);*/ /* slightly lighter */ 
	/*background-image:url(img/thumbs_bgD.jpg); */

	margin-right: 8px;
	margin-bottom:8px;
	
	/*background-color:#000000;*/
	
	/* This is the overall background container for all the thumbnails and associated text/content on the gallery page*/
	/*background-image: url(img/thumbs_bg8.png);
	background-repeat:repeat-y;*/
}
/* CSS3 for trigs div */
.j1JAG01 .j1JAG_trigs {
	-moz-box-shadow: 2px 2px 6px #000; /* Firefox */  
	-webkit-box-shadow: 2px 2px 6px #000; /* Safari, Chrome */  
	box-shadow: 2px 2px 6px #000; /* CSS3 */ 
}

.j1JAG01 .j1JAG_trigs img {
	/*border: 1px #aaa solid;*/
	height:120px;/*60 x 80, originally 50px x 60px*/*/
	width: 160px;
	/*vertical-align:bottom;*//*added - removes annoying gap in strict mode under thumbnail above padding/border*/
	display:block;/*added - works instead of vertical-align to remove annoying gap in strict mode*/
	
	background-color:#FFF;
	padding: 3px;
	
	margin-left:auto;
	margin-right:auto;
}
.j1JAG01 .j1JAG_trigs ul {
	margin: 0px;
	padding: 0px;
}
.j1JAG01 .j1JAG_trigs li {
	float:left;
	/*width:170px !important;*/
	list-style-type: none;
	/*padding: 2px;*//*Originally 3px*/
	/*border: 1px solid /*#444444;*/
	/*border:1px solid #fff; *//*The outside border of the small thumbnail*/
	/*margin-right:2px;*/ /*originally 6px*/
	padding:5px;
	padding-top;0px;
	padding-bottom:0px
	margin-bottom:1em;/* originally 6px*/
	/*background-color: #000000;*/ /*#FFFF66;*//*Added* Originally white by default*/
	/*background-color:#ddd;*/
	margin-left:auto;
	margin-right:auto;
	/*border:2px #000000 solid;*/
}

.j1JAG01 .j1JAG_trigs li.over {
	
	/*border-color: #999*/ /*#444444;*/ /*Outside thumbnail border on hover*/
	/*background-color: #fff */ /*#000000;*/ /*The background colour between inner and outer thumbnail borders on hover*/

}
.j1JAG01 .j1JAG_trigs a {
	display:block;
	float:left;
	z-index:1;
	font-size: 0.9em;
	/*border: 1px solid #333333;*//*#ff0000;*//*tight inner border immediately around the small thumbnail image*/
	/*Set a width to make even width columns for the thumbnails - will allways have the same no. of images in each row if set. Works better than if on the list item*/
	width: 180px;
	/*margin-right:10px;*/
	/*padding-right:4px;*/
}
/*CSS3 Code for trig thumbnails */
.j1JAG01 .j1JAG_trigs img {
	-moz-box-shadow: 5px 5px 5px #222; /* Firefox */  
 	-webkit-box-shadow: 5px 5px 5px #222; /* Safari, Chrome */  
 	box-shadow: 5px 5px 5px #222; /* CSS3 */ 
	
}
.j1JAG01 .j1JAG_trigs img:hover {
	border-color: #FFFFFF;/*The tight inner border around small thumbnail on hover*/
}

/* Larger Overlay images under the thumbnails *//*Actual size set by the thumbnail images themselves. 200px wide is a good size. May need to move thumbnails into the folder, that size, afterwards*/
#j1JAG_ovr {
	padding:4px;
	padding-bottom:2px;/*Added - otherwise bottom border effect is too large */
	background-color: /*#333333;*//*#cccccc;*/#FFFFFF;
	border: 1px solid /*#333333;*/#999999;
}

/*Added - creates border around inner image in overlay thumbnail*//*Also makes it more like the smaller thumbnails when they are hovered */
#j1JAG_ovr img {
    border: 1px solid #FFFFFF;
}
/*Added - styling for added thumbnail titles in thumbnail gallery */
a#thumbLink span {
	display:block;
	max-width:160px;
	height:6em;
	color:#000000;
	margin-top:5px;
	padding-top:2px;
	padding-bottom;2px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	font-size:0.9em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height:1.5em;
}
	a#thumbLink:hover {
	text-decoration:none;
}