@charset "utf-8";
*, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

a {color:white; text-decoration: none;} 
  
a:hover {text-decoration: underline;} 
 body {
	 margin:0;
	 width:100vw;
		min-height:100vh!important;
		background-image: url('../img/rose2.jpg');
		background-size: 100vw 95vh;
		background-position: center top;
		background-repeat: no-repeat;
		box-sizing: border-box;
		background-attachment: fixed;
		cursor: url('../img/hummel.png'), auto!important;	
		padding-bottom:5vh;

 } 
 h1 {
	 font-size:3.5vw!important;
 }
 	.marquee {
		max-width: 100vw; /* iOS braucht das */
		white-space: nowrap;
		width:100vw;
		overflow: hidden;
		position:fixed;
		bottom:0;
		left:0;
		background-color: black;
		color:#b5e51d;
		padding-bottom:0.3vh;
		padding-top:0.3vh;
		font-size:2.5vw;
		font-weight:bold;
		font-family:  'Gabriola';
		/* hier evtl. noch font-size, color usw. */
	}

	.marquee span {
		display: inline-block;
		padding-left: 105%; /* die zusätzlichen 5% erzeugen einen verzögerten Start und vermeiden so ein Ruckeln auf langsamen Seiten */
		animation: marquee 45s linear infinite;
	}

	/* Optional: mouseover (oder Tipp auf dem Touchscreen) pausiert die Laufschrift */
	.marquee span:hover {
		animation-play-state: paused 
	}

	/* Make it move */
	@keyframes marquee {
		0%   { transform: translateX(0); }
		100% { transform: translateX(-100%); }
	}
