/*
 * Theme clean
 ***********************************************************************************************************/

HTML
{
    height:100%;
    overflow:hidden;
    font-size:11pt;
    background-color:white;
}

BODY
{
    font-family:"DejaVu Sans", "Bitstream Vera Sans", sans-serif;
    height:100%;
    overflow:hidden;
    margin:0;padding:0;
    color:#336;
    background-color:white;
}

a
{
    font-weight:bold;
    color:#6a5acd;
    text-decoration:none;
}

a:hover, a:focus, a:active
{
    color:#f90;
    text-decoration:underline;
}


/*
 * Common
 ***********************************************************************************************************/
span.progressing
{
    background:url('illus/loading.gif') no-repeat 0px 50%;
    padding-left:70px;
}

/*
 * No script informations
 ***********************************************************************************************************/
div#noscriptInfo
{
    position:absolute;
    left:0%;top:0%;
    width:100%;height:100%;
    background-color:white;
    z-index:100;
}
div#noscriptInfo p
{
    margin:4pt;
}

/*
 * Thumbnails
 ***********************************************************************************************************/

div#ThumbnailsMode
{
    background-color:#fff;
}

div#ThumbnailsTitle
{
    position:absolute;
    left:31%;width:68%;
    height:5%;
    z-index:2;
    background-color:white;
}

div#ThumbnailsTitle h2
{
    text-align:center;
    font-size:12pt;
    font-weight:bold;
    margin:0;padding:0;
    font-variant:small-caps;
    vertical-align:middle;
    font-stretch:extra-expanded;
    letter-spacing:3px;
    z-index:2;
    background-color:white;
    border-bottom:2px solid #789;
}

div#ThumbnailsInfos
{
    position:absolute;
    top:90%;height:5%;
    left:31%;width:68%;
    background-color:white;
    font-size:85%;
    border-top:2px solid #789;
}

p#ThumbnailsInfosText
{
    overflow:hidden;
    position:absolute;
    left:2%;top:0%;
    width:96%;height:1.5em;
    margin:0;
    z-index:5;
}

div#ThumbnailsInfos a
{
    color:#bbb;
    font-weight:bold;
}

div#ThumbnailsInfos a:hover
{
    color:#789;
    text-decoration:none;
}

div#ThumbnailsInfos span#pageLabel
{
    font-weight:bold;
    padding:2pt 4pt;
    background-color:#789;
    color:white;
}

div#ThumbnailsInfos span
{
    font-weight:bold;
    padding:2pt 4pt;
    margin:0 2pt;
    background-color:#e7edf5;
}

div#ThumbnailsControls
{
    position:absolute;
    top:95%;height:5%;
    left:31%;width:68%;
    z-index:2;
    border-top:1px solid #7a8a9a;
    background-color:white;
    font-size:85%;
}

div#ThumbnailsBox
{
    position:absolute;
    left:31%; width:68%;
    top:5%;height:85%;
    overflow:auto;
    z-index:2;
    text-align:center;
    visibility:hidden;
}

table#ThumbnailsGrid
{
    border-collapse:separate;
    margin:auto;
    border-spacing:6px;
    table-layout:fixed;
}

table#ThumbnailsGrid td
{
    background-color:white;
    text-align:center;
    vertical-align:bottom;
    background-color:#fff;
    border:3px double #eee9e9;
}

table#ThumbnailsGrid td.currentPhoto,
table#ThumbnailsList td.currentPhoto
{
    border:3px solid #b0c4de;
    background-color:#fff;
    text-align:center;
}

a.Thumbnail img
{
    border-style:none;
    margin:0;
    padding:0;
}

span.photoTitle
{
    font-weight:normal;
    text-decoration:none;
    color:#789;
    border-top:1px solid #eee9e9;
    font-size:11px;
    display:block;
    margin:0;
    height:28px;
    overflow:hidden;
}

a.Thumbnail:hover
{
    text-decoration:none;
}

table#ThumbnailsList
{
    margin-top:1em;
    margin-bottom:1em;
    display:table;
    width:98%;
    margin-left:1%;
    border-spacing:2px;
}

table#ThumbnailsList tr
{
    height:122px;
    width:122px;
    vertical-align:middle;
}

table#ThumbnailsList td.ThumbnailImage
{
    vertical-align:middle;
    width:122px;
    text-align:center;
    background-color:#fff;
    border:3px double #eee9e9;
}

