@charset "UTF-8";
/* =Base *//*************************************************************/
  body {
    font-family: 'Quicksand', sans-serif;  
    font-size: 100%;
    color: #012;
    background-color: #FFF; }

  a {
    color: #fc9502;
    font-weight: bold;
    text-decoration: none; }

  p, ul, ol, dl {
    font-size: 100%;
    line-height: 32px; }

  img {
    display: block;
    max-width: 100%; }

  blockquote {
    margin: 0px;
    margin-top: 40px;
    margin-bottom: 70px;
    padding: 0px;
    text-align: center;
    position: relative; }
    blockquote footer {
      position: absolute;
      bottom: -35px;
      font-size: 80%;
      color: #333333;
      letter-spacing: 0px;
      left: 0px;
      right: 0px; }
    blockquote p {
      display: inline;
      font-size: 120%;
      color: #828282;
      font-weight: 400; }

  strong {
    color: #fc9502; }

  .wrapper {
    max-width: 800px;
    margin: 60px auto; }

/* =Header *//*************************************************************/
  .header {
    overflow: hidden; }

  .navigation {
    float: left; }

  .logo {
    font-size: 300%;
    font-weight: 700;
    color: #ff530c;
    display: block; }

  .menu {
    color: #828282;
    font-size: 150%;
    margin: 0px;
    margin-top: 6px;
    padding: 0px;
    list-style-type: none; }

  .menu__entry {
    display: inline-block;
    margin-right: 35px; }
    .menu__entry:last-child {
      margin-right: 0px; }

  .menu__entry a {
    font-weight: 400; }

  .social-links {
    float: right;
    font-size: 150%;
    color: #828282;
    list-style-type: none; }

  .social-links__entry {
    display: inline-block;
    margin-left: 10px; }

/* =Titles *//*************************************************************/
  .page-title {
    margin: 30px auto;
    text-align: center; }

  .page-title__text {
    font-weight: 700;
    font-size: 150%; }

  .page-title__subtitle {
    font-weight: 400;
    font-size: 75%;
    color: #828282; }

/* =Post teasers *//*************************************************************/
  .list-posts {
    list-style-type: none;
    padding: 0px; }

  .post-teaser {
    margin-bottom: 15px;
    font-weight: 700; }

  .post-teaser__title {
    font-size: 100%;
    color: #828282; }

  .post-teaser__date {
    font-size: 100%;
    float: right;
    vertical-align: middle;
    color: #828282; }

  .post-teaser__month {
    width: 100%;
    text-align: center;
  }

  .empty-post-list {
    font-size: 150%;
    font-weight: 700;
    color: #333333;
    text-align: center; }

/* =Post page *//*************************************************************/
  .about {
    color: #828282;
    text-align: center;
    line-height: 24px; }

  .about__divider {
    font-size: 100%;
    letter-spacing: 9.09px; }

  .about__text {
    font-size: 100%; }

  .center-text {
    text-align: center;
  }

/* =Page navigation *//*************************************************************/
  .PageNavigation {
    display: block;
    width: auto;
    overflow: hidden;
  }

  .PageNavigation a {
    display: block;
    width: 50%;
    float: left;
    margin: 1em 0;
  }

  .PageNavigation .next {
    text-align: right;
  }

/* =Main Page *//*************************************************************/
  #about-img {
    border-radius: 13%;
    max-width: 125px;
    margin: auto;
    margin-bottom: 3%;
  }

  #describe-text {
      display: block;
      text-align: center;
      width: 100%; }

/* =Small screen *//*************************************************************/
  @media (max-width: 500px) {
    p, ul, ol, dl {
      font-size: 100%;
      line-height: 1.6; }

    .wrapper {
      width: 90%;
      margin: 15px auto; }

    .navigation,
    .social-links {
      display: block;
      text-align: center;
      width: 100%; }

    .social-links {
      font-size: 200%;
      margin: 10px auto; }

    .page-title {
      margin-top: 10px;
      margin-bottom: 30px; }

    .page-title__text {
      font-size: 150%; }

    .page-title__subtitle {
      font-size: 65%; }

    .post-teaser__title {
      font-size: 150%;
      display: block;
      text-align: center;
      width: 100%; }

    .post-teaser__date {
      font-size: 100%;
      margin-top: 10px;
      float: none;
      display: block;
      text-align: center;
      width: 100%; }

  }


thead {
  background-color: #f4f4f4;
  text-align: left;
}

th, td {
  padding: 12px 16px;
  border-bottom: 1px solid #ddd;
}

tbody tr:nth-child(even) {
  background-color: #fafafa;
}

tbody tr:hover {
  background-color: #f1f1f1;
}

th {
  font-weight: 600;
  color: #333;
}

td {
  color: #555;
}