*{
  box-sizing: border-box;
  padding:0;
  margin: 0;
}

body{
  background-color: black;
align-items:center;
}

h1{
  font-weight:normal;
  font-size:10px;
}

span{
  font-size:1em;
}

p{
  line-height: 2em;
}

section{
  width:100%;
}

#credits{
  width:100%;
  align-items:center;
}


.logo-container{
  position:relative;
  width:100%;
/*  width:1150px;
  height:550px;*/
  background-color:black;
  overflow:hidden;
}

.logo-container img{
  margin:0;
  padding:0;
  position:absolute
  top:0;
  left:0;
  width:100%;
  height:auto;
}

#adrText{
  margin-top:0;
  padding-top:0;
}

.container{
  display:flex;
  max-width:800px;
  margin-top:0;
  margin-bottom:10px;
  margin-left:20%;
  margin-right:20%;
  justify-content: center;
  background-color:black;
}

.container img{
  object-fit:cover;
}

.thumbnail{
  margin:0px;
  justify-content: center;

}

.thumbnail-constrain:hover img{
    transform: scale(1.1);
    transition: transform 0.2s ease-in-out;
    filter:blur(1px);
}

#imdb-logo{
  opacity:60%;
  transform:scale(1);
  position: flex;
  top: 0;
  left: 0;
  padding:25%;
  display:flex;
  align-items:center;
  justify-content: center;
  filter:blur(0px);
  user-select:none;
}

.thumbnail-constrain{
  position:relative;
  margin-bottom: 0px;
  height:280px;
  width:200px;
  overflow:hidden;
}

.overlay{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
  display:flex;
  align-items:center;
  justify-content: center;
}

.overlay h2{
  text-align:center;
  color:white;
  font-size: 1.5rem;
  margin:0;
}

.overlay:hover{
  opacity:1;
}

.galleryContainer img{
  margin:0px;
  padding:0px;
  max-width:100%;
  height:auto;
  transition: transform 0.2s ease-in-out;

}

.galleryContainer{
  max-width:800px;

  display:grid;
  margin: auto;
  grid-template-columns: repeat(4,1fr);
  align-items: center;
  grid-column-gap: 4px;
  grid-row-gap:0;
}

.adrTopItem{
  grid-column:1 / span 4;
  grid-row:1;
  background-color:black;
  font-family: "Raleway", sans-serif;
  font-size: 16px;
  line-height: 2em;
  color:#d1d1e0;
  margin-left:0;
  margin-right:0;
}

.description{
  display:flex;
  justify-content: center;
  padding-top:4px;
  padding-bottom:4px;
  max-width:auto;
  height:55px;
  color:#d1d1e0;
  background:#2d2d2d;
  margin:4px 0px;
}

.description h1{
  font-family: "Raleway", sans-serif;
  font-size: 1em;
  align-self:center;
  font-style:italic;
  font-weight:normal;
  text-align:center;
}

.description h1.bigTitle{
  font-family: "Raleway", sans-serif;
  font-size: .9em;
}

.normal {
  font-family:"Times New Roman", sans-serif;
  font-size:.8em;
  font-style:normal;
}

@media(max-width:850px) {
  .galleryContainer{
    max-width:400px;
    justify-content:center;
    grid-template-columns: repeat(3,1fr);
  }
  .adrTopItem{
      grid-column:1 / span 3;
  }

}

@media(max-width:650px) {
  .galleryContainer{
    max-width:400px;
    justify-content:center;
    grid-template-columns: repeat(2,1fr);
  }
    .adrTopItem{
      grid-column:1 / span 2;
  }
}