div.content {
   background-color:rgba(255,255,0,0.2);
    border-style: solid;
    border-color:red;
    border-width: 15px; 
    border-radius: 15px;
/*    background-image: url('/images/pulpito-rot.png');
    background-size:20%;
    background-repeat: no-repeat;
    background-position-x: 90%;*/
box-shadow:  inset 0px 0px 25px 10px rgba(255,225,0,0.74);
max-width:1300px;
margin-left:auto;
margin-right:auto;
}

#pulpito {
    position:absolute;
    left:80%;
   z-index:100;
}

#pulpito img {
   width:90%;  
  
  
}

.foto-modal {
   background-color:rgba(240,240,200);  
}

.content h1 {
    
    color:black;
    font-family: "Gill Sans", sans-serif;
}

div.foto-gallerie {
    display: grid;
    grid-template-columns: repeat(4,22%); 
    /*grid-auto-flow: dense;*/
    gap: 1%;
    justify-content:center;
    max-width:1200px;
    margin-left:auto;
    margin-right:auto;
    padding-bottom:300px;
    visibility: visible;
  
} 
/*4:3*/
.foto-gallerie img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    padding: 0px; 
    margin:0px;
     max-height:none;
    max-width:none;
    aspect-ratio:4/3;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    
}

.foto-gallerie img.gross {
    grid-column: span 2;
    grid-row: span 2;
    background-color:red;
   width: 100%;
    height: 100%;
   
}
/*4:9*/
.foto-gallerie img.hoch {
    grid-row:  span 2;
    grid-column: span 1;
    aspect-ratio:4/6;
    align-self: center;
    justify-self: center;
    object-fit: cover;
    max-height:none;
     width: 100%;
    height: 100%;
  }

.foto-gallerie img.panorama {
    grid-row:  span 1;
    grid-column: span 2;
    aspect-ratio:8/3;
  }
  
  
  
.foto-gallerie img.breit {
    grid-row: span 1;
    grid-column: span 2;
    aspect-ratio:4/6;
   
    
}


.fotoinfo,
.foto-modal .icons
 {
    color:red;
   
}

.foto-modal .icons:hover
 {
  color: orange;
  
}