body { font-family: sans-serif; padding: 0px; margin:0px; height: 100% }
nav { font-size: 10px; }
li { list-style-type: none; min-height: 18px }
a { text-decoration: none }
a:hover { text-decoration: underline }
img { border-style: none }
.kopimi {
  right: 0; top: auto; left: auto; bottom: 0;
  margin: 4px; width: 40px; height: 32px;
}
.kopimi span::before { content: url(images/kopimi-opaque.svgz); }
.main {
  width: 75%;
}
.content {
  padding-top: 8px;
  padding-left: 20%;
}
.box {
  color: white;
  font: 12px sans-serif;
  padding: 8px 12px 12px 12px;
  background-image: url(images/box.svgz);
  -webkit-border-radius: 8px;
  -webkit-box-shadow: 1px 2px 6px black;
  -moz-border-radius: 8px;
  -moz-box-shadow: 1px 2px 6px black;
  margin: 0px 0px -1px 0px;
  /*background-color: rgba(0,0,0,0.9);*/
  min-height: 32px;
  min-width: 200px;
}
.icon { margin-left: -19px; width: 16px; height: 16px; float: left; margin-top: -2px }
#blogo {
  height: 100px;
}
@media screen {
  nav {
    width: 20%;
    float: left;
  }
  .right {
    width: 25%;
    height: 100%;
    position:absolute; top: auto; bottom: 0; right: 0; left: auto;
    z-index: -1;
  }
  .upperright {
    height:10%;
    min-height:100px;
    position:fixed; top:0; right: 0; left: auto; bottom:0;
  }
  footer {
    background: url(images/grasspat.svgz);
    height: 64px; width: 100%;
    position: fixed; left: 0; right: 0; top: auto; bottom:0;
  }
  .kopimi {
    position: fixed;
  }
  .i {
    display: none;
    position: relative;
    color: white;
    font: 14px sans-serif;
    padding: 8px 12px 16px 12px;
    margin: 0 0 100px 0;
    background-image: url(images/infobox.svgz);
  }
}
@media handheld {
  .upperright, .i, .kopimi {
    display: none;
  }
  footer {
    background: url(images/grasspat.svgz);
    height: 64px; width: 100%;
  }
  #blogo {
  width:100%;
  max-height:100px;
  }
}

/* twitter styles */
#svgtwitter { margin-top: 4px }
.twim {
  float: left;
  position: absolute;
  width: 32px;
  border: none; /* for moz */
}
.twtx {
  display: block;
  position: relative;
  padding-left: 40px;
  vertical-align: top;
}
.twtx > a {
  color: white;
  font-weight: bold;
}
.twat {
  font-size: 9px;
  font-style: italic;
  position: relative;
  bottom: -4px;
  text-align: right;
}
.twresult.nosvg {
  color: white;
  font: 12px sans-serif;
  padding: 8px 12px 12px 12px;
  -webkit-border-radius: 8px;
  -webkit-box-shadow: 1px 2px 6px black;
  -moz-border-radius: 8px;
  -moz-box-shadow: 1px 2px 6px black;
  border-radius: 8px;
  box-shadow: 1px 2px 6px black;
  margin: 0px 3px 5px 3px;
  background-color: rgba(0,0,0,0.9);
  min-height: 32px;
  min-width: 200px;
}
.twresult {
  color: white;
  font: 12px sans-serif;
  background-image: url(images/box.svg);
  padding: 8px 12px 12px 12px;
  margin: 0px 3px 5px 3px;
  min-height: 32px;
  min-width: 200px;
}
.twitter[data-noimage] .twimlink,.twitter[data-nofromuser] .twfromuserlink,.twitter[data-nodate] .twat,.twitter[data-notext] .twtx {
  display: none;
}
.twitter[data-noimage] .twtx {
  padding-left: 4px;
}
.twitter[data-noimage] .twat {
  padding-right: 4px;
}
.twitter#twself .twresult, .twitter#twself a {
  color: black;
  background: lightblue;
}