body {
            font-family: Arial, sans-serif;
            margin: 40px;
            background-color: #f9f9f9;
        }
        .wrapper{
            margin: 0 auto;
            width: 1000px;
        }
        h1, h4, h5, th {
            color: #900000;
        }
        .tile-block {
            background-color: #fff;
            padding: 20px;
            margin-bottom: 40px;
            border-radius: 8px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        table .article-table{
            padding: 50px;
            border-collapse: collapse;
            margin-top: 15px;
            margin-left: 50px;
            margin-right: 50px;
            border-radius: 8px;
            font-size: small;
            height: 300px;
            width: 420px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
        }
        th, td .article-table{
            background-color: #eee;
            border: 1px solid #fff;
            padding: 10px;            
        }
        th .article-table{
            text-align: center;
        }
        .features {
            margin-top: 10px;
            padding: 15px;
        }
        .features li {
            margin-bottom: 5px;
            font-size: small;
        }
        .logo {
            min-width: 300px !important;
            padding: 15px;
        }
        .flex-container {
            display: flex;
            
        }
        .producent {
            font-size: small;
            padding: 15px;      
        }
        .dachowka {
            width: 175px;
            padding: 15px;   
        }
        .opinia {
            padding: 15px;
            font-size: small;
        }
        .ocena{
            max-height: 30px;
            max-width: 30px;
            padding-left: 5px;
        }
        .referencje {
            max-height: 150px;
            margin: 5px;

        }

        @media (max-width: 600px) {
    body {
        margin: 10px;
        font-size: 14px;
    }
    .wrapper {
        width: 100%;
        margin: 0;
        padding: 0 5px;
    }
    h1, h4, h5, th {
        font-size: 1.1em;
    }
    .tile-block {
        padding: 10px;
        margin-bottom: 20px;
    }
    table .article-table {
        padding: 10px;
        margin: 0;
        width: 100%;
        font-size: 12px;
        height: auto;
    }
    th, td .article-table {
        padding: 5px;
        font-size: 12px;
    }
    .features {
        padding: 8px;
        font-size: 12px;
    }
    .features li {
        font-size: 12px;
        margin-bottom: 3px;
    }
    .logo {
        min-width: 120px !important;
        padding: 8px;
    }
    .flex-container {
        flex-direction: column;
        gap: 10px;
    }
    .producent, .dachowka, .opinia {
        padding: 8px;
        font-size: 12px;
    }
    .dachowka {
        width: 100px;
        padding: 8px;
    }
    .ocena {
        max-height: 20px;
        max-width: 20px;
        padding-left: 2px;
    }
    .referencje {
        max-height: 80px;
        margin: 2px;
    }
}