@charset "utf-8";
/* CSS Document */
body{
	background-color: linen;
	overflow-x: hidden;
	 
}


div.container {
	margin: 0 auto;
	width: 90%;
	
}

h1 {
 font-family:Georgia, "Times New Roman", Times, serif;
  text-align: center;
  text-shadow: 2px 2px #FFFFFF;
  COLOR: DARKSLATEGREY;
 
 
}

h2, h3 {
	font-family:Georgia, "Times New Roman", Times, serif;
	color:tomato;
	text-shadow: 2px 2px #FFFFFF;
	COLOR: DARKSLATEGREY;
	text-align:center;
	
}

p, ul {
	font-family:Verdana, Geneva, sans-serif;
	COLOR: black;
	text-align: left;
}

	
.storepicture {

  border-radius: 30px;	
  display: block;
  margin-left: auto;
  margin-right: auto;
  
  max-width: 100%;
  height: auto;
}

.storename{
		
}

.tagline {
  font-family:Georgia, "Times New Roman", Times, serif;
  font-size:25px;
  font-weight: normal;
  margin: 0 0 0 0;
  padding: 0 0 30px 0;
  
}

.storename {
	margin: 0 0 0 0px;
	padding: 0 0 0 0px;

}

.logo-container {
	text-align: center;

}
	
.line{
	
background-color: black;
height: 3px;
}

.productcontainer{ 
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  padding: 10px;
  box-sizing: border-box;
  max-width: 100%;
  overflow-x: hidden;
	
}
.productcontainer h2{
	clear:both;
	
	}



.gallery img {
  display: block;
  margin: 0 auto;
  max-width: 100%;
  height: auto;
  transition: transform 0.3s ease;
}

.gallery {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  border-radius: 8px;
  overflow: hidden;
}

/* Hover / Tap effect */
.gallery:hover,
.gallery:active {
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

div.desc {
  padding: 15px;
  text-align: center;
  font-family:Verdana, Geneva, sans-serif;
  font-size:12px;
}

* {
  box-sizing: border-box;
}

.responsive {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1 1 100px;
  max-width: 120px;
  text-align: center;
  box-sizing: border-box;
}

/* Responsive adjustments */
@media (max-width: 600px) {
  .responsive {
    flex: 1 1 45%;
    max-width: 45%;
  }
}

@media (max-width: 400px) {
  .responsive {
    flex: 1 1 100%;
    max-width: 100%;
  }
}

.clearfix::after {
  content: "";
  display: table;
  clear: both;
}





.productdescription{
  text-align: center;
  margin: 20px auto;
  max-width: 800px; /* Optional: Controls line length for better readability */
	}











div.contact {
	
	
	
}

.contact p {
	
	text-align: center;
	}

div.bottom {
	
	clear:both;
	
	
}