@font-face {
    font-family: 'Maxlf';
    src: url('http://gorohov.name/fonts/max-light-webfont.eot');
    src: url('http://gorohov.name/fonts/max-light-webfont.eot?#iefix') format('embedded-opentype'), url('http://gorohov.name/fonts/max-light-webfont.woff') format('woff'), url('http://gorohov.name/fonts/max-light-webfont.ttf') format('truetype'), url('http://gorohov.name/fonts/max-light-webfont.svg#Maxlf') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    height: 100%;
}

body {
    /* font: 12px Maxlf, Tahoma, Arial, sans-serif; */
    /*color: #c0b98f;*/
    /*background: #161a21 url(images/pattern.png) center -102px;*/
    margin: 0 auto;
    background-color:white;
}



#content {
    position: relative;
    width: 100%;
    height: 100%;
}

#page {
    height: 100%;
    min-height: 450px; /* data + footer */
    position: relative;
    overflow: hidden;
}



#data_wrapper {
    overflow: hidden;
    text-align: center;
    height: 450px;
    padding: 0 0 0 100%;
    position: relative;
}

    #data_wrapper * {
        text-align: left
    }

#data {
    position: absolute;
    top: 0;
    left: 0;
    height: 550px;
    margin: 0 0 0 -450px;
    /*min-width: 1105px;*/
    left: 55%;
    border: 0px solid;
}

    #data .item {
        position: absolute;
        opacity: 0.3;
        filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=30);
    }

        #data .item.empty {
            padding: 6px 0 0 6px;
            display: none
        }

        #data .item a,
        #data .item span {
            display: block;
            width: 117px; /* 117 */
            height: 130px; /* 130 */
            padding: 6px 0 0 6px;
            cursor: pointer;
            background: url(images/cell.png) -1px 0 no-repeat;
        }

            #data .item a:hover,
            #data .item.selected a {
                background-position: 0 -130px
            }

        #data .item.selected a {
            background-position: 0 -260px;
            text-shadow: #09f1ef -1px -1px 0;
        }

        #data .item h3,
        #data .item .date,
        #data .item p {
            display: none
        }

        /* 105 */
        #data .item.r1 {
            top: 0
        }

        #data .item.r2 {
            top: 100px
        }

        #data .item.r3 {
            top: 200px
        }

        #data .item.r4 {
            top: 300px
        }

        #data .item.r5 {
            top: 400px
        }

        #data .item.r6 {
            top: 500px
        }

        #data .item.r7 {
            top: 600px
        }

        #data .item.r8 {
            top: 700px
        }

        #data .item.r9 {
            top: 800px
        }

        #data .item.r10 {
            top: 900px
        }

        #data .item.r11 {
            top: 1000px
        }

        /* 115 */
        #data .item.c1 {
            left: 0
        }

        #data .item.c2 {
            left: 115px
        }

        #data .item.c3 {
            left: 230px
        }

        #data .item.c4 {
            left: 345px
        }

        #data .item.c5 {
            left: 460px
        }

        #data .item.c6 {
            left: 575px
        }

        #data .item.c7 {
            left: 690px
        }

        #data .item.c8 {
            left: 805px
        }

        #data .item.c9 {
            left: 920px
        }

        #data .item.c10 {
            left: 1035px
        }

        /* 115 */
        #data .item.even_row.c1 {
            left: 58px
        }

        #data .item.even_row.c2 {
            left: 173px
        }

        #data .item.even_row.c3 {
            left: 288px
        }

        #data .item.even_row.c4 {
            left: 403px
        }

        #data .item.even_row.c5 {
            left: 518px
        }

        #data .item.even_row.c6 {
            left: 633px
        }

        #data .item.even_row.c7 {
            left: 748px
        }

        #data .item.even_row.c8 {
            left: 863px
        }

        #data .item.even_row.c9 {
            left: 978px
        }

        #data .item.even_row.c10 {
            left: 1093px
        }

        #data .item.main {
            opacity: 1;
            filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
        }

            #data .item.main a {
                background: url(images/pmaincell.png) -1px 0 no-repeat;
                   
            }

                #data .item.main a:hover {
                    background-position: 0px -130px
                }

            #data .item.main.selected a {
                background-position: 0 -260px
            }

            #data .item.main.create a {
                background-position: -117px 0
            }

                #data .item.main.create a:hover {
                    background-position: -117px -130px
                }

            #data .item.main.create.selected a {
                background-position: -117px -260px
            }

            #data .item.main.build a {
                background-position: -234px 0
            }

                #data .item.main.build a:hover {
                    background-position: -234px -130px
                }

            #data .item.main.build.selected a {
                background-position: -234px -260px
            }

            #data .item.main.test a {
                background-position: -351px 0
            }

                #data .item.main.test a:hover {
                    background-position: -351px -130px
                }

            #data .item.main.test.selected a {
                background-position: -351px -260px
            }

            #data .item.main.deploy a {
                background-position: -468px 0
            }

                #data .item.main.deploy a:hover {
                    background-position: -468px -130px
                }

            #data .item.main.deploy.selected a {
                background-position: -468px -260px
            }

            #data .item.main.monitor a {
                background-position: -588px 0
            }

                #data .item.main.monitor a:hover {
                    background-position: -588px -130px;
                }

            #data .item.main.monitor.selected a {
                background-position: -588px -260px
            }