@import url('https://fonts.googleapis.com/css?family=Manrope:300,400,700&display=swap&subset=latin-ext');

@import url(/css/menu.css);
@import url(/css/slider.css);
@import url(/css/main.css);
@import url(/css/footer.css);

/*@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css);*/
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/latest/css/font-awesome.min.css);
@import url(https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/fontawesome.css);


:root { 
--body-bg-szin: #fff;

--body-betutipus: 'Manrope', sans-serif;
--body-weight: 300; 
--b-weight: 700;
--body-betumeret: 1.0em;		--body-betumeretM: 1.3em;
--body-betuszin: #333; 

--a-weight: 400; 
--a-alahuzas: none; 
--a-alahuzas-hover: none; 
--a-betuszin: #572240;
--a-betuszin-hover: #000;

--h-betutipus:  'Manrope', sans-serif;  /* h1 - h5 */
--h-weight: 400;
--h-betuszin: #572240;
--h-betuszin-a: #572240;
--h-betuszin-hover: #000;
--h-a-alahuzas: none;
--h-a-alahuzas-hover: none;

--h1-betumeret: 2.2em;			--h1-betumeretM: 1.7em;
--h2-betumeret: 2.0em;			--h2-betumeretM: 1.5em;
--h3-betumeret: 1.7em;			--h3-betumeretM: 1.4em;
--h4-betumeret: 1.4em;			--h4-betumeretM: 1.0em;
--h5-betumeret: 1.3em;			--h5-betumeretM: 1.0em;

--input-betutipus: 'Manrope', sans-serif;
--input-weight: 300;
--input-betumeret: 1.0em;		--input-betumeretM: 1.0em;
--input-betuszin: #666; 

--menu-betutipus: 'Manrope', sans-serif;
--menu-magassag: 8vw;			--menu-magassagM: 15vw;
--menu-logoszelesseg: 15%;		--menu-logoszelessegM: 70%;
--menu-betumeret: 0.8em;		--menu-betumeretM: 1.0em;
--menu-weight: 700;
--menu-hatter: rgba(255,255,255,0.8);			--menu-hatterM: rgba(255,255,255,1.0);			--menu_menupontokmobile-hatter: rgba(116,114,111,0.8);  --menu_menupontokdesktop-magassag: 3vw;	--menu_menupontokmobile-magassag: 13vw;
--menu-betuszin: #000;			--menu-betuszinM: #fff;
--menu-betuszin-hover: #572240;
--menu-a-hatter: #none;
--menu-a-hatter-hover: #572240;

--slider-height: 100vh;			--slider-heightM: 100vh;
--slider-bg: #fff;

--footer-hatter: #572240;
--footer-betutipus: 'Manrope', sans-serif;
--footer-betumeret: 1.0em;		--footer-betumeretM: 0.8em;
--footer-weight: 300;
--footer-betuszin: #fff;
--footer-betuszin-hover: #000;
--footer-a-hatter: none;
--footer-a-hatter-hover: #none;

--main-szelesseg: 95%;			--main-szelessegM: 90%;
--main-maxszelesseg: 1180px;    --main-maxszelessegM: 90%;

--hr-szin: #572240;
--hr-szelesseg: 5%;			--hr-szelessegM: 45%;

--trans-dur-a: 0.4s;
--trans-dur-b: 0.4s;

--img-hover-opacity-a: 0.8;
--img-hover-opacity-b: 0.8;

--butt1-betutipus: 'Manrope', sans-serif;
--butt1-betumeret: 1.0em;		--butt1-betumeretM: 1em;
--butt1-weight: 400;
--butt1-betuszin: #000;
--butt1-betuszin-hover: #fff;
--butt1-hatter: none;
--butt1-hatter-hover: #572240;
--butt1-border: 1px solid #000;
--butt1-border-hover: 1px solid #572240;
--butt1-borderradius: 0; /*sima*/
/*--butt1-borderradius: 10px; kiskerekites*/
/*--butt1-borderradius: 100vw; ovalis*/

--butt2-betutipus: 'Manrope', sans-serif;
--butt2-betumeret: 1.0em;		--butt2-betumeretM: 1em;
--butt2-weight: 400;
--butt2-betuszin: #fff;
--butt2-betuszin-hover: #2a3677;
--butt2-hatter: none;
--butt2-hatter-hover: #fcee36;
--butt2-border: 1px solid #fff;
--butt2-border-hover: 1px solid #fcee36;
/*--butt2-borderradius: 10px; kiskerekites*/
/*--butt2-borderradius: 100vw; ovalis*/

--butt3-betutipus: 'Manrope', sans-serif;
--butt3-betumeret: 0.8em;		--butt3-betumeretM: 1em;
--butt3-weight: 400;
--butt3-betuszin: #fff;
--butt3-betuszin-hover: #bf3a32;
--butt3-hatter: #bf3a32;
--butt3-hatter-hover: none;
--butt3-border: 3px solid #bf3a32;
--butt3-border-hover: 3px solid #bf3a32;
/*--butt3-borderradius: 10px; kiskerekites*/
/*--butt3-borderradius: 100vw; ovalis*/

--korhatter1-hatter: #F00;
--korhatter1-betuszin: #fff;

--blokk_1_hasab_kephatter-hatter:  url(/img/kepeshatter.jpg) ;
--blokk_1_hasab_kephatter-itemhatter: none;
--blokk_2_hasab_kephatter-hatter: #fff url(/img/slider.jpg) no-repeat fixed center;
--blokk_2_hasab_kephatter-itemhatter: #fff;
--blokk_3_hasab_kephatter-hatter: #fff url(/img/stilus_katbg.jpg) no-repeat fixed center;
--blokk_3_hasab_kephatter-itemhatter: none;
--blokk_4_hasab_kephatter-hatter: url(/img/bg_index_iroda.jpg) ;
--blokk_4_hasab_kephatter-itemhatter: none;

--blokk_1_hasab-hatter: #eee;
--blokk_1_hasab-itemhatter: none;
--blokk_2_hasab-hatter: none;
--blokk_2_hasab-itemhatter: none;
--blokk_3_hasab-hatter: #none;
--blokk_3_hasab-itemhatter: none;
--blokk_4_hasab-hatter: #none ;
--blokk_4_hasab-itemhatter: #none;

--aloldalcim_kephatter_01-hatter: url(/img/bg_aloldal01.jpg) ;
--aloldalcim_kephatter_02-hatter: url(/img/bg_aloldal02.jpg) ;

--galeria_01-item-szelesseg: 25%;			--galeria_01-item-szelessegM: 100%; 
}


