@import url('/inc/text.css');

body {
    margin: 0;    
    font-family:Verdana,Arial,Helvetica,sans-serif;
    font-size:12px;
    background-repeat: repeat-y;
    background-image: url('/img/layout/background.gif');
    background-position: top center;
}

#wrapper { 
    width: 1000px;
    margin: 0 auto;
    background-repeat: repeat-y;
    background-image: url('/img/layout/background.gif');
}

#left {
    width: 215px;
    float: left;
    padding-right: 15px;
    padding-top: 87px;    
}

#right a { color: #eee; text-decoration: underline; }
#right ul, #left ul {
    list-style-type: none;
    text-align: right;
    width: 100%;
    margin: 0;
    padding: 0;
}
#right ul { text-align: left; }

#right li, #left li { list-style-type: none; }
#left li a {
    padding-right: 15px;
    display: block;
    font-size: 12px;
    height: 37px;
    line-height: 35px;
    text-decoration: none;
    color: #000;    
    background-image: url('/img/layout/li.gif');
    background-position: center right;
    background-repeat: no-repeat;

}

#left li ul li a { color: #FFF; background-image: url('/img/layout/li-2.gif');}

#right li a:hover, #right li a.active, #left li a:hover, #left li a.active {
    text-decoration: underline;
}

#right {
    width: 215px;
    padding-left: 15px;
    padding-top: 160px;
    float: right;
}
#right li a {height: 37px; line-height: 37px; padding-left: 15px; display: block; color: #fff; text-decoration: none}


#header table { border-collapse: collapse; width: 100%; }
#header td { border-left: 1px solid #F00; border-bottom: 1px solid #f00; text-align: center; height: 180px; width: 180px; background-color: #fff; }
#header td a{ display: block;}
#header td a img{ vertical-align: middle; }
#header table.welcome td { width: 270px; height: 150px; border-bottom: 0}
#header table.welcome td.header-title {
    background-color: #000;
    margin: auto; 
    color: #fff;
    height: 30px;
    border: 0;
    border-bottom: 1px solid #F00;
    vertical-align: middle;
}
#header table.welcome td.header-title h1{margin: 0; padding: 0}

#header .header-title h1 {
    color: #fff;
    font-size: 11px;
    font-weight: normal;
}

#center {
    width: 540px;
    float: left;
    overflow: hidden; 
}

#login { 
    padding-left: 20px;
    width: 180px;
    height: 111px;
}

#login .title {
    font-weight: bold;
    line-height: 25px;
    display: block;
    color: #fff;
    text-align: center;
    
}

textarea, input[type=text], input[type=password] { border: 1px solid #AAA; }

.author {
    font-style: italic;
    font-size: 10px;
}

#header div.gallery {
    width: 100%;
    height: 100%;
    display: block;
    padding: 0;
    margin: 0;
    background-repeat: no-repeat;
}
#header td.gallery_active a { color: #fff; text-decoration: none; }
#header td.gallery_active a:hover { text-decoration: underline; }

#header td.gallery_active {
    padding: 10px;
    width: 160px;
    vertical-align: top;
    text-align: left;
}

#header tr.gallery td { border: 0; }

/* the four circle buttons, top right */
#header .buttons {
    padding-left: 40px;
}
#header .buttons a {
    width: 30px;
    height: 30px;
    float: left;
    margin-right: 4px;
    margin-bottom: 4px;
    text-decoration: none;
}
#header .buttons a:hover {
    text-decoration: none;
}
#footer {
    font-size: 11px;
    text-align: center;
    padding: 10px;
    width: 520px;
    border-top: 2px solid #ccc;
}


/**
 * Dots
 * */

.fgdot, .fgpic {
    float: left;
    background-image: url('/img/layout/circle.jpg');
    background-repeat: no-repeat;
    width: 30px;
    height: 30px;
    margin-left: 4px;
    margin-bottom: 4px;
    text-decoration: none;
}
.fgdot:hover {
    text-decoration: none;
}

#fgballon {
    background-color: #e6e6e6;
    border: 1px solid #000;
    color: #000;
    padding: 5px;
}

#header td.galleryTitle {
     margin: 0; 
     padding: 0; 
     background-color: #fff; 
     border: 0;
     vertical-align: top;
     text-align: left;
}
.gallery h1 {
    font-size: 13px;
}
td.galleryTitle h1 {
    color: #7f7f7f;
    font-size: 11px;
    text-transform: uppercase;
    margin: 0;
    padding: 8px;
    text-align: left;
}
.galleryAuthor {
    text-align: left; 
    padding: 8px;
    display: block;
}
.photoDots {
    display: block;
    padding: 8px;
    text-align: left;
}
.galleryNaloga {
    padding: 8px;
    display: block;
    text-align: left;
}
#header td.galleryText {
    text-align: left;
    vertical-align: top;
    background-color: #e6e6e6;
}
.fgpic:hover {
    background-image: url('/img/layout/circle-dot.jpg');
}

/**
 * bg/fg blocks (gallery table)
 * */
#header .blackwhite {
    background-color: #000;
    color: #fff;
}

#header .whiteblack {
    background-color: #fff;
    color: #000;
}

#header .grayblack {
    background-color: #e6e6e6;
    color: #000;
}

#header .gallerygroup a {
    text-decoration: none;
}

#header .gallerygroup a:hover {
    text-decoration: underline;
}