html, body, #background ,#background_alt, #loading {
   width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
}

body {
   font-family: 'open sans',verdana;
   background-color: black;
   color: #999999;
}

#loading{
   display: none;
   //background-image: url('../img/spinner.gif');
   //background-repeat: no-repeat;     
   //background-position: center;
   
   // Make the background a tiny bit transparent. That results in that the Cesium is rendered.
   // Which is needed to make our performance mesurement, in order to deside which background to display.
   background-color: rgba(0, 0, 0, 0.99);

   // The following lines needed for css spinnter. We don't use it is not supported by old IE versions.
   //display: flex;
   //align-items: center;
   //justify-content: center;
   //height: 100vh;
   
   // z-index -1 only seems to work with postion absolute.   
   position:absolute;
   z-index: -1;
}

#background{
   display: none;
   
   // z-index -1 only seems to work with postion absolute. 
   position:absolute;
   z-index: -2;
}

#background_alt{
   display:none;
   background-image: url('../img/background_alt.jpg');
   background-size: cover;
   background-position: center;
}

/* Menu */
#menu{
   display:none;
   position: fixed;
   top: 100px;
   left: 25px;
}
    
/* Quote */
#quote{
   z-index: 1;
   width: 100%;
   position: absolute;
   bottom: 1cm;
   font-size: 11px;
   font-weight: bold;
   text-align: center;
}

/* Links */
a:link, a:visited, a:active { 
   color: #999999; 
   text-decoration: none;  
}

a:hover { 
   color: #66FF99;
}

a:focus { 
   outline: 0;
}

/* Outer left pannel */
#outer_left{
   position: fixed;
   top: 28px;
   left: 0px;
}

#left{
   position: fixed;
   top: 0px;
   left: 0px;
   z-index: 10;
}
      
/* Buttons for menu hiding are configured in the navigation_xyz.css files */
      
/* Logo here we have two alternative set of logos
depending if we are on the start page our in a 
gallery */

/* Logo konstanczer.de text */
#logo_k{
   position: absolute;
   top: 35px;
   left: 25px; 
}

#logo_o{
   position: absolute;
   top: 35px;
   left: 43px;
}

#logo_n{
   position: absolute;
   top: 35px;
   left: 61px;
}

#logo_s{
   position: absolute;
   top: 35px;
   left: 79px;
}

#logo_t{
   position: absolute;
   top: 35px;
   left: 97px;
}

#logo_triangle{
   position: absolute;
   top: 30px;
   left: 107px;            
}

#logo_n2{
   position: absolute;
   top: 35px;
   left: 146px;
}

#logo_c{
   position: absolute;
   top: 35px;
   left: 164px;            
}   

#logo_z{
   position: absolute;
   top: 35px;
   left: 182px;
} 

#logo_e{
   position: absolute;
   top: 35px;
   left: 200px;            
}       

#logo_r{
   position: absolute;
   top: 35px;
   left: 218px;
} 

#logo_dot{
   position: absolute;
   top: 43px;
   left: 235px;
}    

#logo_d{
   position: absolute;
   top: 35px;
   left: 242px;
} 

#logo_e2{
   position: absolute;
   top: 35px;
   left: 260px;
} 

/* Small world */
#world{
   position: absolute;
   top: 15px;
   left: 25px; 
}

/* Picture gallery */
.royalSlider { 
   display:none; 
}