/* links externos */
a[rel^=external]:after{ content: "⭷"; }
a{ 
 color: #857;
}
a:visited{
 color: #404;
}
a.icon{
 background-color: #fff;
}
/* gemtext-like format */
/* h1:before{ content: "# "; }
h2:before{ content: "## "; }
h3:before{ content: "### "; }*/
a.arrow:before{ content: "⇒ "; }
body{
 color: #100;
 max-width:36em;
 margin:0 auto;
 font-size:18px;
 padding: 1em;
 font-family:sans-serif;
}

footer{
 font-size: x-small;
 padding-top:2em;
}

footer img{
 margin:0;
}

pre{
 background-color: #edd;
 color: #433;
 padding:1em;
 overflow-x: auto;
}

blockquote{
 font-style: italic;
}

main h1{
 margin-top: 1.5em;
 font-size: xx-large;
}
main h2{
 font-size: x-large;
 margin-left:0.3em;
}
main h3{
 font-size: larger;
 margin-left:1em;
}

gallery{
 display:flex;
 flex-direction:row;
 flex-wrap:wrap;
 justify-content:space-evenly;
 align-content:center;
}
img{
 margin:10px;
 border-radius:5px;
 max-width: 320px;
}

nav { float: none }

nav, #incoming{ font-size:smaller; }
nav li, #incoming li{ padding:0.2em; }
main li, #incoming li{  padding:0.5em; }

table {
	font-size: smaller;
        max-width: 90%;
        border-collapse: collapse;
        margin: 1em auto;
	text-align:left;
    }
table  th {
        border-bottom: 1px solid black;
        padding: 0.1em 1em;
    }
table  td {
        padding: 0.1em 1em;
    }
td.num{
	text-align:right;
}
#translation{
	font-size: smaller;
	font-style: italic;
	margin-left: 2em;
}
#incoming{
	font-size: smaller;
}

/* desktop */
@media screen and (min-width: 600px) {
  nav { float: right; width:30% }
  nav ul { margin-top:0; padding-left: 3em }
  #incoming li{
	display:inline; 
	padding: 0.5em 1em 0.5em 0;
  }
  nav, #incoming{ font-size:0.7em; }
  img{ max-width: 100%; }
}