table#ThumbnailsList td.ThumbnailInfos
{
    vertical-align:top;
    overflow:auto;
    background-color:#fff;
    border:3px double #eee9e9;
}

table#ThumbnailsList td.ThumbnailInfos span.location
{
    display:block;
}

table#ThumbnailsList td.ThumbnailControls
{
    display:none;   /* TO BE CONTINUED... */
    width:10px;
    background-color:#fff;
    border:3px double #eee9e9;
}


/*
 * SLIDE ***************************************************************************************************/

div#SlideTitle
{
    position:absolute;
	top:0%;left:0%;
    width:100%;height:5%;
    margin:0;padding:0;
    visibility:hidden;
}

div#SlideTitle h2
{
    margin:0;padding:0;
    text-align:center;
    font-size:12pt;
    font-weight:bold;
    font-variant:small-caps;
    font-stretch:extra-expanded;
    letter-spacing:2px;
	margin-top:4pt;
}

#SlideBox
{
    position:absolute;
    left:1%;top:5%;
    height:75%;width:98%;
    background-color:white;
    text-align:center;
    vertical-align:middle;
    visibility:hidden;
    overflow:hidden;
}

#SlideDesc
{
    position:absolute;
    left:4%;width:92%;
    top:80%;height:10%;
    text-align:center;
    visibility:hidden;
}

#SlideDesc p
{
    margin:0;
    font-style:italic;
    line-height:1.2em;
    margin-left:30pt;
    margin-right:30pt;
}

img#PreviousSlideImage
{
    position:absolute;
    left:10pt;
    bottom:10pt;
}

img#NextSlideImage
{
    position:absolute;
    right:10pt;
    bottom:10pt;
}

#SlideBox a img#SlideImage
{
    border-style:none;
    margin-left:auto;
    margin-top:auto;
    padding:3px;
    border:3px double #789;
}

div#SlideInfos
{
    position:absolute;
    left:0%;top:90%;
    height:5%;width:100%;
    z-index:1;
    font-style:italic;
    border-top:2px solid #789;
    background-color:white;
    visibility:hidden;
}

div#SlideInfos p
{
    margin-top:5px;
    background-color:white;
}

div#SlideInfos span.FileTitle { display:none; }
div#SlideInfos span.ImageDims { }
div#SlideInfos span.FileWeight { }
div#SlideInfos span.FileDate { }


div#SlideControls
{
    position:absolute;
    top:95%;left:0%;
    width:100%;height:5%;
    vertical-align:middle;
    z-index:1;
    border-top:1px solid #ddd;
    background-color:white;
    visibility:hidden;
}
/*
 * CONTROLS & STATUS ***************************************************************************************/
.infos
{
    text-align:center;
}

.controls, .infos
{
    font-size:9pt;
    padding:0;margin:0;
    vertical-align:middle;
}

div#ThumbnailsControls #ThumbnailsStatus, 
div#SlideControls #SlideStatus
{
    padding-right:2pt;
    padding-left:2pt;
	line-height:21px;
    float:left;
}

div#ThumbnailsControls a, div#SlideControls a
{
    text-decoration:none;
    margin:0;padding:0;
    margin-left:4px;
    float:left;
    background-position: 50% 50%;
    background-repeat:no-repeat;
    background-attachment:scroll;
    width:30px;
    height:21px;
}

div#ThumbnailsControls a#nav_stopdiapo,
div#SlideControls a#nav_stopdiaporama
{
    display:none;
}

div#ThumbnailsControls a#nav_startdiapo { background-image:url('illus/startdiapo.png') ; }
div#ThumbnailsControls a#nav_startdiapo:hover { background-image:url('illus/startdiapo-hover.png') ; }
div#ThumbnailsControls a#nav_stopdiapo { background-image:url('illus/stopdiapo.png') ; }
div#ThumbnailsControls a#nav_stopdiapo:hover { background-image:url('illus/stopdiapo-hover.png') ; }
div#ThumbnailsControls a#nav_firstpage { background-image:url('illus/first.png') ; }
div#ThumbnailsControls a#nav_firstpage:hover { background-image:url('illus/first-hover.png') ; }
div#ThumbnailsControls a#nav_previouspage { background-image:url('illus/previous.png') ; }
div#ThumbnailsControls a#nav_previouspage:hover { background-image:url('illus/previous-hover.png') ; }
div#ThumbnailsControls a#nav_nextpage { background-image:url('illus/next.png') ; }
div#ThumbnailsControls a#nav_nextpage:hover { background-image:url('illus/next-hover.png') ; }
div#ThumbnailsControls a#nav_lastpage { background-image:url('illus/last.png') ; }
div#ThumbnailsControls a#nav_lastpage:hover { background-image:url('illus/last-hover.png') ; }

