/* Basic styling for the gallery */
        .gallery {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }
        .gallery img {
            max-width: 100%;
            height: auto;
            cursor: pointer;
            transition: transform 0.3s;
        }
        .gallery img:hover {
            transform: scale(1.1);
        }
        /* Modal styling */
        .modal {
            display: none;
            position: fixed;
            z-index: 1;
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            overflow: auto;
            background-color: rgb(90,29,45);
        }
        .modal-content {
            margin: auto;
            display: block;
            width: 80%;
            max-width: 700px;
        }
        .close {
            position: absolute;
            top: 30px;
            right: 35px;
            color: #fff;
            font-size: 50px;
            font-weight: bold;
        }
        .close:hover,
        .close:focus {
            color: orange;
            text-decoration: none;
            cursor: pointer;
        }
        
        .info{
        color: #bbb;
            text-decoration: none; 
             font-weight: bold;
              background-color: navy;
                z-index: 2;
                padding:12px;
        }
    
        /* Basic styling for the gallery container */
        .gallery-container {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }

        /* Individual image container styling */
        .image-container {
            padding: 20px;
            width: 250px;
        }

        /* Making images responsive */
        .image-container img {
            max-width: 100%;
            height: auto;
            display: block;
        }

        /* Ensuring the gallery adjusts for smaller screens */
        @media (max-width: 768px) {
            .image-container {
                width: 100%; /* Full width on smaller screens */
            }
        }
   
.card {
 padding:20px;
            flex-wrap: wrap;
            justify-content: center;  
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  max-width: 600px;
  margin: auto;
  text-align: center;
  font-family: arial;
}

.price {
  color: grey;
  font-size: 22px;
}
.tich{
width: 80%;
  font-size: 18px;    
/*background-color: #6699ff;*/
  text-align: center;
}
.card button {
  border: none;
  outline: 0;
  padding: 12px;
  color: white;
  background-color: #000;
  text-align: center;
  cursor: pointer;
  width: 100px;
  font-size: 20px;
}
.desc{
font-size:140%;
text-align:center;
}
.card button:hover {
  opacity: 0.7;
}

 .description{
  text-align: left;   
 }
  #resizableDiv {
      
  width: 200px;
  border: 2px solid black;
  padding: 10px;
}