body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
    color: #333;

    .main-image {
        width: 100%;
        height: 200px;
        background: url('/images/desktop.webp') no-repeat center center;
        background-size: cover;
        background-color: #f4f4f4; 

        .navbar {
            display: flex;
            justify-content: space-between;
            padding: 10px 20px;
    
            a {
                color: white;
                text-decoration: none;
                margin-left: 20px;
                background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent black background */
                padding: 5px 10px; /* Adds padding around the text */
                border-radius: 5px; /* Optional: rounds the corners */

                @media (max-width: 768px) {
                    margin-left: 10px;
                    font-size: 15px;
                    margin-top: 10px;
                }
            }
    
            .left {
                font-size: 40px;
                font-weight: bold;
                text-wrap: nowrap;

                @media (max-width: 768px) {
                    font-size: 20px;
                }
            }
        }
    }

    .index-page {
        height: 500px;

        @media (max-width: 768px) {
            height: 200px;
        }
    }

    


    .list-products-title {
        text-align: center;
        margin: 20px 0;
    }

    .product-list {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: stretch;
        margin: 0 auto;
        max-width: 1200px;

        .product {
            position: relative;
            background: #fff;
            border: 1px solid #ddd;
            margin: 10px;
            padding: 20px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            flex: 0 0 30%;
            max-width: 30%;
            box-sizing: border-box;

            @media (max-width: 768px) {
                flex: 0 45%;
                max-width: 50%;
            }


            @media (max-width: 480px) {
                flex: 100%;
                max-width: 100%;
            }


            h3 {
                color: #333;
            }

            .certified {
                position: absolute;
                top: 10px; /* Adjust spacing from the top corner */
                right: 10px; /* Adjust spacing from the right corner */
            }

            .product-screenshot {
                width: 100%;
                height: auto;
                border-bottom: 1px solid #ddd;
            }

        }
    }

    .product-link {
        text-decoration: none;
        color: inherit;
        display: block;

        &:hover, &:focus {
            text-decoration: none;
            background-color: transparent;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        }
    }

    .product-page {
        width: 80%;
        margin: 20px auto;
        padding: 20px;
        background: #fff;
        border: 1px solid #ddd;

        .product-screenshot {
            width: 500px;
            height: auto;
            border-bottom: 1px solid #ddd;
        }
    }

    .product-icon {
        width: 32px;
        height: 32px;
        vertical-align: sub;
    }

    .privacy{
        max-width: 60%;
        margin-left: 20%;


        @media (max-width: 768px) {
            max-width: 90%;
            margin-left: 5%;
        }
    }

    .contacts {
        iframe {
            width: 100%;
            height: 1200px;
            border: 0;
        }

        p {
            text-align: center;
        }
    }
}