/* CSS Document */

.feher {color: #fff!important;}
.fekete {color: #000;}
.szin1 {color: #572240;} .szin1_bg {background-color: #bf3a32; color:#fff;}/*bordo*/
.szin2 {color: #fcee36;}
.szin3 {color: #fff;}



@media only screen and (max-width: 768px) {
	* { display:none1!important;}
	#mobile { display: block; }
	#nomobile {display: none; }
	body, td, th { font-size: var(--body-betumeretM); }
	h1 { font-size: var(--h1-betumeretM);} h2 { font-size: var(--h2-betumeretM);}	h3 { font-size: var(--h3-betumeretM);} h4 { font-size: var(--h4-betumeretM);}	h5 { font-size: var(--h5-betumeretM);}
	input, textarea, select {font-size: var(--input-betumeretM);}
	select option {font-size: var(--input-betumeretM);}
	
	#form_01 input, #form_01 textarea, #form_01 select { }
		
	#main { width:var(--main-szelessegM); margin:auto; } #main img { max-width:100%!important;}

	#loader {  background: url("img/loading.gif") no-repeat scroll center center #fff;  position: fixed;  height: 100%;   width: 100%; z-index:9999;}
	
	.scroll_a_tetore { width:8vw; height:8vw; text-align:center; position:fixed; bottom:5%; right:5vw; display:none; background: url('img/nyiltotop.png') no-repeat; opacity: 0.5; z-index:9000; background-size: cover;}
	.scroll_a_tetore:hover { opacity:1.0;}
	
	#stilus_container { width: 100%; background: url(img/stilus_bg_.jpg); background-position: center; background-repeat: repeat-y;}
	#stilus_bal { width: 100%; margin: 0 00% 5% 0; text-align: left;}
	#stilus_jobb { width: 100%; margin: 0 0 5% 00%; text-align: right;}
	#stilus_container img { width: 98%;}
	#stilus_container img:hover {transform: scale(1.02,1.02);}
	
	.szolg_blokk img {width: 40%;}
	.stilus_kepnek {width: 100%;}
	
	.uzlet img { width: 100%;}
	
	#referenciakepek { width: 100%;}
	#referenciakepek img { max-height: 50vh; margin: 0.5%; width: 99%;}
	
	.butt1 {font-size:var(--butt1-betumeretM); padding:2vw 5vw!important; margin:1.5vw 0; width:auto!important; border-radius:var(--butt1-borderradius);}
	.butt2 {font-size:var(--butt2-betumeretM); padding:2vw 5vw!important; margin:1.5vw 0; width:auto!important; border-radius:var(--butt2-borderradius);}
	.butt3 {font-size:var(--butt2-betumeretM); padding:2.5vw 5.5vw!important; margin:1.5vw 0; width:auto!important; border-radius:var(--butt2-borderradius);}
	
	.korhatter1 { font-size: calc(0.5 * var(--body-betumeretM)); border-radius:50%; background:var(--korhatter1-hatter); color:var(--korhatter1-betuszin); width:var(--body-betumeretM); height:var(--body-betumeretM); line-height:var(--body-betumeretM); display: inline-block; text-align:center; font-weight:700; margin:1%;}
	
	#blokk_1_hasab img {width: 70%; }
	#blokk_4_hasab img {width: 80%; }
	#blokk_2_hasab img { width: 100%;}
	
	#slider_nyil { position:absolute; bottom:5%; left:47.5%; text-align:center; width:5%; height:5%; background:url(/img/nyille.png); background-position:center; background-size:cover; z-index:2000; opacity:0.7;}
	


	.fa, .fas {  font-size: 8vw;  width: 8vw;  text-align: center;  text-decoration: none;  margin: 0 0 2vw 0;}
	
/*	iframe { width:100%!important; margin:1vw 0 1vw 0; padding:0; }	*/
}


@media only screen and (min-width: 769px) {
	#mobile { display: none; }
	#nomobile {display: block; }
	body { font-size: var(--body-betumeret); }
	h1 { font-size: var(--h1-betumeret);} h2 { font-size: var(--h2-betumeret);}	h3 { font-size: var(--h3-betumeret);} h4 { font-size: var(--h4-betumeret);}	h5 { font-size: var(--h5-betumeret);}
	input, textarea, select {font-size: var(--input-betumeret);}
	select option {font-size: var(--input-betumeret);}
	
	#form_01 input, #form_01 textarea, #form_01 select { }
		
	#main { width:var(--main-szelesseg); max-width:var(--main-maxszelesseg); margin:auto; }  #main img { max-width:100%!important;}

	#loader {  background: url("img/loading.gif") no-repeat scroll center center #fff;  position: fixed;  height: 100%;   width: 100%; z-index:9999;}
	
	.scroll_a_tetore { width:4vw; height:4vw; text-align:center; position:fixed; bottom:10%; right:2vw; display:none; background: url('img/nyiltotop.png') no-repeat; opacity: 0.5; z-index:900; background-size: cover;}
	.scroll_a_tetore:hover { opacity:1.0;}
	
	#stilus_container { width: 100%; background: url(img/stilus_bg.jpg); background-position: center; background-repeat: repeat-y;}
	#stilus_bal { width: 50%; margin: 0 50% 5% 0; text-align: left;}
	#stilus_jobb { width: 50%; margin: 0 0 5% 50%; text-align: right;}
	#stilus_container img { width: 98%;}
	#stilus_container img:hover {transform: scale(1.02,1.02);}
	
	.szolg_blokk img {width: 10%;}
	.stilus_kepnek {width: 70%;}
	
	.uzlet img { width: 65%;}
	
	#referenciakepek { width: 100%;}
	#referenciakepek img { max-height: 30vh; margin: 0.5%; width: 99%;}
	
	.butt1 {font-size:var(--butt1-betumeret); padding:1.2vw 2.2vw!important; margin:0.5vw 0; width:auto!important; border-radius:var(--butt1-borderradius);}
	.butt2 {font-size:var(--butt2-betumeret); padding:1.2vw 2.2vw!important; margin:0.5vw 0; width:auto!important; border-radius:var(--butt2-borderradius);}
	.butt3 {font-size:var(--butt3-betumeret); padding:1.2vw 2.2vw!important; margin:0.5vw 0; width:auto!important; border-radius:var(--butt3-borderradius);}
	
	.korhatter1 { font-size: calc(0.5 * var(--body-betumeret)); border-radius:50%; background:var(--korhatter1-hatter); color:var(--korhatter1-betuszin); width:var(--body-betumeret); height:var(--body-betumeret); line-height:var(--body-betumeret); display: inline-block; text-align:center; font-weight:700; margin:1%;}
	
	#blokk_1_hasab img {width: 75%; }
	#blokk_4_hasab img {width: 60%; }
	#blokk_2_hasab img { width: 100%;}
	
	#slider_nyil { position:absolute; bottom:10%; left:49%; text-align:center; width:2%; height:2%; background:url(/img/nyille.png); background-position:center; background-size:cover; z-index:2000; opacity:0.7;}
	


	.fa, .fas {  font-size: 4vw;  width: 4vw;  text-align: center;  text-decoration: none;  margin: 0 0 1vw 0;}
	
/*	iframe { width:100%!important; margin:1vw 0 1vw 0; padding:0; }	*/
}



* {	outline: none; tap-highlight-color:transparent!important; -webkit-tap-highlight-color: transparent!important; }
body  {	margin:0; padding:0; background-color: var(--body-bg-szin); tap-highlight-color:transparent; width:100%; overflow-x:hidden!important; color:var(--body-betuszin);}
body,td,th,div,p,span { font-family: var(--body-betutipus);	color: var(--body-betuszin:); font-weight: var(--body-weight);}

h1,h2,h3,h4,h5 {color: var(--h-betuszin); font-family:var(--h-betutipus); font-weight: var(--h-weight); margin:0; padding:0;}
h1 a, h2 a, h3 a, h4 a, h5 a {color: var(--h-betuszin-a); transition-duration: var(--trans-dur-a); text-decoration:var(--h-a-alahuzas);}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover {color: var(--h-betuszin-hover); transition-duration: var(--trans-dur-b); text-decoration:var(--h-a-alahuzas);}

a {text-decoration: var(--a-alahuzas);	color:var(--a-betuszin); font-weight: var(--a-weight);	outline: none;	padding:0; margin:0; transition-duration: var(--trans-dur-a);}
a:hover {text-decoration: var(--a-alahuzas-hover); color: var(--a-betuszin-hover); transition-duration: var(--trans-dur-b);}

img { var(--img-hover-opacity-a); transition-duration: var(--trans-dur-a);}
a img:hover {opacity: var(--img-hover-opacity-b); transition-duration: var(--trans-dur-b);}

hr {border:none; border-bottom:10px solid var(--hr-szin); padding:0;	margin:0 auto; width:var(--hr-szelesseg)}

input, textarea, select { font-family: var(--input-betutipus);	color: var(--input-betuszin); font-weight: var(--input-weight);}

.butt1 { font-family:var(--butt1-betutipus); background:var(--butt1-hatter); border:var(--butt1-border); color:var(--butt1-betuszin); display: inline-block; cursor:pointer; transition-duration: var(--trans-dur-a); border-radius:var(--butt1-borderradius); text-decoration:none;}
.butt1:hover { background:var(--butt1-hatter-hover); border:var(--butt1-border-hover); color:var(--butt1-betuszin-hover); transition-duration: var(--trans-dur-b); text-decoration:none;}
.butt2 { font-family:var(--butt2-betutipus); background:var(--butt2-hatter); border:var(--butt2-border); color:var(--butt2-betuszin); display: inline-block; cursor:pointer; transition-duration: var(--trans-dur-a); border-radius:var(--butt2-borderradius); text-decoration:none;}
.butt2:hover { background:var(--butt2-hatter-hover); border:var(--butt2-border-hover); color:var(--butt2-betuszin-hover); transition-duration: var(--trans-dur-b); text-decoration:none;}
.butt3 { font-family:var(--butt3-betutipus); background:var(--butt3-hatter); border:var(--butt3-border); color:var(--butt3-betuszin); display: inline-block; cursor:pointer; transition-duration: var(--trans-dur-a); border-radius:var(--butt3-borderradius); text-decoration:none;}
.butt3:hover { background:var(--butt3-hatter-hover); border:var(--butt3-border-hover); color:var(--butt3-betuszin-hover); transition-duration: var(--trans-dur-b); text-decoration:none;}

b, strong { font-weight:700;}


@keyframes slider_01_zoom { 0% {transform:scale(1.02,1.02); filter: blur(10px);} 20% {transform:scale(1.1,1.1); filter: blur(0);} 100% {transform:scale(1.02,1.02); filter: blur(10px);}}




.butt1.o, .butt2.o, .butt3.o { display:none;}
#nyito_lead_hide { display:none}
#nyito_lead_hide.o { display:block;}