:root {
	--main-szin1: #2b3b46; 
	--main-szin2: #b5995f;
	--main-szin3: #bbc1c4;
	--main-kozepszurke:#555555;
	--main-betuszin: #000;
	--main-betuszin-vilagos: #c4b29f;
	--main-betuszin-hover: rgb(10, 23, 45);
}
@keyframes nagyit {
    0% {margin-top: 0%;}
	0% {margin-left: 0%;}
	0% {height: 100%;}
    100% {margin-top: -5%;}
	100% {margin-left: -5%;}
	100% {height: 110%;}
}
@keyframes attunes {
    0% {opacity: 0; transform: scale(0);}
	0% {filter: alpha(opacity=0);}
	    25% {opacity: 10;}
	25% {filter: alpha(opacity=100);}
	    100% {opacity: 10;}
	50% {filter: alpha(opacity=100); transform: scale(1);}
    50% {opacity: 10;}
	100% {filter: alpha(opacity=100);}
}
@keyframes pulse {
	0% {
		transform: scale(1);
		box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
	}

	70% {
		transform: scale(1);
		box-shadow: 0 0 0 16px rgba(255, 255, 255, 0);
	}
	100% {
		transform: scale(1);
		box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
	}
}
@keyframes forgat {
    0% {    -ms-transform: rotate(0deg); /* IE 9 */
    -webkit-transform: rotate(0deg); /* Safari */
    transform: rotate(0deg);}
	 	25% {    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);}
	 	50% {    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);}
	 	 	75% {    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(360deg); /* Safari */
    transform: rotate(180deg);}
	 	100% {    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Safari */
    transform: rotate(180deg);}

}
body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	font-family: 'Roboto', sans-serif;
	box-sizing: border-box;
	font-size: 11pt;
	font-weight: 300;
	line-height: 180%;
	scroll-behavior: smooth;
}
html {
	scroll-behavior: smooth;
}
h1 {
	font-size: 24pt;
	line-height: 140%;
	/* font-family: 'Lobster', sans-serif; */
	font-family: "Kalnia", serif;
	color: var(--main-szin1);
}
.nyitoblokk h1{
	font-size: 18pt;
}
h2 {
	font-size: 16pt;
	line-height: 160%;
	font-weight: 700;
}
h3 {
	font-size: 12pt;
	font-weight: 700;
	margin: 0px;
}
a:link, a:visited {
	text-decoration: none;
	color: var(--main-betuszin);
}
a.fhiv:link, a.fhiv:visited {
	color: var(--main-betuszin-vilagos);
}
a.shiv:link, a.shiv:visited {
	color: #000;
}
a:hover, a.shiv:hover {
	text-decoration: none;
	color: var(--main-betuszin-hover);
}
.alap {
	max-width: 1400px;
	margin: auto;
	position: relative;
}
.fejsor {
	height: 34px;
}
.menusorAlap {
	height: 50px;
	background-color: var(--main-szin1);
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50px 100%);
	margin-left: 200px;
}
.menusor {
	position: absolute;
	z-index: 200;
	margin-top: -50px;
	right: 8px;
}
.keresosor {
	height: 100px;
	background-color: var(--main-szin2);
	border-top: 4px solid white;
	border-bottom: 4px solid white;
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 100px 100%);
	margin-left: 250px;
}
.keresosor h1 {
	margin: 25px 100px;
	color: white;
}
.keresosor h2 {
	color: white;
	margin: 10px 50px;
}
.keresosor .inpAlap {
margin-left: 92px;
}
.nyelvalap2 {
	display: none;
    }
.nyelvalap {
	float:right;
	margin-top: -86px;
	margin-right: 8px;
}
.nyelv img{
	width: 20px;
	height: 20px;
	border: 2px solid #ffffff;
	border-radius: 50%;
}
.nyelv-on {
	opacity: 1.0;
}.attetszo {
	opacity: 0.5;	
	transition: 200ms;
}
.attetszo:hover {
	opacity: 1.0;	
	transition: 200ms;
	cursor: pointer;
}

