@charset "utf-8";
/* CSS Document */
html, body

{
	background-image: url("../ujkepek/product.jpg");
background-attachment:fixed;
background-size: 100% 100%;
	background-repeat: no-repeat;

height: 100vh;
margin: 0;
overflow: hidden;
}
stile

html, body {
	
	
	}
 .cim {
	 background-color: black;
	 opacity: 0.7;
    
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
		font-size: 40px;
    font-family: audiowide;
		color: aqua;
}
.kieg {
    background-color: black;
	 opacity: 0.7;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
		font-size: 20px;
    font-family: audiowide;
		color: aqua;
}
.gombocska1 {
	  position: absolute;
	top: 42%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska1:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska2 {
	 position: absolute;
	top: 42%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska2:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
 
.gombocska3 {
	 position: absolute;
	top: 82%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska3:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

.f
{
	width: 100px;
	height: 100px;
	border: #EC1115;
}

 a {
    color: white;
    text-decoration: none;
}
.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska5 {
	 position: absolute;
	top: 82%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska5:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
.gombocska6 {
	 position: absolute;
	top: 42%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska6:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}


.gombocska7 {
	 background-image: url("../asd/4cyl.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 9.5%;
     padding: 8px 40px;
     display: inline-block;
}

.gombocska8 {
	 background-image: url("../asd/6cylnissanuj.gif");
	 width: 200px;
	 height: 150px;
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 42.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska9 {
	 background-image: url("../asd/5cyluj.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 73.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska10 {
	 background-image: url("../asd/5cyltfsi.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 9.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska11 {
	 background-image:url("../asd/8cylbmw.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 42.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska12 {
	 background-image:url("../asd/6cyl2jzuj.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 73.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

@media screen and (max-width: 1970px) {
 
	 .gombocska1 {
	  position: absolute;
	top: 42%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska1:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska2 {
	 position: absolute;
	top: 42%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska2:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
 
.gombocska3 {
	 position: absolute;
	top: 82%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska3:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

	
.gombocska5 {
	 position: absolute;
	top: 82%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska5:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
.gombocska6 {
	 position: absolute;
	top: 42%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 140px;
     display: inline-block;
     
}
    .gombocska6:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}


.gombocska7 {
	 background-image: url( "../asd/4cyl.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 20%;
     left: 9.5%;
     padding: 8px 40px;
     display: inline-block;
}

.gombocska8 {
	 background-image: url("../asd/6cylnissanuj.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 20%;
     left: 42.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska9 {
	 background-image: url("../asd/5cyluj.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 20%;
     left: 73.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska10 {
	 background-image: url("../asd/6cyl2jzuj.gif");
	 width: 200px;
	 height: 150px;

	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 58%;
     left: 9.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska11 {
	 background-image: url("../asd/8cylbmw.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 58%;
     left: 42.5%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska12 {
	 background-image: url("../asd/5cyltfsi.gif");
	 width: 200px;
	 height: 150px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 58%;
     left: 73.5%;
     padding: 8px 40px;
     display: inline-block;
     
}	
	
	
	
	

	
	@media screen and (max-width: 1200px) {
 .gombocska7 {
	 background-image: url("../asd/4cyl.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;

}

.gombocska8 {
	 background-image:url("../asd/6cylnissanuj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;

     
}

.gombocska9 {
	 background-image: url("../asd/5cyluj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;

     
}

.gombocska10 {
	 background-image: url("../asd/6cyl2jzuj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska11 {
	 background-image: url("../asd/8cylbmw.gif");
	 width: 160px;
	 height:140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska12 {
	 background-image: url("../asd/6cylbmw.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;
     
}
		
}
	
		 .gombocska1 {
	  position: absolute;
	top: 42%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
			 text-align: center;
     
}
    .gombocska1:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska2 {
	 position: absolute;
	top: 42%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska2:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
 
.gombocska3 {
	 position: absolute;
	top: 82%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska3:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

	
.gombocska5 {
	 position: absolute;
	top: 82%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
	text-align: center;
     display: inline-block;
     
}
    .gombocska5:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
.gombocska6 {
	 position: absolute;
	top: 42%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska6:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
	
	
	@media screen and (max-width: 1000px) {
 .gombocska7 {
	 background-image: url("../asd/4cyl.gif");
	 width: 120px;
	 height: 100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;

}

.gombocska8 {
	 background-image:url("../asd/6cylnissanuj.gif");
	 width: 120px;
	 height: 100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;

     
}

.gombocska9 {
	 background-image: url("../asd/5cyluj.gif");
	 width: 120px;
	 height: 100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;

     
}

.gombocska10 {
	 background-image: url("../asd/6cyl2jzuj.gif");
	 width: 120px;
	 height: 100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska11 {
	 background-image: url("../asd/8cylbmw.gif");
	 width: 120px;
	 height:100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska12 {
	 background-image: url("../asd/5cyltfsi.gif");
	 width: 120px;
	 height: 100px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;
     
}
		
}
	
		 .gombocska1 {
	  position: absolute;
	top: 42%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
			 text-align: center;
     
}
    .gombocska1:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska2 {
	 position: absolute;
	top: 42%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska2:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
 
.gombocska3 {
	 position: absolute;
	top: 82%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska3:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

	
.gombocska5 {
	 position: absolute;
	top: 82%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
	text-align: center;
     display: inline-block;
     
}
    .gombocska5:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
.gombocska6 {
	 position: absolute;
	top: 42%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 100px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska6:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
	
	
	
	
@media screen and (max-width: 800px) {
 .gombocska7 {
	 background-image: url("../asd/4cyl.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;
}

.gombocska8 {
	 background-image:url("../asd/6cylnissanuj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska9 {
	 background-image: url("../asd/5cyluj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 24%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska10 {
	 background-image: url("../asd/6cyl2jzuj.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 11%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska11 {
	 background-image: url("../asd/8cylbmw.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 44%;
     padding: 8px 40px;
     display: inline-block;
     
}

.gombocska12 {
	 background-image: url("../asd/5cyltfsi.gif");
	 width: 160px;
	 height: 140px;
	
	 background-repeat: no-repeat;
	 background-position: center;
	 background-size: contain;
	 position: absolute;
	 top: 64%;
     left: 75%;
     padding: 8px 40px;
     display: inline-block;
     
}
	
	 .gombocska1 {
	  position: absolute;
	top: 42%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
		 text-align: center;
     
}
    .gombocska1:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
.gombocska2 {
	 position: absolute;
	top: 42%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska2:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
 a {
    color: white;
    text-decoration: none;
}
 
.gombocska3 {
	 position: absolute;
	top: 82%;
    left: 11%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska3:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

.gombocska4 {
	 position: absolute;
	top: 82%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska4:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 

	
.gombocska5 {
	 position: absolute;
	top: 82%;
    left: 75%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska5:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
.gombocska6 {
	 position: absolute;
	top: 42%;
    left: 44%;
     font-size: 16px;
     font-family: audiowide;
     background-color: rgba(0, 0, 0, 0.5);
     padding: 8px 40px;
     width: 60px;
     display: inline-block;
	text-align: center;
     
}
    .gombocska6:hover {
      border: 1px solid #02ECF8;
      transition-duration: 0.5s;
} 
	}
	
}