@import url('theme/reset.css');
@import url('theme/layout.css');
@import url('theme/style.css');

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

/*\

lang

\*/

body[lang='en'] [lang]:not([lang='en']) {
	display:none;
}

/*\

layout

\*/

body {
   display:grid;
   grid-template-rows:100%;
   grid-auto-flow:column;
   grid-gap:1em;
}
body > nav {
	/* flex:1 1 auto; */
   /* display:grid;
   grid-template-rows:auto auto;
   grid-template-columns:1fr;
   grid-gap:0.5em;
	align-items:start; */
}
article {
   display:grid;
   /* grid-gap:0.5em; */
	grid-template-rows:auto 1fr;
	grid-template-columns:auto;
	grid-template-areas:'header' 'viewport';
	/* overflow-y:hidden; */
}
article:target {
	width:100vw;
	/* height:100vh; */
	box-sizing:border-box;
}
article header {
	grid-area:header;
	min-width:400px;
}
article section {
	grid-area:viewport;
}
/*
article section:nth-of-type(n-1) {
	display:none;
}
*/
article section.image {
	align-self:center;
	display:grid;
	width:480px;
	height:320px;
	grid-template-rows:1fr;
	grid-template-columns:auto;
	justify-items:center;
}
article section img,
article section iframe {
	display:block;
	width:100%;
   height:100%;
   object-fit:contain;
}
/*\

section

\*/


#logo {
   display:flex;
   align-items:center;
   justify-content:center;
}
#logo img {
   justify-self:center;
}

/*\



\*/

ol {
   display:grid;
   grid-auto-flow:column;
	grid-auto-columns:1fr;
   grid-template-rows:repeat(10,auto);
}
ol li {
	white-space:nowrap;
}


/*\

font

\*/

header {
   font-family:manlymen;
   text-align:center;
}
ol {
   font-family:manlymen;
   list-style-type:decimal;
	list-style-position:inside;
}
ul {
   font-family:manlymen;
   list-style-type:disc;
	list-style-position:inside;
}
p {
	text-indent:1em;
	text-align:justify;
}

/*\

style

\*/

body {
	box-sizing:border-box;
	padding:1em 0;
}
nav {
	box-sizing:border-box;
   border-radius:0 1em 1em 0;
	padding:0.5em;
}
article {
	box-sizing:border-box;
	padding:0.5em;
   border-radius:1em;
}
header {
	box-sizing:border-box;
	padding:0.5em;
}
section {
   border-radius:0.5em;
   background-color:rgb(34,36,38);
}
ol {
	box-sizing:border-box;
	padding:0.5em;
}
ol li {
   margin:0 1em;
}
p {
	box-sizing:border-box;
	padding:0.5em;
}
article img {
   border-radius:0.5em;
   /* overflow:hidden; */
   /* background-color:rgb(232,236,246); */
}