/*
	CSS for Metadata Dev
2026.1.10
*/
#primary{
	& a{
		text-decoration:none;
		&:hover{text-decoration:underline;}
	}

	& img.dlg, & img.dlg_s{
		border:1px solid #DCDCDC;
		filter:drop-shadow(#aaa 2px 2px 3px);
	}

	& .OvvMsg{
		display:grid;
		grid-template-columns:auto 1fr;
		gap:0 1em;
		& ul{
			list-style:url(/img/dot.png);
			margin-top:.5em;
			margin-bottom:0;
			padding-left:1em;
			& li{
				padding-bottom:.3em;
				& ul{
					list-style:url(/img/dot1.png);
					margin:.2em 0 .2em 1.5em;
					& li{padding-bottom:0;}
				}
			}
		}
		& .foot{margin-top:0em;grid-area:2/1/2/3;}
	}
	& h3 > span{border-bottom:2px solid gray;}

	& div.tech-btn{
		margin-bottom:2px;
		display:grid;
		grid-template-columns:repeat(2,max-content);
		gap:6px;
		& > div{
			padding:0 8px;
			background-color:#FFF;
			font-weight:bold;
			border:1px solid gray;
			border-radius:.3em;
			cursor:pointer;
			&:hover{}
			&.techOn{background-color:#FFC;}
		}
	}

	& pre{
		margin-top:0;
		&.code{margin-bottom:0;}
		&.xmp{
			overflow:auto;
			padding:1em;
		}
	}

	& .dl_site-wrap{
		margin-top:1em;
		display:grid;
		grid-template-columns: max-content max-content;
		gap:3px 2px;
		& div{
			padding:.5em 1em;
			&:nth-child(1),&:nth-child(3){background-color:#eef0fa;}
			&:nth-child(2),&:nth-child(4){background-color:#f4f4f4;}
			& span{color:orange;}
		}
	}
}

/* Small Screen */
@media only screen and (max-width:700px){
	#primary{
		& pre.code{font-size:50%}
	}
}
@media only screen and (max-width:600px){
		& img.dlg{width:80%;}
		& img.dlg_s{width:36%;}
	}
}