@charset "utf-8";
/* CSS Document */
html {
	scroll-behavior: smooth;
}

* {
	padding: 0;
	margin: 0;
	border: 0;
}
#obal {
	
	width: 100%;
	height: auto;
	margin: 0 auto;
	
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Thin.ttf") format('ttf');
  font-weight: 100;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-ExtraLight.ttf") format('ttf');
  font-weight: 200;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Light.ttf") format('ttf');
  font-weight: 300;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Medium.ttf") format('ttf');
  font-weight: 500;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-SemiBold.ttf") format('ttf');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Bold.ttf") format('ttf');
  font-weight: 700;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-ExtraBold.ttf") format('ttf');
  font-weight: 800;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Black.ttf") format('ttf');
  font-weight: 900;
  font-style: normal;
}
@font-face {
  font-family: 'Montserrat';
  src: url("fonts/Montserrat-Regular.ttf") format('ttf');
  font-weight: 400;
  font-style: normal;
}
body {
  font-family: 'Montserrat', sans-serif;
}
.obal_onas {
	width: 100%;
	height: auto;
	margin: 0 auto;
}
@media (max-width: 1360px) {
	.domov {
		font-size: 11pt;
	}
	.octi {
		font-size: 11pt;
	}
	.prichute {
		font-size: 11pt;
	}
	.b2b {
		font-size: 11pt;
	}
	.shop {
		font-size: 11pt;
	}
	.kontakt {
		font-size: 11pt;
	}
	body .jazyk {
		font-size: 11pt;
		padding-top: 31px;
	}
	body .lomeno {
		font-size: 11pt;
		padding-top: 31px;
	}
	.socialne_siete {
		width: 4px;
		height: 5px;
	}
	body .bublina{
		width: 20%;
	}
	body .obal_bublina {
		margin-right: 15px;
	}
	body .nadpis_bublina {
		font-size: 12pt;
	}
	body .text_bublina {
		font-size: 7pt;

	}
	
	
	body .banner {
		position: relative;
		top: -210px;
	}
	body .nadpis_banner {
		font-size: 25pt;
	}
	body .podnadpis_banner {
		font-size: 10pt;
	}
	body .vyber {
		animation: vyber_tisic 0.8s linear forwards; 
	}
	body .slider {
		position: relative;
		top: 240px;
		height: 370px;
	}
	body .cta {
			width: 100%;
		height: 100%;
		max-width: 200px;
		max-height: 60px;
		position: absolute;
		bottom: -200px;
		right: 245px;
	}
	body .dots {
	
	display: none;
	}
	
	
	body .text_karta {
		font-size: 6pt;
	
	}
	body .nadpis_karta {
		font-size: 8pt;
	}
	body .karta_vyber {
		height: 450px;
		
	}
	body .obrazok_karta {
		object-fit: cover;
	}
	body .text_informacia {
		position: relative;
		left: 20px;
	}
}
@media (min-width: 2290px) {
	
	body .vyber {
		height: 390px;
		
	}
	body .obal_bublina {
		position: absolute;
		top: -280px;
			
	}
	body .bublina_dva {
		position: relative;
		left: 150px;
	}
	body .text_bublina {
		font-size: 11pt;
	}
	body .banner {
		width: 100%;
		height: 100%;
		max-height: 1150px;
		object-fit: cover;
	}
	body .nadpis_banner {
		font-size: 32pt;
	}
	body .podnadpis_banner {
		width: 30%;
		font-size: 14pt;
	}
	body .slider {
		height: 550px;
		
		
	}

	body .obal_recenzie {
		width: 750px;
		
	}
	body .jedna {
		width: 30%;
	}
body .dva {
		width: 20%;
	height: 20%;
	}
	body .tri {
		width: 50%;
		height: 20%;
		
	}
	body .review1 {
		width: 20%;
		
	}

	
	body .review2 {
		width: 20%;
		height: 20%;
		padding-bottom: 30px;
	}
	body .styri {
		width: 40%;
		height: 27%;
	}
	body .review3 {
		width: 26%;
		height: 22%;
	}
	body .pat {
		width: 30%;
		height: 26%;
	}
		body .sest {
		width: 30%;
		height: 26%;
	}
body .video_recept {
		width: 100%;
	max-width: 850px;
	
	height: 452px;
	margin-left: 0px;
	}
	body .obal_obrazok_produkt {
		width: 100%;
	height: 100%;
	max-width: 530px;
	max-height: 550px;
		
	}
}
@media (max-width: 1090px) {
    #obal {
        max-width: 100%;
       }
	.show {
		display: none;
		
	}
	.obal_jazyk {
		position: relative;
		left: 250px;
	}
	.jazyk {
		
		text-align: right;
		padding-right: 2px;
		padding-left: 2px;
		
	}
	
		.hideOnMobile {
		display: none;
	}
	.navigacia {
	display:flex;	
}
	body	.nadpis_banner {
		font-size: 20pt;
		 line-height: normal;
        display: block;
	}
	body .banner {
		position: relative;
		top: -160px;
	}
	body .podnadpis_banner {
		font-size: 6pt;
	}
	body .vyber {
		animation: vyber_tablet 0.8s linear forwards;
	}
	body .bublina {
		width: 25%;
	}
	body .bublina_jedna {
		width: 25%;
	}
	body .bublina_dva {
		width: 25%;
	}
		body .nadpis_bublina {
		font-size: 9pt;
	}
	body .text_bublina {
		font-size: 6pt;

	}
	body .obal_slider {
		height: 250px;
		position: relative;
		bottom: 470px;

		
	}
	body .slider {
		 height: 250px;
	}
	body .cta {
		width: 40%;
		position: absolute;
	
	left: 170px;
	}
	body .dots {
		display: none;
	}
	body .obal_karty_vyber_domov {
		position: relative;
		bottom: 0px;
	}
	body .best {
		position: relative;
		bottom: 0px;
		font-size: 14pt;
	}
	body .nadpis_recenzie {
		font-size: 14pt;
	}
	body .nadpis_recen_form {
		font-size: 14pt;
	}
	body .review-card {
		width: 250px;
	}
	body #formularRecenzia {
		width: 350px;
		margin-left: 20px;
	}
	body .text_vyber {
		font-size: 8pt;
	}
	body .text_recenzie {
		font-size: 6pt;
	}
	body .hviezdy {
		font-size: 7pt;
	}
	body .meno_recenzie {
		font-size: 7pt;
	}
	body .obal_text_kontakt {
		width: 70%;
		padding-left: 20px;
		
	}
	body .text_kontakt {
		font-size: 9pt;
		margin-left: 10px;
		
	}
	body .nadpis_kontakt {
		font-size: 10pt;
	}
	body .faktur_udaje {
		font-size: 7pt;
	}
	body .ikony_kontakt {
		width: 80%;
		position: relative;
		bottom: 10px;
	}
	body .siete {
		width: 20%;
	}
	
	body .nadpis_karta {
		font-size: 7pt;
	}
	body .ingrediencie {
		width: 55%;
	}
	body .postup_recept {
		width: 65%;
		font-size: 9pt;
	}
}


