/* resets */

*{
	padding:0px;
	margin:0px;
}

img{
	border:0px;
	max-width:100%;
}

sup{
	vertical-align:top;
	position:relative;
	top:-0.5em;
	padding-left:1px;
}

sub{
	vertical-align:bottom;
	position:relative;
	bottom:-0.5em;
	padding-left:1px;
}

u{
	text-underline-position:under;
}

ul > li{
	list-style-type:none;
}

.center{
	text-align:center;
}

.clear{
	display:block;
	height:0px;
	line-height:0px;
	font-size:0px;
	clear:both;
}

.clear.divider10{
	height:10px;
}

.clear.divider20{
	height:20px;
}

.clear.divider30{
	height:30px;
}

.img{
	font-size:0px;
	line-height:0px;
}

a, a:hover, a:active, a:focus{
	text-decoration:none;
	outline:none;
}

button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner,
select::-moz-focus-inner{
	border:none;
	outline:none!important;
}

input{
	border-radius:0px; /* disable iOS browsers auto border radius */
	background:none; /* disable Firefox default grey background */
	outline:none;
	/* for iOS browsers */
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
	-o-appearance:none;
	appearance:none;
}

input[type=submit]{
}

textarea{
	background:none; /* disable Firefox default grey background */
	resize:none;
	outline:none;
	overflow:auto; /* disable scrollbar in IE */
	/* for iOS browsers */
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
	-o-appearance:none;
	appearance:none;
}

select{
	background:none; /* disable default grey background */
	outline:none; /* for Chrome */
	-moz-appearance:none; /* hide arrow */
	-webkit-appearance:none;
	appearance:none;
}

select:-moz-focusring{
	color:transparent!important;
	text-shadow: 0 0 0 #000!important;
}

option:not(:checked){
	color:black; /* prevent <option>s from becoming transparent as well */
}

table{
	/* kis kijelzon hosszu szavak tordelesehez */
	table-layout:fixed;
}

table td{
	/* kis kijelzon hosszu szavak tordelesehez */
	word-wrap:break-word;
	overflow-wrap:break-word;
}

::placeholder{
	opacity:1;
}

::-webkit-input-placeholder{
	/* ezt kulon ki kell irni, mert mobil Chrome-ban csak igy mukodik, ha az elozo melle irom vesszovel, akkor nem */
	opacity:1;
}

::selection{
	color:#ffffff;
	background:#ff0000;
}

::-moz-selection{
	color:#ffffff;
	background:#ff0000;
}

/* */

@colorBrown:#695448;
@colorBrown2:#917a78;
@colorRed:#905C58;

/* */

html{
	/* ez iOS eszkozoknek kell, iPhone-nak biztos, mert van, hogy nem jol jelenitik meg az oldalt */
	-webkit-text-size-adjust:100%;
}

body{
	background-color:#f6f5e9;
}

body.touchScreen *{
	/* mobiloknak, ha kattintunk, akkor ne valtozzon az elem szine/hatterszine, pl. mobil Chrome-ban kekre */
	-webkit-tap-highlight-color:transparent;
	tap-highlight-color:transparent;
}

/* */

.wrap{
	max-width:800px;
	background-color:#f6f5e9;
	margin-right:auto;
	margin-left:auto;
	& > header{
		background-color:#402a30;
		padding:37px 20px 26px 20px;
		& > .img{
			float:left;
		}
		& > a{
			display:inline-block;
			float:right;
		}
	}
	& > .landingImg{
		background-position:top center;
		background-size:cover;
	}
	& > nav{
		display:none;
		border-top:1px solid @colorBrown2;
		padding:32px 0px 32px 0px;
		& > ul{
			opacity:0;
			& > li{
				padding-bottom:25px;
				text-align:center;
				&:last-child{
					padding-bottom:0px;
				}
				& > a{
					display:inline-block;
					font-family:'Open Sans';
					font-weight:400;
					font-size:20px;
					line-height:20px;
					color:@colorBrown;
					text-transform:uppercase;
					@media screen and (max-width:499px){
						font-size:18px;
						line-height:18px;
					}
				}
				& > ul{
					display:none;
					padding-top:25px;
					padding-bottom:7px;
					opacity:0;
					& > li{
						padding-bottom:25px;
						&:last-child{
							padding-bottom:0px;
						}
						& > a{
							display:inline-block;
							font-family:'Open Sans';
							font-weight:400;
							font-size:16px;
							line-height:16px;
							color:@colorBrown2;
							@media screen and (max-width:499px){
								font-size:14px;
								line-height:19px;
							}
						}
					}
				}
			}
		}
	}
	& > .img{
	}
	& > .landingImg{
		opacity:0;
	}
	& > main{
		padding:42px 20px 42px 20px;
		&.landing{
			padding:30px 0px 30px 0px;
			opacity:0;
		}
		& > .lngs{
			text-align:center;
			& > ul{
				display:inline-block;
				& > li{
					float:left;
					&:first-child{
						padding-right:100px;
					}
					& > a{
						color:@colorBrown;
						text-transform:uppercase;
					}
				}
			}
		} /* .lngs */
		& > h1{
			font-family:'Open Sans';
			font-weight:400;
			font-size:22px;
			line-height:22px;
			color:@colorBrown;
			padding-bottom:50px;
			text-transform:uppercase;
			@media screen and (max-width:499px){
				font-size:20px;
				line-height:20px;
			}
		}
		& > h2{
			font-family:'Open Sans';
			font-weight:600;
			font-size:18px;
			line-height:23px;
			color:@colorBrown;
			text-transform:uppercase;
			@media screen and (max-width:499px){
				font-size:16px;
				line-height:21px;
			}
			& > a{
				color:@colorBrown;
				&.playerItem{
					display:block;
					position:relative;
					padding-left:20px;
					&:before{
						display:inline-block;
						position:absolute;
						top:0px;
						left:0px;
						font-family:'Font Awesome 5 Free';
						font-weight:900;
						font-size:14px;
					}
					&.stop:before{
						content:"\f04b";
					}
					&.play:before{
						content:"\f04d";
					}
				}
			}
		}
		& > p, & > div{
			font-family:'Open Sans';
			font-weight:400;
			font-size:16px;
			line-height:26px;
			color:@colorBrown;
			@media screen and (max-width:499px){
				font-size:14px;
				line-height:19px;
			}
			& > a{
				color:@colorRed;
			}
			& > span{
				&.editor3{
				font-family:'Open Sans'!important;
				font-weight:400!important;
				font-size:0.9em!important;
				color:@colorBrown2!important;
				font-style:italic;
				text-transform:normal;
				}
			}
			& > font{
				font-family:'Open Sans'!important;
			}
		}
		& > .gallery{
			padding-top:30px;
			& > ul{
				float:left;
				width:100%;
				& > li{
					float:left;
					width:20%;
					padding-bottom:50px;
					text-align:center;
				}
			}
		}
		& > .videoDivider{
			height:40px;
			border-bottom:1px solid @colorBrown2;
			margin-bottom:40px;
		}
	}
}