#x {
	width:4vw;
	padding:2px;
}
footer {
	position:fixed;
	bottom:0;
	width:100vw;
	height:5vh;
	padding:1vh;
}
.knopfi {
	padding:1vw;
	font-size: 2.5vw;
	background-color:rgba(0,0, 0, 0.8);
	color:#b5e51d;
	border-radius:5%;
	cursor:url('../img/hummel.png'), auto;
	position:absolute;
	top:2vh;
	left:2vw;
	border-radius:10px;
}
.knopfi:hover {
	background-color:#b5e51d;
	color:black;
}
#staudenliste {
	background-color: rgba(0,0, 0, 0.8);
	color:#b5e51d;
	width:50vw;
	margin-left:auto;
	margin-right:auto;
	font-size:2.5vw;
	padding-top:1vh;
	padding-bottom:1vh;
	padding-left:2.5vw;
	font-weight: bold;
	height:auto;
	margin-top:2vh;
	line-height:200%;
	border-radius:10px;
}
#panel {
	position:absolute;
	top:30vh;
	width:auto;
	left:30vw;
	font-family: 'Gabriola';
	font-size:2vw;
	font-weight:bold;
	border-radius:5px;
	background-color:#b5e51d;
	text-shadow: 1px 1px white;
	box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12);
  cursor: url('../img/hummel.png'), auto;


}
#id01 {
	position:absolute;
	top:35vh;
	left:30vw;
	width:44.5vw;
	padding-top:2vh;
	padding-bottom:5vh;
	background-color:#b5e51d;
	font-family: 'Gabriola';
	font-size:2vw;
	border-radius:5px;
	text-shadow: 1px 1px white;
	box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12);
  cursor: url('../img/hummel.png'), auto;



}
#impressumdatenschutz {
	position:absolute;
	top:0;
	left:2vw;
	width:auto;
	font-family:'Gabriola';
	font-size:1.5vw;
}
.gabriola {
	font-family: 'Gabriola';
}
#beere {
	width:14vw;
	height:auto;
	z-index:10;
}
#beere:hover {
	width:16vw;
}
#textbeere {
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Gabriola';
  color: white;
  margin-left:1vw;
  font-weight:bold;
  text-shadow: 2px 2px black;
  font-size:1.6vw;
  z-index: 9;
}
#textbeere:hover {
	color:#b5e51d;
}
#kräuter {
	position:absolute;
	top:2vh;
	right:12vw;
	cursor: url('../img/hummel.png'), auto;
}
#oeffnendes_div {
	display:none;
	margin-left:3vw;
	width: 20vw;
	background-color:rgba(0,0, 0, 0.9);
	color:#b5e51d;
	text-decoration:none!important;
	font-size:1.5vw;
	border-radius:10px;
	padding-top:5vh;
	padding-bottom:22vh;
}
#oeffnendes_div2 {
	display:none;
	margin-left:3vw;
	width: 20vw;
	background-color:rgba(0,0, 0, 0.9);
	color:#b5e51d;
	text-decoration:none!important;
	font-size:1.5vw;
	border-radius:10px;
	padding-top:5vh;
	padding-bottom:20vh;
}
#oeffnendes_div3 {
	display:none;
	margin-left:3vw;
	width: 20vw;
	background-color:rgba(0,0, 0, 0.9);
	color:#b5e51d;
	text-decoration:none!important;
	font-size:1.5vw;
	z-index:3;
	border-radius:10px;
	padding-top:5vh;
	padding-bottom:20vh;
}
#oeffnendes_div4 {
	display:none;
	margin-left:3vw;
	width: 20vw;
	background-color:rgba(0,0, 0, 0.9);
	color:#b5e51d;
	text-decoration:none!important;
	font-size:1.5vw;
	border-radius:10px;
	padding-top:5vh;
	padding-bottom:20vh;
}
#oeffnendes_div5 {
	display:none;
	margin-left:3vw;
	width: 20vw;
	background-color:rgba(0,0, 0, 0.9);
	color:#b5e51d;
	text-decoration:none!important;
	font-size:1.5vw;
	border-radius:10px;
	padding-top:5vh;
	padding-bottom:20vh;
}
#oeffnendes_div span {
	text-decoration:none!important;
}
#kräuter:hover #oeffnendes_div {
	display: block;
}
.kräuterli:hover {
	color:white;
}
#oeffnendes_div:hover ~ #lorbeerblatt {
	width: 24vw;
}
.ul {
	list-style:none;
}
#kräuter:hover #textlorbeer {
	display:none;
}
#wildblumen:hover #blumentext {
	display:none;
}
#beerenobst:hover #textbeere {
	display:none;
}
#bäume:hover #baumtext {
	display:none;
}
#tiere:hover #tiertext {
	display:none;
}
#tiere:hover ~ #panel {
	z-index:-1;
}
#beerenobst:hover ~ #panel {
	z-index:-1;
}
#kräuter:hover ~ #panel {
	z-index:-1;
}
#lorbeerblatt {
	width:22vw;
	height:auto;
	z-index:10;
	
}
#lorbeerblatt:hover{
	width:24vw;
}
#textlorbeer {
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Gabriola';
  color: white;
  margin-left:1vw;
  font-weight:bold;
  text-shadow: 2px 2px black;
  font-size:1.6vw;
  z-index: 9;
}
#textlorbeer:hover {
	color: #b5e51d;
	
}
#wildblumen {
	position:absolute;
	top: 18vh;
	right:0;
	cursor: url('../img/hummel.png'), auto;

}
ul li a {
	cursor: url('../img/hummel.png'), auto;
}
#wildblumen:hover #oeffnendes_div2 {
	display:block;
}
#blume {
	width:14vw;
	height:auto;
	z-index:10;
}
#blume:hover {
	width:15vw;
}
#blumentext {
	position: absolute;
  top: 50%;
  left: 45%;
  transform: translate(-50%, -50%);
  font-family: 'Gabriola';
  color: white;
  margin-left:1vw;
  font-weight:bold;
  text-shadow: 2px 2px black;
  font-size:1.6vw;
  z-index: 9;
}
#blumentext:hover {
	color:#b5e51d;
}
#beerenobst {
	position:absolute;
	left:20vw;
	top:8vh;
cursor: url('../img/hummel.png'), auto;
}
#beerenobst:hover #oeffnendes_div3 {
	display:block;
}
#beerenobst:hover #oeffnendes_div3 a {
	display:block;
}
#tiere {
	position:absolute;
	top:1vh;
	left: 40vw;
	cursor: url('../img/hummel.png'), auto;

}
#tiere:hover #oeffnendes_div5 {
	display:block;
}
#igel {
	width:15vw;
	height:auto;
	z-index:10;
}
#igel:hover {
	width:17vw;
}
#tiertext {
	position: absolute;
  top: 40%;
  left: 40%;
  transform: translate(-50%, -50%);
  font-family: 'Gabriola';
  color: white;
  margin-left:1vw;
  font-weight:bold;
  text-shadow: 2px 2px black;
  font-size:1.6vw;
  z-index: 9;
}
#tiertext:hover {
	color:#b5e51d;
}
#bäume {
	position:absolute;
	top:15vh;
	left: 0vw;
	cursor: url('../img/hummel.png'), auto;

}
#bäume:hover #oeffnendes_div4 {
	display:block;
}
#baum {
	width:17vw;
	height:auto;
	z-index:10;
}
#baum:hover {
	width:20vw;
}
#baumtext {
	position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-family: 'Gabriola';
  color: white;
  margin-left:1vw;
  font-weight:bold;
  text-shadow: 2px 2px black;
  font-size:1.6vw;
  z-index: 9;
}
#baumtext:hover {
	color:#b5e51d;
}
#begrüssung {
z-index:9!important;
	height:auto;
	text-align:center;
	position:absolute;
	left: 15vw;
	top:88vh;
	font-size: 2vw;
	line-height:1.5;
	font-family: 'Lucida-Calligraphy';
	padding-bottom:5vh;
	margin-left:8vw;
	width:70vw;
	border-radius:200px;
	text-shadow:0 -1px 1px #FFFFFF, 0 1px 1px #666666;
	background-image:url(../img/holz.jpg);
	background-repeat:no-repeat;
	background-size:cover;