div#ThumbnailsControls a.disabled#nav_previouspage { background-image:url('illus/previous-disabled.png') ; }
div#ThumbnailsControls a.disabled#nav_nextpage { background-image:url('illus/next-disabled.png') ; }
div#ThumbnailsControls a.disabled#nav_startdiapo { background-image:url('illus/startdiapo-disabled.png') ; }

div#SlideControls a#nav_backthumb { background-image:url('illus/up.png') ; } 
div#SlideControls a#nav_back_thumb:hover { background-image:url('illus/up-hover.png') ; } 
div#SlideControls a#nav_previousphoto { background-image:url('illus/previous.png') ; }
div#SlideControls a#nav_previousphoto:hover { background-image:url('illus/previous-hover.png') ; }
div#SlideControls a#nav_nextphoto { background-image:url('illus/next.png') ; }
div#SlideControls a#nav_nextphoto:hover { background-image:url('illus/next-hover.png') ; }
div#SlideControls a#nav_lastpage { background-image:url('illus/last.png') ; }
div#SlideControls a#nav_lastpage:hover { background-image:url('illus/last-hover.png') ; }
div#SlideControls a#nav_startdiaporama { background-image:url('illus/startdiapo.png') ; }
div#SlideControls a#nav_startdiaporama:hover { background-image:url('illus/startdiapo-hover.png') ; }
div#SlideControls a#nav_stopdiaporama { background-image:url('illus/stopdiapo.png') ; }
div#SlideControls a#nav_stopdiaporama:hover { background-image:url('illus/stopdiapo-hover.png') ; }
div#SlideControls a#nav_viewfullsize { background-image:url('illus/fullsize.png') ; }
div#SlideControls a#nav_viewfullsize:hover { background-image:url('illus/fullsize-hover.png') ; }
div#SlideControls a#nav_savefullsize { background-image:url('illus/save.png') ; }
div#SlideControls a#nav_savefullsize:hover { background-image:url('illus/save-hover.png') ; }

div#SlideControls a.disabled#nav_previousphoto { background-image:url('illus/previous-disabled.png') ; }
div#SlideControls a.disabled#nav_nextphoto { background-image:url('illus/next-disabled.png') ; }
div#SlideControls a.disabled#nav_startdiaporama { background-image:url('illus/startdiapo-disabled.png') ; }

div#ThumbnailsControls span#ThumbnailsPageProgress, div#SlideControls span#SlidePhotoProgress
{
    padding-right:2pt;
	line-height:21px;
    float:right;
    padding-left:70px;
}
div#ThumbnailsControls span.loading#ThumbnailsPageProgress
{
    background:url('illus/loading.gif') no-repeat 0 50%;
}


div#ThumbnailsControls #ThumbnailsControlsButtons, div#SlideControls #SlideControlsButtons
{
    display:inline;
    clear:none;
}

/*
 * Vue des vignettes horizontalement
 ***********************************************************************************************************/
.ThumbnailInfos h3
{
    margin-top:5px;
    margin-bottom:0;
    text-align:center;
    font-size:100%;
}

.ThumbnailInfos h3 span.fileExtension
{
    color:#cce;
}

.ThumbnailInfos h3 span.photoNumber
{
    color:#778899;
    padding-right:10px;
}

.ThumbnailInfos p.fileInfos
{
    font-size:x-small;
    color:#778899;
    margin-top:0;
    margin-bottom:1em;
    text-align:center;
}

.ThumbnailInfos p.photoDesc
{
    font-size:85%;
    text-align:left;
    margin-left:5px;
    margin-right:5px;
    font-style:italic;
    color:#778899;

}
/*
 * Logo de Bildo, non affiché par défaut
 ***********************************************************************************************************/

div#BildoInfos
{
    position:absolute;
    height:10pt;width:30%;
    bottom:2pt;left:2pt;
    z-index:10;
    line-height:10pt;
    font-weight:normal;
}

div#BildoInfos p
{
    font-size:8pt;
    text-align:left;
    margin:0;padding:0;
    float:left;
    margin-right:4pt;
    color:#bbb;
}

div#BildoInfos a
{
    color:#aaa;
    text-decoration:none;
    font-weight:normal;
}

div#BildoInfos a:hover
{
    color:#777;
    text-decoration:none;
}