body{
    background-image: url("../img/daniele-turturici-chilling-on-the-terrace.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0;

    a{
        color: white;
    }

    .page{
        font-family: sans-serif;
        padding: 0;
        max-width: 700px;
        margin: auto;

        header{
            padding: 1rem;
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            flex-wrap: wrap;
            position: sticky;
            top: -1px;
            z-index: 9;
            transition: all 0.25s ease;

            &.is-pinned{
                background: #30392e;
                padding: 5px;
                h1{
                    margin: 5px;
                }
            }

            h1{      
                color: white;
                svg{
                    fill: white;
                    height: 1rem;
                    width: 1rem;
                    cursor: pointer;
                }
            }

            nav{
                display: flex;
                align-items: center;
                gap: 10px;

                a{      
                    color: white;
                    text-decoration: none;
                }
                
            }
        }

        section,
        footer{
            padding: 1rem;
            backdrop-filter: blur(5px);
            color: black;
            background-color: #caffca66;
            margin: 5px;
        }

        section{

            pre.code{
                padding: 5px;
                background-color: #85a885;
                overflow: auto;
            }

            #members{
                #webringulist{
                    display: flex;
                    justify-content: center;

                    table{
                        --table-border: 1px solid black;
                        width: 100%;
                        border-collapse: collapse;
                        border-bottom: var(--table-border);

                        th, td{
                            border-top: var(--table-border);
                            border-inline: var(--table-border);
                            text-align: center;
                        }
                    }
                }
            }
        }
    }
}