*
{
    margin: 0;
    padding: 0;
    border: 0;
}

html
{
    width: 100%;
    height: 100%;
}

body.js
{
    width: 100%;
    height: 100%;
    color: #222;
    background-image: url("/assets/templates/template02/background.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-color: #000;
    font-family: Arial, Verdana, sans-serif;
    font-size: 14px;
    overflow: hidden;
    overflow-y: scroll;
}

/* Menu */

.js #menu
{
    position: absolute;
}

.js #menu ul
{
    list-style-type: none;
}

.js #menu ul li
{
    display: block;
    float: left;
    padding: 0 10px;
}

.js #menu ul li a
{
    display: block;
    padding: 5px 0;
    color: #eee;
    font-size: 18px;
    text-decoration: none;
    outline: 0;
}

.js #menu ul li a:hover
{
    color: #fff;
    text-shadow: 0 0 7px #fff;
}

.js #menu ul li.space
{
    color: #eee;
    font-size: 18px;
    padding: 4px 5px 6px 5px;
}

/* Layout */

.js #container
{
    position: absolute;
    width: 820px;
    height: 620px;
    background: url("/assets/templates/template02/container_small.png") no-repeat;
    overflow: hidden;
    overflow-y: hidden;
}

.js #container.big
{
    background: url("/assets/templates/template02/container_big.png") no-repeat;
}

.js #container .page
{
    position: absolute;
    top: 35px;
    left: 35px;
    width: 520px;
    height: 550px;
}

.js #container.big .page
{
    width: 750px;
}

.js #container #sidebar
{
    position: absolute;
    top: 35px;
    right: 65px;
    width: 150px;
    height: 550px;
}

.js #close
{
    position: absolute;
    top: 20px;
    right: 250px;
    width: 16px;
    height: 16px;
    background: url("/assets/templates/template01/x.png") no-repeat;
    cursor: pointer;
}

.js #up
{
    position: absolute;
    bottom: 40px;
    right: 250px;
    width: 16px;
    height: 16px;
    background: url("/assets/templates/template01/up.png") no-repeat;
    cursor: pointer;
}

.js #down
{
    position: absolute;
    bottom: 20px;
    right: 250px;
    width: 16px;
    height: 16px;
    background: url("/assets/templates/template01/down.png") no-repeat;
    cursor: pointer;
}

.js #container.big #close, .js #container.big #up, .js #container.big #down
{
    right: 50px;
}

/* Side Buttons */

#up2, #down2, #left2, #right2
{
    position: absolute;
    width: 40px;
    height: 40px;
    cursor: pointer;
}

#up2
{
    bottom: 10px;
    background: url("/assets/templates/template01/up2a.png") no-repeat;
}

#up2:hover
{
    background-image: url("/assets/templates/template01/up2b.png");
}

#down2
{
    top: 10px;
    background: url("/assets/templates/template01/down2a.png") no-repeat;
}

#down2:hover
{
    background-image: url("/assets/templates/template01/down2b.png");
}

#left2
{
    right: 10px;
    background: url("/assets/templates/template01/left2a.png") no-repeat;
}

#left2:hover
{
    background-image: url("/assets/templates/template01/left2b.png");
}

#right2
{
    left: 10px;
    background: url("/assets/templates/template01/right2a.png") no-repeat;
}

#right2:hover
{
    background-image: url("/assets/templates/template01/right2b.png");
}