.fs-gallery-container
{
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  top: 0;
  background-color: rgba(150, 150, 150, 0.5);
  z-index: 30000;
}

.fs-gallery-container.hidden
{
  display:none;
}

#fs-gallery-frame
{
  width: 90vw;
  height: 90vh;
  margin-top: 5vh;
  margin-left: 5vw;
}

.gallery-tooltip
{
  border: 2px solid #f1f1f1;
  background-color: #f1f1f1;
  border-radius: 10%;
  display:inline-block;
  height:100%;
  width: 16%;
  padding: 1px;
  margin:0;
}

.selected-tooltip
{
  border: 2px solid #5d5d5d;
  background-color:#5d5d5d;
  border-radius: 10%;
}

.gallery-tooltip-img
{
  object-fit:cover;
  height:100%;
  width:100%;
}

#tooltip-scroll
{
  overflow-y:hidden; 
  overflow-x:hidden; 
  white-space:nowrap; 
  margin-top:10px; 
  position:relative;
  display:inline-block;
  padding-top:14%; 
  width: calc(100% - 50px);
  
}

#tooltip-scroll > div
{
  position:absolute; 
  top:0; 
  bottom:0;
  
}

.arrow-right
{
  width:0;
  height:0;
  border-top:  32px solid transparent;
  border-bottom: 32px solid transparent;
  border-left: 20px solid gray;
  display:inline-block;
  
}

.arrow-left
{
  width:0;
  height:0;
  border-top:  32px solid transparent;
  border-bottom: 32px solid transparent;
  border-right: 20px solid gray;
  display:inline-block;
  
}

.arrow-right:hover
{
  border-left-color: black;
  
}

.arrow-left:hover
{
  border-right-color: black;
}

/*@media only screen and (max-width: 768px) {
  .gallery-tooltip-img
  {
    display:none;
  }
  
  .gallery-tooltip
  {
    width:10px;
    height:10px;
    border-radius: 5px;
    background-color:white;
    border-color:#b2b2b2;
  }
  
  .selected-tooltip
  {
    border-color:#5d5d5d;
    background-color:#5d5d5d;
  }
  
  #tooltip-scroll
  {
    width: 100% - 50px;
  }
  
  #tooltip-scroll > div
  {
    text-align:center;
    left:0;
    right:0;
  }
  
}*/