/* client application overrides */
 
html {
    height:auto;}

html, body {
    color:#4b4a4a;}
    
form {
    width:auto;}
    
a {
    font-weight:bold;
    text-decoration:none;}
    
a:hover {
    color:#5d5d5d;
    text-decoration:underline;}
    

/* popup window - used for images/show and images/cart */
div#popup .window {
    position:relative;
    padding:10px;
    width:640px;
    height:75%;
    left:50%;
    margin-left:-320px;
    text-align:left;}
    
    div#popup .window div.closeButton {
        width:96%;
        padding:.2em 2%;
        text-align:right;}
    
    div#popup .window div#popupContent {
        width:620px;
        height:94%;}
        
    div#popup .window div#popupTrack {
        height:94%;}
    
    div#popup .window div#popupContent p {
        font-size:.9em;}
        
    div#popup .window div#popupContent p.imageName {
        margin:.3em 0;}
    
/* client application styles */
#copyright {
    position:absolute;
    width:570px;
    background:transparent url(/images/spacer.png) repeat;
    z-index:30000;
    cursor:pointer;}
    
#thumbnails {
    position:relative;
    margin-top:10px;
    width:90px;
    text-align:right;}
    
    #thumbnails .thumbnail {
        border:1px solid #b3cde3;
        width:10px;
        height:10px;
        cursor:pointer;
        margin:0px 0px 4px 76px;
        font-size:0px;}
        
    #thumbnails .current {
        background:#af3e3a;}
    

/* user/login */
div.login {
    width:35.9%;
    padding:2%;
    margin:20% 30%;
    border:1px solid #4b4a4a;
    background:#fff;}

div.login table {
    margin:0 auto;}
    
    div.login td {
        padding: .2em;
        text-align:right;}
        
    div.login input {
        border: none;
        background: #fff;
        color: #4b4a4a;
        border:1px solid #4a4a4a;}
        
    div.login .submit {
        text-transform: lowercase;
        cursor: pointer;}
            
            
            
/* image/list */
div.listClientImages {
    width:872px;
    margin:40px auto 0 auto;
    padding-bottom:220px;}
            
a.thumb, a.thumb:visited {
    float:left;
    display:block;
    width:92px;
    color:#4b4a4a;
    margin:0 9px 11px 8px;
    text-decoration:none;}
    
    .albumList a.thumb span.image {
        display: block;
        text-align: center;
        height: 91px;}
        
    .albumList a.thumb span.imageName {
        height: auto;}    
    
    a.thumb span.image {
        display:block;
        padding:12px 0 18px 0;
        background:#fff;
        width:92px;
        height:61px;
        opacity:.6;
        text-align:center;}
        
        a.thumb:hover span.image {
            opacity:1;}
        
    a.thumb span.imageName {
        float:left;
        width:92px;
        height:1em;
        overflow:hidden;
        text-align:center;
        font-size:.9em !important;
        font-weight:bold;
        padding:0.2em;}
        
    
    
.pagination {
    clear:left;
    text-align:right;
    margin-right:3em;
    font-size:110%;
    color:#dadada;}
    
    .pagination a {
        padding:.2em .5em;}
        
        .pagination a:hover {
            background:#dadada;
            text-decoration:none;}
        
        

/* image/show */
    div.orderPrint h3 {
        margin:0.5em 0 0.2em 0;
        font-size:135%;}
        
    div.orderPrint table {
        border-collapse:collapse;
        margin:1em 0;
        padding:0;
        width:100%;
        border-bottom:2px solid #dedede;}
        
        div.orderPrint table th.size, div.checkout table th.size {
            width:49%;}
        
        div.orderPrint table th.price, div.checkout table th.price {
            width:41%;}
            
        div.orderPrint table th.quantity, div.checkout table th.quantity {
            width:10%;}
            
        div.orderPrint table td,
        div.orderPrint table th,
        div.checkout table th,
        div.checkout table td {
            padding:.2em .4em;}
            
        div.orderPrint table tr.even td {
            background:#ededed;}
            
        div.orderPrint table td input {
            width:96%;}
        
        div.orderPrint table td input.autoWidth {
            width:auto;}
    
    
    
/* common view image */
div.viewImage, a.viewImage {
    position:relative;
    margin:0 0 2em 0;}
    
    div.viewImage div.image, a.viewImage span.image {
        position:relative;
        width:100%;}
        
    div.viewImage p.imageName. a.viewImage span.imageName {
        position:absolute;
        bottom:0;
        float:right;
        width:92%;
        text-align:center;
        padding:.3em 4%;
        margin:0;
        opacity:.8;
        z-index:50;
        color:#000;
        font-size:.9em;
        background:#fff;}
        
    div.viewImage div.navigation {
        position:absolute;
        top:50%;
        width:100%;
        margin-top:-15px;
        z-index:1000;}
        
        div.viewImage div.navigation a.previous,
        div.viewImage div.navigation a.next {
            display:inline-block;
            width:40px;}
            
            div.viewImage div.navigation a.next {
                float:right;}
    
/* footer */

#footer {
    position:fixed;
    bottom:0;
    width:100%;
    margin:1em 0 0 0;
    text-align:left;
    background:#ededed;}

    #footer a {
        margin-right:2em;}
        

/* cart lightbox */
#footer h3 {
    display:block;
    margin:0;
    padding:.2em;
    background:#4a4a4a;
    color:#fff;}
    
    #footer h3 a {
        float:right;
        color:#fff;
        font-size:.7em;
        margin:.3em 1em 0 0;}
        
#footer #lightBox{
    float:left;
    width:100%;
    overflow-y:hidden;}

#footer .cart {
    float:left;
    width:70%;
    margin:0;
    margin-bottom:-2000px;
    padding:.4em 0 2000px 15px;
    border-right:2px solid #1a1a1a;}
        
#cart {
    float:left;
    width:100%;
    padding:.5em 0;
    min-height:75px;
    overflow-x:scroll;}
            
    #cart a.viewImage, #cart a.viewImage:hover {
        float:left;
        clear:none;
        width:100px;
        margin:0 7px;
        font-size:.9em;
        text-decoration:none;
        font-weight:bold;}
        
        #cart div.wrapper a.viewImage:first-child {
            margin-left:0;}
                
            #cart div.wrapper a.viewImage span.tooltip {
                top:0;
                left:100%;
                z-index:1000;
                width:200px;
                height:50px;
                border:1px solid #4a4a4a;
                display:none;
                background:#fff url(/images/popup_bg.jpg) no-repeat 100% 0;}
                
                #cart div.wrapper a.viewImage:hover span.tooltip {
                    position:absolute;
                    z-index:10000;
                    display:inline;}
    

#footer .summary {
    float:left;
    width:20%;
    padding-bottom:2000px;
    margin-bottom:-2000px;
    border-right:2px solid #1a1a1a;
    background:#ccc;}

    #footer .sumamry table {
        border-collapse:collapse;
        margin:0;
        padding:0;
        width:100%;}
        
        #footer .summary table td {
            padding:.2em .4em;}
            
        #footer .summary table td.label {
            width:50%;}

#footer .nav {
    float:left;
    width:7%;
    padding-bottom:2000px;
    margin-bottom:-2000px;}
    
    #footer .nav ul {
        float:right;
        margin-top:1em;}
        
        #footer .nav ul li {
            margin:0 0 .6em 0;
            font-size:.9em;}
            
div.checkout div.orderPrint table {
    border:none;
    margin:0;}