@media (max-width: 700px) {

	body header {
		width: 103%;
		
		height: 30px;
		
	}
	body .navigacia {
		width: 70%;
		position: relative;
		right: 40px;
		bottom: 10px;
	}
	body .sidebar {
		width: 60%;
	}
	body .hideOnMobile {
		font-size: 10pt;
		position: relative;
		bottom: 35px;
		
	}
		body .obal_jazyk {
		position: relative;
		left: 70px;
	}
	body .jazyk {
		font-size: 7pt;
		
		padding-right: 10px;
		position: relative;
		bottom: 21px;
	}
	body .lomeno {
			font-size: 7pt;
		
		padding-right: 10px;
		position: relative;
		bottom: 21px;
	}
	body .obal_jazyk_sidebar {
		margin-top: 0;
		text-align: center;
	}
	body .jazyk_sidebar {
		font-size: 6pt;
		position:relative;
		right: 35px;
		bottom: 25px;
	}
	body .lomeno_sidebar {
		font-size: 6pt;
		position:relative;
		right: 35px;
		bottom: 25px;
	}
	body .socialne_siete {
		position: relative;
		bottom: 35px;
		width: 10%;
		
	}
	body #logo {
		width: 30px;
		height: 26px;
		position: relative;
		bottom: 13px;
	}	
	body .text_banner {
		position: absolute;
		top: 55px;
	}
	
	body .banner {
		width: 105.5%;
		position: relative;
		top: -20px;
	
	}
	body	.nadpis_banner {
		font-size: 8pt;
		 line-height: normal;
      
	}
	body .podnadpis_banner {
		width: 50%;
		font-size: 4.7pt;
		line-height: 10px;
		position: relative;
		bottom: 10px;
	}
	body .obal_bublina {
		position: absolute;
		right: 45px;
		top: 30px;
	}
	body .bublina {
		width: 25%;
		height: 75px;
		padding: 15px;
		display: none;
	}
	body .bublina_jedna {
		width: 25%;
		height: 75px;
		padding: 15px;
		display: none;
	}
	body .bublina_dva {
		width: 25%;
		height: 75px;
		padding: 15px;
		display: none;
	}
	body .text_bublina {
		font-size: 4pt;
		position: relative;
		bottom: 28px;

	}
	body .nadpis_bublina {
		font-size: 6pt;
		position: relative;
		bottom: 26px;
	}
	body .vyber {
		width: 90%;
		height: 130px;
		padding: 10px;
		animation: animacia 1s linear forwards;
	}
	body .vyber_jednotka{
		width: 30%;
		height: 100px;
		position: relative;
		bottom: 40px;
	}
	body .viac_produkt {
		width: 100%;
		height: 100%;
		max-width: 65px;
		max-height: 25px;
		border-radius: 5px;
		font-size: 5pt;
		
	}
	body .ikony_vyber {
		width: 100%;
		height: 100%;
		max-width: 20px;
		max-height: 20px;
	}
	body .text_vyber {
		font-size: 5.4pt;
		line-height: 10px;
	}
	body h1 {
		font-size: 7pt;
	}
	
	
	body .obal_slider {
	height: 100%;
		max-height: 120px;
		position: relative;
		bottom: 10px;

	}
	body .slider {
		
		height: 120px;
		border-radius: 17px;
		position: relative;
		top: -10px;
	}
	body .cta {
		position: absolute;
		bottom: 0px;
		left: 70px;
		width: 100%;
		height: 100%;
		max-width: 100px;
		max-height: 2px;
		padding-bottom: 25px;
		background-color: #EC6F6F;
		color: white;
		
	}
	
	body .text_cta {
		font-size: 6.7pt;
	}
	body .dots {
		display: none;
	}
	
	body footer {
		width: 100%;
		height: 100%;
		max-width: 900px;
		max-height: 340px;
		
		padding-left: 20px;
	}
	body .obal_kontakt {
		width: 200%;
		position: relative;
		right: 20px;
		
	}
	body .obal_text_kontakt {
		width: 80%;
		
		
	}
	body .text_kontakt {
		font-size: 8pt;
		
		
	}
	body .ikony_kontakt {
		margin-top: 10px;
		position: relative;
		top: 30px;
	}
	body .nadpis_kontakt  {
		font-size: 7pt;
	}
	body .faktur_udaje {
		font-size: 6pt;
	}
	body .obal_siete {
		width: 50%;
	}
	body .siete {
		width: 45%;
	}
	body .mapa_obal {
		width: 60%;
		
	}
	body .mapa {
		width: 100%;
		height: 100%;
		max-height: 250px;
	}
	body .paticka {
		width: 100%;
		
	}
	body .text_paticka {
		font-size: 5pt;	}
	body .logo_paticka {
		width: 100%;
		height: 100%;
		max-width: 30px;
		max-height: 30px;
		position: relative;
		right: 15px;
	}
	body .nadpis_onas {
		font-size: 15pt;
	}
	body .text_onas_obal {
		width: 90%;
	}
	body .text_onas {
		line-height: 18px;
		font-size: 8pt;
	}
	body .nadpis_ikony_onas {
		font-size: 12pt;
		padding: 20px 20px 0px ;
	}
	
	body .vyhoda {
		width: 30%;
		border-radius: 15px;
	
	}
	body .nadpis_vyhoda {
		font-size: 9pt;
	}
	body .text_vyhoda {
		font-size: 6pt;
		margin-top: 5px;
	}
	body .machule_obal {
		position: relative;
		bottom: 0px;
		overflow: hidden;
		height: 100px;
	}
