/* collection page */

body{ min-width:1113px }
#main{ height:915px; min-width:1113px }

#centralcontent{ width:1113px; margin-left:-557px; height:715px } /*contains list with thumbnail images and absolutely positioned overlay with enlarged image*/
#centralcontent ul{ display:block; overflow:auto; margin:25px 0; padding:0; list-style:none } /*thumbnails*/
#centralcontent ul li{ position:relative; float:left }
#centralcontent ul li img{ width:150px; height:200px; margin:0 9px 18px 0; cursor:pointer }

#centralcontent #enlarged{ /*image shown enlarged with desc and nav*/
    position:absolute; top:0; left:0; width:1113px; height:715px; background-color:#fff; text-align:left; display:none
    }
#centralcontent #enlarged img{ position:absolute; left:250px; bottom:90px }
#centralcontent #enlarged p{ position:absolute; left:700px; bottom:70px }
#centralcontent #enlarged p span{
    display:block; margin:0px 1em 0.9em 2em;
    text-align:left; color:#616161; font-size:11px;
    }
#centralcontent #enlarged #enlg_close{
    top:50px; left:655px; background:transparent url('images/xbutton.png') no-repeat right top;
    position:absolute; display:block; width:23px; height:23px; cursor:pointer;
    }
#centralcontent #enlarged #enlg_prev{
    top:245px; right:180px; background:transparent url('images/arrow-left.png') no-repeat 10px 10px; background-size:14px 24px;
    position:absolute; display:block; width:14px; height:24px; cursor:pointer; padding:10px
    }
#centralcontent #enlarged #enlg_next{
    top:245px; right:145px; background:transparent url('images/arrow-right.png') no-repeat 10px 10px; background-size:14px 24px;
    position:absolute; display:block; width:14px; height:24px; cursor:pointer; padding:10px
    }
#centralcontent #enlarged  h1{
    position:absolute; top:200px; right:90px;
    font-weight:normal; text-transform:uppercase; font-size:1.25em; color:#aaa;
    }
    
/*  backstage page*/
    
#main.backstage{ height:1350px }
#main.backstage #centralcontent{ height:1150px }
#main.backstage #centralcontent > img{ position:absolute }
#main.backstage #centralcontent img.clickme{ cursor:pointer }

#centralcontent #slider{ /* where large images are shown. absolutely positioned, covers the entire centralcontent, viewport for the slider */
    position:absolute; top:0; left:0; width:1113px; height:1150px; background-color:#fff; overflow:hidden; display:none
}
#centralcontent #slider ul{ height:1150px; width:11130px; margin:0; padding:0; overflow:hidden; position:relative }
#centralcontent #slider ul li{ height:1150px; width:1113px; margin:0; padding:0 }
#centralcontent #slider ul li img{ width:auto; height:auto; margin:0; cursor:default }
#centralcontent #slider #next{ position:absolute; top:450px; right:0; width:35px; height:60px; cursor:pointer; padding:10px; background:transparent url('images/arrow-right.png') no-repeat 10px 10px }
#centralcontent #slider #prev{ position:absolute; top:450px; left:0; width:35px; height:60px; cursor:pointer; padding:10px; background:transparent url('images/arrow-left.png') no-repeat 10px 10px }
#centralcontent #slider #xbutton{ position:absolute; top:10px; right:10px; width:23px; height:23px; background:transparent url('images/xbutton.png') no-repeat right top; cursor:pointer; }