@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;700&display=swap');

/* Deffault style */
* {
	font-family: 'Archivo', sans-serif;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}
body {
    margin:0;
    background-color: #262626;
	overflow-x: hidden;
}
/*WHAPTSAPP*/
.float{
	position:fixed;
	width:80px;
	height:80px;
	bottom:5%;
	right:3%;
	background-color:#FFFFFF;
	color:#e72222;;
	border-radius:50px;
	text-align:center;
  font-size:50px;
	box-shadow: 1px 1px 3px #7c7c7c;
  z-index:100;
}
.my-float{
	margin-top:15px;
}

/*NAVIGATION*/

.logo img{
	float: left;
	z-index: 11;
	width: 80%;
	max-width: 200px;
	height: auto;
	padding:5%;
}
nav{
	display: flex;
	padding-right: 5%;
	justify-content: space-around;
	align-items: center;
	background-color: #e72222;
}
.nav-links{
	display:flex;
	justify-content:space-around;
	text-decoration: none;
    margin-top: 0;
    margin-bottom: 0;
    padding: 0.5%;
}
.nav-links li{
  list-style: none;
  float: right;
  background-color: #e72222;
  margin-right:10%;
  padding-top: 3%;
  padding-bottom: 3%;
}
.nav-links a,a:visited{
  	color: #262626;
	text-decoration: none;
	letter-spacing: 3px;
	font-weight: bold;
	font-size:16px; 
}
.nav-links a:hover{
	text-decoration: none;
	color:rgb(197, 197, 197);
	transition: 0.5s;
}
.nav-links a.active {
  color:white;
}
a.leng{
	color:#262626;
}
a#active{
	color: white;
}
.absolut{
	position: absolute;
	display: inline;
	padding-left: 0.5%;
}
a.leng:hover{
	text-decoration: none;
	color:rgb(197, 197, 197);
}
div.kicsivonal{
	font-size: 90%;
	display: inline;
	position: absolute;
	color:#262626;
}
.burger{
	display: none;
}
.burger div{
	width:25px;
	height: 3px;
	background-color:#262626;
	margin: 5px;
}
@media screen and (max-width:1250px){

	body{
		overflow-x: hidden;
	}
	.nav-links{
		position: absolute;
		z-index: 10;
		right: 0px;
		height: 80vh;
		top: 0%;
    	background-color: white;
		display: none;
		flex-direction: column;
		text-align: center;
		width: 50%;
		transform: translateX(100%);
		transition: transform 1s ease-in;
		
		}
	.nav-links li{
		opacity: 0;
    	margin-right:0%;
	}

	.nav-active{
		transform: translateX(0%);
		display: flex;
	}
	.burger{
		display: block;	
		cursor: pointer;
		z-index: 11;
	}
	.absolut{
		padding-left: 5%;
	}
	a.leng{
		padding-right: 5%;
		padding-left: 5%;
	}
	li.leg_box{
		padding-right: 9%;
	}
}
@media screen and (max-width:1245px){
	.nav-links{
		width: 20%;
		height: 15%;
    	justify-content:center;
	}
	.nav-active{
		width: 100%;
		height: 100%;
		padding-bottom: 5%;
	}
	.nav-active a {
		padding-bottom: 5%;
	}
	.nav-links li{
		background-color: white;
	}
	.nav-links a.active{
		color: #e72222;
	}
	a.active{
		background-color: #262626;
		padding:2%;
		border-radius: 15px 15px 15px ;
	}
	a.leng{
		padding-left: 0;
		margin-left: 0;
		margin-right: 0;
	}
	a#active{
		color: #e72222;
	}
	div.kicsivonal{
		visibility: visible;
	}
}
	
@keyframes navLinkFade{
	from{
		opacity: 0;
		transform: translateX(50px);
	}
	to{
		opacity: 1;
		transform: translateX(0px);
	}
}
.toggle .line1{
	transform: rotate(-45deg) translate(-5px,6px);
	transition: 0.5s;
}
.toggle .line2{
	opacity: 0;
}
.toggle .line3{
	transform: rotate(45deg) translate(-5px,-6px);
	transition: 0.5s;
}
/* Body */
.content{
	background-color: #262626;
	padding: 2%;
	padding-left: 0;
	padding-right: 0;
}
.section {
	padding-top: 2%;
	padding-bottom: 3%;
  }

.rolunk-container {
	display: flex;
	background-color: white;
	padding-left: 0;
	padding-right: 0;
}

.rolunk-text {
	flex: 1 1 400px;
	padding: 3%;
	color: #262626;
	font-weight: bold;
}

.rolunk-text h2 {
	color: #e30613;
	font-size: 36px;
	font-weight: bold;
	margin-bottom: 20px;
	padding-top: 5%;
}

.rolunk-text p {
	line-height: 1.6;
	font-size: 15px;
	text-align: justify;
}

