/*! This css-file has been copied from Klaumis Netz-Welt - http://www.klaumikli.de
Last changes: May 2, 2022 */


/*** special styles for maps with Openlayer and OSM***/

    #mymap {
    display: block;
    width:99%; 
    height: 400px; 
    z-index: 0;
    }
    
    /* for maps-menu */
    .olControlAttribution {
        top: 380px; 
        right: 5px;
    }

/*** special styles for text- & photo-pages with focus lightboxes***/   

    .fotohori img {
        padding: 0;
	    margin: 0;
	    margin-bottom: 10px;
	    width: 100%; 
        height: auto;
        }

    .fotohori button {
        position: relative;
        border-style: none;
        background:none
    }
   
    .fotohori button:hover img {
        border-style: solid; 
        border-color: #d85d5d;
    }
    
    .fotohori button:focus img {
	position: fixed;
        border: 1em solid #eee;
        width: 90%;
        max-height: 99vh;
	left: 5%;
	top: 2%;
	z-index: 2000;          /* ol css has z-indeces > 1000 */
	transition: all 1s;
    }    

    .fotoverti button {
        position: relative;
        border-style: none;
        margin-left: 20%;
        width: 60%;
        height: auto;
        background: none;
    }
    
    .fotoverti button img {
        padding: 0;
	margin: 0;
        margin-bottom: 10px;
        border-style: none;
        width: 100%; 
        height: auto;
    }
   
    .fotoverti button:hover img {
        border-style: solid; 
        border-color: #d85d5d;
    }
    
    .fotoverti button:focus img {
        position: fixed;
        border: 1em solid #eee;
        width: auto;
        height: 95%;
        left: 24%;
	top: 0%;
	z-index: 2000;                  /* ol css has z-indeces > 1000 */
	transition: all 1s;
    }    
    
@media (max-width: 849px) {
     .fotohori button:focus img {
         width: 99%;
	 position: relative;
	 left: 0;
	 top: 0;
	 border: 0; 
	 border-style: none;
	 transition: none;
	 }
	
      .fotoverti button:focus img {
         width: auto;
         height: 80%;
	 position: fixed;
	 border: 0.5em solid #eee;
	 left: 25px;
	 right: 0;
	 top: 134px;
	 }
    }