img {
  border-radius: 3.90625%;
  box-shadow: calc(1em / 7) calc(1em / 2.8) calc(1em / 2) rgba(0, 0, 0, 0.5);
}

#logo-img-container {
  height: 256px;
  display: inline-block;
  position: relative;
}

#logo-img-container img {
  width: 256px;
  height: 256px;
}

#logo-img {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  opacity: 1;
  transition: opacity 0.3s;
}

#logo-img:hover {
  opacity: 0;
}

#logo-img.forced:hover {
  opacity: 1;
}

.alt-logo-img {
  opacity: 0;
  position: fixed;
  top: -100%;
  transition: opacity 0.3s;
}

.alt-logo-img.active {
  position: relative;
  top: -256px;
}

.alt-logo-img.active:hover {
  opacity: 1;
}

.alt-logo.img.hidden {
  visibility: hidden;
}

body {
  background: #0d2125 url('../assets/background.png') no-repeat center center fixed;

  -webkit-background-size: cover;
  -moz-background-size:    cover;
  -o-background-size:      cover;
  background-size:         cover;
}

body .container {
  max-width: 600px;
}

.invisible {
  display: none;
}

.height-animated {
  transition: transform 0.3s ease-in, top 0.1s ease-in;
  transform-origin: 50% 0;
}

.height-0 {
  top: -100%;
  position: fixed;
  transform: scaleY(0) translateY(-100%);
}

.height-1 {
  transform: scaleY(1) translateY(0);
}

.small {
  font-size: 0.8em;
  padding-top: 0.3em;
}

.width-animated {
  transition: transform 0.15s ease-in;
  transform-origin: 0 50%;
  display: inline-block;
  position: absolute;
}

.width-0 {
  transform: scaleX(0);
}

.width-1 {
  transform: scaleX(1);
}

.monospace {
  font-family: monospace;
}

.side-by-each {
  width: 48.5%;
}

.side-by-each + .side-by-each {
  margin-left: 1.5%;
  margin-top: 0;  /* Override bootstrap braindeath */
}

.side-by-each-by-each {
  width: 32.3%;
/*  min-width: 140px;*/
  min-width: 11em;
}

.side-by-each-by-each + .side-by-each-by-each {
  margin-left: 1.5%;
  margin-top: 0;  /* Override bootstrap braindeath */
}


#liberapay:hover, #liberapay:focus {
  background-color: #3F3407;
}