:root {
  background: #f1f1f1;
  font-family: Times New Roman,游明朝体,YuMincho,游明朝,Yu Mincho,serif;
  font-size: 20;
  color: #555555;
  margin: 0 auto;
  max-width: 800px;
}

a {
  color: #446688;
}

.header {
  display: flex;
  justify-content: center;
  gap: 2%;
}

.header-title a {
  color: #444444;
  text-decoration: none;
}

.header-icon {
  align-self: center;
  border-radius: 50%;
  width: 45px;
  height: 45px;
}

.header hr {
  margin: 0 5%;
}

.profile {
  text-align: center;
  margin: 0 auto;
  width: 300px;
}

.profile-icon {
  border-radius: 50%;
  width: 80px;
  height: 80px;
}

.profile a {
  color: #333333;
  text-decoration: none;
}

.profile h2 { 
  text-align: center;
  color: #333333;
  text-decoration: none;
}



.content {
}

.post-list {
  margin: 5%;
  text-align: center;
  gap: 3%;
}

.post-title {
  color: #666666;
  flex: 1 0;
}

.post-title a {
  text-decoration: none; 
  color: #666666;
}

.post-list hr {
  margin: 0 3%;
  flex: 0 0;
}

.post-date {
  color: #888888;
  flex: 0 0;
  flex-basis: min-content;
}

.tags-list {
  margin: 10%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1%;
}

.tags-list-elem {
  writing-mode: vertical-rl;
  text-decoration: none;
  color: #666666;
}

.pages {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10%;
}

.pages a {
  text-decoration: none;
  color: #666666;
}

blockquote {
  white-space: pre-wrap;
  margin: 3% 0;
  padding: 1px 20px;
  border: 5px solid #f1f1f1;
  border-left-color: #dddddd;
}

pre {
  white-space: pre-wrap;
  margin: 3% 0;
  padding: 2% 20px;
  color: #666666;
  border: 2px solid #dddddd;
}

code {
  font-family: 'Arial','Consolas';
}

iframe {
  width: 90%;
  height: 35%;
}