body {
    background-image: url("IMG/enchantedGlade.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

#main {
    display: flex;
    justify-content: center;
    zoom: 0.9;

    table {
        margin-top: 100px;
        width: 1400px;

        tr {
            td {
                border: 4px outset #DDDDDD;
                width: 670px;
                background: rgb(50, 50, 50, 0.85);
                transition: scale .5s;
                padding-right: 10px;

                div {
                    display: flex;

                    p {
                        color: #DDDDDD;
                        font-size: 22px;
                        font-family: "SN Pro", sans-serif;
                        padding: 5px;
                        margin-top: -2px;

                        .golden {
                            font-family: "SN Pro", sans-serif;
                            font-size: 30px;
                            color: goldenrod;
                            font-weight: bold;
                        }
                    }
                }
            }

            .filler {
                width: 60px;
                height: 50px;
                border: 0;
                background: none;
            }
        }

        tr:nth-child(1) {
            img {
                margin-left: 25px;
                margin-right: 25px;
                width: 175px;
                height: 175px;

            }

            td {
                height: 250px;
            }
        }

        tr:nth-child(3) {
            img {
                margin-left: 25px;
                margin-right: 25px;
                width: 150px;
                height: 150px;
            }

            td {
                height: 200px;
            }

            td:hover {
                transition: scale .5s;
                scale: 1.05;
                cursor: pointer;
            }


            td:nth-child(3) {
                img {
                    margin-left: 25px;
                    margin-right: 25px;
                    width: 160px;
                    height: 160px;
                }
            }
        }
    }

    .imgBorder {
        border: 5px solid blue;
        border-radius: 50%;
    }
    #creatorCode {
        padding: 10px;
        display: flex;
        justify-content: center;
        position: absolute;
        top: 700px;
        height: fit-content;
        width: fit-content;
        border: 0;
        background: none;
        text-align: center;

        img {
            margin: 10px;
            width: 225px;
            height: 225px;
        }

        span {
            text-shadow: #000 5px 5px 5px;
            font-size: 30px;
            font-family: "LuckiestGuy", sans-serif;
            color: rgb(180, 250, 180);
            line-height: 40px;
            margin-top: 35px;
            transition: font-size .2s;
        }

        #code:hover {
            cursor: pointer;
            font-size: 110%;
            transition: font-size .2s;
        }
    }
}