BODY
{
    margin                  : 0px;
    background-image        : url( "/images/photos/echo/background_grid.gif" );
    font-family             : Verdana, Arial, sans-serif;
}

/* this is the text that holds the username */
.header-text
{
    display                 : block;
    text-decoration         : none;
    background-color        : white;
    text-align              : left;
    padding                 : 10px 0 4px 50px;
    color                   : #990000 !important;
    text-transform          : capitalize;
    border-bottom           : 1px dotted gray;
}

/* this is the outer div of other page for the user */
DIV.parent-pages,
DIV.other-pages
{
    padding-top             : 5px;
    padding-left            : 50px;  
}

/* this allows the user to change the style to another stylesheet */
DIV.style-change
{    
    position                : absolute;
    top                     : 8px;
    right                   : 15px;
}

.style-change-text
{
    display                 : none;
}

/* The caption for the entire page */
div.page-caption
{
    text-align              : left;
    clear                   : all;
}

.parent-page-image-link,
.other-page-image-link
{
    display                 : none;
}

.parent-page-name-link,
.other-page-name-link
{
    font-family         : Verdana, Helvetica;
    font-size           : 0.9em;
    color               : #3366CC;
    text-decoration     : none;
}

.parent-page-current,
.other-page-current
{
    color               : #990000;
    font-weight         : bold;
}

.images-in-folder-text
{
    text-transform    : uppercase;
    padding-left      : 50px;
}

.photos-wrapper
{
/*    margin-left         : 50px; */
}

.photo-caption-wrapper
{
    position            : relative;
    float               : left;
    text-align          : center;
    padding             : 15px 6px;
    width               : 225px;
    height              : 210px;
}

.photo-wrapper
{
    border              : 1px solid #999999;
    padding             : 10px;
    margin              : 0px 30px;
    background-color    : white;
    border-radius       : 10px;
    -moz-border-radius  : 10px;
    max-width           : 150px;
}

/*
BODY > .photo-wrapper
{
    margin              : 0px auto;
}
*/

/* This is the actual image itself */
.photo
{
    border                : 1px solid #999999;
    background-color    : white;
}

/* The caption under the photo */
.photo-caption
{
    /* This screws up mozilla 1.4
    position            : absolute; */
    top                 : 135px;
    left                : 27px;
    display             : block;
    text-decoration     : none;
    margin              : 13px auto 0 auto;
    border              : 1px solid #999999;
    padding             : 5px;
    border-radius       : 10px;
    -moz-border-radius  : 10px;
    background-color    : white;
    width               : 170px;
    font-size           : 10pt;
    color               : #666 !important;
}

.photo-caption-empty
{
    display             : none !important;
}

.footer
{
    clear               : left;
    float               : left;
    font-size           : 0.8em;
    margin-top          : 20px;
    margin-left         : 50px;
}

/*** styles below this comment are only used in the preview window ***/

#TheImage
{
    display             : block;
    margin              : 10px auto 0px auto;
    border              : 1px solid #333333;
}

#TheCaption
{
    display             : block;
    margin              : 20px auto 0px auto;
    text-align          : center;
    border              : 1px solid #999999;
    padding             : 5px;
    border-radius       : 10px;
    -moz-border-radius  : 10px;
    background-color    : white;
    width               : 75%;
    min-height          : 2ex;
}

.slide-controls.top
{
    position            : absolute;
    top                 : 8px;
    right               : 10px;
}

.slide-controls.bottom
{
    position            : static;
    float               : right;
    margin              : 10px 10px 0px 0px;
}

.slide-control
{
    display             : block;
    float               : left;
    width               : 15px;
    height              : 15px;
    background-repeat   : no-repeat;
    margin-top          : 3px;
}

.StopShow
{
    background-image    : url( "/images/photos/echo/stop_up.gif" );
}

.StopShow:hover
{
    background-image    : url( "/images/photos/echo/stop_hover.gif" );
}

.StartShow
{
    background-image    : url( "/images/photos/echo/start_slideshow_up.gif" );
    margin-right        : 30px;
}

.StartShow:hover
{
    background-image    : url( "/images/photos/echo/start_slideshow_hover.gif" );
}

.PrevSlide
{
    background-image    : url( "/images/photos/echo/previous_up.gif" );
    margin-left         : 10px;
}

.PrevSlide:hover
{
    background-image    : url( "/images/photos/echo/previous_hover.gif" );
}

.NextSlide
{
    background-image    : url( "/images/photos/echo/next_up.gif" );
    margin-right        : 10px;
}

.NextSlide:hover
{
    background-image    : url( "/images/photos/echo/next_hover.gif" );
}

.CloseWindow
{
    display             : block;
    float               : left;
    width               : 92px;
    height              : 15px;
    margin-top          : 3px;
    background-image    : url( "/images/photos/echo/back_to_album_up.gif" );
    background-repeat   : no-repeat;
}

.CloseWindow:hover
{
    background-image    : url( "/images/photos/echo/back_to_album_hover.gif" );
}

#PhotoNumTop,
#PhotoNumBottom
{
    display             : block;
    float               : left;
    margin-left         : 5px;
    margin-right        : 5px;
}

.photos-wrapper.fullsize
{
    text-align          : center;
}

a:link, a:visited
{
    color               : #3366CC;
}