/* Applies for everything */

    body {
        background-image: url(../pic/background.png);
        background-size: 150px;
        font-family: Arial;
        text-align: justify;
        font-size: 16px;
        line-height: 25px;
    }

    .container {
        max-width: 1000px;
        margin-left: auto;
        margin-right: auto;
        display: grid;
        grid-gap: 10px;
        grid-template-columns: 600px 390px;
    }

/* basic colorcoding & padding + border fun for everything */

    header, .textbox, .facts, .gallery, footer {
        padding: 5px;
    }

    h2, h3, p, .textbox, .facts, .gallery, footer {
        background-color: #CDC1FF;
        padding-left: 5px;
        padding-right: 5px;
    }

    .textbox, .facts, .gallery, footer {
        border: #CDC1FF 2px solid;
        border-radius: 5px; 
    }

    h2 {
        font-size: 25px;
        text-align: center;
    }

/* Everything inside the header */

    header {
        grid-row: 1 / 2;
        grid-column: 1 / 3;
        background-color: #F5EFFF;
        border: #F5EFFF 2px solid;
        border-radius: 5px;
    }

    h1 {
        font-size: 32px;
        text-align: center;
        grid-row: 1 / 2;
        grid-column: 1 / 2;
    }
/* Everything inside the Main */

    .textbox {
        grid-row: 2 / 3;
        grid-column: 1 / 2; 
        height: max-content;
    }

    .facts {
        grid-row: 2 / 3;
        grid-column: 2 / 3; 
        height: max-content;
        grid-gap: 10px;
    }

    table {
        border: black 1px solid;
    }

    th {
        float: left;
        padding-right: 5px;
    }
  
    td {
        padding-bottom: 5px;
    }

/* Everything inside the Gallery tab */

    .gallery {
        grid-row: 3 / 4;
        grid-column: 1 / 3;
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
    }

    .gallery h2 {
        width: 1000px;
    }

    .pictures {
        margin-left: 12.5px;
        width: 150px;
    }


    .pictures a {
        width: 150px;
        height: 150px;
        border: 1px solid #5a5a5a;
        border-radius: 2px;
        padding: 5px;
        background-color: #e5daf2;
        display: flex;
        justify-content: center;
        box-sizing: border-box;
    }


    .pictures img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

    .description {
        margin: 0;
        text-align: center;
    }

/* Everything inside the Footer */

    footer {
        grid-row: 4 / 5;
        grid-column: 1 / 3;
        height: max-content;
    }