body .obal_text_form {
		width: 80%;
	}
	body .nadpis_formular {
	font-size: 16pt;	
}
body .obal_text_form p {
	
	font-size: 7pt;
}
	body .formular {
		width: 80%;
		
	}
	body .suhlas_text {
		font-size: 8pt;
	}
	body .nadpis_vyber {
		font-size: 14pt;
	}
	body .podnadpis_vyber {
		font-size: 9pt;
	}
	body .text_vyber_karta {
		font-size: 6.5pt;
		margin-top: 5px;
	}
body .obal_karty_vyber_domov {
		margin: auto;
	width: 100%;
	padding-left: 7px;
	
	}
		 body .obal_karty_vyber {
    justify-content: center;
    padding-left: 10px;
    gap: 10px;
  }

body   .karta_vyber {
    flex: 1 1 100%; /* na mobile celá šírka */
    max-width: 70%;
	height: 100%;
	max-height: 500px;
  }


	body .popup-content {
		width: 290px;
		height: 250px;
		margin-top: 15%;
	}
	body .policko_popup {
		margin-top: 13px;
	}
	body .text_popup {
		font-size: 7pt;
	}
	body .obal_stava {
		display: none;
	}
	body .stava {
		display: none;
	}
	body .nadpis_pre_recepty {
		font-size: 13pt;
	}
	body .recepty {
		width: 100%;
		height: 200px;
		margin-bottom: 40px;
	}
	body .text_informacia {
	font-size: 4pt;
	
	position: relative;
	right: 65px;
}
	body .obal_informacie_recepty {
		width: 70%;
	}
	body .meno_receptu {
		font-size: 6pt;
	}
	body .text_recepty {
		font-size: 4pt;
	}
	body .obal_text_recepty {
		font-size: 4pt;
	}
	body .podnadpis_recepty {
	 font-size: 5pt;
	}
	body .video_recepty {
		width: 25%;
		max-width: 200px;
		position: relative;
		bottom: 119px;
	
		
	}
	body .video_recepty_jedna {
		width: 100px;
		
	}

	}
	
	 

 .popup { display: none;
	 position: fixed; 
	 top: 0; 
	 left: 0; 
	 width: 100%; 
	 height: 100%; 
	 background: rgba(0,0,0,0.5); 
z-index: 20;
	
}
.obal_nadpis_zlava {
	width: 90%;
	height: 100%;
	max-height: 40px;
	
	
	display: flex;
	justify-content: center;
	gap: 15px;
}
.obal_stava {
	width: 100%;
	height: 233px;
	display: flex;
	justify-content: center;

	overflow: hidden;
	
}
.stava {
	width: 100%;
	height: 100%;
	max-width: 560px;
	max-height: 233px;
	position: relative;
	bottom: 60px;
}
.ikonka_zlava {
	width: 100%;
	height: 100%;
	max-width: 30px;
	max-height: 30px;
}
.nadpis_popup {
	font-size: 21pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
}
.text_popup {
	font-size: 10pt;
	font-family: Montserrat;
	margin-top: 10px;
}
.policko_popup {
	margin-top: 35px;
	border-bottom: solid 2px #EC6F6F;
	padding: 10px;
	width: 50%;
}
.button_popup {
	width: 110px;
	height: 25px;
	border: solid 2px #EC6F6F;
	margin-top: 15px;
	border-radius: 5px;
	background-color: transparent;
	cursor: pointer;
	transition: all 0.5s ease;
	color: #EC6F6F;
}
.button_popup:hover {
	color:white;
	background-color: #EC6F6F;
}
  .popup-content { background: #fff; 
	  margin: 10% auto; 
	  padding: 20px; 
	  width: 450px; 
	  height: 420px; 
	  border-radius: 10px; 
	  text-align: center; }

  .close { float: right; font-size: 24px; cursor: pointer; }


header {
	width: 99.2%;
	height: 75px;
	background-color: #B15353;
	display: flex;
	justify-content: space-between;
	padding: 5px;
	
}
#logo {
	
	width: 100%;
	height: 100%;
	max-width: 60px;
	max-height: 50px;
padding: 15px;
}

.show {
	width: 60%;
	
font-size: 17pt;
	text-align: center;
	
	margin: auto;
	padding-bottom: 20px;
	padding-right: 5px;
padding-left: 45px;
}
.obal_jazyk {
	width: 100%;
	max-width: 80px;
	height: auto;
	
	display: flex;
	justify-content: center;
}
.jazyk {
	text-decoration: none;
	font-size: 14pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	padding-top: 25px;
	transition: 2s;
}
.jazyk:hover {
	font-size: 16pt;
}
.lomeno {
	
	font-size: 14pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	margin-left: 3px;
	margin-right: 3px;
	padding-top: 25px;
}
.sidebar {
	position: fixed;
	top: 0;
	right: 0;
	padding-right: 55px;
	height: 100vh;
	width: 250px;
	z-index: 999;
	background-color:rgba(177,83,83,0.70);
	backdrop-filter: blur(10px);
	box-shadow: -10px 0 10px rgba(0, 0, 0, 0.1);
	display: none;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-start;
	text-align: center;
	padding-top: 25px;
	 animation-name: example;
	 
  animation-duration: 2s;
}

@keyframes example {
  0%   { right:-150px; top:0px;}
  100% { right:0px; top:0px;}
}

.navigacia {
	width: 45px;
	filter: invert(1);
}
.menu-button {
	width: 10%;
	
	
}
.kriz {
	width: 35px;
	padding-right: 25px;
	filter: invert(1);
}
.hideOnMobile {
	display: block;
	padding-left: 110px;
	color: white;
	margin-top: 15px;
	text-decoration: none;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 15pt;
	transition: 2s;
}
.hideOnMobile:hover{font-size: 18pt;}
.obal_jazyk_sidebar {
	width: 100%;
	height: 30px;

	display: flex;
	justify-content: flex-end;
	padding-right: 45px;
	margin-top: 10px;
	margin-bottom: 25px;
}

.jazyk_sidebar {
	text-decoration: none;
	font-size: 15pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	padding-top: 25px;
	transition: 2s;
	position: relative;
	right: 20px;
}
.jazyk_sidebar:hover {font-size: 18pt;}
.lomeno_sidebar {
	font-size: 15pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	padding-top: 25px;
	transition: 2s;
	margin-left: 5px;
	margin-right: 5px;
	position: relative;
	right: 20px;
}
.lomeno_sidebar:hover {font-size: 18pt;}
li {
	list-style-type: none;
	display: inline;
	margin-left: 55px;
	position: relative;
	top: 10px;
}
.domov {
	text-decoration: none;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #661A17;
	transition: 2s;
}
.domov:hover{font-size: 19pt;}

