:root {
	--szin_zold: #30CA00;
	--szin_piros: red;
	--szin_feher: white;
	--szin_narancs: #ee3b24;
}

.kozepre {text-align: center;}
.vastag {font-weight: bold;}
.szin_zold {color: var(--szin_zold);}
.szin_feher {color: var(--szin_feher) !important;}
.szin_piros {color: var(--szin_piros);}

/* Header */
.logo-area span {color:red; font-size: 36px; font-weight: 500;}
@media (max-width: 767px) {
	.logo-area span {font-size: 24px;}
	.logo-area a img {width: 100px !important; height: auto !important;}
}

/* Hírek */
.blogcontainer {display: grid; grid-template-columns: 1fr 1fr; gap: 20px;
	.blog-card {border: 1px solid #ddd; position: relative; background: darkcyan;
		h2 {color: white; font-size: 1.2em; padding: 5px; text-align: center; margin: 0; height: 70px;}
		.blog-date {background: red; color: white; display: block; float: none; padding: 0.625em 0; text-align: center; width: 100%;}
		.blog-kep {height: 300px; background-position: center center; background-size: cover; background-repeat: no-repeat;}
		.tovabb {position: absolute; bottom: 0px; left: 0px; border: 1px solid black; padding: 10px 20px; background: white;}
		.tovabb:hover {background: red; color: white;}
		.tovabb	a:hover {background: red; color: white;}
	}
}

@media screen and (max-width: 480px) {
	.blogcontainer {grid-template-columns: 1fr;}
}

/* Lapozó */
#pagination {display: flex; justify-content: center; align-items: center; gap: 15px; background: red; padding: 10px 20px; border-radius: 8px; margin-top: 20px;

	button {background: white; color: black; border: none; padding: 8px 15px; font-size: 16px; font-weight: bold; cursor: pointer; border-radius: 5px; transition: 0.3s ease;}
	button:hover {background: #ddd;}
	button:disabled {background: #999; cursor: not-allowed;}

	#page-info {color: white; font-size: 18px; font-weight: bold;}
}

/* Töri, toborzó, tagok */
#tori h3, #toborzo h3, #tagok h3 {display: flex; flex-direction: column; background: red; color: white; margin: 10px 0 20px 0; padding: 5px; font-weight: 700; width: auto; align-items: center;}

/* Ügyintézés */
#ugyintezes {width: 100%; position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 100px 0 0 0;
	h3 {background: red; color: white; margin: 10px 0 20px 0; padding: 5px; font-weight: 700; width: 100%;}
	.mbmbolt {width:100%;}
	ul {font-size: larger;}
	li {padding-bottom: 10px;}
	.figyusz {background: yellow; padding: 15px; border: 1px solid blue; margin: 0 20px;}
}

/* Cimkék */
#cimkek {width: 100%; text-align: center; padding: 20px 0 0 0;
	h3 {background: red; color: white; margin: 10px 0 20px 0; padding: 5px; font-weight: 700; width: 100%;}
}

/* Footer */
#footer {background-image: url(img/hatterek/lablec.jpg);}
.footer-area h5 {color: white; text-align: center;}
.hr-foot {width: 80%; margin: 10px auto; border: 1px solid #fff;}
.footer-items {color: white; text-align: center;}

.ferde-vonal {width: 0;	height: 0; border-bottom: 150px solid black; border-left: 100vw solid transparent; max-width: 100%;}

.icon-pentagon {display: inline-block; height: 24px; width: 40px; position: relative; color: #fff; -webkit-transition: all 0.3s ease 0s;
	-moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; background: none repeat scroll 0 0 var(--szin_narancs);}
.icon-pentagon:before {border-bottom: 10px solid var(--szin_narancs); border-left: 20px solid rgba(0, 0, 0, 0); border-right: 20px solid rgba(0, 0, 0, 0);
	top: -10px; content: ""; height: 0; left: 0; position: absolute; width: 0;}
.icon-pentagon:after {border-top: 10px solid var(--szin_narancs); border-left: 20px solid rgba(0, 0, 0, 0); border-right: 20px solid rgba(0, 0, 0, 0); bottom: -10px; content: ""; height: 0;
	left: 0; position: absolute; width: 0;}

.animated {-webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both;}

.card, .input-group {border: 1px solid rgba(0, 0, 0, .125)!important; box-shadow: 10px 10px 8px #888888;}
.page-item .page-link {width: auto; padding: 5px;}

/* Lightbox stílusok teljes képernyős háttér */
#lightbox {display: none; /* Alapból rejtett */ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.9); /* Sötét háttér */ justify-content: center; align-items: center; z-index: 1000;}

/* Kép a lightboxban - teljes méret */
#lightbox img {border-radius: 10px; box-shadow: 0px 0px 20px rgba(255, 255, 255, 0.5); max-width: 90vw; max-height: 90vh; /* Kép maximális magassága */}

/* Bezárás gomb */
#close-btn {position: absolute; top: 20px; right: 30px; font-size: 40px; color: white; cursor: pointer; font-weight: bold; transition: 0.3s;}
#close-btn:hover {color: red;}

/* Kattintható képek kis méretben */
.clickable-img {height: 200px; /* Eredeti méret az oldalon */ cursor: pointer; transition: 0.3s; border-radius: 5px;}
.clickable-img:hover {opacity: 0.8;}