* {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
        }
        body {
            font-family: Arial, sans-serif;
            background-color: #fafafa;
        }
        header {
            grid-area: header;
            text-align: center;
            font-family: cursive;
        }
        nav {
            grid-area: menu;
            padding-top: 20px;
            min-height: 400px;
        }
        nav .menuElement {
            display: block;
            margin: 10px 0;
            padding: 8px;
            text-decoration: none;
            color: #333;
            cursor: pointer;
            border-radius: 4px;
            transition: background-color 0.3s;
        }
        nav .menuElement:hover {
            background-color: #2196F3;
            color: white;
        }
        main {
            grid-area: content;
            min-height: 200px;
        }
        aside {
            grid-area: extra;
        }
        footer {
            grid-area: footer;
            text-align: center;
            padding: 10px;
        }

        .slogan { color: #d7aa3b;}
       
        /* Show/Hide content */
        .frontContent {
            display: none;
        }
        .frontContent.active {
            display: block;
        }
        .photoDimension 
        {
            width: 100%;
            height: 350px;
            border-radius: 4px;
        }
        /* Gallery animation styles */
        .row
        {
            display: flex;
            flex-wrap: wrap;
            gap: 10px;
        }
       
       
        .panel
        {
            background-color:#e5e2de;
            margin-bottom:35px;
            border-radius:15px;
        }
       
        .productHead
        {
            font-size:12px;
            text-align:right;
            padding:15px;
            width:100%;
        }
       
       
        .maingallery
        {
        }
       
        .products
        {
            display: grid;
            grid-template-columns: auto auto;
            gap: 10px;
            padding: 10px;
            width: 100%;
            justify-content: center; /* Center items horizontally */
            justify-items:center;
            align-items: center; /* Center items vertically */
            
        }
        .inputter { width:100%; }
        .msgtxt { width:100%; height:250px;}
        .btn { width:49%; }
        .gallery {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
            gap: 20px;
            padding: 20px;
        }
        .gallery-item {
            border: 1px solid #ccc;
            border-radius: 10px;
            overflow: hidden;
            background: #fff;
            box-shadow: 0 4px 10px rgba(0,0,0,0.1);
            transition: transform 0.3s ease;
       
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 100%;
            width: 100%;
            max-width: 300px;
            margin: 0 auto;
        }
        .paypal-button {
            margin-top: auto;
        }
       
       
        .gallery-item:hover {
            transform: scale(1.03);
        }
        .gallery-item img {
            width: 100%;
            display: block;
        }
        .gallery-item h3 {
            margin: 10px;
            font-size: 1.2em;
        }
        .gallery-item p {
            margin: 10px;
            color: #666;
        }
               
        .container
        {
            display: grid;
            grid-template-areas:
                "header header header"
                "menu content extra"
                "footer footer footer";
            grid-template-columns: 25% 50% 25%;
            gap: 10px;
            padding: 10px;
 
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 20px;
            max-width: 1200px;
            margin: 0 auto;
            padding: 20px;
        }
        
        
        .container > div {
            background-color: rgba(255, 255, 255, 0.9);
            padding: 15px;
            border-radius: 4px;
        }
       
       
        /* Style for each individual salgado item */
        .column
        {
            flex: 1 1 calc(33.333% - 40px);
            max-width: 300px;
            text-align: center;
            padding: 15px;

            flex: 1 1 calc(50% - 10px);
            opacity: 1;
            transform: scale(1);
            transition: opacity 0.5s ease, transform 0.5s ease;
        }
        .column.hide {
            opacity: 0;
            transform: scale(0.9);
            pointer-events: none;
        }
       
       

       
        .column img
        {
            max-width: 100%;
            border-radius: 4px;
            margin-bottom: 10px;
        }
       
        .column h4
        {
            margin: 10px 0 5px;
            color: #333;
        }
       
        .column p
        {
            color: #666;
            font-size: 0.9em;
        }
        .productTitle
        {   
            font-size: 16px; 
            font-weight:600;
            
        }
   
        /* Responsive Design */
   
        @media (max-width: 768px) {
            .container {
                grid-template-areas:
                    "header"
                    "menu"
                    "content"
                    "extra"
                    "footer";
                grid-template-columns: 1fr;
            }
            .column {
                flex: 1 1 calc(50% - 20px);
            }
            nav {
                min-height: auto;
                padding-top: 10px;
            }
            nav .menuElement {
                margin: 5px 0;
                padding: 6px;
            }
   
            .products {
                grid-template-columns: 1fr;
            }
            .headTitle
            { width: 400px; }
        }
   
        @media (max-width: 480px) {
            .container {
                gap: 5px;
                padding: 5px;
            }
            .column {
                flex: 1 1 100%;
            }
            .gallery-item, .photoDimension {
                width: 100%;
                height: auto;
            }
            header img {
                max-width: 100%;
                height: auto;
            }
            main h3 {
                font-size: 1.1em;
            }
        }