.octi {
	text-decoration: none;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #891914;
	transition: 2s;
}
.octi:hover{font-size: 19pt;}

.prichute {
	text-decoration: none;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #D17900;
	transition: 2s;
}
.prichute:hover{font-size: 19pt;}

.b2b {
	text-decoration: none;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #D38D1A;
	transition: 2s;
}
.b2b:hover{font-size: 19pt;}

.shop {
	text-decoration: none;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #EDB63B;
	transition: 2s;
}
.shop:hover{font-size: 19pt;}

.kontakt {
	text-decoration: none;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	color: #E7C87D;
	transition: 2s;
}
.kontakt:hover{font-size: 19pt;}

.socialne_siete {
	width: 28px;
	height: 29px;
	filter: invert(1);
	margin-left: 24px;
	padding-left: 20px;
	padding-top:30px;
	transition: 2s;
	position: relative;
left: 30px;
}
.socialne_siete:hover{transform: scale(1.2)}

.uvod {
	width: 100%;
	
}
.nadpis_banner {
	font-size: 30pt;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 900; /* Black */
	margin-left: 15px;
	margin-top: 15px;
	
}
.podnadpis_banner {
	width: 40%;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* regular */
	font-size: 12pt;
	line-height: 23px;
	margin-left: 15px;
	margin-top: 15px
}
.text_banner {
	display: none;
	width: 29%;
	position: absolute;
	right: 16px;
	top: 110px;
}
.banner {
	width: 100%;
	height: 100%;
	
	max-height: 900px;
	position: relative;
	bottom: 95px;
	z-index: -1;
}
.obal_vyber {
	width: 100%;
	height: auto;
	background-color: blue;
	
	
}  
.vyber {
	width: 85%;
	height: 280px;
	border-radius: 20px;
	margin:auto;
	display: flex;
	justify-content: space-around;
	background-color: white;
position: relative;
	animation: vyber 0.8s linear forwards;
	box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.3);
}
@keyframes animacia {
	from   { bottom: 0px;}
  to {  bottom:55px;}
}

@keyframes vyber {
		from   { bottom: 0px;}
  to {  bottom: 275px;}
}
@keyframes vyber_tablet {
	from   { bottom: 0px;}
  to {  bottom: 285px;}
}
@keyframes vyber_tisic {
	from   { bottom: 0px;}
  to {  bottom: 285px;}
}
.obal_bublina {
 
	width: 75%;
	height: 280px;
	border-radius: 20px;
	margin:auto;
	display: flex;
	justify-content: space-between;
	
position: absolute;
	bottom: 190px;
	right: 10%;
	left: 22%;
	z-index: 1;

}
.bublina {
	width: 20%;
	height: 196px;
	background-color: #F29999;
	border-radius: 70px 70px 70px 0px;
	padding: 15px;
	text-align: center;
	
	opacity: 0;
    visibility: hidden;
    
    transition: opacity 0.6s ease-in-out, visibility 0.3s ease-in-out;
	color: white;
}
.bublina_jedna {
	width: 20%;
	height: 196px;
	background-color: #F29999;
	border-radius: 70px 70px 70px 0px;
	padding: 15px;
	text-align: center;
	position: relative;
	left: 45px;
	opacity: 0;
    visibility: hidden;
	
    transition: opacity 0.6s ease-in-out, visibility 0.3s ease-in-out;
	color: white;
}
.bublina_dva {
	width: 20%;
	height: 196px;
	background-color: #F29999;
	border-radius: 70px 70px 70px 0px;
	padding: 15px;
	text-align: center;
position: relative;
	left: 105px;
	opacity: 0;
    visibility: hidden;
    transition: opacity 0.6s ease-in-out, visibility 0.3s ease-in-out;
	color: white;
}
 .vyber:hover  .bublina {
           opacity: 1;
    visibility: visible;
        }
 .vyber:hover  .bublina_jedna {
           opacity: 1;
    visibility: visible;
        }
 .vyber:hover  .bublina_dva {
           opacity: 1;
    visibility: visible;
        }
.nadpis_bublina {
	font-size: 15pt;
		 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	margin-top: 28px;
}
.text_bublina {
	font-size: 9pt;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	margin-top: 10px;
}
.vyber_jednotka {
	width: 30%;
	height: 280px;
	transition: 2s;
	z-index: 10;
	position: relative;
	text-align: center;
	
}
.ikony_vyber {
	width: 20%;
	margin-top: 40px;
	
}
.odkaz {
	text-decoration: none;
	color:black;
}
h1 {
	margin-top: 10px;
	 font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 17pt;
}
.text_vyber {
	 font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	font-size: 10pt;
	margin-top: 8px;
	
}
.viac_produkt {
	width: 100%;
	height: 100%;
	max-width: 148px;
	max-height: 44px;
	background-color: transparent;
	border: solid 2.5px #EC6F6F;
	border-radius: 10px;
	cursor: pointer;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 10pt;
	color: #EC6F6F;
fill:#EC6F6F;
	position: relative;
	top: 15px;
	transition: 0.8s ease-in-out, visibility 0.6s ease-in-out;

}
.viac_produkt:hover {
	color: white;
	fill:white;
	background-color: #EC6F6F;
}
.sipka_odkaz {
	width: 12%;
}
.obal_slider {
	width: 60%;
	height: 450px;
	border-radius: 53px;
	margin:auto;
	position: relative;
	bottom: 180px;
}
.slider {
    width: 100%;
    height: 450px;
    overflow: hidden;
	margin:auto;
  box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.3);
    border-radius: 53px;
	opacity: 0; /* Začneme s neviditeľným sliderom */
    transform: translateX(-100%); /* Začneme mimo obrazovky zľava */
    transition: all 1s ease; /* Plynulý prechod */
}
.slider.slider-visible {
    opacity: 1; /* Zobrazíme slider */
    transform: translateX(0); /* Posuneme ho na správnu pozíciu */
}

.slides {
    display: flex;
    width: 300%; /* 3 obrázky */
    animation: slide 9s infinite;
	
}

.slides img {
    width: 33.33%;
    height: auto;
	max-height: 680px;
	object-fit: cover;
}

