html, body {
    height:100%;
    width:100%;
    border:0;
    margin:0;
    padding:0;
}

#distance { 
    width:1px;
    height:50%;
    margin-bottom:-275px; /* half of container's height */
    float:left;
}

#mainContainer {
    margin:auto;
    position:relative; /* puts container in front of distance */
    text-align:left;
    height:550px;
    width:1000px;
    clear:left;
    padding:0;
}

    /* Corner with logo */
    #cornerTopRight {
        position:absolute;
        top:-15px;
        right:-15px;
        
        width:220px;
        height:180px;
        
        z-index:30;

        background-repeat:no-repeat;
    }
    
    /* content div */
    #content {
        position:absolute;
        top:0px;
        left:100px;
        width:655px;
        height:548px;
    }
    
    /* handwrited font */
    #transferFont {
        position:absolute;
        top:5px;
    }

    /* main menu */
    #mainMenuContainer {
        position:absolute;
        top:130px;
        left:0px;
        width:100%;
    }

    .menu {
        text-decoration:none;
        color:#000000;
    }
    .menu:hover {
        text-decoration:none;
        color:#999999;
    }
    .menuActive {
        text-decoration:none;
        color:#999999;
    }

        /* image Menu */
        .mainMenu {
            position:relative;
            float:left;
            height:19px;
        }
            .mainMenuImage {
                border:0;
                float:left;
            }
        
        /* text Menu */
        .mainMenuText {
            float:left;
            height:13px;
            margin-right:20px;
        }
        
            
    /* sub menu */
    #subMenuContainer {
        position:absolute;
        top:152px;
        left:0px;
        width:100%;
    }

        /* image Menu */
        .subMenu {
            position:relative;
            float:left;
            height:19px;
        }
            .subMenuImage {
                border:0;
                float:left;
            }

        /* text Menu */
        .subMenuText {
            float:left;
            height:11px;
            margin-right:10px;
        }

        
    /* content */
    #shortContent {
        position:absolute;
        top:180px;
        left:1px;
        width:100%;
        height:150px;
    }
        #shortContentText {
            height:155px;
            width:100%;
            overflow:hidden;
        }

        #shortContentMore {
            text-align:right;
        }
            
    #fullContent {
        display:none;
        position:absolute;
        top:180px;
        left:1px;
        width:100%;
        height:330px;
    }
        #fullContentText {
            height:323px;
            width:100%;
            overflow:auto;
        }
        #fullContentLine {
            position:absolute;
            bottom:0px;
    
            width:100%;
            height:2px;
        }
        
    /* coloured lines */
    #lineTop {
        position:absolute;
        top:122px;

        width:100%;
        height:1px;
    }
    #lineBottom {
        position:absolute;
        top:357px;

        width:100%;
        height:1px;
    }
        .line {
            border-top-style:solid;
        }
    
    #bigImageContainer {
        position:absolute;
        top:377px;
        left:0px;
        width:700px;
        height:95px;
        padding:0;
    }
        .bigImage {
            width:95px;
            height:95px;
            max-width:95px;
            max-height:95px;
            margin-right:41px;
            float:left;
            padding:0;
            border:1px solid #ffffff;
        }
        
        .bigImage img {
            max-width:95px;
            max-height:95px;
        }
        
        .droppable-active {
            border:1px solid #aaaaaa;
        }
        
        .droppable-hover {
            border:1px solid #666666;
        }
    
    #smallImageContainer {
        position:absolute;
        top:489px;
        left:0px;
        width:647px;
        height:20px;
        padding:0;
        overflow:hidden;
    }
        .smallImage {
            width:20px;
            height:20px;
            margin-right:7px;
            float:left;
        }
    
    #silhouette {
        position:absolute;
        bottom:0px;
        right:0px;
        width:200px;
        height:300px;
        z-index:20;
    }
    
    #infoBox {
        display:none;
        position:absolute;
        top:361px;
        left:0px;
        width:640px;
        height:150px;
        padding:4px;
    }
        #infoBoxClose {
            position:absolute;
            top:0px;
            right:0px;
            
            width:12px;
            height:12px;
            
            cursor:pointer;
            
            background-image:url("../images/close.jpg");
        }
    
    #info {
        position:absolute;
        top:524px;
        left:0px;
    }
    
    #copyright {
        position:absolute;
        top:524px;
        right:0px;
    }
    
    /* debug div */
    #preloadDiv {
        display:none;
        position:absolute;
        bottom:0px;
        left:0px;
    }
    
    /* shadows */
    #shadowTop {
        position:absolute;
        top:-15px;
        left:0px;
        
        width:100%;
        height:15px;
        
        z-index:10;

        background-image:url("../images/shadowTop.jpg");
        background-repeat:repeat-x;
    }
    
    #shadowRight {
        position:absolute;
        top:0px;
        right:-15px;
        
        width:15px;
        height:100%;
        
        z-index:10;

        background-image:url("../images/shadowRight.jpg");
        background-repeat:repeat-y;
    }
    
    #shadowBottom {
        position:absolute;
        bottom:-15px;
        left:0px;
        
        width:100%;
        height:15px;
        
        z-index:10;

        background-image:url("../images/shadowBottom.jpg");
        background-repeat:repeat-x;
    }
    
    #shadowLeft {
        position:absolute;
        top:0px;
        left:-15px;
        
        width:15px;
        height:100%;
        
        z-index:10;

        background-image:url("../images/shadowLeft.jpg");
        background-repeat:repeat-y;
    }
    
    #shadowTopLeft {
        position:absolute;
        top:-15px;
        left:-15px;
        
        width:30px;
        height:15px;
        
        z-index:10;

        background-image:url("../images/shadowTopLeft.jpg");
        background-repeat:no-repeat;
    }
    
    #shadowBottomRight {
        position:absolute;
        bottom:-15px;
        right:-15px;
        
        width:15px;
        height:15px;
        
        z-index:10;

        background-image:url("../images/shadowBottomRight.jpg");
        background-repeat:no-repeat;
    }

    #shadowBottomLeft {
        position:absolute;
        bottom:-15px;
        left:-15px;
        
        width:30px;
        height:15px;
        
        z-index:10;

        background-image:url("../images/shadowBottomLeft.jpg");
        background-repeat:no-repeat;
    }