.lowerGallery {
    background-color: #cccccc;
    text-align: center;
    color: #191970;
    /*height: 440px; change back to this after adding back page selector */
    height: 414px;
    width: 729px;
    margin: 0 auto;
}
table.galleryLeft {
    background-color: #202020;
    text-align: center;
    height: 100%;
    width: 100%;
}
.pageSelector {
    font-size: .8em;
    font-weight: bold;
    text-align: left;
    margin: 0;
    padding: 0;
}
.pageSelector a {
    text-decoration: none;
    color: #191970;
}
.pageSelector a:hover {
    text-decoration: underline;
    font-weight: bold;
    color: #0000ff;
}
.gallerycontainer {
    position: relative;
    width:310px;
    height: 392px;
    margin: -389px 0 0 405px;
    background-color: #cccccc;
    padding: 5px 0px 0px 5px;
/* Add a height attribute and set to largest image's height to prevent overlaying */
}
.thumb, .no-thumb {
    width: 83px;
    height: 90px;
    margin: 3px;
    padding: 0;
    background-color: #104895;
}
.no-thumb {
    border:1px solid #fff;
}
.thumb a img {
    display:block;
    padding: 0px;
}
.thumbnail {
    text-decoration: none;
}
.thumbnail img {
    border: 0;
    margin: auto;
}
.thumbnail:hover {
    background-color: transparent;
    cursor: default;
}
.thumbnail:hover img {
    border: 0;
}
.thumbnail span {
/* CSS for enlarged image */    
    position: absolute;
    left: -1000px;
    border: 0;
    visibility: hidden;
    text-decoration: none;
}
.thumbnail span img {
/* CSS for enlarged image */    
    border-width: 0;
    padding: 2px;
    margin-bottom: 3px;
}
/* ================== position where enlarged image should offset horizontally on hover =================== */  
.thumbnail:hover span {
/* CSS for enlarged image */    
    visibility: visible;
    z-index: 1000;
    /*top: 57px;*/
    top: 22px;
    left: -376px;
    color: white;   
}
.thumbnail:hover span.ls, .thumbnail:hover span.ls2 {
    /*top: 87px;*/
    top: 57px;
    left: -376px;
}
.thumbnail:hover span.ls3 {
top: 40px;
left: -376px;
}
.thumbnail:hover span.nar {
    /*top: 57px;*/
    top: 27px;
    left: -326px;
}
.thumbnail:hover span.nar2 {
    /*top: 57px;*/
    top: 17px;
    left: -355px;
}
.thumbnail:hover span.med {
    /*top: 57px;*/
    top: 27px;
    left: -346px;
}
.thumbnail:hover span.med2 {
    /*top: 57px;*/
    top: 27px;
    left: -336px;
}
.thumbnail:hover span.med3 {
    /*top: 57px;*/
    top: 7px;
    left: -336px;
}
.thumbnail:hover span.med4 {
    /*top: 57px;*/
    top: 7px;
    left: -346px;
}
/* ====================== end positioning of large images on hover =============================== */
.imgHolder {
    text-align: center;
    background-color: #202020;
    border: 1px ridge #808080;
    color: #cccccc;
    z-index: 0;
    width: 390px;
    height: 390px;
    margin: 0;
    font-size: 1.2em;
    line-height: 1.5em;
    font-family: serif;
    font-style: italic;
    position:relative;
    left: 10px;
   /* top: 35px; change back to this after adding page selector back */
   top: 9px;
 }
p.placeholder {
    margin-top: 150px;
    margin-left: 40px;
    margin-right: 40px;
}
.pageSelector {
    margin-bottom: 5px;
    margin-top: 5px;
}