/* Animácia posúvania */
@keyframes slide {
     0%, 33.33% { transform: translateX(0%); }
    36.33%, 66.66% { transform: translateX(-33.33%); }
    69.66%, 100% { transform: translateX(-66.66%); }
}

/* Štýl bodiek */
.dots {
    display: flex;
    justify-content: center;
    margin-top: 10px;
	position: relative;
	bottom: 180px;
}

.dot {
    width: 15px;
    height: 15px;
    margin: 5px;
    background-color: #ccc;
    border-radius: 50%;
    transition: background-color 0.3s ease;
}

/* Zmena farby bodiek cez animáciu */
@keyframes dotAnimation {
    0%, 33.33% { background-color: #F29999; }
    36.33%, 66.66% { background-color: #ccc; }
    69.66%, 100% { background-color: #ccc; }
}

.dot:nth-child(1) { animation: dotAnimation 9s infinite; }
.dot:nth-child(2) { animation: dotAnimation 9s infinite 3s; }
.dot:nth-child(3) { animation: dotAnimation 9s infinite 6s; }

.cta {
	width: 22%;
	height: 80px;
	border: 5px solid #EC6F6F; 
	position: absolute;
	right: 41%;
	bottom: 15px;
	border-radius: 12px;
	cursor: pointer;
	
padding: 10px;
	
	opacity: 0; /* Začneme s neviditeľným sliderom */
    transform: translateX(-100%); /* Začneme mimo obrazovky zľava */
    transition: all 1s ease; 
}
.cta.cta-visible {
    opacity: 1; /* Zobrazíme slider */
    transform: translateX(0); /* Posuneme ho na správnu pozíciu */
}

.text_cta {
font-size: 11pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	
}
.cta:hover {
	background-color: #EC6F6F;
	color:white;
	transform: scale(1.1);
}
.best {
	padding: 30px;
	font-size: 20pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	position: relative;
	bottom: 150px;
	text-align: center;
}
.obal_karty_vyber_domov {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-around;
	gap:10px;
	position: relative;
	bottom: 150px;
	margin-bottom: 25px;
}
.nadpis_recenzie {
	padding: 10px;
	font-size: 20pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
}
.reviews-container {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 2rem;
  padding: 2rem;
	
}

.review-card {
    width: 300px;
    padding: 1.5rem;
    border: 1px solid #eee;
    border-radius: 1rem;
    box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.3);
    font-family: sans-serif;
    margin-bottom: 2rem;
  }

  .review-header {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
  }

  .review-header img {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    object-fit: cover;
  }

  .review-stars {
    display: flex;
    gap: 0.3rem;
    margin-bottom: 0.8rem;
  }

  .star {
    width: 24px;
    height: 24px;
    fill: #EC6F6F;
  }

  /* Prázdna hviezda sivá */
  .star.empty {
    fill: #ccc;
  }
.obal_nadpis_recen {
	width: 100%;
	display: flex;	
	justify-content: center;
	
}
.nadpis_recen_form {
	
	font-size: 16pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	position: relative;
	top: 20px;
}
#formularRecenzia {
  max-width: 450px;
	padding: 10px;
  margin:  auto;
	margin-top: 45px;
	margin-bottom: 25px;
  font-family: Arial, sans-serif;
	box-shadow: 0px 4px 8px 4px rgba(0, 0, 0, 0.3);
	border-radius: 13px;
}

.form-group {
  margin-bottom: 1rem;
}

.form-group label {
  display: block;
  margin-bottom: 0.3rem;
  font-weight: bold;
}

.form-group input[type="text"],
.form-group textarea {
  width: 100%;
  padding: 0.5rem;

  border-bottom: solid 2px #EC6F6F;
  box-sizing: border-box;
  font-size: 1rem;
  font-family: inherit;
}

#formularRecenzia-hviezdy {
  display: flex;
  gap: 0.3rem;
  font-size: 1.8rem;
  color: #ccc;
  cursor: pointer;
  margin-top: 0.3rem;
}

#formularRecenzia-hviezdy span:hover,
#formularRecenzia-hviezdy span.hovered,
#formularRecenzia-hviezdy span.selected {
  color: #EC6F6F;
}
.obal_button_recenzia {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
}
.tri {
  padding: 0.7rem 1.2rem;
	
  border: 2px solid #EC6F6F;
  border-radius: 6px;
 background-color: transparent;
  color: #EC6F6F;
  cursor: pointer;
  font-size: 1rem;
  font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
  transition: 1.3s;
}

.tri:hover {
  background:#EC6F6F;
	color:white;
}
footer{
	width: 100%;
	height: 469px;
	max-height: 469px;
	background-color: #B15353;
	display: flex;
	justify-content: space-between;
}
.obal_kontakt {
	width: 50%;
	height: 100%;
	max-height: 429px;
	
	padding: 20px;
	
}

.obal_ikony {
	width: 10%;
	height: 328px;
	
	float:left;
	
}
.ikony_kontakt {
	width: 100%;
	height: 100%;
	max-width: 40px;
	margin-top: 30px;
	margin-left: 20px;
	max-height: 40px;
	display:block;
	filter: invert(1);
	
}
.obal_text_kontakt {
	width: 80%;
	height: 328px;
	padding-left: 10px;
	float:left;
	padding-top: 15px;
}
.text_kontakt {
	font-size: 12pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	display: block;
	margin-top: 40px;
	
}
.nadpis_kontakt {
	font-size: 13pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	color:white;
	margin-top: 40px;
}
.faktur_udaje {
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	color:white;
	margin-top: 10px;
}
.obal_siete {
	width: 30%;
	
	display: flex;
	justify-content: space-between;
	padding-top: 15px;
}
.siete {
	width: 28px;
	height: 29px;
	filter: invert(1);
	transition: 2s;
	
}
.siete:hover{transform: scale(1.15)}
.mapa_obal {
	width: 50%;
	height: 100%;
	max-height: 429px;
	padding: 10px;
	
}
.mapa {
	width: 80%;
	height: 100%;
	max-height: 326px;
	border-radius: 34px;
	margin-top: 50px;
	display: none;
}
.obal_paticka {
	width: 100%;
	background-color: #AE4242;
}
.paticka {
	width: 98%;
	height: 44px;
	background-color: #AE4242;
margin:auto;
	display: flex;
	justify-content: space-between;
	padding-top: 10px;
	

}
.text_paticka {
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	font-size: 9pt;
	margin-top: 10px;
	color: white;
}
.logo_paticka {
	width: 30px;
	margin-top: 5px;
}

