.shop-items, .shop-items a
{
  color: var(--dark-color);
}

.shop-items
{
  position:relative;
  width:100%;
  padding-right:100px;
  padding-left:100px;
  min-height:300px;
  align:center;
  margin:40px auto;
  display:flex;
  flex-wrap: wrap;
  align-content: center;
  align-items:flex-start;
  justify-content: center;
}

.shop-item
{
  position:relative;
  flex-grow:0;
  width:254px;
  min-height:300px;
  margin:20px;
}



.shop-item:hover .shop-item-img
{
  box-shadow:0px 2px 3px rgba(0,0,0,0.3);
}

.shop-item:hover .shop-item-details,
.shop-item:hover .shop-item-details h3
{
  font-weight: bold;
}


.shop-item-img
{
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  border-radius: 5px;
  overflow:hidden;
}

.shop-item img
{
  position:absolute;
  top:0px;
  left:0px;
  width:100%;
  height:100%;
  object-fit: cover;
  cursor:pointer;
}

.shop-item-details
{
  position:relative;
  left:0px;
  bottom:0px;
  width:100%;
  margin-top:0em;
  cursor:pointer;
  padding-top:5px;
  height:60px;
}

.shop-item-details h3
{
  width:100%;
  font-size:1.1em;
  font-weight:normal;
  letter-spacing: 0.1em;
  margin:0px;
  padding:0px;
  margin-bottom:5px;
  text-align: center;
}

.shop-item-details p
{
  display:block;
  font-size:1.25em;
  font-weight:200;
  letter-spacing: 0.1em;
  line-height:1.5em;
  margin:0px;
  padding:0px;
  text-align: center;
}

.shop-item-details.shop-item-show-link p
{
  display:block;
}

.shop-item-details.shop-item-show-link p a
{
  font-size:16px;
}

@media screen and (max-width: 900px)
{
  .shop-items
    {
      padding-left:40px;
      padding-right:40px;
    }

  .shop-details
    {
      margin-left:40px;
    }
}


@media screen and (max-width: 600px)
{
  .shop-items
  {
    padding-left:0px;
    padding-right:0px;
  }
}