﻿
html,body {
    padding:0px;height:100%;margin:0px;
}
.world-holder {
    position:absolute;
    top:0px;
    left:0px;
    right:0px;
    bottom:0px;
    overflow:hidden;
}
.world-holder .description {
    text-align:center;
    display:none;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top:260px;
    font-style:italic;
    color:#0068ac;
    margin-left:-470px;
    width: 940px;
    z-index:1010;
}
.world-holder .links {
    display:none;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left:400px;
    margin-top:-150px;
    width: 200px;
    z-index:190;
}
.world-holder .links .world-menu-item {
    font-family: 'b_ruston47_1.5light';
    font-size:15px;
    display:block;
    cursor:pointer;
    color:#0068ac;
    padding:2px 8px;
    min-width:190px;
}
.world-holder .links .world-menu-item.active {
    background-color:#0068ac;
    border-radius:3px;
    color:White;
}

.imgcontainer {
    display:none;
    position: relative;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left:-500px;
    margin-top:-350px;
}

.imgcontainer img
{
    display:none;
    position: absolute;
    width: 1000px;
    height: 700px;
    top: 0px;
    left: 0px;
    outline: none;
            
}
.imgcontainer img.active {
    display:block;
}

.imgcontainer .click-layers {
    top: 0px;
    left: 0px;
    position:absolute;
    z-index:150;
}
.imgcontainer .click-layers .item {
    position:absolute;
    display:block;
    cursor:pointer;
}

.imgcontainer .click-layers .item img {
    position:relative;
    display:inline;
    top: auto;
    left: auto;
    width: auto;
    height: auto;
}
.introcontainer {
    display:block;
    position: relative;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left:-500px;
    margin-top:-350px;
}
.introcontainer img {
    display:none;
    position:absolute;
}
.introcontainer img.active {
    display:block;
}

#overlaycontrol
{
    /*background-color:Red;*/
    z-index:1000;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    opacity:0;
    filter:alpha(opacity=0); /* For IE8 and earlier */
}
        
    #knap
{
    /*background-color:Red;*/
    z-index:1005;
    position:absolute;
    top:0px;
    left:0px;
}
        
#booble
{
    width:171px;
    height:162px;
    position:absolute;
    top:100px;
    left:500px;
    background-image:url('images/bobble.png');
    visibility:hidden;
    z-index:900;
    text-align:center;
    color:White;
}
#goto 
{
    position:absolute;
    top:200px;
    left:850px;   
    z-index:1100;
}
#loading
{
    /*display:none;*/
        position:absolute;
    z-index:1200;
    font-size:15px;
    background-color:white;
    top:50%;
    left:50%;
    margin-left:-230px;
    margin-top:-50px;
    color:#0068ac;
    text-align:center;
    width:460px;
    height:100px;
}
#loading p {
    color:#0068ac;
    font-style:italic;
    margin-top:15px;
}
#loading .progressbar {
    margin:50px 0px 0px 20px;
}
#loading .progressbar .bar {
    width:420px;
    height:2px;
    position:relative;
    background-color:#e5e5e5;
}
#loading .progressbar .bar .status {
    width:0%;
    background-color:#0068ac;
    height:2px;
}

#loading .progressbar .bar .fader {
    position:absolute;
    width:420px;
    height:2px;
    top:0px;
    background-image:url(/assets/world-loader-overlay.png);
}

@media only screen and (max-height: 745px) {
    .world-holder .links {
        margin-top:-100px;
    }
    .imgcontainer {
        margin-top:-300px;
    }
    .introcontainer {
        margin-top:-300px;
    }
    
    .world-holder .description {
        margin-top:280px;
    }
}

@media only screen and (max-width: 1250px) {
            
    /*#loading {
        margin-left:-350px;
    }*/
    .world-holder .description {
    /*margin-left:-325px;*/
    }
    .world-holder .links {
        margin-left:300px;
    }
    .imgcontainer {
        margin-left:-600px;
    }
    .introcontainer {
        margin-left:-600px;
    }
}
        