/* ALAP */

@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&display=swap');

:root {
  --sotetSzin: #0000cc;
  --vilagosSzin: #fff;
  --betuTipus: "Roboto Condensed";
  --betuMeret: 19px;
  --sorkoz: 1.5;
  --cimTipus: "Roboto Condensed";
  --szovegSzin: #666666;
  --cimkeSzin: #666666;
  --linkSzin1: #222222;
  --linkSzin2: var(--sotetSzin);
  --alcimSzin: #666666;
  --alcim1Szin: #666666;
  --alcim2Szin: #666666;
  --szovegmezoSzovegSzin: #666666;
  --szovegmezoKeretSzin: #aaaaaa;
  --szovegmezoHatterSzin: #ffffff;
  --gombSarok: 40px;
  --gombSzovegSzin1: #ffffff;
  --gombSzovegSzin2: #ffffff;
  --gombKeretSzin: var(--sotetSzin);
  --gombHatterSzin1: var(--sotetSzin);
  --gombHatterSzin2: color-mix(in srgb, var(--sotetSzin), black 30%);
  --oldalSzelesseg: 90%;
  --menuBetuMeret: 14px;
  --mobilmenuSzin: #666666;
  --mobilmenuHatter1: #fff;
  --mobilmenuHatter2: var(--sotetSzin);
  --mobilmenuSzovegSzin1: #222222;
  --mobilmenuSzovegSzin2: #fff;
  --fejlecKeretSzin: #00000020;
  --fejlecHatterSzin: #00000005;
  --regHelyesMezoSzin: #4CAF50;
}

* {
box-sizing: border-box;
}

body {
margin: 0;
padding: 0;
font-family: var(--betuTipus);
font-size: var(--betuMeret);
color: var(--szovegSzin);
line-height: var(--sorkoz);
}

h1, h2, h3, h4, h5, h6 {
font-family: var(--cimTipus);
font-weight: 300;
color: var(--alcimSzin);
margin-bottom: 0;
}

h1 {
color: var(--alcim1Szin);
}

h2 {
color: var(--alcim2Szin);
}

label {
font-weight: 600;
}

input, button {
font-family: var(--betuTipus);
font-size: var(--betuMeret);
padding: 10px 15px;
outline-style: none;
-webkit-border-radius: 5px;
border-radius: 5px;
transition: 0.3s;
}

input[type="text"], input[type="password"] {
border: 1px solid var(--szovegmezoKeretSzin);
background: var(--szovegmezoHatterSzin);
color: var(--szovegmezoSzovegSzin);
}

input[type="submit"], input[type="button"], button {
border: 1px solid var(--gombKeretSzin);
background: var(--gombHatterSzin1);
color: var(--gombSzovegSzin1);
cursor: pointer;
-webkit-border-radius: var(--gombSarok);
border-radius: var(--gombSarok);
}

input[type="submit"]:hover, input[type="button"]:hover, button:hover {
background: var(--gombHatterSzin2);
color: var(--gombSzovegSzin2);
}

.divNullaz {
clear: both;
}

.szovegKozepre {
text-align: center;
}

.nagybetu {
text-transform: uppercase;
}

.betuKoz1 {
letter-spacing: 1px;
}

.betuKoz2 {
letter-spacing: 2px;
}

.betuKoz3 {
letter-spacing: 3px;
}

.sorkoz0 {
line-height: 0;
}

.sorkoz05 {
line-height: 0.5;
}

.sorkoz06 {
line-height: 0.6;
}

.sorkoz07 {
line-height: 0.7;
}

.sorkoz08 {
line-height: 0.8;
}

.sorkoz09 {
line-height: 0.9;
}

.sorkoz1 {
line-height: 1;
}

.sorkoz12 {
line-height: 1.2;
}

.sorkoz13 {
line-height: 1.3;
}

.sorkoz14 {
line-height: 1.4;
}

.sorkoz15 {
line-height: 1.5;
}

.kulsoKitoltes0 {
margin: 0;
}

.belsoKitoltes0 {
padding: 0;
}

/* ALAP VEGE */

/* FEJLEC */

#fejlecKulsoKeret {
padding: 8px 0;
border-bottom: 1px solid var(--fejlecKeretSzin);
background: var(--fejlecHatterSzin);
}

#fejlecBelsoKeret {
margin: auto;
width: var(--oldalSzelesseg);
}

#fejlecBalKeret {
float: left;
}

#fejlecJobbKeret {
font-size: var(--menuBetuMeret);
float: right;
}

#logoKeret {
position: relative;
}

#logoKeret a {
position: absolute;
top: 5px;
display: block;
font-family: var(--cimTipus);
font-weight: 300;
font-size: 36px;
text-decoration: none;
color: #222222;
line-height: 0.8;
}

.fejlecGomb {
display: inline-block;
text-decoration: none;
padding: 7px 20px;
text-align: center;
color: var(--vilagosSzin) !important;
background: var(--sotetSzin);
-webkit-border-radius: var(--gombSarok);
border-radius: var(--gombSarok);
}

.fejlecGomb:hover {
background: var(--gombHatterSzin2);
color: var(--gombSzovegSzin2);
}

/* FEJLEC VEGE */

/* MENU */
#menuKeret {
}

#menuKeret a {
margin-left: 20px;
font-size: var(--menuBetuMeret);
text-decoration: none;
text-transform: uppercase;
color: var(--linkSzin1);
}

#menuKeret a:first-child {
margin-left: 0px;
}

#menuKeret a:hover {
color: var(--linkSzin2);
}

/* MENU VEGE */

