.pg-gallery{
  display:flex;
  gap:20px;
  width:100%;
  align-items:center;
}
.pg-thumbs{
  width:95px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
  flex:0 0 95px;
}
.pg-thumb-list{
  display:flex;
  flex-direction:column;
  gap:15px;
  height:250px;
  overflow:hidden;
  padding:10px;
  box-sizing:border-box;
}
.pg-thumb{
  width:90px;
  height:70px;
  padding:0;
  margin:0;
  object-fit:cover;
  border:2px solid transparent;
  border-radius:5px;
  background:transparent !important;
  cursor:pointer;
  transition:.2s;
  overflow:hidden;
  flex:0 0 70px;
}
.pg-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pg-thumb.is-active{
  border:1px solid #000;
  box-shadow:0 2px 8px #194671;
  padding:6px;
}
.pg-thumb:hover{
  border:1px solid #000;
  box-shadow:0 2px 8px #194671;
  padding:6px;
}
.pg-arrow{
  width:32px;
  height:28px;
  padding:0 !important;
  margin:0;
  border:0 !important;
  background:transparent !important;
  color:#194671 !important;
  box-shadow:none !important;
  outline:none !important;
  font-size:18px;
  line-height:1;
  cursor:pointer;
}
.pg-arrow:hover{
  background:transparent !important;
  color:#194671 !important;
  box-shadow:0 2px 8px rgba(25,70,113,.35) !important;
  outline:none !important;
}
.pg-arrow:focus,
.pg-arrow:active{
  background:#fff !important;
  color:#194671 !important;
  box-shadow:0 2px 8px rgba(25,70,113,.45) !important;
  outline:none !important;
}
.pg-main{
  position:relative;
  flex:1;
  overflow:hidden;
  cursor:crosshair;
  box-shadow:0 2px 8px #194671;
  border-radius:5px;
  padding:10px;
  box-sizing:border-box;
}
.pg-main-image{
  width:100%;
  height:auto;
  display:block;
}
.pg-lens{
  position:absolute;
  width:220px;
  height:220px;
  border:2px solid #fff;
  border-radius:50%;
  pointer-events:none;
  display:none;
  z-index:5;
  background-repeat:no-repeat;
  background-size:400%;
}
@media (max-width:767px){
  .pg-gallery{
    flex-direction:column;
    gap:10px;
  }
  .pg-main{
    width:100%;
    order:1;
    cursor:default;
  }
  .pg-thumbs{
    width:100%;
    order:2;
    flex-direction:row;
    justify-content:center;
    gap:5px;
  }
  .pg-thumb-list{
    width:240px;
    height:65px;
    padding:0;
    flex-direction:row;
    gap:5px;
    overflow:hidden;
  }
  .pg-thumb{
    flex:0 0 75px;
    width:75px;
    height:60px;
  }
  .pg-arrow{
    flex:0 0 30px;
    width:30px;
    height:40px;
  }
  .pg-lens{display:none !important;}
}