.text_onas_obal {
	width: 60%;
	height: 100%;
	max-height: 350px;
	margin:auto;
	margin-top: 65px;
	
	text-align: center;
}
.nadpis_onas {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 21pt;
}

.text_onas {
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	font-size: 12pt;
	margin-top: 5px;
}
.nadpis_ikony_onas {
		font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 18pt;
	margin-left: 15px;
	padding: 30px;
}
.obal_vyhody {
	width: 100%;
	height: 100%;
	max-height: 750px;
	padding-top: 40px;
}
.vyhody_prvy_riadok {
	width: 100%;
	height: 100%;
	max-height: 375px;
	display: flex;
	justify-content:space-around;
	flex-wrap: wrap;
	gap:10px;
	margin-top: 60px;
}
.vyhody_druhy_riadok {
	width: 100%;
	height: 100%;
	max-height: 375px;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 15px;
	margin-bottom: 140px;
}
.vyhoda {
	width: 20%;
	padding: 15px;
	background-color: white;
	text-align: center;
	border-radius: 41px;
	box-shadow: 4px 5px 6.3px 0 rgba(0, 0, 0, 0.35);
	transition: all 1.5s ease;
}
.vyhoda:hover {
	transform: scale(1.1);
}
.vyhody:active {
	transform: scale(1.1);
}
.ikonky_vyhody {
	width: 20%;
}
.nadpis_vyhoda {
	font-size: 14pt;
		font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
}
.text_vyhoda {
	font-size: 11pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
	
}
.obal_text_form {
	width: 65%;
	margin: auto;
	text-align: center;
	padding-top: 10px;

}
.nadpis_formular {
	font-size: 30px;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	
}
.obal_text_form p {
	padding-top: 10px;
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
}
.obal_formular {
	width: 100%;
	height: 100%;
	max-height: 650px;
	
}
.formular {
	width: 100%;
	max-width: 520px;
	background-color: white;
	box-shadow: 3px 10px 8.7px -1px rgba(0, 0, 0, 0.3);
	margin:auto;
	margin-top: 40px;
	margin-bottom: 20px;
	border-radius: 40px;
display: flex;
	justify-content: center;
	padding: 15px;
}
.vlavo {
	width: 100%;
	margin-top: 20px;
	
	
}
.formular_text {
	width: 100%;
	height: 30px;
	padding: 5px;
	background-color: transparent;
	border-bottom: solid 2px #EC6F6F;
	
	margin-top: 10px;
	font-size: 9pt;
	font-family: Montserrat;
}
h7 {
	font-size: 12pt;
		font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	position: relative;
	top: 7px;
}
.sprava {
	width: 100%;
	height: 120px;
	background-color: transparent;
	border-bottom: solid 2px #EC6F6F;
	margin-top: 10px;
	padding: 5px;
	font-size: 9pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
}
.suhlas {
	margin-top: 20px;
	border: solid 1px #EC6F6F;
	
}
.suhlas_text {
	font-size: 10pt;
		font-family: 'Montserrat', sans-serif;
  font-weight: 400; /* Regular */
}
input[type="checkbox"] {
  accent-color: #EC6F6F; /* zmení farbu zakliknutia v moderných prehliadačoch */
}
.obal_tlacitko {
	width: 100%;
	display: flex;
	justify-content: center;
	
}
.tlacidlo_form {
	width: 37%;
	height: 30px;
	border-radius: 8px;
	background-color: transparent;
	border: solid 2px #EC6F6F;
	color: #EC6F6F;
	margin-top: 17px;
	transition: all 1.5s ease;
	cursor: pointer;
}
.tlacidlo_form:hover {
	background-color: #EC6F6F;
	color:white;
}
.machule_obal {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
}
.machula_jedna {
	width: 30%;
	z-index: -1;
	position: relative;
	top: 30px;
	
	transform: rotate(9deg);
}
.machula_dva
{
	width: 30%;
	z-index: -1;
	position: relative;
	top: 30px;
	transform: rotate(-9deg);
}
.obal_text_vyber {
	width: 80%;
	height: auto;
	
	
	padding: 15px;
}
.nadpis_vyber {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 23pt;
}
.podnadpis_vyber {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 14pt;
	margin-top: 10px;
}
.text_vyber_karta {
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; 
	font-size: 11pt;
}
.obal_karty_vyber {
  width: 97%;
  display: flex;
  justify-content: space-around;
  gap: 20px;
  flex-wrap: wrap; /* nech sa zalomia len keď treba */
	margin-bottom: 50px;
	margin-top: 40px;
}

