
/* Actual content */
.item{	width:215px;	height:460px;	 background-repeat:no-repeat; background: white;
	-webkit-background-size: 100%;     -o-background-size: 100%;   background-size: 100%;
	position: relative;	top:0;	left:0;	z-index:5;	overflow: hidden;	-webkit-border-radius: 3px;	        border-radius: 3px;	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.1);	        box-shadow: 0 1px 5px rgba(0,0,0,0.1);}
.item-overlay{position: absolute;	top: 0;	left: 0;	width: 100%;	height: 100%;  border-radius: 3px;
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI4JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC40MiIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 28%, rgba(0,0,0,0.2) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(28%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.2))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#6b000000',GradientType=0 ); /* IE6-8 */

	-webkit-transition: background-color 0.3s ease-in-out;
	   -moz-transition: background-color 0.3s ease-in-out;
	    -ms-transition: background-color 0.3s ease-in-out;
	     -o-transition: background-color 0.3s ease-in-out;
	        transition: background-color 0.3s ease-in-out;
}
.item:hover .item-overlay{
	/* IE9 SVG, needs conditional override of 'filter' to 'none' */
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjI4JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC40MiIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 28%, rgba(0,0,0,0.2) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(28%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.2))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,0.2) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#6b000000',GradientType=0 ); /* IE6-8 */
	background-color: rgba(0,0,0,0.2);
}
.item-content{
	position: absolute;
	width:100%;
	bottom: 0px;
	-webkit-transform: translate(0,20%);
	   -moz-transform: translate(0,20%);
	    -ms-transform: translate(0,20%);
	     -o-transform: translate(0,20%);
	        transform: translate(0,20%);
	
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
	
}
.item:hover .item-content{
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
	    -ms-transform: translate(0,0);
	     -o-transform: translate(0,0);
	        transform: translate(0,0);
	    
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}

.item-top-content{	position: relative;}
.item-top-content-inner{	position: absolute;bottom: 0;	padding:10px 15px 10px 15px;	background: rgba(255,255,255,.85);	width:100%;}
.item-add-content{	padding:0 30px 15px 30px;	opacity:1;
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;}
.item:hover .item-add-content{	opacity:1}
.item-add-content-inner{	border:0px solid #dadada;	border-top-width:1px;	padding-top:10px;}

/* Buttons */
.btn.buy{	background-color: #BED600; font-size: 12px;	text-align:center;	line-height:30px;	font-weight:700;	color:#fff;	border-radius:3px;	text-decoration:none;opacity:1;	border:0px solid #a3b800;	border-bottom-width:2px;
	-webkit-transition: all 0.2s ease-in-out;
	   -moz-transition: all 0.2s ease-in-out;
	    -ms-transition: all 0.2s ease-in-out;
	     -o-transition: all 0.2s ease-in-out;
	        transition: all 0.2s ease-in-out;}
.btn.buy:hover{	background-color:#a3b800;}
.expand{	display:block;}


/* content */
.item-product{	width:100%;	float:left;}
.item-product-price{	width:30%;	float:right;	text-align: right;}
/* Style / Theming */

/*Prduct title*/
h2{ font-size: 14px; font-weight:400;color:#222; margin-bottom: 10px;}
.subdescription{	font-family: 'helvetica neue';	font-size:0.7em;	font-weight:400;	color:#7d7d7d;}

/*product price*/
.item-product-price{	color:#40c781;font-size:1em;font-weight:700;position:relative;font-family:'helvetica neue'}
.item-product-price .subdescription{	color:#7d7d7d;}
.old-price{
	border:0 solid #7d7d7d;
	border-bottom-width:1px;
	margin-top:-11px;
	width:30px;
	position:absolute;
	right:-2px;
	bottom:10px;
	-webkit-transform: rotate(-30deg);
	   -moz-transform: rotate(-30deg);
	    -ms-transform: rotate(-30deg);
	     -o-transform: rotate(-30deg);
	        transform: rotate(-30deg);
}

.item-content{background: rgba(255,255,255,.85);}
.item-add-content{	font-family: 'Lato', sans-serif;	font-weight:400;	color:#7d7d7d; height:60px;}
.item-add-content .section{	margin-bottom:10px;}
.item-add-content .section:last-of-type{	margin-bottom:0;}
.item-add-content h4{	font-weight:600;	color:#222;	font-size:0.8em;}
.item-add-content p{	font-size:0.8em;}


/* Item menu */
.item-menu{position: absolute;	top:3px;	left:0px;	height:254px;	width:260px;	border-radius:3px 0 0 3px;	background:#4f4f4f;
	-webkit-border-radius: 3px;
	        border-radius: 3px;
	-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.3);
	        box-shadow: 0 1px 5px rgba(0,0,0,0.3);
	-webkit-transform: translate(0,0);
	   -moz-transform: translate(0,0);
	    -ms-transform: translate(0,0);
	     -o-transform: translate(0,0);
	        transform: translate(0,0);
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
.item-menu.visible{
	-webkit-transform: translate(-70px,0);
	   -moz-transform: translate(-70px,0);
	    -ms-transform: translate(-70px,0);
	     -o-transform: translate(-70px,0);
	        transform: translate(-70px,0);
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
.item-menu:hover{
	-webkit-transform: translate(-70px,0);
	   -moz-transform: translate(-70px,0);
	    -ms-transform: translate(-70px,0);
	     -o-transform: translate(-70px,0);
	        transform: translate(-70px,0);
	-webkit-transition: all 0.3s ease-in-out;
	   -moz-transition: all 0.3s ease-in-out;
	    -ms-transition: all 0.3s ease-in-out;
	     -o-transition: all 0.3s ease-in-out;
	        transition: all 0.3s ease-in-out;
}
