/*@font-face {
    font-family: 'Baekmuk Dotum';
    src:url('subset-Baekmuk-Dotum.woff2') format('woff2'),
        url('subset-Baekmuk-Dotum.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
*/
body {
    background-color:#F9F9F9;
}

/*h1,h2,h3,h4,h4{
    font-family: 'Baekmuk Dotum';
}
*/
#banner{
	font-size:48px;
    display: inline-block;
}

#menu {
    display: inline-block;
}

#menu li {
    display: inline;
    font-size:24px;
}

h1 {
    font-size: 3rem;
    margin-bottom: 1rem;
}
h3 {
    background-color: gainsboro;
    padding: 0.2em 0.1em 0.1em 0.5em;
}

#article-menu h1{
    display: inline-block;
}

article:nth-of-type(even) {
    transform: rotate(0.5deg);
}

article:nth-of-type(odd) {
    transform: rotate(-0.2deg);
}

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

.entry-metadata {
    font-size:12px;
    max-width:640px;
}

#post-title {
    font-size:72px;
}

.about_collaborator {
    max-width: 600px;
    float: left;
    margin: 1em;
}

.h-entry .entry-content{
	position: relative;
	text-align: center;
	font-size: 36px;
    min-width:200px;
}

.entry-content {
    max-width:70ch;
    margin: 0 auto;
}
.entry-content p {
    text-align: left;
    margin-top:1em;
    margin-bottom:1em;
}

.entry-content img{
    max-width: 100%;
}

figure {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

figcaption {
    font-size:smaller;
    margin-top:0.5em;
    margin-left:1em;
    margin-bottom:1em;
}

article header {
	position: absolute;
	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
    margin:0;
}

.bg {
    background-color: white;
    filter: blur(30px) opacity(95%);;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1;
}

.h-entry{
    display: inline-block;
    margin:1em;
}

blockquote {
  position: relative;
  padding-left: 1em;
  border-left: 0.2em solid black;
  margin:0.1em;
}
blockquote p:before{
    content: '\201C';
    color: black;
}
blockquote p:after {
    content: '\201D';
   }

code {
	background-color: #EDD;
	padding-left: 0.2em;
	padding-right: 0.2em;
	padding-bottom: 0.05em;
}

.codehilite {
	overflow:auto;
}

.codehilite code {
	background-color:unset;
}

@media (orientation: landscape) {
  body {
    flex-direction: row;
  }
}

@media (orientation: portrait) {

#banner {
    font-size: 36px;
}
.h-entry .entry-content{
    position: relative;
    text-align: center;
    font-size: 20px;
    min-width:200px;
}

#menu li {
    display: inline;
    font-size:20px;
}
}