.main-banner {
    position: relative;
    margin: auto;
    margin-bottom: 10px;
}

#banner-links {
    margin: auto;
    width: 380px;
    margin-top: -2px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #988868;
    text-decoration: none;
}

.hotlink a:first-child {
    float: left;
    margin-left: 2px;
    margin-right: 47px;
}

.hotlink a:nth-child(2) {
    float: left;
    margin-right: 48px;
}

.hotlink a:nth-child(3) {
    float: left;
}

.hotlink a:last-child {
    float: right;
    margin-right: 2px;
}

/* Center Pic Display */
.nav-area {
    position: relative;
    margin: auto;
    width: 550px;
    left: 0;
    padding-bottom: 0;
    border: 0 solid white;
}

.nav-btns {
    position: relative;
}

.pic-wall {
    display: block;
    height: 400px;
    visibility: visible;
    border: 0px solid lime;
}

.pic-frame {
    position: absolute;
    top: 0;
    display: block;
    margin: auto;
    opacity: 0;
    transition: opacity .5s ease;
    -webkit-transition: opacity .5s ease;
    -moz-transition: opacity .5s ease;
}

#pic0, #pic1 {
    float: left;
    height: 325px;
    margin: 0;
}

div.caption {
    display: inline-block;
    width: 100%;
    left: 0;
    padding-left: 3px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
	color: #988868;
}

p.caption {
    margin-top: -9pt;
    float: left;
}

div.nav-prev {
    position: absolute;
    top: 147px;
    left: -30px;
    width: 28px;
    height: 28px;
    padding: 0;
    /* background-image: url("graphics/Left Arrow Normal.png"); */
    background: url('graphics/NavBtns-sp.png') 0 0;
    background-size: 200%;
    /* background-position: center; */
    background-repeat: no-repeat;
    cursor: default;
}

div.nav-prev:hover {
    /* background-image: url("graphics/Left Arrow Hover.png"); */
    background-position: -28px 0;
}

div.nav-prev:active {
    background-position: -29px 0;
}

div.nav-next {
    position: absolute;
    top: 147px;
    left: 550px;
    width: 28px;
    height: 28px;
    padding: 0;
    /* background-image: url("graphics/Right Arrow Normal.png"); */
    background: url('graphics/NavBtns-sp.png') 0 0;
    background-size: 200%;
    background-position: 0 -28px;
    cursor: default;
}

div.nav-next:hover {
    background-position: -28px -28px;
}

div.nav-next:active {
    background-position: -27px -28px;
}

/* Thumbnail Strip */
.tn-frame {
    margin: 4px 0 0 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 9pt;
    border-bottom: none;
}

.tn-caption {
    margin-top: -2px;
    margin-bottom: 8px;
}

.tn-caption[data-sel = "yes"] {
    font-weight: bold;
    font-style: italic;
    color: black;
}

.thumbs1 {
    position: fixed; 
    top: 0; 
    left: 0; 
    height: 100%; 
    width: 150px; 
    z-index: 99;
}

.thumbs2 {
    width: 100%;
    height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

.thumbs3 {
    top: 0;
    padding:4px 0;
    text-align: center;
    font-family: arial;
    font-size: 8pt;
    color:#333333;
}

/***************************/

.gallery {
    position: absolute;
    margin: 0;
    top: 10px;
    left: 150px;
    right: 0;
    padding-bottom: 60px;
    user-select: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
}

.ribbon-link:first-child { left: 2%; }
.ribbon-link:nth-child(2) { left: 34%; }
.ribbon-link:nth-child(3) { left: 64%; }
.ribbon-link:nth-child(4) { right: 2%; }
.ribbon-link:last-child { right: 2%; }