:root {
	--serif: Playfair Display Flex,Playfair-Display-Fallback,Apple Color Emoji,Noto Color Emoji,serif; 
	--sans: Metropolis,Metropolis-Fallback,Apple Color Emoji,Noto Color Emoji,sans-serif;
	--blue: #2a68a3;
	--blue2: #60bbcd;
}

main { min-height: 768px; }
menu { font-family: var(--serif); color: #444; font-size: 14px; }
menu .item a {white-space: nowrap; letter-spacing: 1px;  border-bottom: 2px solid white; transition: 0.8s; }
menu .item a:hover {border-bottom: 2px solid var(--blue); }
menu .item.on a { border-bottom: 2px solid var(--blue); color: #111; }
.mobileMenu { font-family: var(--serif); color: #444; font-size: 14px; letter-spacing: 1px; }

h1 { font-family: var(--serif); color: var(--blue); text-align: center; padding: 1px; font-size: 3rem; }
h2 { font-family: var(--serif); color: var(--blue); text-align: center; padding: 1px; font-size: 2rem; }
h3 { font-family: var(--sans); color: #777; text-align: center; padding: 1px; font-size: 1.5rem; }

p,td,li { font-family: var(--sans); color: #777; font-size: 1.075rem; line-height: 1.6; }

.center {text-align: center;}
.left {text-align: left;}
.right {text-align: right;}
.italic {font-style: italic;}

.tartalom {max-width: 1000px; margin: 0 auto; overflow: hidden; padding: 10px 0;}
.tartalom.img {justify-content: center; align-items: top;}

.flex {display: flex; } 
.flex div {flex:1;}

.underline {border-bottom: 2px solid lightblue;}

@media screen and (max-width: 800px){
	.flex {
		flex-direction: column;
	}
	.left, .right {text-align: center;} 

}


.sav { background: rgba(255,255,255,0.9); color: #444; margin-top: 0; }

.kurzusok {
	display:flex;
	padding: 30px;
}

.kurzusok div {padding: 30px 30px;}

.kurzusok img {  width: 100%;  border: 2px dotted gold; padding: 10px;}
.reklam {text-align:center; padding: 30px 60px;}
.reklam img {max-width: 600px; width: 100%;}

.tartalom.img img {}

.tartalom .bal {text-align: center;}
.tartalom div img{padding: 10px; max-width: 400px; width: 100%; margin: 0 auto;}
.tartalom ul{padding: 0 0 0 30px;}
.tartalom li{}
.tartalom p{padding: 20px;}
@media screen and (max-width: 800px){
	.sav .tartalom {flex-direction: column;}
}

.orarend {margin: 10px;}
.orarend th, .orarend td {text-align: center;}
.orarend .napok th {background: gold; border: 1px solid white; padding: 10px;}
.orarend .orak td {background: beige; border: 1px solid white; padding: 10px;  font-family: monospace; padding: 10px 0px; font-size: 16px;}
.orarend .napok th span:nth-of-type(1) {display: none;}
@media screen and (max-width: 800px){
	.orarend .napok th span:nth-of-type(2) {display: none;}
	.orarend .napok th span:nth-of-type(1) {display: block;}
	.orarend .orak th, .orarend .orak td{padding: 10px 0; font-size: 14px;}
}

.kapcsolat {max-width: 600px; margin: 0 auto;}
.kapcsolat div {text-align: left;}
.kapcsolat label {display: block; padding: 10px 0 5px 0;}
.kapcsolat textarea {height: 100px; width: 500px;}
.kapcsolat img {border: 1px solid #ccc;}
.kapcsolat button {background: gray; border: none; padding: 10px 30px; color:white; cursor: pointer;}
@media screen and (max-width: 800px){
	.kapcsolat {padding: 10px;}
	.kapcsolat textarea {width: 100%;}
}