:root {
        --g:rgb(48, 47, 47);
        --dg:rgb(27, 27, 28);
        --wh: rgb(255, 254, 254);
}

body{
          font-family: "Redaction 50", serif;
          font-size: 1.1em;
            max-width: 1200px;
            margin: 0 auto;
            background: linear-gradient(90deg, var(--dg), var(--g));
            color: var(--dg);
        }

* {
    cursor: url("img/cursor.png"), auto;
}

        main{
            background-color: var(--wh);
            overflow:hidden;
            margin: 60px 0px 0px 0px;
            padding: 10px;
            border: solid var(--dg) 1.5px;
        }

        table{
            overflow:hidden;
           width: 100%;
            }

            tr{
           display: flex;  
           gap: 5px;
            }

            th{
                border: solid var(--dg) 1.5px;
                width: 100%;
                padding:10px;
                vertical-align: top;
                font-weight: normal;
                text-align: left;
            }

        h1 {
            margin: 2px 0px 3px 0px !important;
        }

        b
        {
            background: linear-gradient(90deg, var(--dg), #b3b2b2);
            color: transparent;
            background-clip: text;
            transition: letter-spacing 0.4s, color 0.4s;

        }
        
        b:hover {
            letter-spacing: 0.2em;
        }

        a{
            text-decoration: none;
            color: inherit;
            transition: font-size 0.4s, color 0.4s;}

        a:hover{
            font-size: 20px;
        }

        footer{ 
            text-align: center;
            margin-top: 10px;    
        }

/* Moba */

img{
    max-width: 100%;
}

@media (max-width: 600px){
    main{
        margin: 8px;
        padding: 6px;
    }

    section{
        padding: 10px 12px;
    }

    tr{
        flex-direction: column;
    }

    th .button,
    th button{
        margin-top: 4px;
    }

    th img[height]{
        max-height: 250px;
        width: auto;
    }

}