@import url(/css/sonja.css);

@font-face {
  font-family: 'RockSaltRegular';
  src: url('css/fonts/RockSalt-webfont.eot?') format('eot'),
       url('css/fonts/RockSalt-webfont.woff') format('woff'),
       url('css/fonts/RockSalt-webfont.ttf') format('truetype'),
       url('css/fonts/RockSalt-webfont.svg#webfontoBzC41ky') format('svg');
  font-weight: normal;
  font-style: normal;
}

#header h1 {
  font-family:RockSaltRegular, impact, helvetica, sans-serif;
  font-weight:normal;
}

#wrap {
  width:auto;
  max-width:64em;
  min-width:32em;
  margin:0 auto;
}

#header {
  background-image:none;
}

#header h1, #header h2 {
  padding-left:10px;
}

#header h1 a {
  margin:0;
}

#header h2, #header ul {
  font-family:RockSaltRegular,impact,helvetica,sans-serif;
}

#header h2 {
  font-size:125%;
}

#header ul {
  width:100%;
}

#content {
  width:78%;
  margin-left:1%;
}

#blog h3 {
  position:relative;
}

#blog h3:before {
  content:"\2665";
  padding-right:5px;
  color:#783333;
  text-shadow:0 0 5px #fff;
}

#blog h3 span {
  position:absolute;
  right:15px;
  font-size:87.5%;
}

#content {
  background-color:rgba(255,255,255,0.85);
}

#content ul.linklist {
  list-style:none none;
}

#content ul.linklist li h3 {
  padding:10px 0 0;
  margin:0;
}

#content ul.linklist li a {
  color:#000;
/*  text-shadow:0 0 2px #000;*/
}

#blog #subnavi .aktiv, #links #subnavi .aktiv {
  font-weight:bold;
  color:#000;
  text-shadow:0 0 2px #fff;
}

#blog #content p img {
  padding:3px;
  background:rgba(255,255,255,0.5);
  margin:5px 0;
}

#blog #content .more a {
  background-color:rgba(255,255,255,0.5);
  padding:2px 3px;
}

input::selection, textarea::selection {
  background-color:#666;
  color:#fff;
}

@media screen and (max-width:60em) {
  #header ul {
    width:100%;
    border-radius:0;    
  }
  #content img {
    max-width:100%;
    height:auto;
  }
  #content {
    width:68%;
    margin:0;
    padding:0.5%;
  }
  #sidebar {
    width:30%;
  }
}

@media screen and (max-width:48.75em) {
  #wrap {
    width:100%;
    min-width:auto;
  }
  #content, #sidebar {
    width:100%;
    border-radius:0;
  }
  #sidebar ul {
    text-align:left;
  }
}

@media screen and (max-width:25em) {
  #header ul li {
    display:list-item;
    text-align:left;
    width:auto;
  }
  #header h1 {
    font-size:1.5em;
  }
}