/* Just some base styles not needed for example to function */
*, html {
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

body, form, ul, li, p, h1, h2, h3, h4, h5 {
    margin: 0;
    padding: 0;
}

body {
    background-color: #606061;
    color: #000000;
    margin: 0;
}

img {
    border: none;
}

p {
    font-size: 1em;
    margin: 0 0 1em 0;
}

html {
    font-size: 100%; /* IE hack */
}

body {
    font-size: 1em; /* Sets base font size to 16px */
}

table {
    font-size: 100%; /* IE hack */
}

input, select, textarea, th, td {
    font-size: 1em;
}

/* CSS Tree menu styles */
ol.tree {
    padding: 0 0 0 30px;
    
}

li {
    position: relative;
    margin-left: -15px;
    list-style: none;
}

    li.file {
        margin-left: -1px !important;
    }

        li.file a {
            background: url(../images/document.png) 0 0 no-repeat;
            color: #fff;
            padding-left: 21px;
            text-decoration: none;
            display: block;
        }

            li.file a[href *= '.pdf'] {
                background: url(../images/document.png) 0 0 no-repeat;
            }

            li.file a[href *= '.html'] {
                background: url(../images/document.png) 0 0 no-repeat;
            }

            li.file a[href $= '.css'] {
                background: url(../images/document.png) 0 0 no-repeat;
            }

            li.file a[href $= '.js'] {
                background: url(../images/document.png) 0 0 no-repeat;
            }

    li input {
        position: absolute;
        left: 0;
        margin-left: 0;
        opacity: 0;
        z-index: 2;
        cursor: pointer;
        height: 1em;
        width: 1em;
        top: 0;
    }

        li input + ol {
            background: url(../images/toggle-small-expand.png) 40px 0 no-repeat;
            margin: -30px 0 0 -44px; /* 15px */
            height: 1em;
        }

            li input + ol > li {
                display: none;
                margin-left: -14px !important;
                padding-left: 1px;
            }

    li label {
        background: url(../images/folder-horizontal.png) 15px 1px no-repeat;
        cursor: pointer;
        display: block;
        padding-left: 37px;
    }

    li input:checked + ol {
        background: url(../images/toggle-small.png) 40px 5px no-repeat;
        margin: -1.25em 0 0 -44px; /* 20px */
        padding: 1.563em 0 0 80px;
        height: auto;
    }

        li input:checked + ol > li {
            display: block;
            margin: 0 0 0.125em; /* 2px */
        }

            li input:checked + ol > li:last-child {
                margin: 0 0 0.063em; /* 1px */
            }