.main-header{
    background: rgba(81, 81, 81, 0.85);
    height: 20%;
}
body{
    margin: 0%;
     
    background-color: #cccccc;  
}
h1{
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
margin-left: 8%;

color:white;
margin-top: 0%;
padding: 20px 0;

}

.c-header{
display: inline-block;
margin-left: 8%;
white-space: nowrap;
}

nav{
font-size: 18px;
float:right;
}
nav :hover{
    color: rgb(133, 133, 133);
}

.img{
float:right;
padding: 10px; 
}


.img1{
    float: left;
    padding: 10px;
}



.container{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    text-align: center;
    font-size: 40px;
    color: white;
    width: 80%;
    height: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 20%;
    row-gap: 101px;
    
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    padding: 10px;
    margin-bottom: 40px;
    }

    
    .el--1{
        grid-column: 1;
        grid-row: 1;
        /* background-color: #515151; */
        /* opacity: 85%; */
        background: rgba(81, 81, 81, 0.85);/*  like that the opacity only affects the background and not pictures, text,...*/
        font-size: 20px;
        text-align: left;
        padding: 15px 25px;
    }

    .el--2{
        grid-column: 2;
        grid-row: 1;
        background: rgba(81, 81, 81, 0.85);
        font-size: 20px;
        text-align: left;
        padding: 15px 20px;
    }
    .el--3{
        grid-column: 1;
        grid-row: 2;
        background: rgba(81, 81, 81, 0.85);
        font-size: 20px;
        text-align: left;
        padding: 15px 20px;
    }
    .el--4{
        grid-column: 2;
        grid-row: 2;
        background: rgba(81, 81, 81, 0.85);
        font-size: 20px;
        text-align: left;
        padding: 15px 20px;
    }

    a{
        color: white;
    }
    

    @media only screen and (max-width: 600px) {


    .container{
            
    
    
   /*  height: auto; */
    display:block;
    align-items: center;
    column-gap: 10px;
    row-gap: 101px;
    
    margin-bottom: 50px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    padding: 10%;
    margin-bottom: 40px;

        }
    }