
.js main header .inside h1{
  position:fixed;
}

.picture{
  overflow: hidden;
  position: relative;
  margin-top: -2px;
  display: inline-block;
}
.picture,
.picture img{
  margin: 0px;
  height: 100%;
}

.legend{
  padding: 5px;
  position: absolute;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #fff;
  background-color: #333;
  top: 0px;
  opacity: 0;
  -webkit-transition: opacity 0.4s;
}
.picture:hover .legend{
  opacity: 0.6;
}

.js img{
  max-height: 500px;
  opacity: 0.6;
}
.picture:hover{
  cursor: pointer;
}
.color1{
  background-color: #73626E;
}
.color2{
  background-color: #B38184;
}
.color3{
  background-color: #F0B49E;
}
.color4{
  background-color: #45ADA8;
}
.color5{
  background-color: #F7E4BE;
}
.color6{
  background-color: #E9D65C;
}
.color7{
  background-color: #E9B654;
}
.color8{
  background-color: #ACBB66;
}
.color9{
  background-color: #C1DAEE;
}
.color10{
  background-color: #92282F;
}
.picture1{
  width: 94px;
  height: 70px;
}
.picture2{
  width: 94px;
  height: 70px;
}
.picture3{
  width: 56px;
  height: 85px;
}
.picture4{
  width: 120px;
  height: 80px;
}
.picture5{
  width: 53px;
  height: 80px;
}
.picture6{
  width: 56px;
  height: 85px;
}
.picture7{
  width: 66px;
  height: 85px;
}
.picture8{
  width: 101px;
  height: 75px;
}
.picture9{
  width: 62px;
  height: 80px;
}
.picture10{
  width: 66px;
  height: 85px;
}
.picture11{
  width: 62px;
  height: 80px;
}
.picture12{
  width: 128px;
  height: 85px;
}
.picture13{
  width: 62px;
  height: 80px;
}
.picture14{
  width: 113px;
  height: 75px;
}
.picture15{
  width: 56px;
  height: 85px;
}
.picture16{
  width: 54px;
  height: 70px;
}
.picture17{
  width: 94px;
  height: 70px;
}


.loader-wrapper{
  position: absolute;
  top: calc(50vh - 28px);
  left: calc(50vw - 28px);
}

.loader {
  width: 56px;
  height: 56px;
  border: 2px solid rgba(0, 82, 236, 0.5);
  border-radius: 50%;
  position: relative;
  animation: loader-rotate 1s ease-in-out infinite;
  top: 50%;
  margin: -28px auto 0;
}
.loader::after {
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #0052ec;
  position: absolute;
  top: -6px;
  left: 50%;
  margin-left: -5px;
}

@keyframes loader-rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
