@charset "utf-8";
/* Spiderfly Elements by Spiderfly Studios - https://www.spiderflystudios.com */
/* WooCommerce Elements */

/* PRODUCT GRID MODS */
.col2sale li.product {width:46%!important; margin:0 2% 5% 2% !important;} 
.col3sale li.product {width:31.3%!important; margin:0 1% 5% 1% !important;}

/*MODERN PRODUCT LISTING & IMAGE*/
.modprod {
  font-family: 'Poppins:400,700', Arial, sans-serif;
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  background-color: #000000;
  color: #ffffff;
  text-align: left;
  font-size: 16px;
  border: 1px solid #b0b0b0 !important;
}
.modprod * {
  -webkit-transition: all 0.35s;
  transition: all 0.35s;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.modprod img {
  max-width: 100%;
  width:100% !important;
  vertical-align: top;
}
.modprod figcaption {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 20px;
  background-image: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.6) 10%, transparent 50%);
  background-image: linear-gradient(to top, rgba(0, 0, 0, 0.6) 10%, transparent 50%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.modprod h3 {
  font-weight: 400;
  line-height: 1;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 3px 0;
}
.modprod .sale {
  position: absolute;
  top: -3px;
  padding: 10px 20px;
  left: 0px;
  font-weight: 700;
  font-size: 22px;
}
.modprod .title1 {
  font-size: 30px;
  color: #f5f5f5;
  font-weight: 800;
}
.modprod .title2 {
	color: #f5f5f5;
	font-weight: 700;
	font-size: 16px;
	text-shadow:none;
	width: fit-content;
	padding: 8px 14px 7px 20px;
	margin-left: -20px;
	z-index:1000;
}
.modprod .title3 {
    font-weight: 800;
    color: #dddddd;
    font-size: 20px;
	margin-bottom:-2px;
}
.modprod a {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.modprod:hover img,
.modprod.hover img {
  -webkit-transform: scale(1.3) rotate(5deg);
  transform: scale(1.3) rotate(5deg);
}
.modprod h3 small{
	padding-bottom: 2px !important;
    vertical-align: middle;
    display: inline-block;
}
.corner-ribbon{
  width: 200px;
  background: #e43;
  position: absolute;
  top: 12px;
  left: -70px;
  text-align: center;
  line-height: 35px;
  letter-spacing: 1px;
  color: #f0f0f0;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.corner-ribbon.top-right{
  top: 12px;
  right: -70px;
  left: auto;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
/*.corner-ribbon.blue{background: #179e4d;}*/


/* Add To Card Button - Wiggle Button */
.wiggle {
-webkit-animation: btnWiggle 3s infinite;
  -moz-animation: btnWiggle 3s infinite;
  -o-animation: btnWiggle 3s infinite;
  animation: btnWiggle 3s infinite;
  transition: all 0.2s ease-in-out;
  overflow:hidden;
}
.wiggle::before {
    content: "";
    background-color: rgba(255,255,255,0.3);
    height: 100px;
    width: 50px;
    display: block;
    position: absolute;
    top: -10px;
    left: -150%;
    transform: skewX(-45deg) translateX(0);
    transition: none;
  }
.wiggle:hover::before {
      transform: skewX(-45deg) translateX(600px);
     transition: all 1s ease-in-out;
    }
@-webkit-keyframes btnWiggle {
	0% {-webkit-transform: rotate(0deg);}
	2% {-webkit-transform: rotate(-2deg);}
	3.5% {-webkit-transform: rotate(2deg);}
	5% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(0deg);}
}
@-o-keyframes btnWiggle {
	0% {-webkit-transform: rotate(0deg);}
	2% {-webkit-transform: rotate(-2deg);}
	3.5% {-webkit-transform: rotate(2deg);}
	5% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(0deg);}
}
@keyframes btnWiggle {
	0% {-webkit-transform: rotate(0deg);}
	2% {-webkit-transform: rotate(-2deg);}
	3.5% {-webkit-transform: rotate(2deg);}
	5% {-webkit-transform: rotate(0deg);}
	100% {-webkit-transform: rotate(0deg);}
}
@keyframes sheen {
  0% {
    transform: skewY(-45deg) translateX(0);
  }
  100% {
    transform: skewY(-45deg) translateX(200px);
  }
}


/* Artframe WooCommerce Integration */
.artframe {
    background-color: #fff;
    box-shadow: inset 0 0 2px hsla(0,0%,0%,.2),
                0 3px 1px hsla(0,0%,100%,.75),
                0 -1px 1px 2px hsla(0,0%,0%,.1);
    height: 350px;
    /*left: 50%;*/
    margin: 50px auto;
    padding: .5em;
    position: relative;
    /*top: 50%;*/
    width: 500px;
	display:block;
}
.art_title {text-align: center;}
/* Frame */
.artframe:before {
    background-color: #22130c;
    bottom: -2.5em;
    box-shadow: inset 0 1px 1px 1px hsla(0,0%,100%,.2),
                inset 0 -2px 1px hsla(0,0%,0%,.4),
                0 5px 50px hsla(0,0%,0%,.25),
                0 20px 20px -15px hsla(0,0%,0%,.2),
                0 30px 20px -15px hsla(0,0%,0%,.15),
                0 40px 20px -15px hsla(0,0%,0%,.1);
    content: '';
    left: -2.5em;
    position: absolute;
    right: -2.5em;
    top: -2.5em;
    z-index: -1;
}
/* Mat */
.artframe:after {
    background-color: #fff5e5;
    bottom: -1.5em;
    box-shadow: 0 2px 1px hsla(0,0%,100%,.2),
                0 -1px 1px 1px hsla(0,0%,0%,.4),
                inset 0 2px 3px 1px hsla(0,0%,0%,.2),
                inset 0 4px 3px 1px hsla(0,0%,0%,.2),
                inset 0 6px 3px 1px hsla(0,0%,0%,.1);
    content: '';
    left: -1.5em;
    position: absolute;
    right: -1.5em;
    top: -1.5em;
    z-index: -1;
}
/* Slides */
.artframe li {
    box-shadow: 0 -1px 0 2px hsla(0,0%,0%,.03);
    list-style:none;
    position: absolute;
    overflow: hidden;
    height:calc(350px - 14px);
    width:calc(500px - 14px);
	margin:0px !important;
	padding:0px !important;
	background-repeat:no-repeat;
}
.artframe input {
    bottom:0;
    position:absolute;
    display: none;
}
/* Navigation */
.artframe label {
    background-color: #111;
    background-image: linear-gradient(transparent, hsla(0,0%,0%,.25));
    border: .2em solid transparent;
    bottom: 0.5em;
    border-radius: 100%;
    cursor: pointer;
    display: block;
    height: .5em;
    left: 4em;
    opacity: 0;
    position: absolute;
    transition: .25s;
    width: .5em;
    visibility: hidden;
    z-index: 10;
}
.artframe label:after {
    border-radius: 100%;
    bottom: -.2em;
    box-shadow: inset 0 0 0 .2em #111,
                inset 0 2px 2px #000,
                0 1px 1px hsla(0,0%,100%,.25);
    content: '';
    left: -.2em;
    position: absolute;
    right: -.2em;
    top: -.2em;
}
.artframe:hover label {
    opacity: 1;
    visibility: visible;
}
.artframe input:checked + label {
    background-color: #fff;
}
.artframe:hover li:nth-child(1) label {
    left: .5em;
}
.artframe:hover li:nth-child(2) label {
    left: 2em;
}
.artframe:hover li:nth-child(3) label {
    left: 3.5em;
}
.artframe:hover li:nth-child(4) label {
    left: 5em;
}
/* Images */
.artframe img {
    /*opacity: 0;*/
    transition: .25s;
   width:100%;
    vertical-align: top;
    /*visibility: hidden;*/
}
.artframe li input:checked ~ img {
    opacity: 1;
    visibility: visible;
    z-index: 10;
}
.price-tag {
	min-width: 60px;
	display: flex;
	align-items: center;
	height: 50px;
	border-radius: 5px 5px 5px 0;
	background: #ed6663;
	border-bottom: 2px solid #ad5449 !important;
	border-right: 2px solid #ad5449 !important;
	z-index: 99;
	position: absolute;
	top: -15px;
	left: -48px;
}
.price-tag::after {
	content: '';
	position: absolute;
	border-left: 13px solid transparent;
	border-top: 13px solid #872f25;
	left: 0px;
	top: 50px;
}
.price-tag .artprice {
	margin: 18px 18px 14px 18px;
	color: #ffffff;
	font-size: 22px;
}

a.lbzoom {text-decoration: none !important;}
.lbzoom {z-index:98; position:absolute; bottom:7px; left:7px; width:40px; height:40px; opacity:0.3; text-decoration: none;}
.lbzoom.light {background-color:#fff !important; color:#000 !important;}
.lbzoom.dark {background-color:#000 !important; color:#fff !important;}
.lbzoom:hover {opacity:0.6; text-decoration: none; transition: all 0.1s linear; height:50px; width:50px;}
.lbzoom .av_font_icon {font-size:28px;line-height:38px; text-decoration: none!important;}
.lbzoom:hover .av_font_icon {font-size:34px;line-height:48px; transition: all 0.1s linear; text-decoration:none !important;}
a.addcartbtn {text-decoration: none !important;}
.addcartbtn {z-index:98; position:absolute; bottom:7px; right:7px; width:42px; height:42px; background-color: #ad5449; color:#fff !important; opacity:0.5; text-decoration: none; border-top:1px solid #fff !important; border-left:1px solid #fff !important; overflow:hidden !important;}
.addcartbtn:hover {opacity:0.9; text-decoration: none; color:#fff!important; width:180px; transition: all 0.1s linear; border-top:1px solid #b0b0b0 !important; border-left:1px solid #b0b0b0 !important;}
.addcartbtn .av_font_icon {font-size:28px;line-height:38px; text-decoration: none!important;}
.addcartbtn:hover .av_font_icon::after {font-size: 16px; margin-left:8px; vertical-align:top;}
.addcartbtn:hover .av_font_icon {transition: all 0.1s linear; text-decoration:none !important;}
a.artdim {text-decoration: none !important;}
.artsize .artdim {z-index:98; position:absolute; top:10px; right:10px; opacity:0.3; text-decoration: none; width:25px; height:25px;}
.artdim.light {color:#fff !important; background-color:#000; border:1px solid #000; border-radius:50px;}
.artsize .artdim:hover {text-decoration: none; transition: all 0.1s linear; top:7px; right:7px; background:none;border:none; opacity:0.8;}
.artdim .av_font_icon {font-size:25px;line-height:21px; text-decoration: none!important;}
.artdim:hover .av_font_icon {transition: all 0.1s linear; text-decoration:none !important; display:none;}
.artdim:hover .av_font_icon .av-icon-char {display:none;}
.artsize .artdim .artwidth {opacity:0; position:absolute; top:-10px; right:-3px; background-color:#000;color:#fff;height:25px; width:25px; margin-bottom:-25px;text-align:center;z-index:10;overflow:hidden;font-size:14px;line-height:25px;}
.artsize .artdim:hover .artwidth {background-color:#000; top:0px; right:0px; opacity:0.95 !important; border-radius:0px; height:25px; overflow:hidden;transition: all 0.1s linear;}
.artsize .artdim .artheight {opacity:0; position:absolute; top:25px; right:0px; background-color:#000;color:#fff;width:25px; height:25px; margin-left:-25px;text-align:center;z-index:10;overflow:hidden; font-size:14px;}
.artsize .artdim:hover .artheight {background-color:#000; top:25px; right:0px; opacity:0.95 !important; border-radius:0px; width:42px !important; overflow:hidden;transition: all 0.1s linear;}