.rolunk-image {
	flex: 1 1 60%;
	padding-left: 0;
	background-color: #e30613;
	max-width: 50%;
}
.rolunk-image img {
	width: 100%;
	max-width: none;
	border: 10px solid #e30613;
	height: 100%;
}
h2.elerhetosegek{
	padding-top: 0%;
}
p.conact-txt{
	font-weight: 1;
}
/* Markak */
.markaink {
	padding: 2% 0 5% 0;
  }
  
  p.markaink_cim {
	font-size: 600%;
	color: white;
	text-align: center;
	font-weight: bold;
  }
  
  .red_border {
	background-color: #e30613;
	padding: 1% 0;
  }
  
  .markaink_white {
	background-color: white;
	padding: 2% 0;
  }
  
  .brand-container {
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
	gap: 10px;
  }
  
  .brand-container img {
	width: 7%;
	max-width: 150px;
	height: auto;
	margin: 5px;
  }
iframe.maps{
	width: 100%;
	height: 100%;
}

  /* Responzivitás mobil eszközökhöz */
  @media (max-width: 768px) {
	.brand-container img {
	  max-width: 50px; 
	}
  }
  
  @media (max-width: 480px) {
	.brand-container img {
	  max-width: 30px; 
	}
  }
  

  
.kituntetesek_white {
	background-color: white;
	padding: 0.4% 0;
	margin-bottom: 4%;

}
  
.red_border_kitu {
	background-color: #e30613;
	padding: 2% 0;
}
.kitu_cont {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8rem; 
	flex-wrap: wrap; 
}
.kitunt {
	font-size: 200%;
	color: white;
	text-align: center;
	font-weight: bold;
	white-space: nowrap;
}
.kitunt1 img {
	height: 200px;
	width: auto;
}
  

/* Footer */
.footer{
  color:#262626 ;
  background-color: white;
  text-align: center;
  padding: 3%;
  padding-bottom: 13%;
}

.copyright{
    float: right;
    padding-top: 0;
    font-weight: lighter;
    text-align: right;
	font-weight: 2;
}
.footer_contact{
  float: left;
  text-align: left;
  padding-top: 0;
  font-weight: lighter;
  line-height: 1.3;
  font-weight: 20;
}
.footer_contact a{
  color: #e72222;
  text-decoration: none;
}
.elerhetosegek{
	font-size:200%;
	padding-bottom: 0;
}

/* Responsivity for Desktop */
@media only screen and (max-width: 1390px){
.footer{
  padding-bottom: 15%;
}

}
@media only screen and (max-width: 1060px){
  .footer{
    padding-bottom: 25%;
  }
  
  }
@media only screen and (max-width: 680px){
  .footer{
    padding-bottom: 19%;
  }
  .footer_contact{
    float: none;
    text-align: center;
    padding-bottom: 3%;
  }
  .copyright{
    float:none ;
    text-align: center;
  }
    
}




/* Responsivity for Mobile */
@media only screen and (max-width: 600px) {
	.elerhetosegek{
		font-size:150%;
		padding-top: 5%;
	}
	.logo img{
		width: 40%;
	}
}
 

/* General Mobile Responsiveness */
@media only screen and (max-width: 808px) {
	/* Navigation */
	.nav-links {
		flex-direction: column;
		align-items: center;
		width: 100%;
		padding: 0;
	}
	.nav-links li {
		margin-right: 0;
		width: 100%;
	}
	.nav-links a {
		font-size: 14px;
		padding: 10px 25px;
	}
	.burger {
		display: block;
		cursor: pointer;
	}
	li.leg_box{
		padding-right: 10%;
	}
	li.leg_box .absolut{
		padding: 0;
	}

	/* Section: About Us */
	.rolunk-container {
		flex-direction: column;
	}
	.rolunk-image {
		width: 100%;
		max-width: 100%;
		height: auto;
	}
	.rolunk-text h2 {
		font-size: 24px;
		text-align: center;
	}
	.rolunk-text p {
		font-size: 14px;
		text-align: center;
		line-height: 1.4;
	}

	/* Markaink Section */
	.markaink_cim {
		font-size: 5rem;
	}
	.markaink_white {
		padding: 5% 0;
	}
	.logoscroll {
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
		gap: 1rem;
	}
	.logoscroll img {
		width: 100px;
	}

	/* Kitüntetések Section */
	.kitu_cont {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 2rem;
	}
	.kitunt {
		font-size: 2rem;
	}
	.kitunt1 img {
		width: 150px;
		height: auto;
	}

	/* Footer */
	.footer_contact,
	.copyright {
		text-align: center;
	}
	.elerhetosegek {
		font-size: 1.5rem;
	}
}
@media only screen and (max-width: 1246px) {
	.kitu_cont {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 2rem;
	}
	.kitunt {
		font-size: 2rem;
	}
	.kitunt1 img {
		width: 300px;
		height: auto;
	}

}
@media only screen and (max-width: 556px) {
p.markaink_cim {
	font-size: 300%;
}
li.leg_box{
	padding-right: 14%;
}
}
@media only screen and (max-width: 265px) {
	p.markaink_cim {
		font-size: 200%;
	}
	.kitunt {
		font-size: 120%;
	}
	.footer{
		font-size: 60%;
	}
	.elerhetosegek{
		font-size: 180%;
	}
	li.leg_box{
		padding-right: 30%;
	}
}
/* Responsivity for Desktop */
@media only screen and (max-width: 1390px) {
	.footer {
		padding-bottom: 15%;
	}
}

@media only screen and (max-width: 1060px) {
	.footer {
		padding-bottom: 15%;
	}
}