.about {
    position: absolute;
    margin-top: 120px;
    margin-left: 50%;
    transform: translateX(-50%);
    font-family: Arial, Helvetica, sans-serif;
    color: var(--clr-green);
    width: 80%;
    background-color: rgba(16, 7, 100, 0.562);
    padding: 10px;
    border-radius: 15px;
    margin-bottom: 5px;
    
    
}
.about h1     {
    text-align: center;
    font-size: 24px;
    color: cyan;
    margin-bottom: 5px;
}
.about h2     {
    font-size: 17px;
    text-align: justify;
    color: rgb(180, 231, 214); 
}
.image {
    position: relative;
    display: flex;
    float: left;
    width: 460px;
    border-radius: 4%;
    box-shadow: inset 0 0 0.5em 0 var(--clr-neon), 0 0 0.5em 0 var(--clr-neon);
    margin-right: 10px;
    
}
.about h3 {
    margin-top: -5px;
    font-size: 17px;
    text-align: justify;
    color: rgb(180, 231, 214);   
}

@media screen and (max-width: 900px) {
    .image {
        width: 400px;  
        margin-left: 50%;
        transform: translateX(-50%);
        margin-bottom: 8px;  
    } 
    .about h2     {
        text-align: center;
        word-spacing: large; 
    }
    .about h3     {
        text-align: center;
        word-spacing: large; 
    }
}
@media screen and (max-width: 600px) {
    .image {
        width: 340px; 
        margin-left: 50%;
        transform: translateX(-50%); 
    }   
}
@media screen and (max-width: 500px) {
    .image {
        width: 300px; 
        margin-left: 50%;
        transform: translateX(-50%); 
    }   
}

.puffer 
{
    position: absolute;
    margin-top: 1050px;
    margin-left: 50%;
    transform: translateX(-50%);
    width: 50%;
    height: 200px;   
}
@media screen and (max-width: 1800px) {
    .puffer { margin-top: 1150px; }
}
@media screen and (max-width: 1600px) {
    .puffer { margin-top: 1400px; }
}
@media screen and (max-width: 1300px) {
    .puffer { margin-top: 1700px; }
}
@media screen and (max-width: 1000px) {
    .puffer { margin-top: 2000px; }
}
@media screen and (max-width: 900px) {
    .puffer { margin-top: 2200px; }
    
}
@media screen and (max-width: 750px) {
    .puffer { margin-top: 2500px; }
}
@media screen and (max-width: 650px) {
    .puffer { margin-top: 3100px; }
}
@media screen and (max-width: 550px) {
    .puffer { margin-top: 3750px; }
}
@media screen and (max-width: 450px) {	
    .puffer { margin-top: 4100px; }	
    
}