/* All the container information */

    .container {

    display: grid;
    border-radius: 10px;
    

    grid-template-rows: auto 300px auto auto auto auto;
    
    grid-template-areas:
    "navigation-section"
    "header"
    "content-section-top"  
    "content-section-middle"  
    "content-section-bottom"  
    "content-section-footer"  

   }

   
.photos1 {

    float: right;     
    margin: 20px;
    max-height: 35%;
    max-width: 35%;
    border-radius: 5px;
    min-height: 25%;
    min-width: 25%;
    filter: drop-shadow(1.25em .25em 1.25em rgb(1, 78, 39));
}

.photos2 {

    float: left;     
    margin: 20px;
    max-height: 35%;
    max-width: 35%;
    border-radius: 5px;
    min-height: 25%;
    min-width: 25%;
    filter: drop-shadow(1.25em .25em 1.25em rgb(1, 78, 39));
}

   
   /* Main Page Sections */
   
   .navigation-section {

    grid-area: navigation-section;
    

   

    
    }

    .header {

        grid-area: header;
        padding: 5px;
        

        background-image: url(../site-img/img.jpg);
       
        background-repeat: no-repeat;
        background-size: cover;

        border: solid;
        border-color: #ffffff;
        border-style: solid;
        border-width: 2px;
        border-radius: 10px;

    }

    .content-section-top {

        display: flex;
        grid-area: content-section-top;
       
        padding: 20px;
        padding-top: 0px;
        
     
    }

    .content-section-middle {

        grid-area: content-section-middle;
     
        padding: 20px;
        margin: 8px;
        
       
    }

    .content-section-bottom {

        grid-area: content-section-bottom;
       
        padding: 20px;
        margin: 8px;

    }

    .content-section-footer {

    
        margin: 8px;
        display: flex;
        grid-area: content-section-footer;
     
        border: solid;
        border-color: #ffffff;
        border-style: solid;
        border-width: 2px;
        border-radius: 10px;
    }