@charset "utf-8";
/* #############################################################################################################
#  Inovazi Agência Criativa                                                                                     
#  Copyright (C) 2013 Inovazi Agência Criativa                                                                  
#  Website:  http://www.inovazi.com                                                                             
#  ########################################################################################################## */

@import url(http://fonts.googleapis.com/css?family=Titillium+Web:400,600,200);

#ProdCont .pageTitle{
    display: none;
}

.productCatalog {
	display:table;
	width:100%;
	min-height:100%;
	position:relative;
}

    .productCatalog > h1{
        text-align: center;
        font-size: 28px;
        color: #d40202;
        margin: 50px auto;
    }

	.productCatalog .galleryTools{
		position:absolute;
		right: 185px;
		top: -47px;
		z-index:1;
	}
	
	.productCatalog .galleryTools.Bottom{
		position:relative;
		/*float:right;
		right:30px;	*/
		top:auto;
		/*bottom:-55px;*/
		z-index:2;


        float: none;
        clear: both;
        width: 100%;
        text-align: center;
        bottom: 0;
        right: 0;
	}
	.productCatalog .galleryTools.Bottom div.pageNav{
        float: none;
        margin-left: 0;
    }

		.productCatalog .galleryTools div{
			display:inline-block;
			margin-left:8px;
		}
		
			.productCatalog .galleryTools div.pageNav a,
			.productCatalog .galleryTools .pageJump,
			.productCatalog .galleryTools .categoryJump span{
				display:inline-block;
				padding:3px 10px;
				border:1px solid #000;	
				background:#fff;
				text-transform:uppercase;
				color:#000;
				float:left;
				margin-left:8px;
			} .productCatalog .galleryTools div.pageNav a:hover { text-decoration:none; }
				.productCatalog .galleryTools div.pageNav a:hover,
				.productCatalog .galleryTools .pageJump:hover,
				.productCatalog .galleryTools .categoryJump span:hover{
					border-color:#d40202;
					color:#d40202;
				}
				
			.productCatalog .galleryTools div.pageNav a.blocked{
				border-color:#bababa;
				color:#bababa;
				cursor:default;
			} .productCatalog .galleryTools div.pageNav a.blocked:hover{
					border-color:#bababa;
					color:#bababa; 
					cursor:default;
			  }
			
			.productCatalog .galleryTools div.pageNav { float:left; }
			
			.productCatalog .galleryTools div.pageNav a{
				margin-left:2px;	
			}
			
			.productCatalog .galleryTools div.pageNav .pagNum { 
				background:#fff; 
				color:#000; 
				border:1px solid #000;
			} .productCatalog .galleryTools div.pageNav .pagNum:hover,
			  .productCatalog .galleryTools div.pageNav .pagNum.current { 
					background:#fff !important;
					border-color:#d40202; 
					color:#d40202 !important;
			  } /*.productCatalog .galleryTools div.pageNav a.pagNum:nth-child(2),
                .productCatalog .galleryTools div.pageNav a.pagNum:nth-last-child(2){
                  display:inline-block !important;
                  background:#000;
                  color:#fff;
              }*/
			
			.productCatalog .galleryTools .pageJumpInput {
				position: absolute;
				border: 1px solid #000;
				right: -28px;
				top: 25px;
				width: 75px;
				padding: 3px;	
				opacity:0;
				background:#fff;
			}
			
				.productCatalog .galleryTools .pageJumpInput input{
					display: inline-block;
					float: left;
					width: 40px;
					padding: 4px;
					height: 12px;
					border: 1px solid #000;
				}
				
				.productCatalog .galleryTools .pageJumpInput a{
					display: inline-block;
					float: left;
					width: 20px;
					height: 20px;
					margin-left: 5px;
					margin-top: 1px;
				}
			
			.productCatalog .galleryTools .pageJump{
				font-weight:600;	
			}
			
			.productCatalog .galleryTools .pageJump .actualPage{
				cursor: default;
				color:#000;
				border-bottom:1px solid #a4a4a4;	
				font-weight:200;
			}
			
			.productCatalog .galleryTools .categoryJump span.openButton{
				padding: 8px 10px;
				border-left:0px;
			}
			
			.productCatalog .galleryTools .categoryJump span{
				margin-left:0px;
			}
			
			.productCatalog .galleryTools .categoryJump:hover span{
					border-color:#d40202;
					color:#d40202;
					cursor:pointer;
				}
			.productCatalog .galleryTools .categoryJump:hover i.icon{
				background-position: -2px -158px;
			}

	.productCatalog ul{
		height:100%;
		padding: 13px;
		display:block;
		margin:0 auto;
		text-align:center;
	}

        @-webkit-keyframes enterAnimation {
            0%   {-webkit-transform: scale(0)}
            100% {-webkit-transform: scale(1)}
        }

        /* Standard syntax */
        @keyframes enterAnimation {
            0%   {
                -webkit-transform: scale(0);
                -moz-transform: scale(0);
                -ms-transform: scale(0);
                -o-transform: scale(0);
                transform: scale(0);
            }
            100% {
                -webkit-transform: scale(1);
                -moz-transform: scale(1);
                -ms-transform: scale(1);
                -o-transform: scale(1);
                transform: scale(1);
            }
        }

		.productCatalog ul li{
			position:relative;
			/*display:block;
			margin:1px;*/
			border:3px solid #fff;
			background:none;
			overflow:hidden;
			width:255px;
			height:255px;
			/*float:left;*/
			
			/* Internet Explorer 10 */
			display:-ms-flexbox;
			-ms-flex-pack:center;
			-ms-flex-align:center;
			
			/* Firefox */
			display:-moz-box;
			-moz-box-pack:center;
			-moz-box-align:center;
			
			/* Safari, Chrome, and Opera */
			display:-webkit-box;
			-webkit-box-pack:center;
			-webkit-box-align:center;
			
			/* W3C */
			display:box;
			box-pack:center;
			box-align:center;
			
			display:inline-block;

            -webkit-animation-name: enterAnimation; /* Chrome, Safari, Opera */
            -webkit-animation-duration: 1s;
		}
		
		.productCatalog ul li img {
            min-width:100% ;
            min-height:100% ;
            position: absolute;
            left: 50%;
            top: 50%;
            transform: translate(-50%, -50%);
        }
		
		.productCatalog ul li a:hover{ text-decoration:none; }
		
		.productCatalog ul li div.mask{
			position:absolute;
			top:0;
			left:0;
			right:0;
			bottom:0;
			background:rgba(0,0,0,0.6);
			opacity:0;
			cursor:pointer;
			-webkit-transition: all .2s; /* For Safari 3.1 to 6.0 */
			transition: all .2s;
			/* Internet Explorer 10 */
			display:-ms-flexbox;
			-ms-flex-pack:center;
			-ms-flex-align:center;
			
			/* Firefox */
			display:-moz-box;
			-moz-box-pack:center;
			-moz-box-align:center;
			
			/* Safari, Chrome, and Opera */
			display:-webkit-box;
			-webkit-box-pack:center;
			-webkit-box-align:center;
			
			/* W3C */
			display:box;
			box-pack:center;
			box-align:center;
		} .productCatalog ul li:hover div.mask{ 
			opacity:1;
		 } 
		 
		 	.productCatalog ul li div.mask .maskContent{
				display:block;
				width:100%;
			} .productCatalog ul li div.mask .prodDesc:before{
                      content: "";
                      position: absolute;
                      top: -10px;
                      left: 50%;
                      width: 0px;
                      height: 0px;
                      border-style: solid;
                      border-width: 0 17.5px 10px 17.5px;
                      border-color: transparent transparent #d40202 transparent;
                      margin-left: -17.5px;
			  } .productCatalog ul li:hover div.mask .prodDesc:before{
					/*content:"";
					position:absolute;
					top: 0px;
					left: -25px;
					width: 30px;
					background: #D40202;
					height: 100%;*/
			  } .productCatalog ul li div.mask .prodDesc:after{
					content:"";
					position:absolute;
					top:0px;
					right: 0px;
					width: 30px;
					height: 100%;
					background: #D40202;
					-webkit-transition:all .2s;
					-moz-transition:all .2s;
					-o-transition:all .2s;
					transition:all .2s;
			  } .productCatalog ul li:hover div.mask .prodDesc:after{
					content:"";
					position:absolute;
					top:0px;
					right: -25px;
					width: 30px;
					height: 100%;
					background: #D40202;
					-webkit-transition:all .2s;
					-moz-transition:all .2s;
					-o-transition:all .2s;
					transition:all .2s;
			  }
				
		 
		 	.productCatalog ul li div.mask .links{
				display:table;
				margin:0 auto;
                position: relative;
                opacity: 0;
                top: 20px;
                -webkit-transition: all .3s .2s;
                -moz-transition: all .3s .2s;
                -ms-transition: all .3s .2s;
                -o-transition: all .3s .2s;
                transition: all .3s .2s;
			}

            .productCatalog ul li:hover div.mask .links{
                top: 0;
                opacity: 1;
            }
			
				.productCatalog ul li div.mask .links a{
					display:inline-block;
					margin:0 5px;
                    -webkit-transition: left .3s .2s;
                    -moz-transition: left .3s .2s;
                    -ms-transition: left .3s .2s;
                    -o-transition: left .3s .2s;
                    transition: left .3s .2s;
				}

                .productCatalog ul li div.mask .links a:first-child{ position: relative; left: 32px; }
                .productCatalog ul li div.mask .links a:last-child{ position: relative; left: -32px; }

                .productCatalog ul li:hover div.mask .links a:first-child,
                .productCatalog ul li:hover div.mask .links a:last-child{ left: 0; }


                    .productCatalog ul li div.mask .links a span.seeMedRed{
                        width:28px;
                        height:28px;
                        background-position: -45px -143px;
                    } .productCatalog ul li div.mask .links a:hover span.seeMedRed{
                            background-position: -53px -259px;
                        }

                    .productCatalog ul li div.mask .links a span.fbLight{
                        width:28px;
                        height:28px;
                        background-position: -154px -229px;
                        opacity: .6;
                    } .productCatalog ul li div.mask .links a:hover span.fbLight{
                          opacity: 1;
                      }

                    .productCatalog ul li div.mask .links a span.pnLight{
                        width:28px;
                        height:28px;
                        background-position: -215px -229px;
                        opacity: .6;
                    } .productCatalog ul li div.mask .links a:hover span.pnLight{
                          opacity: 1;
                      }


				.productCatalog ul li div.mask .prodDesc{
					display:block;
					background:#d40202;	
					text-align:center;
					padding:14px;
					color:#fff;
					margin-top:10px;
					position:relative;
                    top: 30px;
                    opacity: 0;
                    -webkit-transition: all .3s;
                    -moz-transition: all .3s;
                    -ms-transition: all .3s;
                    -o-transition: all .3s;
                    transition: all .3s;
				} /*.productCatalog ul li div.mask .prodDesc:before{
						content:"";
						position:absolute;
						top:-10px;
						left:50%;
						width: 0px;
						height: 0px;
						border-style: solid;
						border-width: 0 17.5px 10px 17.5px;
						border-color: transparent transparent #d40202 transparent;
						margin-left: -17.5px;
				  }*/

                .productCatalog ul li:hover div.mask .prodDesc{
                    top: 0;
                    opacity: 1;
                }
				  
				  	.productCatalog ul li div.mask .prodDesc div{
						display: table;
						margin: 0 auto;
					} .productCatalog ul li div.mask .prodDesc div:first-child:before{
							content:"";
							position:absolute;
							top:-10px;
							left:50%;
							width: 0px;
							height: 0px;
							border-style: solid;
							border-width: 0 17.5px 10px 17.5px;
							border-color: transparent transparent #d40202 transparent;
							margin-left: -17.5px;
						}
			
					.productCatalog ul li div.mask .prodDesc span.title a{
						font-size:18px;
						color:#fff;
					}
					
					.productCatalog ul li div.mask .prodDesc span.price a{
						font-size:14px;
						color:#fff;
					}
			
@-moz-document url-prefix() { 
	.productCatalog ul li div.mask .maskContent{
		position:relative;
		top:50%;
		margin-top:-57px;	
	}
}
			
			
@media screen and (-webkit-min-device-pixel-ratio:0) { 

	::i-block-chrome, .productCatalog ul li img{
		height: auto;
	}
		
}
			
			
			
			
			