.karta_vyber {
  flex: 1 1 calc(50% - 20px); /* vždy max 2 vedľa seba */
  max-width: 500px; /* nech to nejde do nekonečna */
  height: auto; /* nech si to prispôsobí */
  background-color: white;
  border-radius: 0 0 20px 20px;
  box-shadow: 3px 10px 8.7px -1px rgba(0, 0, 0, 0.3);
  text-align: center;
  transition: 1s ease;
	margin-bottom: 10px;
	padding-bottom: 15px;
}
.karta_vyber:hover {
	transform: scale(1.05);
}
.viac_produkt_karty {
	width: 100%;
	height: 100%;
	max-width: 348px;
	max-height: 44px;
	background-color: transparent;
	border: solid 2.5px #EC6F6F;
	border-radius: 10px;
	cursor: pointer;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 10pt;
	color: #EC6F6F;
fill:#EC6F6F;
	display: flex;
	justify-content: center;
	text-decoration: none;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: auto;
	transition: 2s;

}
.viac_produkt_karty:hover {
	color: white;
	fill:white;
	background-color: #EC6F6F;
}
.obrazok_karta {
	width: 100%;
object-fit:cover;
	height: 100%;
	
	max-height: 290px;
}
.nadpis_karta {
	width: 90%;
	margin: auto;
	font-size: 12pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	padding: 10px;
}
.text_karta {
	width: 70%;
	margin: auto;
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; 
	padding: 0px 10px 15px 10px;
}
@media (max-width: 700px) {
	body .nadpis_karta {
		font-size: 7.5pt;  /* len na malých obrazovkách */
		padding: 3px;
	}
	body .text_karta {
		font-size: 6.5pt;
	}
	body .viac_produkt_karty {
		width: 100%;
	height: 100%;
	max-width: 105px;
	max-height: 10px;
		font-size: 6.5pt;
		border-radius: 5px;
		padding-bottom: 20px;
		text-align: center;
	}
		
	body .zobrazit {
		font-size: 5pt;
	}
}
.zobrazit {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 11pt;
	color: #EC6F6F;
	position: relative;
	bottom: 5px;
}
.text_informacia {
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	position: relative;
	right: 50px;
}
.nadpis_pre_recepty {
	font-size: 23pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	margin-top: 75px;
	margin-left: 20px;
	margin-bottom: 50px;
}
.recepty {
	width: 82%;
	height: 450px;
	display: flex;
	justify-content: space-around;
	
	margin:auto;
}
.obal_informacie_recepty {
	width: 60%;
	height: 100%;
	max-height: 30px;
margin-top: 10px;
	margin-bottom: 5px;
	display: flex;
	justify-content: flex-start;
	gap: 5px;
}
.obal_text_recepty {
	width: 50%;
	height: 100%;
	max-height: 352px;
	
	padding-left: 5px;
	
}
.meno_receptu {
	font-size: 16pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	padding-bottom: 10px;
}
.text_recepty {
	font-family: Montserrat;
	font-size: 10pt;
}
.podnadpis_recepty {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 12pt;
}
.video_recepty {
	width: 44%;
	max-width: 450px;
	height: 100%;
	max-height: 352px;
	margin-left: 0px;
	margin-top: 65px;
	
}
.video_recepty_jedna {
	border-radius: 15px;
}
@media  (max-width: 700px) {
		body .obal_produkt {
		  display: flex;         /* nechaj flex */
    flex-direction: column; /* obrázok hore, text dole */
    align-items: center;    /* zarovná do stredu */
	}
	body .slider2 {
		width: 100%;
		
		height: 100%;
	}
	
	body .slides2 {
		width: 100%;
		height: 100%;
		max-width: 450px;
		max-height: 350px;
	}
	body #radio2-1:checked ~ .slides2 {
  transform: translateX(0%);
}

body #radio2-2:checked ~ .slides2 {
  transform: translateX(-100.8%);
}

body #radio2-3:checked ~ .slides2 {
  transform: translateX(-203.7%);
}
	body .arrow2 {
		font-size: 8pt;
		
		display: flex;
		justify-content: center;
	
	}
	
	body .manual-btn2 {
		width: 1px;
		height: 1px;
	}
	 body .obal_text_produkt {
    width: 80% !important;
    max-width: 100% !important;
    margin: 10px 0;  /* nech má trošku priestoru od slidera */
  }
	body .text_produkt {
		font-size: 6pt;
		line-height: 14px;
	}
	body .nadpis_produkt {
		font-size: 10pt;
	}
	body .podnadpis_produkt {
		font-size: 7pt;
	}
	body .cena {
		font-size: 8pt;
	}
	body .tlacitko_produkt {
		width: 100%;
		height: 100%;
		max-width: 120px;
		max-height: 35px;
		border-radius: 9px;
		padding: 3px;
	}
	body .kosik {
		width: 100%;
		height: 100%;
		max-width: 15px;
		max-height: 15px;
	}
	body .nakup_text {
		font-size: 6pt;
	}
 body .obal_nadpis_recept {
    font-size: 12pt;
    padding: 5px;
	 text-align: center;
  }

 body  .video_recept {
    width: 100%;
    max-width: 250px;
    max-height: 150px;
  }

 body  .obal_text_recept {
    font-size: 6pt;
    line-height: 10px;
  }
	
	body .suroviny {
		font-size: 5pt;
		line-height: 18px;
	}
	body .nadpis_recept_meno {
		font-size: 8pt;
		line-height: 15px;
	}
	body .cas_receptu {
		width: 100%;
		height: 100%;
		max-width: 7px;
		max-height: 7px;
		
	}
	body .text_informacie {
		font-size: 4.3pt;
		position: relative;
		right: 4px;
	}
	body .narocnost {
		width: 100%;
		height: 100%;
		max-width: 7px;
		max-height: 7px;
	}
	body .obal_informacie_receptu {
		width: 100%;
		
		display: flex;
		justify-content: space-around;
	}
	body .ingrediencie {
		width: 40%;
		height: 290px;
	}
	body .postup_recept {
		width: 60%;
		font-size: 6.5pt;
		line-height: 15px;
	}
	body .obal_dalsie_produkty {
		padding: 5px;
		padding-top: 45px;
		
	}
	body .obal_produkty {
		width: 100%;
		
	}
	body .produkty {
		font-size: 12pt;
	}
	body .nadpis_produkty {
		font-size: 9pt;
	}
	body .text_produkty {
		font-size: 6.7pt;
	}
	body .obrazok_produkty {
		width: 100%;
		height: 100%;
		max-width: 250px;
		max-height: 150px;
	}
	body .obal_obrazok_produkty {
	width: 100%;
	height: 100%;
	max-width: 88px;
	max-height: 151px;
		
	}
	body .tlacitko_produkty {
	width: 100%;
	height: 100%;
	max-width: 80px;
	max-height: 25px;
		font-size: 6pt;
	}
	body .obal_informacie_receptu {
		
		width: 14%;
		height: 20px;
		
	}
	body .cas_receptu {
		width: 100%;
		height: 100%;
		max-width: 15px;
		max-height: 15px;
		position: relative;
		right: 10px;
	}
	
	body .obtiaznost_ikonky {
		width: 100%;
		height: 100%;
		max-width: 8px;
		max-height: 8px;
		position: relative;
		right: 15px;
		
	}
	body .obal_ikonky_receptu {
		width: 100%;
		height: 20px;
		
	
	
	}
	
}
.obal_produkt {
	width: 99%;
	height: auto;
	display: flex;
	justify-content: space-between;
	
	margin-top: 20px;
	
}
.obal_obrazok_produkt {
	width: 37%;
	height: auto;
	padding: 10px;
	margin: auto;
	
}

 .slider2 {
  position: relative;
  width: 100%;
  max-width: 600px;
  height: 100%;
	 max-height: 450px;
  margin: auto;
  overflow: hidden;
  border-radius: 10px;
	 
}