box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12);
}
#startseite {
	margin-top:5vh;
}
input:focus {
outline:0;
border:1px solid forestgreen;
-webkit-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
-moz-box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
box-shadow: 0 0 5px 4px rgba(36,184,194, 0.10);
}
#artikelbild {
				padding:1px;
				text-align:left
}
.slider {
				width: auto;
				height: 70%;
				padding: 5vw;
				overflow:auto;
				text-align:center;
				padding-top:5vh;
			}
.mySlides {
				display: none;
			}
			.mySlides fade numbertext img {
				vertical-align: middle;
				width: 50vw !important;
				height: 50vh !important; 
			}			
			.slideshow-container {
			  max-width: 100%;  
			  margin: 0 auto;
			  
			}	
			.text {
			  color: #f2f2f2;
			  font-size: 15px;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 8px;
			  width: 100%;
			  text-align: center;
			}			
			.numbertext {
			  color: black;
			  text-align:center;
			  font-weight:bold;
			  font-size: 18px;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 15vh;
			}
			.preistext {
			  color: red;
			  text-align:center;
			  font-weight:bold;
			  font-size: 18px;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 20vh;
			}			
			.dot {
			  height: 15px;
			  width: 15px;			 
			  background-color: #2fec12;			 
			  border-radius: 50%;
			  display: inline-block;
			  transition: background-color 0.6s ease;
			  text-align: center;
			}
			.active {
			  background-color: forestgreen;
			}			
			.fade {
			  -webkit-animation-name: fade;
			  -webkit-animation-duration: 2.5s;
			  animation-name: fade;
			  animation-duration: 2.5s;
			}
			.tabelle {
				font-size:1.5vw;
				font-weight:bold;
			}
			.sidenav .closebtn {
	display:none;
}
#firmenlogo {
	
	color:rgba(200, 247, 197, 1);
	width:60vw;
	height:30vh;
	position:absolute;
	left:20vw;
	top:70vh;
	font-size:10em;
	font-weight:bold;
	padding-left:15px;
	font-family: 'Gabriola';
	text-align:center;
}
#punkt {
	text-align:center;
	position: absolute;
	bottom:15vh;
	left:48%;
}			
footer {
	background-color:#2d6b1d;
	color:white;
	padding:6px;
	position:fixed;
	bottom:0!important;
	width:100%;
	}
#nochkeinartikel {
	text-align:center;
	font-weight:bold;
}
#float {
	clear:both;
	content: ""; 
	display: block;
}
#produktrechts {
	position: absolute;
	left: 55%;
	top: 25%;
	padding-right:3%;
	min-height:100%!important;
	padding-bottom:10vh!important;
	
}
#articlelist {
	padding-left:5vw;
}
#produktbild {
	float:left;
	width:auto;
	height:80%;
}
#produktbild:after {
	clear:both;
}
#stueckzahl {
	
	width: 60px;
}  
#container { 
    width: 700px; 
    margin: 150px auto; 
    background-color: #eee; 
    padding:15px; 
    overflow: hidden; 
} 
 
#zusammen {
	width:20vw;
	text-align:right;
	margin-left:60vw;
} 

.rechnung-ergebnis {
	margin-left:5vw;
}
    #main { 
        width: 100%; 
        float: left; 
    } 
      
        #main table { 
            width: 480px; 
        } 
          
            #main table th { 
                padding: 10px; 
                background-color: #48577D; 
                color: #fff; 
                text-align: left; 
            } 
              
            #main table td { 
                padding: 5px; 
            } 
              
            #main table tr { 
                background-color: #d3dcf2; 
            } 
      
    #sidebar { 
        width: 200px; 
        float: left; 
    }
#warenkorbmain {
	width: 90vw;
	font-family:arial;
	min-height:100%;
	margin-top:18%;
	
	
}
#stueckzahl {
	padding:10px;
	color:forestgreen;
}

