/*
	Theme Name: Notio Child Theme
	Theme URI: https://themeforest.net/item/notio-deluxe-portfolio-theme/10049784
	Description: <strong>A Premium theme for magazine, editor, community and more! WordPress Theme by <a href="http://www.themeforest.net/user/fuelthemes">fuelthemes</a></strong> – Update notifications available on Twitter and Themeforest <a href="http://twitter.com/anteksiler">Follow us on twitter</a> – <a href="http://themeforest.net/user/fuelthemes">Follow us on Themeforest</a>
	Version: 1.0.0
	Author: fuelthemes
	Author URI: http://themeforest.net/user/fuelthemes
	Template: notio-wp
*/

@import url("../notio-wp/style.css");


/* 
 * Tutte gli li che contengono gli elementi della lista degli articoli contengono una classe del tipo "product_cat-seating-furniture-vintage"
 * dove "seating-furniture-vintage" è lo slug della categoria a cui appartiene. Pe rinserir ela scritta Vintage a fianco di ungli foto di un articolo Vintage
 * si fa un selecttore che individua tutti gli li che contengono la parola "vintage" all'interno dell'attributo class
 */

li[class*="vintage"] figure::before {
  	content: "Vintage";
	position: absolute;
	background: rgba(177,177,0,0.5);
	display: flex;
    align-items: center;
    z-index: 2;
    font-size: 10px;
    color: #fff;
    font-weight: 300;
    height: 25px;
    line-height: 1;
    padding: 0 5px;
    text-transform: uppercase;
    letter-spacing: normal;
}
*, :after, :before {
    box-sizing: inherit;
}


li[class*="vintage"] figure {
	box-shadow:inset 0 0 100px rgba(0,0,20,.7), 0 5px 15px rgba(0,0,0,.5);
  	background:-webkit-linear-gradient(top, rgba(255,145,0,0.2) 0%,rgba(255,230,48,0.2) 60%), -webkit-linear-gradient(20deg, rgba(255,0,0,0.5) 0%,rgba(255,0,0,0) 35%);
}

li[class*="vintage"] figure img { 
	-webkit-filter:sepia(0.2) brightness(1.1) contrast(1.3);
  transition:-webkit-filter 0.3s ease-in-out;
	position:relative; z-index:-1; }

li[class*="vintage"] figure:hover { background:none; }
li[class*="vintage"] figure:hover img { -webkit-filter:sepia(0) brightness(1) contrast(1); }

/* 
 * Sposta la scritta "Out of stock" in basso 
 */
.badge.out-of-stock {
	top: initial;
	bottom: 10px;
}