.slides2 {
  display: flex;
  width: 300%;
  height: 100%;
  transition: transform 0.5s ease;
}

.slides2 img {
width: 100%;
	max-width: 550px;
  height: 100%;
  object-fit: cover;
}

.radio2 {
  display: none;
}

#radio2-1:checked ~ .slides2 {
  transform: translateX(0%);
}

#radio2-2:checked ~ .slides2 {
  transform: translateX(-33.3%);
}

#radio2-3:checked ~ .slides2 {
  transform: translateX(-66.7%);
}

.arrow2 {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.4);
  color: #fff;
  font-size: 20px;
  padding: 10px;
  border-radius: 50%;
  cursor: pointer;
  z-index: 2;
  user-select: none;
	
}

.left2 {
  left: 5px;
}

.right2 {
  right: 5px;
}

.nav-arrows2 {
  display: none;
}

#radio2-1:checked ~ .nav1,
#radio2-2:checked ~ .nav2,
#radio2-3:checked ~ .nav3 {
  display: block;
}

.navigation-manual2 {
  position: absolute;
  bottom: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  gap: 10px;
}

.manual-btn2 {
  border: 2px solid #fff;
  padding: 5px;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s;
}

.manual-btn2:hover {
  background: #fff;
}

.obal_text_produkt {
	width: 49%;
	height: auto;
	padding: 10px;
}
.obrazok_produkt {
	width: 100%;
	height: 100%;
	max-width: 630px;
	max-height: 450px;
	border-radius: 25px;
	
}
.text_produkt {
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
	font-weight: 400;
	margin-top: 15px;
	line-height: 20px;
}
.nadpis_produkt {
	font-size: 17pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
}
.podnadpis_produkt {
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	margin-top: 4px;
}
.cena {
	font-size: 12pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	margin-top: 15px;
}
.tlacitko_produkt {
	width: 100%;
	height: 100%;
	max-width: 150px;
	max-height: 55px;
	background-color: transparent;
	border-radius: 15px;
	border: solid 3px #EC6F6F;
	margin-top: 15px;
	text-align: content;
	padding: 5px;
	padding-bottom: 5px;
	transition: 1.6s;
	color: #EC6F6F;
	fill: #EC6F6F;
	cursor: pointer;
}
.tlacitko_produkt:hover {
	background-color: #EC6F6F;
color: white;
	fill: white;
}

.kosik {
	width: 100%;
	height: 100%;
	max-width: 25px;
	max-height: 25px;
	
}
.nakup_text {
	font-size: 9pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	
}
.obal_nadpis_recept {
	width: 90%;
	height: auto;
	
	margin-top: 50px;
	padding: 15px;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 14pt;
}
.obal_video_produkt {
	width: 100%;
	height: auto;
	
	display: flex;
	justify-content: center;
	padding-top: 25px;
	margin-top: 10px;
}

.video_recept {
	border-radius: 15px;
}
.obal_text_recept {
	width: 90%;
	height: auto;
	
	display: flex;
	justify-content: center;
	margin:auto;
	padding: 15px;
	line-height: 21px;
	font-family:Montserrat;
	font-size: 11pt;
	margin-top: 30px;
}
.ingrediencie {
	width: 27%;
	height: auto;
	border-right: solid 2.5px black;
}
.obal_cele_ikonky {
	width: 100%;
	height: 30px;
	margin-top: 10px;
	display: flex;
	justify-content: flex-start;
	
}
.obal_informacie_receptu {
	width: 15%;
	height: 100%;
	max-height: 30px;
margin-top: 10px;
	margin-bottom: 5px;
	
	padding-left: 15px;
}
.text_informacie {
	font-size: 10pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	
}
.obal_celkovo_text {
	width: 100%;
	height: 100%;
	max-height: 30px;
	
	display: flex;
	justify-content: flex-start;
	margin-top: 9px;
}
.obal_text_info {
	width: 20%;
height: 100%;
	
	max-height: 30px;
	padding-left: 5px;
	
	
}
.obal_text_narocnost {
	width: 35%;
height: 100%;
	
	max-height: 30px;
	padding-left: 5px;
	text-align: center;
	
}
.obal_ikonky_receptu {
	width: 55%;
	height: 100%;
	max-height: 30px;
margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 5px;
	
	padding-left: 15px;
}
.obtiaznost_ikonky {
	width: 100%;
	height: 100%;
	max-width: 20px;
	max-height: 20px;
}
.cas_receptu {
	width: 100%;
	height: 100%;
	max-width: 24px;
	max-height: 24px;
	
	
}

.postup_recept {
	width: 73%;
	padding-left: 10px;
}
.text_recept {
	margin-top: 15px;
}
.nadpis_recept_meno {
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 16pt;
	margin-bottom: 5px;
	line-height: 28px;
}
.suroviny {
	line-height: 30px;
font-family: 'Montserrat', sans-serif;
  font-weight: 400; 
	font-size: 11pt;
}
.obal_dalsie_produkty {
	width: 80%;
	height: auto;
	margin-top: 40px;
margin-bottom: 20px;
	padding: 15px;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 14pt;
}
.obal_produkty{
	width: 100%;
	height: auto;
	
	margin-bottom: 100px;
	display: flex;
	justify-content: flex-start;
	gap: 25px;
}
.obal_obrazok_produkty {
	width: 100%;
	height: 100%;
	max-width: 188px;
	max-height: 251px;
	
}
.obrazok_produkty {
	width: 100%;
	height: 100%;
	max-width: 248px;
	max-height: 101px;
	transform: scale(1.7);
}
.obal_text_produkty {
	width: 50%;
	height: auto;
	
	padding: 10px;
}
.nadpis_produkty {
	font-size: 13pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
}
.text_produkty {
	font-size: 9pt;
	font-family: 'Montserrat', sans-serif;
  font-weight: 400; 
	margin-top: 5px;
}
.tlacitko_produkty {
	width: 100%;
	height: 100%;
	max-width: 120px;
	max-height: 35px;
	margin-top: 15px;
	border-radius: 9px;
	background-color: #EC6F6F;
	color: white;
	font-family: 'Montserrat', sans-serif;
  font-weight: 600; /* SemiBold */
	font-size: 8pt;
	cursor: pointer;
	transition: 1.5s;
}
.tlacitko_produkty:hover {
	 box-shadow: 0 0 10px rgba(0, 0, 0, 0.8);
	transform: scale(1.04);
}