.impressumtext {
	padding:2vw;
	padding-top:25vh;
}
.span {
	color:gray;
	font-size:0.9vw;
}
.topnav {
  overflow: hidden;
  
  background-color: forestgreen;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 1.3em;
}

.active {
  background-color: forestgreen;
  color: white;
}

.topnav .icon {
  display: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  font-size: 1.3em;    
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: forestgreen;
  font-family: inherit;
  margin: 0;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: white;
  color:forestgreen;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: forestgreen;
  background-color:white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: white;
  color: forestgreen;
}

.dropdown-content a:hover {
  background-color: forestgreen;
  color: white;
}

.dropdown:hover .dropdown-content {
  display: block;
}
	
.clearfix:after {
				content: "";
				display: block;
				clear: both;
			}
.button {
	position:absolute;
	right:3vw;
	top: 2.5vh;	
	padding:1vw;
	font-size: 1.2em;
	background-color:forestgreen;
	color:white;
	border-radius:5%;
}		
.knopf {
	padding:1vw;
	font-size: 1vw;
	background-color:forestgreen;
	color:white;
	border-radius:5%;
	cursor:pointer;
}	
.zurueck {
	position: absolute;
	left: 3vw;
	top: 2.5vh;
	padding: 1vw;
	font-size: 1vw;
	background-color: forestgreen;
	color:white;
	border-radius: 5%;
}
#warenkorb {
	height:80px;
	width:auto;
	position:absolute;
	top: 15%;
	right:5%;
}
#warenkorbindex {
	height:50px;
	width:auto;
	position:absolute;
	top: 2%;
	right:2%;
}
#blumen {
	height:80px;
	width:auto;
	position:absolute;
	top: 27%;
	left:5%;
}	
#dealer-form {
	width: 90vw;
	height:100vh;
	
}		

			
#kyocera {
	height:50%;
}

#netzwerkkabel {
	height:50%;
	margin-top:0;
}

#telefon {
	height:65%;
	margin-top:5%;
}

#server {
	height:25%;
	margin-top:15%;
}		

#iiyama {
	height:55%;
	margin-top:10%;
}
header {
				top: 0;
				
				position: fixed;
				z-index: 999;
				height: 10%;
				width: 100vw;
				margin: 0 auto;
				
				
			}
#textarea {
	width: 60%;
	height: 150px;
	padding: 12px 20px;
	box-sizing: border-box;
	border: 2px solid forestgreen;
	border-radius: 4px;
	background-color: #f8f8f8;
	resize: none;
}
#anrede {
	width:10%;
	padding: 16px 20px;
	border-radius:5px;
}	

#vollername {
	width: 30%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}	
#strasse {
	width: 30%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}	
#hausnummer {
	width: 10%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}
#plz {
	width: 12%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}

#ort {
	width: 28%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}

#telefone {
	width: 12%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}

#email {
	width: 28%;
	padding: 12px 20px;
	margin: 8px 0;
	box-sizing: border-box;
	border-radius:5px;
}
			
			/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
			/*Mobile-----------------------------------------------*/
		@media only screen and (max-width: 1023px) {
body {
	width:100vw;
	margin:0;
	height: 100%;
}
header {
	width:100vw;
	margin: 0;
		vertical-align: middle;

}			

h1 {
	font-size: 2.5em;
	height:8vh;
	
}	
#textarea {
	width:90vw;
	padding: 1vw 2vw;
	margin-left: 5vw;
	
}
#anrede {
	width:40%;
}

#vollername {
	width: 50%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}	
#strasse {
	width: 50%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}	
#hausnummer {
	width: 15%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}
#plz {
	width: 20%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}

#ort {
	width: 45%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}

#telefone {
	width: 20%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}

#email {
	width: 45%;
	padding: 4vw 1vw;
	margin: 5vw 0;
	box-sizing: border-box;
	border-radius:5px;
}
.slider {
				width: 90vw;
				height: auto;
				padding: 1vw;
				overflow:auto;
				text-align:left;
}

