/*created Oct 27, 2025 16:46 */
/*last edited Dec 31, 2025 12:03 */
	@import url("https://fonts.googleapis.com/css?family=Kalam:300,400,700&subset=latin-ext");
	html {-webkit-text-size-adjust: 100%} /*Fontnövelés megakadályozása iPhone landscape módban*/
	body, table, tr, td,  li, img, div, figure, span {margin:0; padding:0; border:0;box-sizing:border-box}
	body a:link {color:#ffaaff} a:visited {color:#c000c0} a:#ff0000 {color:burlywood}
	body {background: url(stone29c.jpg)  #472a2a  fixed;
		font-family:Arial;
		font-size: 10pt/14pt
	}
	:focus {outline:none}

	.main {max-width:1100px;margin:auto}

	:root {
		--rbook:hidden; /*book*/
		--end:none; /*block*/
		--cran:none; /*block*/
		--plan:none; /*block*/
		--marb:none; /*inline*/
		--cry1:none; /*inline*/
		--cry2:none; /*inline*/
		}

	a {text-decoration: none;}
	a:link {text-decoration: none; font-weight: 800; font-size: 90%; font-family: Verdana, Arial, sans-serif; line-height: 200%;}
	a:visited {text-decoration: none; font-weight: 800; font-size: 90%; font-family: Verdana, Arial, sans-serif; line-height: 200%; }

@media screen and (min-width:801px){
	.grid-container {
		display: grid;
		grid-template-columns: 3fr 1fr;
		grid-template-rows: 1fr 2fr;
		grid-gap: 10px;
	}

	.item {
		background-color: rgba(71,42,42,0.66);
		padding: 5px;
		text-align: center;
		border-style: solid;

		border-image-source: url(border5.png);
		border-image-slice: 4;
		border-image-width: 4px;
		border-image-repeat: repeat;
	}

	.item1 { /*fáklya*/
		grid-column 1;
		grid-row 1;
		flex-wrap: nowrap;
		padding: 10px;
	}

	.item2 { /*leltár*/
		margin-bottom:1em;
		margin-bottom:1em;
		background-color: rgb(71,42,42);
		grid-column 1;
		grid-row 2;
		padding: 10px;
	}

	.item3 { /*kép*/
		margin-bottom:1em;
		max-width:808px;
		grid-column 2;
		grid-row: 1 / span 2;
	}
}
@media screen and (max-width:800px){

	.grid-container {
	  display: grid;
	  grid-template-columns: 1fr 1fr;
	  grid-template-rows: 1fr 1fr;
	  grid-gap: 10px;
	}
	.item {
	  background-color: rgba(71,42,42,0.66);
	  border: 1px solid #400000;
	  padding: 1px;
	  margin:1px;
	  text-align: center;
	  border-radius: 8px;

	}

	.item1 { /*fáklya*/
		grid-column 1;
		grid-row 2;
		flex-wrap: nowrap;
	}

	.item2 { /*leltár*/
		background-color: rgb(71,42,42);
		grid-column 2;
		grid-row 2;
	}

	.item3 { /*kép*/
		grid-column-start: span 2;
		grid-row: 1;
	}

}
	img.pics {max-width:100%;
		height:auto;
		margin:auto;
		border:1px solid #400000;
		border-radius:8px;
		display:block;
	}
	img.pics2 {max-width:100%;
		height:auto;
	}

	table.book {
		width:70%;height:75.0%;
		margin:auto;
		position:absolute;
		left:15.0%;top:11.8%;
		font:2.1cqw 'Kalam',times,serif;
		line-height:1.1em;
		text-align:left;
		border:0;
		border-collapse: collapse;
	}
	td.book {
		width:50%;
		padding:0 1em 0 1em;
		position:absolute;
		cursor:grabbing;
	}

	#mark {
	border: 2px dotted red !important;
	position:absolute;
	}

	div.pic {
		background-color: #303030; width:800; height:600; padding:0;
		border-left: 2px solid #606060; border-top: 2px solid #606060;
		border-right:2px solid #000000; border-bottom: 2px solid #000000
	}

	p.tan {
    	color : wheat;
		font:  12pt/16pt arial, sans-serif;
	}

	.tan2 {
    	color: wheat;
		font: 14pt arial, sans-serif;
	}

	p.yellow{
		color: thistle;
		font:  12pt/16pt arial, sans-serif;
	}

	.fant
		{
    	color: wheat;
		font:bold 24pt/26pt "Kalam", verdana, arial, sans-serif;
		text-align: center;
	}

	.responsive_torch {    /*uj*/
		display:inline-block;
		height:auto;
		max-width:100%;
		vertical-align:middle;
		margin:auto;
		}
	.responsive { /*uj*/
		max-width:100%;
		height:auto;
		margin:auto;
	}

	.hint
		{
		    border-right: #7B3503 1px solid;
		    padding-right: 2px;
		    border-top: peru 1px solid;
		    padding-top: 2px;
		    border-left: peru 1px solid;
		    padding-left: 2px;
		    border-bottom: #7B3503 1px solid;
		    padding-bottom: 2px;
		    position: absolute;
		    text-align:center;
		    display:inline-block;
		    visibility: hidden;
		    color: black;
		    background-color: tan;
		}

	.keret {border: 1px solid red} /*for testing only*/
	.keret2 {border: 1px solid cyan} /*for testing only*/
	.keret3 {border: 2px solid yellow} /*for testing only*/