/*
* PHOTO VIEWER RULES
*/

.photo-viewer-wrapper {}
.photo-viewer-wrapper .stage-wrapper {
    float:left;
    display:block;
    width:720px;
    position: relative
}
.photo-viewer-wrapper .right-pane {
    float:left;
    margin-left: 18px;
    width:300px;
    padding-top:30px;
}

.photo-viewer-wrapper .right-pane .ads {
    margin-top:10px;
}

.photo-viewer-wrapper .stage-wrapper .ads {
    margin:10px 0;
    text-align: center;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage { margin:10px 0; position:relative; min-height: 200px; width:720px;}
.photo-viewer-wrapper .stage-wrapper .theater-stage .spotlight { 
    margin: 0 auto; 
    width:auto;
    max-width: 746px;
    text-align: center;
    position: absolute;
    left:50%;
    top:50%;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage .spotlight .photo {
    max-width: 700px;
    padding:10px;
    background: white;    
    box-shadow: 0 5px 3px -1px #242424;
    border:0px none;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage .spotlight .photo.plain {
    padding:0px;
    box-shadow: none;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage .stage-overlay {
    position: absolute;
    top:0;
    left:0;
    width:720px;
    display:none;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage:hover > .stage-overlay {
    display:block;
}

.photo-viewer-wrapper .stage-wrapper .theater-stage .stage-overlay .nav-wrap {
    height: 100%;
    width:320px;
    display:inline-block;
    position: relative;
    cursor: pointer;
}

.theater-stage .stage-overlay .nav-wrap.nav-left{ display:block; float:left; }
.theater-stage .stage-overlay .nav-wrap.nav-right{ display:block; float:right; }
.theater-stage .stage-overlay .nav-wrap .nav-button { 
    position:absolute;   
    display:block;
    width:32px;
    height:32px;
    top:45%;
    cursor:pointer;
}

.theater-stage .stage-overlay .nav-wrap .nav-button.left { 
    background: url(img/navigate_left_unselected_32px.png) no-repeat;
    left:10%;
}

.theater-stage .stage-overlay .nav-wrap .nav-button.right{ 
    background: url(img/navigate_right_unselected_32px.png) no-repeat;
    right:10%;
}

.theater-stage .stage-overlay .nav-wrap.nav-left:hover > .nav-button.left {
    background: url(img/navigate_left_selected_32px.png) no-repeat;    
}

.theater-stage .stage-overlay .nav-wrap.nav-right:hover > .nav-button.right{ 
    background: url(img/navigate_right_selected_32px.png) no-repeat;
}

.photo-viewer-wrapper .photo-summary .owner {
    display:inline-block;
}
.photo-viewer-wrapper .photo-summary .owner .pix {
    float:left;
}

.photo-viewer-wrapper .photo-summary .owner .title {
    float:left;
    width:200px;
    margin-left:10px;
}

.photo-viewer-wrapper .wf {
    margin-bottom: 10px;
    text-align: center;
}

.photo-viewer-wrapper .photo-summary a, .photo-viewer-wrapper .photo-summary, .photo-viewer-wrapper .wf, .photo-viewer-wrapper .wf a, .photo-viewer-wrapper .wf .member-comment-count, .photo-viewer-wrapper .wf .UI_liked_count {
    color:#fff;
}
.photo-viewer-wrapper .photo-summary .owner {}
.photo-viewer-wrapper .photo-info{
    padding:10px 0;
    margin:0px;
}

.photo-viewer-wrapper .photo-caption {
    color:white;
    text-align: center;
}

#album-photos .grid_thumbnails {
    display:block;
    margin-top:10px;
}

#album-photos .grid_thumbnails .grid_block{
    display:inline-block;
}
#album-photos .grid_thumbnails .grid_block .grid { float:left; margin:auto 5px;}
#album-photos .grid_thumbnails .grid_block .grid .thumbnail{
    width:50px;
}

#album-photos .thumbnail-nav{
    position:relative;
}

#album-photos .thumbnail-nav .control {
    position:absolute;
    width:21px;
    cursor:pointer;
}

#album-photos #leftControl {
    left:245px;
    top:0;
}

#album-photos #rightControl {
    right:0;
    top:0;
}

.member-profile-page #fav-place-list {

    /* for slideshow */
    margin:0 auto;
    width:300px;
    height:auto;
    position:relative;    
}

#album-photos #slidesContainer {
  width:300px;
  height:auto;
  overflow:auto; /* allow scrollbar */
  position:relative;
}

#album-photos #slideshow #slidesContainer .slide {
  margin:0 auto;
  width:300px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */
  height:auto;
}
