/* 
 * 3DCityDB-Web-Map
 * http://www.3dcitydb.org/
 * 
 * Copyright 2015 - 2017
 * Chair of Geoinformatics
 * Technical University of Munich, Germany
 * https://www.gis.bgu.tum.de/
 * 
 * The 3DCityDB-Web-Map is jointly developed with the following
 * cooperation partners:
 * 
 * virtualcitySYSTEMS GmbH, Berlin <http://www.virtualcitysystems.de/>
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *     http://www.apache.org/licenses/LICENSE-2.0
 *     
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

.infobox-full {
    position: fixed;
    top: 45px;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    /*    max-height: none;
        max-width: none;*/
    overflow: hidden;
    z-index: 9999;
}

.infobox-full iframe {
    max-height: 100%!important;
    height: 100%;
}

.infobox-full-ios {
    overflow: auto!important; 
    -webkit-overflow-scrolling: touch!important;
}

.infobox-full-ios iframe {
    min-height: 100%;
    max-width: 100%;
}

/*------------------------------------------------------*/
.uiMenu-full {
    max-height: 77vh!important;
    width: 95vw!important;
    overflow: hidden;
    position: absolute;
    margin-top: 15px;
}

.uiMenu-full-ios {
    overflow: auto!important; 
    -webkit-overflow-scrolling: touch!important;
}

.toolbox-full {
    width: 98%!important;
}

.citydb_long_container-full {
    margin-left: 0!important;
    margin-right: 0!important;
}

.citydb_short_container-full {
    width: 50%!important;
}

/*------------------------------------------------------*/
.distance-legend-mobile {
    position: absolute;
    bottom: 35px;
    right: 0%;
}

.loadingIndicator-tile-mobile {
    display: none;
    height: 3px;
    width: 100%;
    position: absolute;
    bottom: 0%;
    overflow: hidden;
    background-color: white;
}
.loadingIndicator-tile-mobile:before{
    display: block;
    position: absolute;
    content: "";
    left: -200px;
    width: 200px;
    height: 3px;
    background-color: #0074D9;
    animation: loading 1s linear infinite;
}
@keyframes loading {
    from {left: -200px; width: 30%;}
    50% {width: 30%;}
    70% {width: 70%;}
    80% {left: 50%;}
    95% {left: 120%;}
    to {left: 100%;}
}

/*------------------------------------------------------*/
.loadingIndicator-mobile {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -25px;
    margin-top: -50px;
    width: 50px;
    height: 100px;
    text-align: center;
    font-size: 25px;
}

.loadingIndicator-mobile > div {
    background-color: white;
    height: 100%;
    width: 5px;
    margin: 2px;
    display: inline-block;
    -webkit-animation: sk-stretchdelay 0.6s infinite ease-in-out;
    animation: sk-stretchdelay 0.6s infinite ease-in-out;
}

.loadingIndicator-mobile .rect1 {
    opacity: 10%;
    -webkit-animation-delay: -0.55s;
    animation-delay: -0.55s;
}

.loadingIndicator-mobile .rect2 {
    opacity: 40%;
    -webkit-animation-delay: -0.5s;
    animation-delay: -0.5s;
}

.loadingIndicator-mobile .rect3 {
    opacity: 70%;
    -webkit-animation-delay: -0.45s;
    animation-delay: -0.45s;
}

.loadingIndicator-mobile .rect4 {
    opacity: 100%;
    -webkit-animation-delay: -0.4s;
    animation-delay: -0.4s;
}

@-webkit-keyframes sk-stretchdelay {
    0%, 40%, 100% { -webkit-transform: scaleY(0.2) }  
    20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
    0%, 40%, 100% { 
        transform: scaleY(0.2);
        -webkit-transform: scaleY(0.2);
    }  20% { 
        transform: scaleY(1.0);
        -webkit-transform: scaleY(1.0);
    }
}

.cesium-widget-errorPanel-content-mobile {
    max-width: 80%!important;
    max-height: 70%!important;
}

/*------------------------------------------------------*/
.splash-wrapper-mobile {
    top: 2%!important;
    right: 2%!important;
    bottom: 2%!important;
    left: 2%!important;
    width: 96%!important;
    max-width: 96%!important;
    height: 96%!important;
    max-height: 96%!important;
    padding: 0!important;
    margin: 0!important;
    border-radius: 0.3rem!important;
}
.splash-wrapper-mobile-ios {
    overflow: auto!important;
    -webkit-overflow-scrolling: touch!important;
}
.splashscreen-buttons-mobile {
    right: 3%!important;
    bottom: 3%!important;
}