body 
{
    background-color: #1a1a1a;
    color: #efefef;
    font-family: Georgia, Serif;
    line-height: 1.0em;
    font-size: 16px;
}

html,body { height: 100%; }

#wrapper
{
    min-height: 100%;
    position: relative;
}
#content { padding-bottom: 50px; padding-top: 100px; }
h1 
{
    background: #1a1a1a url('../img/gallery/header_bg.gif') repeat-x 0 0px;
    height: 52px;
    text-align: center;
    margin-bottom: 40px;
    /*padding-top: 200px;*/
}
h1 a {}
h1 a img { margin: 0 auto; }

#nav { margin: 40px 0 0 0; }
#nav p { text-align: center; }
#nav p a { padding: 0 15px; color: #999; text-decoration: none; }
#nav p a.current, #nav p a:hover, #nav p a:focus { color: #efefef; text-decoration: underline; }
#nav p a:active { color: #efefef; }

#stream 
{
    height: 160px;
    overflow: hidden;
    /*background-color: #333;*/
    line-height: 0; font-size: 0px;
    position: relative;
    margin-top: 40px;
}

.overlay  
{
    z-index: 20;
    height: 160px; 
    width: 100px; 
    position: absolute;
    /*border: 1px solid #933;*/
}
.oLeft { background: Transparent url('../img/gallery/fadeLeft.png') repeat-y 0 0; float: left; }
.oRight { background: Transparent url('../img/gallery/fadeRight.png') repeat-y 0 0; float: right; right: 0; }

#streamInner  
{
    width: 150px; 
    height: 152px; 
    position: relative; 
    left: 50%;
    left: 10px;
    /*-webkit-transition: left 0.2s ease;*/
    cursor: move;
    overflow: hidden;
}
#streamInner img  
{
    padding: 1px;
    margin: 0 8px;
    border-radius: 2px;
    z-index: 10;
    /*-webkit-transition: opacity 0.2s ease;*/
}
#streamInner img:hover, #streamInner img.sel
{
    background: Transparent url('../img/gallery/photo_select_bg.gif') repeat-x 0 0;
    cursor: pointer;
}

#footer  
{
    height: 50px; 
    position: absolute;
    bottom: 0;
    width: 100%;
}
#footer p { text-align: center; padding-top: 15px; font-size: 14px; color: #999; }
#footer a { color:#eee; text-decoration: none; }
#footer a:hover, #footer a:focus { color:#be6262; text-decoration: underline; }
#footer a:active { color: #933; }

#modal 
{
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
}

#matte 
{
    background: #000;
    position: fixed;
    width: 100%; height: 100%;
    left: 0; top: 0;
    z-index: 30;
    filter: alpha(opacity=70);
    opacity: 0.70;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

#popup 
{
    background: #fff;
    height: 300px;
    width: 300px;
    z-index: 40;
    padding: 1px;
    position: fixed;
    top: 20%;
    left: 50%;
    margin-left: -150px;
    -webkit-box-shadow: 0 0 15px rgba(0,0,0,0.75);
    background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fff), to(#333));
    border-radius: 2px;
}

#popup img {  }

.helper  
{
    position: absolute; 
    width: 50%;
    height: 100%;
    z-index: 100;
    visibility: hidden;
    -webkit-transition: opacity 0.2s ease;
    filter: alpha(opacity=0);
    opacity: 0.0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    cursor: pointer;
}
.prev  
{
    background: Transparent url('../img/gallery/helper_prev.png') no-repeat left center; 
    top: 0; left: 15px;
}
.next 
{
    background: Transparent url('../img/gallery/helper_next.png') no-repeat right center; 
    top: 0; right: 15px;
}
.prev:hover, .next:hover 
{
    filter: alpha(opacity=100);
    opacity: 1.00;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.close 
{
    background: Transparent url('../img/gallery/helper_close.png') no-repeat center center;
    width: 36px; height: 36px;
    top: -18px; right: -18px;
    /*filter: alpha(opacity=100);
    opacity: 1.00;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";*/
    /* TODO: Make hover state for helper buttons! */
}