html
{
	scroll-behavior: smooth;
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

@-webkit-keyframes fade 
{
	from {opacity: .4} 
	to {opacity: 1}
}
  
@keyframes fade 
{
	from {opacity: .4} 
	to {opacity: 1}
}

@-webkit-keyframes beuszas 
{
	from {opacity: .4; filter: blur(8px); -webkit-filter: blur(8px)} 
	to {opacity: 1; filter: blur(0px); -webkit-filter: blur(0px)}
}
  
@keyframes beuszas 
{
	from {opacity: .4; filter: blur(8px); -webkit-filter: blur(8px); -webkit-filter: grayscale(100%); filter: grayscale(100%)}
	to {opacity: 1; filter: blur(0px); -webkit-filter: blur(0px); -webkit-filter: grayscale(0%); filter: grayscale(0%)}
}

@keyframes elbujik
{
	0% {opacity: 1;}
	100% {opacity: .2;}
}

@keyframes elotunik
{
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@font-face
{
	font-family: 'Tasadith';
	src: url(https://havasisoftware.hu/font/Thasadith-Regular.ttf);
}

@font-face
{
	font-family: 'Bellota';
	src: url(https://havasisoftware.hu/font/BellotaText-Light.ttf);
}

@font-face
{
	font-family: 'Pavanam';
	src: url(https://havasisoftware.hu/font/Pavanam-Regular.ttf);
}

@font-face
{
	font-family: 'Jura';
	src: url(https://havasisoftware.hu/font/Jura-Light.ttf);
}

@font-face
{
	font-family: 'OpenSans';
	src: url(https://havasisoftware.hu/font/OpenSans-Light.ttf);
}

@font-face
{
	font-family: 'PontanoSans';
	src: url(https://havasisoftware.hu/font/PontanoSans-Regular.ttf);
}

@font-face
{
    font-family: 'Ubuntu';
    src: url(font/Ubuntu-Light.ttf);
}

.oldal
{
	background: repeating-linear-gradient(-45deg, transparent, whitesmoke 6px);
	margin-left: 5%;
	margin-right: 5%;
	vertical-align: middle;
	position: relative;
	-webkit-animation-name: animatebottom;
	-webkit-animation-duration: 1s;
	animation-name: animatebottom;
	animation-duration: 1s;
	/*background: rgb(242,242,242);*/
}

.balra
{
	text-align: left;
}

.kozepre
{
	text-align: center;
}

.jobbra
{
	text-align: right;
}

.kek
{
	color: steelblue;
}

.feher
{
	color: white;
}

.antracit
{
	color: #333;
}

/*
p
{
	height: 0.3em;
}
*/

/* Remove margins and padding from the list, and add a black background color */
.fejlec
{
    list-style-type: none;
    padding: 7px;
    overflow: hidden;
    background-color: #333;
	position: sticky;
	vertical-align: middle;
	text-align: center;
	color: white;
	top: 0;
	opacity: 0.9;
    filter: alpha(opacity=50);
	-webkit-transition-duration: 0.7s; /* Safari */
    transition-duration: 0.7s;
	/*background-image: url(pic/logo_elegant.svg);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 120px 42px;
	padding-right: 120px;
	min-height: 40px;
	height: auto;*/
	height: 40px;
	/*box-shadow: 2px 2px 10px 5px gray;*/
	box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
	border-radius: 5px;
	z-index: 1;
}

.fejlec_logo
{
	position: absolute;
	right: 3px;
	height: 42px;
	width: 120px;
}

.menu_icon
{
	height: 20px;
	height: 20px;
	left: 3px;
	margin-top: 7px;
	margin-bottom: 7px;
	vertical-align: middle;
}

.menu_kep
{
	float: left;
	height: 5vh;
	width: 5vh;
	padding: 1vh;
	/*opacity: 0.7;*/
	margin-right: 1vw;
}

/*.menu_kep:hover
{
	//box-shadow: 2px 2px 10px 5px steelblue;
	opacity: 1;
	height: 6vh;
	width: 6vh;
}*/

.menu_leiras
{
	visibility: hidden;
	color : white;
	font-family: Ubuntu;
	animation-name: megjelenik;
	-webkit-animation-name: megjelenik;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.banner_cim
{
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: auto;
	background: steelblue;
	animation-name: megjelenik;
	-webkit-animation-name: megjelenik;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
	vertical-align: middle;
	box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
	border-radius: 5px;
}

.banner_doboz
{
	/*width: 90vw;*/
	height: 40vh;
	position: relative;
	margin: auto;
	z-index: -1;
}

.banner_kep_doboz
{
	display: none;
	text-align: center;
}

.banner_kep_slide
{
	max-width: 90vw;
	height: 40vh;
	vertical-align: middle;
	text-align: center;
	border-radius: 4px;
	/*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
	box-shadow: 0 4px 8px 0 rgba(70, 130, 180, 0.2), 0 6px 20px 0 rgba(70, 130, 180, 0.19);
	object-fit: contain;
	/*background-color:whitesmoke;*/
	background-image: radial-gradient(white, whitesmoke);
}

.banner_kep
{
	max-width: 100%;
	vertical-align: middle;
	/*height: 50vh;
	margin: auto;*/
}

.statusz_csik
{
	margin: 0 2px;
	color: #333;
	font-size: 5vw;
	height: 2vh;
	/*display: inline-block;*/
	transition: background-color 0.6s ease;
}
  
.active
{
	color: steelblue;
}

.ketoszlop
{
	display: grid;
 	grid-template-columns: auto auto;
  	/*grid-gap: 5vw;
	padding: 2vw;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
	align-items: center;
	text-align: center;
	width: fit-content;*/
}

.csempe_terulet
{
	width: 90vw;
	overflow: auto;
	border-style: hidden;
	border-width: thin;
	border-color: steelblue;
	/*display:inline-table;*/
}

.csempe_kep
{
	position: relative;
	height: 50px;
	width: 50px;
	padding-top: 1vw;
}

.tartalom_tablazat
{
	width: 80vw;
	text-align: center;
	padding: 2px;
	border: none;
	border-spacing: 2em;
}

.tartalom_doboz
{
	-webkit-animation-name: animatebottom;
	-webkit-animation-duration: 1s;
	animation-name: animatebottom;
	animation-duration: 1s;
	width: 25vw;
	height: 25vw;
	/*width: 20vw;
	height: 20vw;*/
	box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
	margin-left: 2vw;
	overflow: auto;
	border-radius: 5px;
	background-color: whitesmoke;
}

.tartalom_doboz:hover
{
	box-shadow: 1px 1px 10px 5px rgb(195, 193, 193);
}

.tartalom_doboz_nagykep_cim
{
	position: relative;
	padding: 1vw;
	background: steelblue;
	color: rgb(242,242,242);
	text-align: center;
	font-family: Ubuntu;
	font-size: 3vh;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.6s;
	-webkit-animation-duration: 0.6s;
	/*background-image: radial-gradient(farthest-side, steelblue, whitesmoke);*/
}

.tartalom_doboz_tartalom
{
	overflow: auto;
}

.tartalom_doboz_nagykep_szoveg
{
	background-color: whitesmoke;
	opacity: unset;
	color: #333;
	text-align: left;
	font-family: Ubuntu;
	font-size: large;
	/*font-size: 2.5vh;*/
	padding-right: 2vw;
	overflow-y: auto;
}

.kiemeles_doboz
{
	background-color: steelblue;
	max-width: 60%;
	margin: auto;
	text-align: center;
	/*box-shadow: 2px 2px 10px 7px gray;*/
	box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
	border-radius: 5px;
}

.kiemeles_szoveg
{
	margin: auto;
	color:white;
	font-family: Ubuntu;
	font-weight: 100;
	font-size: 2vw;
}

.navi_sav
{
	width: 90vw;
}

.navimenu
{
	visibility: visible;
	float: left;
	padding: 10px;
}

.hamburger_menu
{
	visibility: hidden;
	position: absolute;
	vertical-align: middle;	
	left: 3px;
	cursor: pointer;
}

.hamburger_menu:hover
{
	background-color: steelblue;
	border-radius: 5px;
	box-shadow: 2px 2px 10px 5px steelblue;
}

.hamburger_menu_tartalom_doboz_old
{
	padding: 7px;
	visibility: hidden;
	position: fixed;
	top: 45px;
	left: 5vw;
	opacity: 0.9;
	overflow: auto;
}

.hamburger_menu_tartalom_doboz
{
	height: 100%;
    width: 0;
    position: fixed; /* Stay in place */
    z-index: 2; /* Sit on top */
    left: 0;
    top: 0;
	color: white;
    
	background-color: #333;
    background-color: rgba(51, 51, 51, 0.9);

	/*background-color: steelblue;
    background-color: rgba(70, 130, 180, 0.9);*/

	/*background-color: white;
    background-color: rgba(255, 255, 255, 0.9);*/

    overflow-x: hidden; /* Függőleges görgetés tiltása */
    transition: 0.5s; /* mobil menü beúszási idő */
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
}

.mobil_menu_cim
{
	font-family: Ubuntu;
	font-size: xx-large;
	font-weight: bold;
	margin-top: 2vh;
	margin-bottom: 4vh;
}

.hamburger_menu_tartalom_doboz .closebtn
{
    position: absolute;
    top: 1vh;
    float: right;
    right: 5vw;
    font-size: xx-large;
    border-style: solid;
    border-width: thin;
    border-color:white;
    border-radius: 25%;
    box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
}

.hamburger_menu_tartalom_doboz a 
{
    padding: 8px;
    text-decoration: none;
    font-family: Ubuntu;
    font-size: xx-large;
    color: white;
    display: block;
    transition: 0.3s;
}

.hamburger_menu_tartalom_doboz a:hover
{
    text-decoration: underline;
	text-decoration-style: dotted;
}

.cegnev
{
	position: static;
	text-align: center;
	color: steelblue;
	font-size: 24px;
	font-family: Ubuntu;
	font-weight: 300;
	letter-spacing: 0.5px;
	line-height: 1.2;
}

.logo
{
	text-align: center;
	padding-top: 100px;
}

.alcim
{
	text-align: center;
	vertical-align: middle;
	color: rgb(242,242,242);
	font-family: Ubuntu;
	/*font-size: 6vh;*/
	font-size: 5vh;
	font-weight: 100;
	letter-spacing: 0.5px;
	line-height: 1.2;
	animation-name: megjelenik;
	-webkit-animation-name: megjelenik;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
	/*padding-top: 2vh;
	padding-bottom: 2vh;*/
}

.bemutatkozo_szoveg
{
	vertical-align: text-top;
	font-family: Ubuntu;
	font-size: 2vh;
	font-weight: 100;
	color: #444;
	line-height: 150%;
	text-align: justify;
	padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.promo_szoveg
{
	vertical-align: text-top;
	font-family: Ubuntu;
	font-size: 6vh;
	font-weight: 100;
	color: #444;
	line-height: 150%;
	text-align: center;
	padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.fejezetcim_kep
{
	position: relative;
	height: 20vh;
}

.fejezetcim
{
	padding-top: 20px;
	padding-bottom: 20px;
	background: steelblue;
	color: rgb(242,242,242);
	text-align: center;
	font-family: Ubuntu;
	font-size: 5vh;
	font-weight: 100;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.6s;
	-webkit-animation-duration: 0.6s;
	border-radius: 5px;
}

.stockify_fejezetcim
{
	background: linear-gradient(purple, blue);
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
}

.fejezetoszlopcim
{
	font-family: Ubuntu;
	padding-top: 36px;
	padding-bottom: 16px;
	text-align: center;
	/*font-size: 24px;*/
	font-size: 5vh;
	font-weight: 100;
	color: steelblue;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.fejezetkiscim
{
	font-family: Ubuntu;
	text-align: left;
	font-size: 3.5vh;
	font-weight: 100;
	color: steelblue;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.oszloptores
{
	break-after: column;
}

.fejezetszoveg
{
	vertical-align: text-top;
	font-family: Ubuntu;
	font-size: 3.5vh;
	font-weight: 100;
	color: #444;
	line-height: 150%;
	text-align: justify;
	padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

input[type=submit]
{
	text-align: center;
	margin: auto;
	background-color: rgb(242,242,242);
	border: 1px solid steelblue;
	color: steelblue;
	font-weight: bold;
	font-size: 18px;
	border-radius: 2px;
	padding: 15px 32px;
}

input[type=submit]:hover
{
	background: steelblue;
    color: white;
	-webkit-transition-duration: 0.7s;
    transition-duration: 0.7s;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.lablec
{
	margin: bottom;
	color: antracit;
	text-align: center;
	font-size: 2vh;
	vertical-align: middle;
}

.rejtett
{
	display: none;
}

/* Fading animation */
.fade 
{
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

.beuszas
{
	-webkit-animation-name: beuszas;
	-webkit-animation-duration: 1s;
	animation-name: beuszas;
	animation-duration: 1s;
}

.megjelenik
{
  -webkit-animation-name: megjelenik;
  animation-name: megjelenik;
}

@-webkit-keyframes megjelenik
{
  from {visibility: hidden}
  to {visibility: visible}
}

@keyframes megjelenik
{
  from {visibility: hidden}
  to {visibility: visible}
}

a.tartalom_doboz_link:link, a.tartalom_doboz_link:visited
{
	display: block;
	text-decoration: none;
	color: #333;
}

a.tartalom_doboz_link:hover, a.tartalom_doboz_link:active
{
	display: block;
	opacity: 0.9;
	text-decoration: none;
	color: #333;
}

a.menu_link:link, a.menu_link:visited
{
	color: white;
	/*font-size: 18px;*/
	font-family: Ubuntu;
	text-decoration: none;
}

a.menu_link:hover, a.menu_link:active
{
	text-decoration: underline;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	-webkit-transition-duration: 2s; /* Safari */
    transition-duration: 2s;
	/*background: white;
    color: steelblue;*/
}

a.link:link, a.link:visited
{
	color: steelblue;
	/*font-size: 18px;*/
	font-family: Ubuntu;
	text-decoration: none;
}

a.link:hover, a.link:active
{
	text-decoration: underline;
	text-decoration-line: underline;
	text-decoration-style: dotted;
	-webkit-transition-duration: 2s; /* Safari */
    transition-duration: 2s;
	/*background: steelblue;
    color: white;*/
}

a.impresszum_link:link, a.impresszum_link:visited
{
	color: unset;
}

a.impresszum_link:hover, a.impresszum_link:active
{
	color: unset;
	background: unset;
}

.impresszum_ceglogo
{
	height: 25vh;
	margin-top: 1vh;
}

.levelfejlec
{
	background-color: #333;
    width: 100%; /* Full width */
	opacity: 0.9;
    filter: alpha(opacity=50);
	box-shadow: 3px 3px gray;	
	text-align: right;
	color: white;
	font-size: 24px;
	font-family: Ubuntu;
	font-weight: 300;
	letter-spacing: 0.5px;
	line-height: 1.2;
}

.leirasdoboz
{
	margin-left: 10%;
	margin-right: 10%;
	position: center;
	/*width: auto;*/
	background-color: white;
	box-shadow: 3px 3px gray;
	text-align: justify;
	color: steelblue;
	font-family: Ubuntu;
	font-style: italic;
}

.beleerzes
{
	padding-top: 36px;
	text-align: center;
	font-family: Ubuntu;
	font-size: 24px;
	font-weight: bold;
	color: steelblue;
	animation-name: fade;
	-webkit-animation-name: fade;
	animation-duration: 0.7s;
	-webkit-animation-duration: 0.7s;
}

.kep 
{	
    /*opacity: 0.5;
	height: 15vh;*/
	height: 40px;
}

/*
.kep:hover 
{
    opacity: 1.0;
}
*/

.fejezetkiskep
{
	height: 3.5vh;
}

hr
{
	color: steelblue;
}

.tablazat_doboz
{
	width: 80vw;
	overflow: auto;
	text-align: center;
}

.artablazat
{
	border-color: steelblue;
	border-style: solid;
	border-collapse: collapse;
	border: steelblue;
	text-align: left;
	width: 80%;
	overflow: auto;
}

.adatkezeles_doboz
{
	overflow-x: auto;
	/*text-align: center;*/
}

.adatkezeles_tablazat
{
	border-color: steelblue;
	border-style: solid;
	border-collapse: collapse;
	border: steelblue;
	/*text-align: center;
	width: 100%;*/
	overflow-x: auto;
}

.adatkezeles_tablazat th, .adatkezeles_tablazat td
{
	padding: 0.7vh;
}

.artablazat_cim
{
	text-align: center;
	font-family: Ubuntu;
	font-weight: 100;
	font-size: 4vh;
	background-color: steelblue;
	color:white;
	border-radius: 5px;
	padding: 4px;
}

.artablazat th
{
	text-align: center;
	vertical-align: top;
	padding: 0.7vh;
	font-family: Ubuntu;
	font-weight: 100;
	font-size: 3vh;
	/*font-size-adjust: ;*/
}

/*
.artablazat tr:nth-child(odd) 
{
	background-color: lightblue;
	background-color: rgb(158, 204, 241);
}
*/

.artablazat td
{
	padding: 0.7vh;
	font-family: Ubuntu;
	font-weight: 100;
	font-size: 2.5vh;
}

.artablazat_summa
{
	/*color: IndianRed;*/
	color: steelblue;
	cursor: default;
	/*color: DarkSeaGreen;
	color: LightCoral;*/
}

.artablazat_sor:hover
{
	background-color: lightgrey;
	/*background-color: steelblue;
	color: white;*/
	cursor: default;
}

.artablazat_labjegyzet
{
	font-size: smaller;
	font-style: italic;
	text-align: center;
}

.szam
{
	text-align: right;
	white-space: nowrap;
}

::-webkit-scrollbar 
{
    width: 7px;
}
::-webkit-scrollbar-track 
{
    background-color: #333;
    border-left: 1px solid #ccc;
}

::-webkit-scrollbar-thumb 
{
    background-color: steelblue;
	/*border-radius: 3.5px;*/
}

::-webkit-scrollbar-thumb:hover 
{
  /*background-color: #aaa;*/
  background-color: #ccc;
}

.impresszum
{
	margin-left: 0%;
	margin-right: 0%;
	vertical-align: middle;
	position: relative;
	background-color: #111;
	color: steelblue;
	opacity: 0.9;
	font-family: Ubuntu;
	font-weight: 100;
	line-height: 150%;
	padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
	/*box-shadow: 2px 2px 10px 5px gray;*/
	box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
	border-radius: 5px;
}

.impresszum_cim
{
	color: steelblue;
	font-family: Ubuntu;
	font-size: 5vh;
	font-weight: 100;
	text-align: center;
}

.impresszum_ikon
{
	height: 7vh;
	text-align: center;
}

.impresszum_szoveg
{
	color:steelblue;
	font-family: Ubuntu;
	font-size: 2vh;
}

.impresszum_tablazat
{
	display: grid;
 	grid-template-columns: auto auto auto auto;
	grid-gap: 10vw;
	padding: 2vw;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
	align-items: center;
	text-align: center;
	width: fit-content;
}

.kozossegi_ikon
{
	height: 30px;
}

.kozossegi_ikon:hover
{
	opacity: 0.7;
}

.kozossegi_link
{
	display: visible;
}

.kozossegi_link:hover
{
	opacity: 0.7;
	color: white;
	-webkit-transition-duration: 2s; /* Safari */
    transition-duration: 2s;
}

.cookie
{
	max-width: 20%;
	height: auto;
	background-color: #333;
	opacity: 0.9;
	border-radius: 5px;
	color: white;
	position: fixed;
	right: 5vw;
	bottom: 7px;
	padding: 7px;
	text-align: center;
	font-family: Ubuntu;
	box-shadow: 1px 1px 2px 2px gray;
	animation: elotunik 2s ease-in-out;
}

.cookie2
{
	width: 20%;
	height: auto;
	background-color: #333;
	opacity: 0.9;
	border-radius: 5px;
	color: white;
	/*visibility: visible;*/
	position: fixed;
	right: 7px;
	bottom: 7px;
	padding: 7px;
	text-align: center;
	font-family: Ubuntu;
	box-shadow: 1px 1px 2px 2px gray;
	/*box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);*/
}

.lablec_keret
{
	background-color: #333;
	background-image: url(https://havasisoftware.hu/pic/logo_elegant.svg);
	background-position: right center;
	background-repeat: no-repeat;
	background-size: 120px 42px;
	vertical-align: middle;
	min-height: 50px;
	border-radius: 5px;
}

.lablec
{
	/*float: center;*/
	font-family: Garamond;
	margin: auto;
	color: white;
	text-align: center;
	font-size: 16px;
	vertical-align: middle;
	padding-top: 5px;
	padding-bottom: 5px;
}

.kepgaleria
{
	width: 80vw;
	overflow: auto;
}

.galeria_kep
{
	box-shadow: 5px 10px 18px #888888;
	cursor: pointer;
	height: 100px;
}

.galeria_kep:hover
{
	opacity: 0.7;
}

.nagykep_doboz
{
	position: relative;
	display: none;
	width: 80vw;
	background-color: #333;
	padding: 5px;
	box-shadow: 5px 10px 18px #888888;
	color: white;
	opacity: 0.9;
	border-radius: 4px;
}

.nagykep_bezar_gomb
{
	position: relative;
	/*float: right;*/
	top: 0px;
	right: 5px;
	color: white;
	font-size: 35px;
	cursor: pointer;
	height: 30px;
	width: 30px;
}

.nagykep_bezar_gomb:hover
{
	background-color: white;
	background-size: 20px 20px;
	border-radius: 50%;
	opacity: 0.7;
	color: #333;
	font-weight: bold;
}

.nagykep_szoveg
{
	position: relative;
	top: 0px;
	bottom: 5px;
	left: 15px;
	color: white;
	font-size: 20px;
	font-family: Ubuntu;
}

.csempe_terulet1
{
	display: grid;
 	grid-template-columns: auto auto;
  	grid-gap: 3vh;
	padding: 0.5vw;
	/*padding: 1vh;*/
}

.csempe_terulet2
{
	display: grid;
 	grid-template-columns: auto auto auto;
  	grid-gap: 2vh;
	padding: 2vw;
	/*padding: 1vh;*/
}

.csempe_terulet3
{
	display: grid;
 	grid-template-columns: auto auto auto auto;
  	grid-gap: 2vh;
	padding: 2vw;
}

.topgomb 
{
	display: none; /* Hidden by default */
	position: fixed; /* Fixed/sticky position */
	bottom: 5vh; /* Place the button at the bottom of the page */
	right: 30px; /* Place the button 30px from the right */
	z-index: 1;
	border: none; /* Remove borders */
	outline: none; /* Remove outline */
	border-color: steelblue;
	border-style: solid;
	border-width: thin;
	color: steelblue; /* Text color */
	cursor: pointer; /* Add a mouse pointer on hover */
	padding-left: 15px; /* Some padding */
	padding-right: 15px;
	padding-top: 7px;
	padding-bottom: 7px;
	border-radius: 10px; /* Rounded corners */
	font-family: Ubuntu;
	font-weight: bold;
	font-size: 18px; /* Increase font size */
	opacity: 0.9;
}
  
.topgomb:hover 
{
	background-color: steelblue; /* Add a dark-grey background on hover */
	color: white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.mygas_video_link
{
	z-index: 99;
}

.mygas_video_link:hover
{
	cursor: help;
}

.mygas_video_ablak
{
	height: 100%;
    width: 0;
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    background-color: rgb(255,255,255); /* Fehér fallback szín */
    background-color: rgba(255,255,255, 0.9); /* Fehér átlátszó szín */
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
    box-shadow: inset 0px 3px 6px steelblue, 0px 3px 6px steelblue;
}

.mygas_video_player
{
	width: 90vw;
	height: auto;
}

.funkcio_sav
{
	position: fixed;
	left: 50%;
	transform: translate(-50%);
	bottom: 10px;
	width: fit-content;
	margin: auto;
	padding-left: 10px;
	padding-right: 10px;
	background-color: rgba(255, 255, 255, 0.9);
	border-style: solid;
	border-width: thin;
	border-radius: 10px;
	border-color: steelblue;
	display: flex;
	flex-direction: row;
	justify-content: right;
	align-items: center;
	color:steelblue; 
	z-index:1;
	opacity: .2;
	animation: elbujik 2s ease-in-out;
}

.funkcio_sav:hover
{
	opacity: 1;
}

.switch
{
	display: inline-block;
	width: 50px;
	height: 25px;
	background: #ccc;
	border-radius: 25px;
	position: relative;
	cursor: pointer;
}

.switch::after
{
	content: "";
	width: 21px;
	height: 21px;
	background: white;
	border-radius: 50%;
	position: absolute;
	top: 2px;
	left: 2px;
	transition: 0.3s;
}

.kapcsolo_input:checked + .switch
{
	background: rgb(70, 130, 180);
}

.kapcsolo_input:checked + .switch::after
{
	transform: translateX(25px);
}

.kapcsolo_input
{
	display: none;
}

.tegez
{
	display: none;
}

.magaz
{
	display: inline;
}

@media screen and (max-width:1600px)
{
	.csempe_terulet1
	{
		grid-template-columns: auto auto;
		grid-gap: 3vh;
		padding: 1vw;
	}

	/*.tartalom_doboz
	{
		width: 25vw;
		height: 25vw;
	}*/

	.tartalom_doboz_nagykep_szoveg
	{
		font-size: medium;
	}
}

@media screen and (max-width:1280px)
{
	/*
	.navimenu
	{
		visibility: hidden;
	}

	.hamburger_menu
	{
		visibility: visible;
	}*/

	/*.hamburger_menu_tartalom_doboz
	{
		background-color: #333;
		opacity: 0.9;
		visibility: hidden;
		z-index: +1;
	}*/

	.csempe_terulet2, .csempe_terulet3
	{
		display: grid;
		grid-template-columns: auto auto;
		/*grid-gap: 2vh;*/
		padding: 2vw;
		/*padding: 1vh;*/
	}

	.tartalom_doboz
	{
		-webkit-animation-name: animatebottom;
		-webkit-animation-duration: 1s;
		animation-name: animatebottom;
		animation-duration: 1s;
		width: 30vw;
		height: 30vw;
		box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
		margin-left: 2vw;
		overflow: auto;
		border-radius: 5px;
	}

	.tartalom_doboz_nagykep_cim
	{
		/*font-size: 3vh;*/
		font-size: medium;
	}

	.tartalom_doboz_nagykep_szoveg
	{
		color: #333;
		text-align: left;
		font-family: Ubuntu;
		font-weight: 100;
		/*font-size: 2vh;*/
		font-size: medium;
		padding-right: 2vw;
	}

	.artablazat th
	{
		font-size: 4vh;
	}

	.artablazat td
	{
		font-size: 3vh;
	}

	.topgomb 
	{
		right: 2.5px;
	}
}

@media screen and (max-width:1024px)
{
	.navimenu
	{
		visibility: hidden;
	}

	.hamburger_menu
	{
		visibility: visible;
	}

	.promo_szoveg
	{
		font-size: 3vh;
	}

	.alcim
	{
		font-size: 3vh;
	}

	.fejezetszoveg
	{
		font-size: 2.5vh;
	}

	.impresszum_ceglogo
	{
		height: unset;
		width: 80%;
	}
}

@media screen and (max-width:768px)
{
	.navimenu
	{
		visibility: hidden;
	}

	.hamburger_menu
	{
		visibility: visible;
	}

	/*.hamburger_menu_tartalom_doboz
	{
		background-color: #333;
		opacity: 0.9;
		visibility: hidden;
		z-index: +2;
	}*/

	.csempe_terulet1, .csempe_terulet2, .csempe_terulet3
	{
		display: grid;
		grid-template-columns: auto;
		/*grid-gap: 2vh;*/
		padding: 2vw;
	}

	.tartalom_doboz
	{
		-webkit-animation-name: animatebottom;
		-webkit-animation-duration: 1s;
		animation-name: animatebottom;
		animation-duration: 1s;
		/*width: 40vw;
		height: 40vw;*/
		height: 30vh;
		width: 30vh;
		background-color: steelblue;
		box-shadow: 1px 1px 10px 2px rgb(195, 193, 193);
		margin-left: 2vw;
		border-radius: 50%;
	}

	.csempe_kep
	{
		height: 35px;
		width: 35px;
		padding-top: 0.5vw;
	}

	.tartalom_doboz_nagykep_cim
	{
		position: relative;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		/*width: min-content;*/
		background: none;
		/*font-size: 2vh;*/
		font-size: small;
		padding-top: 15%;
		padding-bottom: 15%;
		/*margin-top: 15%;
		margin-bottom: 15%;*/
	}

	.tartalom_doboz_nagykep_szoveg
	{
		display: none;
		/*color: #333;
		text-align: left;
		font-family: Ubuntu;
		font-weight: 100;
		font-size: 2vh;
		padding-right: 2vw;*/		
	}

	.cookie
	{
		max-width: 40%;
		right: 1px;
		bottom: 30px;
		/*width: 80vw;
		max-width: 80vw;
		height: auto;
		background-color: #333;
		opacity: 0.9;
		border-radius: 5px;
		color: white;
		position: fixed;
		bottom: 7px;
		right: 10vw;
		left: 10vw;
		margin-right: 0;
		padding: 7px;
		text-align: center;
		font-family: Ubuntu;
		font-weight: 100;
		box-shadow: 2px 2px 5px 5px gray;*/
	}

	.artablazat th
	{
		font-size: 3vh;
	}

	.artablazat td
	{
		font-size: 2.5vh;
	}

	.impresszum_tablazat
	{
		display: grid;
		grid-template-columns: auto;
		grid-gap: 2vw;
		padding: 2vw;
		max-width: 80%;
		margin-left: auto;
		margin-right: auto;
		align-items: center;
		text-align: center;
	}
}