/* CSS Document */
/*NEU*/


html {
  -webkit-text-size-adjust: 100%; /* Prevents Chrome from overriding your font sizes */
}


/* Responsive Grid / Flex CSS */
#container {
  max-width: 1280px;
  margin: 0 auto;
  background: #fff; /* optional if you want a white box effect */
}

/* Remove underline from all links */
a {
  text-decoration: none;
  color: inherit; /* keeps text color consistent */
}

/* Optional: add hover style so users know it’s clickable */
a:hover {
  text-decoration: underline;  /* or use a color change if you prefer */
  color: #b30000; /* example: subtle red hover */
}

.product-preview img,
.product-link img {
  width: 100%;
  height: 180px;       /* pick a size that works well for your layout */
  object-fit: cover;   /* ensures images scale & crop nicely */
  border-radius: 6px;
}

.product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.product-preview, .product-link {
  text-align: center;
  border: 1px solid #eee;
  border-radius: 8px;
  padding: 10px;
  transition: transform 0.2s ease;
  background: #fff;
}

.product-preview:hover, .product-link:hover {
  transform: translateY(-5px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.product-preview h2, .product-link h2 {
  font-size: 1rem;
  margin-top: 10px;
  line-height: 1.3;
	color: black;
		
}

/*------------------General--------------*/
.flags img {
  display: none !important;
}

.blue {
  color: #796f63; 
}

/* Base font size for desktops */
body {
  font-size: 1.2rem;
  line-height: 1.6;
  font-family: Arial, sans-serif;
}

h1 {
  color:#ab1834;
  font-size: 1.5rem;
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-weight: 500; 
  margin-top:15px;
  font-style:italic;
 text-align: center;
}

h2 {
   color:#ab1834;
  font-family: Arial, sans-serif;
  font-size: 1.2rem;
  font-weight: bold;
  margin-top: 5px;
  line-height: 1.4;
  text-align: center;
}

h3 {
  margin-bottom: 0px;
  font-size: 1.1rem;
}



* {
  font-family:Arial, Helvetica, sans-serif;
}

.nopointer {
  cursor:default !important;
}

div.nopointer img {
  cursor:default !important;
}

/*------------------Body and Container--------------*/
body {
  background-image:url(../img/layout/bg-beige.jpg); 
  margin:0;
  background-color: #f5f4df;
}

div#container {
  width:900px;
  padding: 5px;
  margin-top:2px;
  background-color:white;
  border:25px solid #ab1834;
  /*--min-height:100% !important;
  height:100%;--*/
}

/*------------------Bilder leiste head--------------*/
div#bildleiste_head a img {
  border:0;
}

div#bildleiste_head {
  width:900px;
  margin-top:0px;
  height:131px;
} 

div.bilder_rechts a {
  display:inline-block;
  margin-right:7px;
}

/*--------footer--------------*/
div.mainmenu_bottom span,
div.productmenu_bottom span {
  margin:0 5px;
}

div.footer a, div.footer a:visited {
  text-decoration:none;
  color:#666666;
}

div.footer a:hover {
  color:#000000;
}

.footer {
  padding-top:30px;
  text-align: center;
}

/*---------------------Flaggen--------------*/
.flags_onlinekatalog img {
  border:0;
}
.flags_onlinekatalog {
  color:blue;
  padding-left:20px;
}

/*------------------mainmenu--------------*/
.mainmenu a, .mainmenu {
  color: white;
  text-decoration:none;
  font-size: 0.8rem; 
  letter-spacing: 1px;
  font-weight: 500;
  text-transform:uppercase;
}

.mainmenu a:hover {
  text-decoration:underline;
  color:#ab1834;
}

div.mainmenu {
  vertical-align:top;
  background-color:#c8b69e;
  text-align:left;
  height:17px;
  color:white;
  margin-top:5px;
} 



.mainmenu {
  margin:0 5px;
}

/* top menus */
div#top_menus {
  background-color:#c8b69e;
  width:100%;
  
  z-index:310;
  margin-left: -5px;
  width: 101.2%;
  border-bottom: 1px solid #ab1834;
  padding-top: 5px;
  margin-top: 5px;
}

div#menu2{
  padding-bottom: 5px;
	padding-top: 5px;
}


/*------------------produktmenu--------------*/
.productmenu a, .productmenu {
  color: #796f63;
  text-decoration:none;
  font-size: 0.625rem; 
  font-weight:600;
  text-align: left;
  font-family:Arial, Helvetica, sans-serif;
}

.productmenu a {
  background-color:white;
  margin:2px;
  padding:5px;
  border:1px solid #ab1834;
  display:inline-block;
}

div.productmenu {
  position:relative;
  z-index:100;
  clear:both;
  background-color:#FCE2E8;
  width:900px;
    text-align:center;
	padding-top: 5px;
    padding-bottom: 5px;
}

.productmenu ul li ul li {
  font-weight:normal;
}

.productmenu a:hover {
  text-decoration:underline !important;
}

div#head {
  background-color:white;
  position:relative;
  z-index: 20000 !important;
}

/*------------------Stoffe--------------*/
h1.stoffe_header {
  margin-left:260px;
  float:left;
  margin-bottom:0;
} 

p.stoffe_backbutton {
  float:right;
  margin-top:5px;
  margin-right:20px;
}

/*------------------zusätzliche Navigation top--------------*/
.navigation_top a {
  color:lightgrey;
  font-family:Arial, Helvetica, sans-serif !important;
  text-decoration:none;
  font-size:0.625rem;
  text-transform:uppercase;
  margin-left:10px;
}

.navigation_top a:hover {
  text-decoration:underline;
}

/*********************posamenten***************************/
.posamenten_herstellung_gallery span {
  float:left;
}

.posamenten_herstellung_gallery span img {
  margin-bottom:10px;
}

div.posamenten_herstellung_gallery {
  margin-right:70px;
  margin-left:30px;
}

ul.listing_bilder, ul.listing_bilder li {
  list-style-type:none;
}

ul.listing_bilder li p {
  font-size:0.625rem;
  padding-bottom:5px;
}

table.table_perlenvorhang td {
  width:30px;
  text-align:center;
  padding:2px;
  font-size:0.625rem;
}

table.table_perlenvorhang td p {
  width:25px;
  font-size:0.625rem;
  text-align:center;
}

table.table_perlenvorhang, table.table_perlenvorhang td {
  border:1px solid gray;
}

table.airdisplay_table td {
  padding:2px;
  font-size:0.625rem;
}

div#kontaktdiv a {
  color:gray;
}

div#agb h2 {
  font-size:9pt;
  margin-top:15px;
}

div#agb {
  text-align:left;
}

/* google map contact*/
#map_wrapper {
  height: 400px;
  margin-bottom:5px;
}

#map_canvas {
  width: 100%;
  height: 100%;
}

div.info_content {
  height:200px;
  width:400px;
  text-align:left;
}

/*end google map contact */

/* Increase font size for mobile devices 786 */
@media (max-width: 900px) {
  body {
    font-size: 1.5rem;
    /*line-height: 1.75;*/
  }

  h1 {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.5rem;
  }

  p {
    font-size: 1.3rem;
  }
	
  .product-preview h2, .product-link h2 {
    font-size: 1.7rem;
  }
	
	#menu2 a  {
	font-size: 1.8rem;
	 }
	.mainmenu a{
	font-size: 1.5rem;
		   }
	div#menu2{
 	padding-top: 15px;
}
	
	#p7TMnav div a {
  font-size: 1.3rem;

}
	
	
}