.store-item{
    border: 1px solid #f3f3f4;
    text-align: center;
    padding: 5px 5px 15px 5px;
}

.onsale img{
/*        max-width: 600px;  */
        width: 100%;
        object-position: 50% 50%;
    } 


.soldout img{
/*        max-width: 600px;  */
        width: 100%;
        object-position: 50% 50%;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
        opacity: 0.7;
    } 

.store-item p.item-name-onsale{
    font-size: 14px;
}

.store-item p.item-name-soldout{
    text-decoration: line-through;
    font-size: 14px;
}

p.onsale{
        color: lightseagreen;
        font-size: 13px;
        text-decoration-line: overline;
}    
p.soldout{
        font-size: 13px;
        color: indianred;
        text-decoration:overline;
}

.email-copy {
  position: relative;
  cursor: pointer;
  display: inline-block;
}

.email-tooltip {
  position: absolute;
  bottom: 95%;              /* was 125% – closer to the text now */
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s ease-out, transform 0.15s ease-out;
  transform-origin: bottom center;
  z-index: 10;
}

.email-tooltip.visible {
  opacity: 1;
  transform: translateX(-50%) translateY(-1px); /* slightly less offset */
}

@media screen and (max-width: 620px){
    #store{
    margin-top: 70px;
}

   .store-set {
    position: relative;
    display: block;
    margin: 10px; 
    }
    
    .store-item{
        margin-bottom: 60px;
    }

    .store-item img{
        width: 100%;
    }
}

@media screen and (min-width: 621px){
    
    #store{
        padding: 0 10px;
        margin: 70px 30px 0 30px;
    }
    
    #store .store-set{
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
/*        grid-auto-rows: 200px;*/
/*        grid-auto-flow: dense;*/
        grid-column-gap: 15px;
        grid-row-gap: 25px;
        align-content: center;
        align-items: center;
/*        flex-direction: column;*/
    }
 
    .store-item img {
        vertical-align: middle;
        display: inline-block;
        object-fit: cover;
        width: 100%;
        height: auto;
    }
}


@media screen and (min-width: 760px){
    
    #store{
        padding: 0 20px;
    }

    .store-set{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    grid-auto-rows: minmax(500px, auto);
    width: fit-content;
    grid-auto-flow: dense;
    grid-column-gap: 20px;
    grid-row-gap: 30px;
    align-content: center;
    align-items: center;
        
    }

}