a {color: #48577D; text-decoration: none;} 
  
a:hover {text-decoration: underline;} 
  

h2 {
	font-size: 16px;
	margin-top:20vh;
} 
.tabelle {
				font-size:0.8em;
				
			}
.mySlides {
				display: none;
			}
			.mySlides fade numbertext img {
				vertical-align: middle;
				width: 50vw !important;
				height: 50vh !important; 
			}			
			.slideshow-container {
			  max-width: 90vw;  
			  margin: 0 auto;
			  
			}	
			.text {
			  color: #f2f2f2;
			  font-size: 1.4em;
			  font-weight:bold;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 8px;
			  width: 100%;
			  text-align: center;
			}			
			.numbertext {
			  color: black;
			  text-align:center;
			  font-weight:bold;
			  font-size: 18px;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 15vh;
			}
			.preistext {
			  color: red;
			  text-align:center;
			  font-weight:bold;
			  font-size: 1.4em;
			  padding: 8px 12px;
			  position: absolute;
			  bottom: 20vh;
			}			
			.dot {
			  height: 15px;
			  width: 15px;			 
			  background-color: #2fec12;			 
			  border-radius: 50%;
			  display: inline-block;
			  transition: background-color 0.6s ease;
			  text-align: center;
			}
			.active {
			  background-color: forestgreen;
			}			
			.fade {
			  -webkit-animation-name: fade;
			  -webkit-animation-duration: 2.5s;
			  animation-name: fade;
			  animation-duration: 2.5s;
			}
#punkt {
	text-align:center;
	position: absolute;
	bottom:15vh;
	left:35%;
}			
#footer {
	background-color:forestgreen;
	padding:2vw;
	text-align:center;
	height:10vh;
	font-size:1.3em;
	position:fixed;
	bottom:0!important;
	width:100vw!important;
	}
#nochkeinartikel {
	text-align:center;
	font-weight:bold;
}
#float {
	clear:both;
	content: ""; 
	display: block;
}
#produktrechts {
	position: absolute;
	left: 0;
	top: 67%;
	padding-right:3%;
	padding-left:3%;
	margin-bottom:14vh;
	margin-top:5vh;
	
}
#produktbild {
	float:left;
	width:auto;
	height:80%;
}
#produktbild:after {
	clear:both;
}
#stueckzahl {
	
	width: 60px;
}  
#container { 
    width: 700px; 
    margin: 150px auto; 
    background-color: #eee; 
    padding:15px; 
    overflow: hidden; 
} 
  
    #main { 
        width: 100%; 
        float: left; 
    } 
	
.impressumtext {
	padding:2vw;
	margin-top:25vh;
}
.RespTable, .RespTable thead, .RespTable tbody, .RespTable tr, .RespTable th, .RespTable td {

display: block;

}

.RespTable  {

text-align: right;
margin-bottom:15vh;

}

 

.RespTable thead {

position: absolute;

top: -1111px;

left: -1111px;

}

 

.RespTable td:before {

float: left;

padding: 0 10px 0 0;



font-weight: bold;

}

.RespTable td:nth-child(1) {

font-weight: bold;

}

.RespTable td:last-child {

border-bottom: 5px forestgreen solid;

}

.oddRow {

background: #fff;

}

  
      
    #sidebar { 
        width: 200px; 
        float: left; 
    }
#warenkorbmain {
	width: 90vw;
	height: 100%important;
	
	
}

  .topnav a, .dropdown .dropbtn {
    display: none;
  }
  .topnav a.icon {
    float: right;
    display: block;
  }

  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
	
.clearfix:after {
				content: "";
				display: block;
				clear: both;
			}
		
.knopf {
	padding:1vw;
	font-size: 1.1em;
	background-color:forestgreen;
	color:white;
	border-radius:5%;
	cursor:pointer;
}	
.zurueck {
	position: absolute;
	left: 3vw;
	top: 2.5vh;
	padding: 1vw;
	font-size: 1vw;
	background-color: forestgreen;
	color:white;
	border-radius: 5%;
}

#warenkorb {
	height:55px;
	width:55px;
	position:absolute;
	overflow:auto;
	top: 0;
	right:2vw;
	
}
#blumen {
	height:50px;
	width:50px;
	position:absolute;
	overflow:auto;
	top: 0;
	left:2vw;
	
}	
#dealer-form {
	width: 90vw;
	position: relative;
	min-height: 100%;
	margin:0 auto;
	padding-bottom:10vh;
	
}		
			
#kyocera {
	height:60%;
	width:auto;
}

#netzwerkkabel {
	height:40%;
	margin-top:15%;
}

#telefon {
	height:65%;
	margin-top:5%;
}

#server {
	height:25%;
	margin-top:25%;
}		

#iiyama {
	height:45%;
	margin-top:10%;
}
.oddCol {
	font-size: 1.5em;
}
.span {
	font-size:0.7em;
	color:gray;
	
}
#stueckzahl {
	font-size:1.3em;
	margin-left:30vw;
	
	
}
table td, table tr {
  display: block;
  text-align:left
}

table th {
  display: none;
}

table td::before {
  content: attr(data-th)" ";
  display: inline-block;
  font-weight: bold;
  margin-right: 0.25em;
}
table tr {
	margin-bottom:5vh;
}


#zusammen {
	width: 90vw;
	text-align:left;
	margin-left:2vw;
}
}