.aspect
{
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    overflow:hidden;                                
    }
            
.aspect.ratio1x1
    {
         
    padding-bottom: 50%;
        }   
        
.aspect .inner
{
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;

    padding-left:0.8em;
    padding-right:0.8em;
    padding-bottom:0.8em;
    
    display:flex;
    justify-content:flex-start;
    align-items:flex-end;  
    
    background-color:rgba(58,162,0,0.0);
    transition: background-color 0.2s;
    }

section .portrait
{
    flex:100%;
    max-width:100%;
        
    display:flex;
    flex-direction:column;

    }
    
 
    
@media (max-width: 800px) {


    section .portrait
    {
    flex:100%;
    max-width:100%;
    margin-bottom:25px;

    }

}  


    
section .portrait .imageWrapper
{
    width:100%;
    height:auto;
    margin-bottom:25px;
    position:relative;
    }  
    
.portrait .imageWrapper img.background
{
   
    width:100%;
    height:100%;

    position:absolute;

    z-index:1;

    }     
    
.portrait .imageWrapper .pic
{

    border-radius: 50%;
    width:90%;
    height:inherit;
    
   
    margin-left:5%;

    margin-top:8%;

    position:relative;
    top:0px;
    z-index:10;

    }
    
@media (min-width: 1500px) {


    section .portrait .imageWrapper .pic
    {
    margin-left:15%;
    margin-top:15%;
    margin-top:8%;
    margin-bottom:5%;
    width:70%;

    }

} 



.portrait .imageWrapper .laraBento {
    background-image: url('../Pix/Portrait.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 102%;
}

.portrait .imageWrapper .laraBento:hover {
}

.portrait .imageWrapper .martinPrigge {
    background-image: url('../Pix/Portrait.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 102%;
}

.portrait .imageWrapper .martinPrigge:hover {
}

.portrait .imageWrapper .yannickDruenkler {
    background-image: url('../Pix/Portrait.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 102%;
}

.portrait .imageWrapper .yannickDruenkler:hover {
} 

.portrait .imageWrapper .sarahAckermann
{
    background-image: url('../Pix/SarahAckermann.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size: 102%;
    }
    
.portrait .imageWrapper .sarahAckermann:hover
{

    } 
    
 .portrait .imageWrapper .saleemSadiq
{
    background-image: url('../Pix/SaleemSadiq.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size: 102%;
    }
    
.portrait .imageWrapper .saleemSadiq:hover
{

    } 
    

 
    
.portrait .imageWrapper .christinaLehmann
{
    background-image: url('../Pix/ChristinaLehmann.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size: 102%;
    }
    
.portrait .imageWrapper .christinaLehmann:hover
{

    } 
    

    
  .portrait .imageWrapper .berndGiesecke
{
    background-image: url('../Pix/BerndGiesecke.jpg');
    background-repeat:no-repeat;
    background-position:center;
    background-size: 102%;
    }
    
.portrait .imageWrapper .berndGiesecke:hover
{

    }   
    
.portrait .imageWrapper .portrait
{
    background-image: url('../Pix/portrait.png');
    background-repeat:no-repeat;
    background-position:center;
    background-size: 102%;
    }
    
.portrait .imageWrapper .portrait:hover
{

    }       
    
 section .portrait .textWrapper
 {
    background-color: rgba(255, 252, 247, 0.8);
    min-height:8em;
    min-height:5em;
    
    position:relative;
    
    border:0px solid blue;
     }   
     
section .portrait .textWrapper p
{
    background-color:transparent;
    margin-top:0.5em;
    margin-bottom:0.5em;
    line-height:1em;
    
    }