.abszKozep {
	display: flex; 
    justify-content: center; 
    align-items: center; 
}
.testsor {
	position: relative;
	margin-bottom: 100px;
}
.testsor ul{
	display: table;
	font-size: 12pt;
}
.testsor ul li, .szovegbox ul li , .labsor ul li{
    padding: 0px;
    text-indent: -1.7em;
    list-style-position: inside;
    display: table;
}
.testsor ul li::before, .szovegbox ul li::before , .labsor ul li::before {
    content: "■";
    font-size: 20px;
    margin-right: 8px;
    color: var(--main-szin2);
}
.logoAlap {
	width: 240px;
	position: absolute;
	top: 80px;
	left: 30px;
	text-align: center;
}
.logoAlap p{
	/* font-family: 'Lobster', sans-serif; */
	font-family: "Kalnia", serif;
	margin: 0px;
	color: var(--main-szin3);
	font-size: 16pt;
	padding-left: 24px;
}
.logoAlap img{
	width: 100%;
}
.nyitoblokk {
	background-color: var(--main-szin3);
	margin-top: 100px;
	padding: 20px 60px;
	min-height: 500px;
}
.nykezdo p{
	margin-bottom: 12px;
}
.nykezdo p:nth-child(3) { width: 32%; }
.nykezdo p:nth-child(4) { width: 38%; }
.nykezdo p:nth-child(5){ width: 42%;}
.nykezdo p:nth-child(6){ width: 48%;}
.nykezdo p:nth-child(7){ width: 52%;}
.nykezdo p:nth-child(n+8){ width: 100%;}
.nyitoblokk .fokep {
	float: right;
	position: absolute;
	width: 1020px;
	right: 30px;
	top: -100px;
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 50% 100%);
}
.referenciak-alap  {
	margin-top: 120px;
	display: table;
}
.referenciak-alap .fokep {
	float: right;
	width: 500px;
	right: 30px;
	margin-top: -80px;
	margin-left: 28px;
}
.referenciak-alap #szoveg {
	margin: 8px 80px;
}
.cimsor {
	background-color: var(--main-szin3);
	padding: 8px 8px;
	margin-bottom: 24px;
}
.cimsor h1{
	margin: 0px;
}
.zaro {
	margin-top: 0px;
	/* clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%, 0% 50%); */
	background: linear-gradient(225deg, var(--main-szin3) 75%, #ffffff 75%);
	min-height: 200px;

}
.centerDivs {
	display: block;
	text-align: center;
  }
.centerDivs1 {
	display: block;
	text-align: center;
}
.centerDivs2 {
	display: flex;
	justify-content: center;
	margin-top: 80px;
	margin-bottom: 0px;
  }
.testsor .almenu {
	position: relative;
	text-align: center;
	justify-content: space-between;
	margin: 40px 100px;
}
.testsor .almenu h3{
	/* font-family: 'Lobster', sans-serif; */
	font-family: "Kalnia", serif;

	font-size: 18pt;
	line-height: 120%;
	width: 220px;
	margin-top: 60px;
	margin-left: 20px;
	margin-bottom: 0px;
	color: #555555;
}
.kulso-rombusz {
	width: 260px; /* Állítsd be a külső rombusz szélességét a szükséges méretre */
	height: 260px; /* Állítsd be a külső rombusz magasságát a szükséges méretre */
	position: relative;
	border: 1px solid rgb(82, 82, 82); /* Külső rombusz 1px-es kerete */
	box-sizing: border-box; /* A border-t beleértve a szélességbe és magasságba */
	transform: rotate(45deg);
	transition: 500ms;
}
.kulso-rombusz:hover {
	transform: scale(1.1); /* Példa: 110%-os méret */
	border-color: rgb(255, 255, 255); /* Példa: piros szín */
	transition: 500ms;
}
.belso-rombusz  {
	width: calc(100% - 12px); /* Külső rombusz szélessége - 2x4px a külső rombusztól való távolság miatt */
	height: calc(100% - 12px); /* Külső rombusz magassága - 2x4px a külső rombusztól való távolság miatt */
	position: absolute;
	top: 6px; /* Távolság a külső rombusz tetejétől */
	left: 6px; /* Távolság a külső rombusz bal szélétől */
	box-sizing: border-box; /* A border-t beleértve a szélességbe és magasságba */
	overflow: hidden;
}
.belso-rombusz img{
	  width: 150%;
	  height: 150%;
	  margin-top: -25%;
	  margin-left: -25%;
	  transform: rotate(-45deg);
}
.kezdoSzovegbox {
	margin-top: 100px;
	padding: 20px 60px;
	display: table;
}
.kezdoSzovegbox h1{
	width: 300px;
	float: left;
	font-size: 21pt;
}
.referencia h1{
text-align: center;
font-family: 'Roboto', sans-serif;
font-weight: 300;
}
.kezdoSzovegbox p{
	column-count: 2; /* két oszlop */
    column-gap: 30px; /* opcionális: oszlopok közötti rés */
}
.szovegbox {
	margin-top: 100px;
	padding: 20px 60px;
}
.labsor {
	background-color: var(--main-szin1);
	padding: 20px 60px;
	color: white;
	display: table;
	width: 100%;
	box-sizing: border-box;
}
.labsor div {
	width: 50%;
	float: left;
}
.labsor h3 {
	margin: 12px 0px 8px 0px;
	font-size: 12pt;
	font-weight: 700;
}
.labsor p {
	margin: 0px 0px 0px 18px;
}
.labsor button {
	background-color: var(--main-szin2);
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 40px 100%);
	width: 70%;
	color: white;
	border: none;
	padding: 8px;
	font-size: 16pt;
	margin-top: -50px;
	right: 50px;
	position: absolute;
	text-align: left;
	padding-left: 50px;
	cursor: pointer;
}
.rovidgomb {
	clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 40px 100%);
	width: 40%!important;
}
.labsor #logo {
	text-align: center;
	font-size: 8pt;
	width: 30%;
}
.labsor img {
	width: 50%;
}
.labsor #baldoboz, .labsor #jobbdoboz{
	width: 35%;
	box-sizing: border-box;
}
.labsor #jobbdoboz{
	padding-left: 14%;
}
.labsor #jobbdoboz{
	float: right;
}
.labsor a:link, .labsor a:visited {
    color: white;
}
.labsor a:hover {
    color: var(--main-szin2);
	transition: 200ms;
}
.labsor .labikon {
	width: 30px; /* Állítsd be az ikonok méretét a saját igényeid szerint */
	height: 30px;
	margin-right: 8px; /* Távolság az ikonok között */
	border-radius: 50%; /* Kör alakú keret */
	border: 1px solid #ffffff; /* Keret színe és vastagsága */
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
	font-size: 14pt;
	transition: box-shadow 0.3s ease; /* Átmenet a fénylő hatásra */
}
.labsor .labikon:hover {
	box-shadow: 0 0 12px rgba(255, 255, 255, 0.5); /* Fénylő hatás hover állapotban */
}
.feher-block, .kepes-block {
	background-color: #fff;
	padding: 8px;
	margin-bottom: 10px;
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
	flex: 1 1 300px; /* Flex elemek alkalmazkodnak, de minimum 180px szélesek */
	max-width: calc(50% - 20px); /* Max szélesség két elem esetén, figyelembe véve a térközt */
	box-sizing: border-box;
	position: relative; 
	overflow: hidden;
	transition: 1s;
}
.kepes-blockKep {
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	margin-bottom: 6px;
}
.kepes-blockKep img{
	width: 100%;
}
.kepes-block p{
	width: 48%;
	float: left;
	margin: 1%;
	background-color: var(--main-szin3);
	height: 32px;
	padding: 2px 8px;
	box-sizing: border-box;
}
.kepes-block:hover{
	background-color: var(--main-szin2);
}
.akcio-szalag {
    position: absolute;
    top: 10px;
    right: -30px; /* A szalag szélességétől függően állítható */
    background-color: red; /* Változtatható */
    color: white;
    padding: 5px 40px;
    transform: rotate(45deg);
    box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    /* Szükség szerint további stílusok */
}
.szinreteg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(
        to bottom, 
        rgba(255, 255, 255, 0) 0%, 
        rgba(0, 11, 54, 0.5) 100%
    );
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 20px;
}
#nm {
	padding-top: 0px;
}

#piros {
	color: red;
	font-weight: 700;
}
.adatlap {
	float: right;
	width: 49%;
	position: relative;
}
.adatok, .leiras {
	background-color: var(--main-szin3);
	width: 100%;
	padding: 18px;
	box-sizing: border-box;
}
.leiras {
	background-color: transparent;
}
.adatlap h3{
	font-size: 24px;
	font-weight: 300;
	margin-bottom: 18px;
}
.adatlap h4{
	position: absolute;
	right: 16px;
	top: 0px;
}
.adatok span{
	padding: 10px 8px;
	padding-bottom: 4px;
	display: block;
	height: 32px;
}
.adatok span:nth-child(even){
	background-color: rgba(255, 255, 255, 0.5);
}
.adatok b{
	width: 30%;
	display: block;
	float: left;
}
.terkep {
	float: right;
	width: 50%;
	margin-bottom: 50px;
}
.lezar {
	clear: both;
}
.lezarb {
	clear: right;
}
