/*
-webkit-hyphens: auto;
   -moz-hyphens: auto;
    -ms-hyphens: auto;
        hyphens: auto;
*/

@font-face {
  font-family: deutsch_font;
  src: local(deutsch_font), url('/fonts/Deutsch.ttf') format('opentype');
}

@font-face {
  font-family: OpenSans;
  src: local(deutsch_font), url('/fonts/OpenSans-Regular.ttf') format('opentype');
}

@font-face {
  font-family: UbuntuRegular;
  src: local(deutsch_font), url('/fonts/Ubuntu-Regular.ttf') format('opentype');
}

@font-face {
  font-family: LatoRegular;
  src: local(deutsch_font), url('/fonts/Lato-Regular.ttf') format('opentype');
}

.bright-bg-color {
  /* good 1 dec 31
  background-color: #ffffee;
  */
  background-color: #fffefa;
}

.medium-bg-color {
  /* good 1 dec 31
  background-color: #f5f5e6;
  */
  background-color: #fffde7;
}

.dark-bg-color {
  /* good 1 dec 31
  background-color: #ffffd0;
  */
  background-color: #fff9c4;
}

/*
.bright-bg-color {
  background-color: #ffffee;
}

.medium-bg-color {
  background-color: #eeddcc;
}

.dark-bg-color {
  background-color: #ddccbb;
}
*/

md-content.galleryarea {
  /*
  padding: 3px;
  */
  margin: 7px;
  border-radius: 7px;
  border: 0px;
  border-spacing: 3px;
}

md-button.galleryarea {
  color: #795548;
}

md-grid-tile.fyllflex {
  display: flex;
  flex: 1 0 auto;
}

md-card.blaffa {
  /* Images are 290 */
  width: 300px;
  padding: 5px;
  /*
  height: 450px;
  border-radius: 5px;
  border: 0px;
  font-size: 0.6em;
  */
  font-size: 0.8em;
  color: #888888;

  overflow-wrap: break-word;
  overflow: auto;
  /*
  float: left;
  flex: 1 0 auto;
  */
}

.card-header {
  color: #444444;
  font-size: 1.3em;
  font-weight: bold;
}

h1 {
  font-size: 2em;
}

body {
  font-size: 1em;
}

p {
  color: #888888;
  overflow-wrap: break-word;
}

#hbuns-footer {
  font-size: 0.8em;
  font-family: Times, serif;
/*  Too blurry in 8px, needs to be responsive-ok, font-family: deutsch_font;*/
}

@media (min-width: 600px) {
  #hbuns-footer {
    width: 75%;
  }
}

@media (min-width: 1000px) {
  #hbuns-footer {
    width: 50%;
  }
}

/* ********************* */

/* Header should be 50 on largescreen or else fill. 
   TODO But only in dir listing mode.
*/

#pieOuter {
  margin: 3px;
  border-radius: 7px;
  background-color: #eeeecc;
  /*
  background-color: #aa8888;
  background-color: #8d6e63;
  */
  padding: 1px;
}

#content {
  background-color: rgb(255, 253, 231);
  margin: 3px;
  border-radius: 7px;
  padding: 10px;
  font-size: 0.9em;
  font-family: 'OpenSans';
}

@media (min-width: 1600px) {
  #pieOuter {
    width: 75%;
  }
}

#pieInner {
  margin: 3px;
  padding: 10px;
  border-radius: 5px;
  font-size: 1em;
  color: #eeeeee;
  /*
  overflow: auto;
  border: 2px solid green;
  padding: 3px;
  vertical-align: top;
  */
  background-color: #000000;
}

#pieInner p {
  color: inherit;
  font-size: 0.8em;
  font-family: 'Courier New', Courier, monospace;
}



/*
div.commentdiv {  }
div.exifdiv {  }
*/