/* MOBIL MENU */

#mobilMenuKeret {
margin-top: 13px;
display: none;
cursor: pointer;
}

#mobilMenuKeret div {
margin-top: 5px;
border-top: 2px solid var(--mobilmenuSzin);
width: 20px;
}

/* MOBIL MENU VEGE */

/* SLIDE */

#slideKulsoKeret {
background-image: url('/web/kepek/fejlec9.jpg');
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}

#slideBelsoKeret {
position: relative;
display: flex;
/*justify-content: left;*/
align-items: center;
width: 100%;
height: 400px;
background: linear-gradient(to right, #002660 20%, rgba(0, 0, 0, 0) 75%);
color: #fff;
}

#slideBelsoKeret h1 {
font-size: 300%;
}

#slideBelsoKeret h2 {
font-size: 150%;
}

#slideBelsoKeret h3 {
font-size: 120%;
}

#slideBelsoKeret h1, #slideBelsoKeret h2, #slideBelsoKeret h3 {
color: #fff;
font-family: var(--cimTipus);
font-weight: 300;
}

#slideBalKeret {
position: absolute; 
left: 35px;
width: 45%;
}

#slideJobbKeret {
position: absolute; 
right: 35px;
width: 45%;
}

.slideGomb {
display: inline;
font-size: 14px;
text-decoration: none;
text-transform: uppercase;
border: 1px solid #fff;
background: #ffffff;
color: #222222;
padding: 10px 15px;
text-align: center;
-webkit-border-radius: var(--gombSarok);
border-radius: var(--gombSarok);
}

.slideGomb:hover {
background: transparent;
color: #fff;
}

/* SLIDE VEGE */

/* TARTALOM */

#tartalomKulsoKeret {
padding: 25px 0;
}

#tartalomBelsoKeret {
margin: auto;
width: var(--oldalSzelesseg);
}

/* TARTALOM VEGE */

/* REGISZTRACIO */
#regKeret {
margin: auto;
width: 100%;
}

/* Lépésjelzők */
.regLepesek {
display: flex;
justify-content: space-between;
margin-bottom: 30px;
background-image: url('/web/kepek/reg-hatter.jpg');
background-repeat: repeat-x;
background-position: center center;
}

.regLepesjelzoPontok {
text-align: center;
padding: 5px 15px;
transition: 0.3s;
-webkit-border-radius: var(--gombSarok);
border-radius: var(--gombSarok);
background-color: #fff;
border: 1px solid var(--sotetSzin);
}

.regLepesjelzoPontok.active {
background-color: var(--linkSzin2);
color: #fff;
/*transform: scale(1.2);*/
}

.regLepesjelzoPontok.finish {
background-color: var(--linkSzin2);
}

/* Lépések elrejtése alapértelmezetten */
.regLepteto {
display: none;
}

/* Aktuális lépés megjelenítése */
.regLepteto.active {
display: block;
}

#regKeret h2 {
margin-top: 0;
}

.regAdatok {
margin-bottom: 20px;
}

#regKeret label {
display: block;
margin-bottom: 5px;
color: var(--cimkeSzin);
}

#regKeret input {
width: 100%;
}

#regKeret input:focus {
border-color: var(--regHelyesMezoSzin);
}

/* Gombok formázása */
.regGombok {
display: flex;
justify-content: space-between;
margin-top: 25px;
}

.regKovetkezoGomb {
margin-left: auto;
}

.regKovetkezoGomb:hover {
background-color: var(--gombHatterSzin2);
color: var(--gombSzovegSzin2);
}

.regElozoGomb {
background-color: var(--gombHatterSzin1);
color: var(--gombSzovegSzin1);
}

.regElozoGomb:hover {
background-color: var(--gombHatterSzin2);
color: var(--gombSzovegSzin2);
}

/* REGISZTRACIO VEGE */

/* MEDIA KERESEK */
@media (max-width: 600px) {

  .mobilonElrejt {
    display: none;
  }
  

  #fejlecKulsoKeret {
  padding: 15px 0;
  }

  #fejlecBelsoKeret, #tartalomBelsoKeret {
    padding: 0 10px;
	width: 100%;
  }

  #logoKeret a {
	top: -2px; 
  }

  #slideBelsoKeret {
	background: linear-gradient(to right, #002660 0%, rgba(0, 0, 0, 0) 100%);
  }

  #slideBalKeret {
    position: relative;
    left: 0px;
	padding: 0 15px;
	width: 100%;
  }

  #slideJobbKeret {
    display: none;
  }

  .fejlecGomb {
	color: var(--mobilmenuSzovegSzin1) !important;
	background: var(--mobilmenuHatter2);
	-webkit-border-radius: 0;
	border-radius: 0;
	text-align: left;
  }

  .fejlecGomb:hover {
	color: var(--mobilmenuSzovegSzin2) !important;
	background: var(--mobilmenuHatter2);
  }

  #menuKeret {
	display: none;
    position: absolute;
	left: 0;
	margin-top: 15px;
	width: 100%;
    z-index: 2;
  }

  #menuKeret a {
    display: block;
	margin: 0 !important;
	border-top: 1px solid #c0c0c0;
	padding: 10px;
    width: 100%;
	color: var(--mobilmenuSzovegSzin1);
	background: var(--mobilmenuHatter1);
  }

  #menuKeret a:hover {
    color: var(--mobilmenuSzovegSzin2);
    background: var(--mobilmenuHatter2);
  }

  #mobilMenuKeret {
    display: block;
	margin-top: 5px;
  }

}
/* MEDIA KERESEK VEGE */