/* *****************************************************

    ** Custom Stylesheet **

    Any custom styling you want to apply should be
    defined here.

***************************************************** */
.produto-home-x
{
  	position:relative;
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            cursor:  pointer;
}
.produto-home-x div{
    padding: 0 0 10px 0;
    overflow: hidden;
    background: #FFF;
}
.produto-home-x:before, .produto-home-x:after
{
	content:"";
    position:absolute;
    z-index:-1;
    -webkit-box-shadow:0px 9px 20px 0px rgba(0,0,0,0.8);
    -moz-box-shadow:0px 9px 20px 0px rgba(0,0,0,0.8);
    box-shadow: 0px 9px 20px 0px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
}

.imgpromox{
        margin: 0 0 27px 0;
    width: 98%;
    transition:0.4s ease;
     -webkit-transition:0.4s ease;
     -o-transition:0.4s ease;
     -moz-transition:0.4s ease;
}
.produto-home-x:after
{
	right:10px;
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg);
       -moz-transform:skew(8deg) rotate(3deg);
        -ms-transform:skew(8deg) rotate(3deg);
         -o-transform:skew(8deg) rotate(3deg);
            transform:skew(8deg) rotate(3deg);
}
.produto-home-x:hover
{
	 -webkit-box-shadow:0 0 20px rgba(0,0,5,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,5,0.8);
    box-shadow:0 0 20px rgba(0,0,5,0.8);
}
.itens-home img{
	border-radius:10px;
}

.imgpromox:hover, .produto-home-x:hover > .imgpromox
{
     width: 95% !important;
     transition:0.4s ease;
     -webkit-transition:0.4s ease;
     -o-transition:0.4s ease;
     -moz-transition:0.4s ease;
}