@media screen {

  html {
    -webkit-text-size-adjust: 100%;
  }

  body {
    font-family: Arial, sans-serif;
    font-size:13px;
    margin:0 auto;
    line-height:1.5em;
    display:flex;
    display:-webkit-flex;
    flex-direction:column;
    -webkit-flex-direction:column;
    min-height:100vh;
  }

  code {
    background-color: rgb(255, 230, 230);
    padding: 1px 3px;
    border-radius: 4px;
    border: 1px solid rgb(235, 200, 200);
  }

  h1 a {
    color: red;
    text-decoration: none;
  }

  h1 a:visited {
    color: red;
  }

  h1 a:active {
    color: red;
  }

  .wrapper {
    padding:1em;
  }

  ul, ol {
    padding-left:2em;
    line-height: 1.8em;
  }

  hr {
    height: 1px;
    border: none;
    background-color: #000;
    margin:1em 0;
    max-width: 800px;
  }

  header, article, footer {
    display:block;
  }

  header, article {
    padding:0 1em;
    max-width:800px;
    margin:0 auto;
  }

  article img {
    max-width: 50%;
  }

  .gsc-control-cse img {
    max-width: none;
  }

  .wrapper {
    flex: 1;
    -webkit-flex: 1;
  }

  blockquote {
    margin-left:1em;
  }

  footer {
    padding-top:1em;
    text-align:right;
  }

  footer span {
    display:inline-block;
    margin-top: -1px;
    padding:0.5em;
    background:#ff0;
  }

  h1 {
    line-height:1.2em;
  }

  h1, h2, h3, h4 {
    color:#f00;
    font-weight:normal;
  }

  h2 {
    padding-top:1em;
  }

  h2 a {
    color: #f00;
  }

  em {
    font-weight:normal;
    color: #008000;
  }

  p a {
    word-break:break-all;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
  }

  .page, .email {
    border:1px solid #000;
    padding:1em;
    margin:2em auto;
    box-shadow: 2px 2px #666;
    -webkit-box-shadow 2px 2px #666;
    -moz-box-shadow 2px 2px #666;
  }

  .page {
    width:80%;
  }

  .email {
    width:95%;
  }

  .page-link {
    display:inline-block;
    padding:0.5em;
    margin:0.15em 0 0.25em 0;
    background-color:#0f0;
    border:1px solid #000;
    text-decoration:none;
    color:#000;
  }

  .no-desktop {
    display:none;
  }

  #cv h2 {
    color: blue;
    font-weight: bold;
    font-size: 1em;
    margin-top: 1em;
  }

  #cv i {
    display: block;
    margin-top: 1em;
    color: red;
  }

}

@media (max-width:640px) {
  .no-desktop {
    display: block;
  }
  .no-mobile {
    display: none !important;
  }
  .wrapper {
    padding: 0.1em;
  }
  ul, ol {
    padding-left: 2em;
  }
}

@media print {
  a {
    color:#000;
  }
  .no-print {
    display: none;
  }
  #cv i {
    display: block;
    margin-top: 1em;
  }
}

.pixelated {
  image-rendering: -moz-crisp-edges; /* Firefox */
  image-rendering: -o-crisp-edges; /* Opera */
  image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
  image-rendering: crisp-edges;
}

.event {
  display:inline-block;
  vertical-align:top;
  width:150px;
  height:150px;
  margin:0 0 0.4em 0;
  padding:1em;
  border:1px solid #000;
}

.pixelated {
  image-rendering:optimizeSpeed;             /* Legal fallback */
  image-rendering:-moz-crisp-edges;          /* Firefox        */
  image-rendering:-o-crisp-edges;            /* Opera          */
  image-rendering:-webkit-optimize-contrast; /* Safari         */
  image-rendering:optimize-contrast;         /* CSS3 Proposed  */
  image-rendering:crisp-edges;               /* CSS4 Proposed  */
  image-rendering:pixelated;                 /* CSS4 Proposed  */
  -ms-interpolation-mode:nearest-neighbor;   /* IE8+           */
}

.tag-cloud {
  width: 286px;
  padding: 7em;
  display: inline-block;
}

.tag-cloud a {
  display: inline-block;
  padding: 3px;
}

@media (max-width:720px) {
  .vine-embed {
    display:none;
  }
}
