/* Generals resets and unimportant stuff */
* { margin: 0px; padding: 0px; }
body {
	background: #eaebec;
	font-family: "Open Sans", sans-serif; 
}
.view-code{\
  color:#48cfad; 
  font-size:14px;
  text-transform:uppercase;
  font-weight:700;
  text-decoration:none;
  position:relative;

  cursor: pointer;
}
.view-code:hover{color:#34c29e;}

/* --- Product Card ---- */
.make-3D-space{
          width: 325px;
    height: 440px;
     transition: transform 5s;
    position: relative;
    display: inline-block;
        margin-right: 17px;
        margin-bottom:22px;
}
.product-front, .product-back{
	  width: 325px;
    height: 440px;
	background:#fff;
	position:absolute;

	-webkit-transition: all 100ms ease-out; 
       -moz-transition: all 100ms ease-out; 
         -o-transition: all 100ms ease-out; 
            transition: all 100ms ease-out; 
             padding: 20px 13px;
}
.product-back{
	display:none;
	transform: rotateY( 180deg );
	  
}
.product-back .ulProduto{
	padding: 31px 11px 10px 18px;
    color: #fff!important;
    height: 320px;
    overflow-y: scroll;
}
.product-back .ulProduto li{
	margin-bottom: 10px;
}
/* Track */
.product-back .ulProduto::-webkit-scrollbar-track {
  background:#2f6293!important; 
}

/* Handle */
.product-back .ulProduto::-webkit-scrollbar-thumb {
  background: #028cd2; 
}

/* Handle on hover */
.product-back .ulProduto::-webkit-scrollbar-thumb:hover {
  background:#006193; 
}
.product-back .ulProduto::-webkit-scrollbar{
	width: 10px;
}
.product-back .ulProduto::-webkit-scrollbar-track {
	-webkit-border-radius: 0px;
	border-radius: 0px;
}
.product-back .ulProduto::-webkit-scrollbar-thumb {
	-webkit-border-radius: 0px;
	border-radius: 0px;
}
.product-card.animate .product-back, .product-card.animate .product-front{
	
	-webkit-transition: all 100ms ease-out; 
       -moz-transition: all 100ms ease-out; 
         -o-transition: all 100ms ease-out; 
            transition: all 100ms ease-out; 
}
.product-card{
	width: 325px;
    height: 440px;
	position:relative;    
		
	overflow:hidden;
	box-shadow:4px 4px 7px -5px rgb(0 0 0 / 15%);
    transform-style: preserve-3d;
	-webkit-transition:  100ms ease-out; 
       -moz-transition:  100ms ease-out; 
         -o-transition:  100ms ease-out; 
            transition:  100ms ease-out;

}
.product-card img{
	    width: 60px;
}
div.product-card.flip-10{
	 -webkit-transform: rotateY( -10deg );
         -moz-transform: rotateY( -10deg );
           -o-transform: rotateY( -10deg );
              transform: rotateY( -10deg );
			   transition:  50ms ease-out; 			
}
div.product-card.flip90{
	 -webkit-transform: rotateY( 90deg );
         -moz-transform: rotateY( 90deg );
           -o-transform: rotateY( 90deg );
              transform: rotateY( 90deg );
			   transition:  100ms ease-in; 			
}
div.product-card.flip190{
	 -webkit-transform: rotateY( 190deg );
         -moz-transform: rotateY( 190deg );
           -o-transform: rotateY( 190deg );
              transform: rotateY( 190deg );
			   transition:  100ms ease-out; 			
}
div.product-card.flip180{
	 -webkit-transform: rotateY( 180deg );
         -moz-transform: rotateY( 180deg );
           -o-transform: rotateY( 180deg );
              transform: rotateY( 180deg );
			   transition:  150ms ease-out; 			
}
.product-card.animate{
	top:5px;
	left:5px;
  width: 325px;
    height: 440px;
	box-shadow:0px 13px 21px -5px rgba(0, 0, 0, 0.3);
	-webkit-transition:  100ms ease-out; 
       -moz-transition:  100ms ease-out; 
         -o-transition:  100ms ease-out; 
            transition:  100ms ease-out; 
}
.divnomeProduto{
	    height: 84px;
}
.stats-container{
	background:#fff;	
	position:absolute;
	top:386px;
	left:0;
	  width: 325px;
    height: 440px;
	padding:27px 35px 35px;	
	-webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out;
}
.product-card.animate .stats-container{
	top:272px;
	-webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 
}
.stats-container .product_name{
	font-size:22px;
	color:#393c45;	
}
.stats-container p{
	font-size:16px;
	color:#b1b1b3;	
	padding:2px 0 20px 0;
}
.stats-container .product_price{
	float:right;
	color:#48cfad;
	font-size:22px;
	font-weight:600;
}
.image_overlay{
	position:absolute;
	top:0;
	left:0; 
	width:100%;
	height:100%;
	background:#48daa1;
	opacity:0;	
}
.product-card.animate .image_overlay{
	opacity:0.7;	
	-webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 
}
.product-options{
	padding:2px 0 0;
}
.product-options strong{
	font-weight:700;
	color:#393c45;
	font-size:14px;
}
.product-options span{	
	color:#969699;
	font-size:14px;
	display:block;
	margin-bottom:8px;
}
.view_details{	
	    position: relative;
      font-size: 14px;
    text-align: center;
    text-transform: uppercase;
    font-weight: 700;
    padding: 0px 0 10px;
    cursor: pointer;
}
.view_details:hover{
	color:#006193;
}

.product-card.animate .view_details{
	
	-webkit-transition: all 200ms ease-out; 
       -moz-transition: all 200ms ease-out; 
         -o-transition: all 200ms ease-out; 
            transition: all 200ms ease-out; 		
}
.divTipo{
	background-color: #eaebec;
    color: #626262;
    padding: 13px 0px 0px;
    margin-top: -15px;
    width: 135%;
    margin-left: -28px;
    margin-bottom: 10px;
    cursor: pointer;
        height: 67px;
}
.divTipo i{
	    font-size: 20px;
}
.divTipo p{
	margin-bottom: 0px!important;
}
.divTipo img{
	margin-bottom: 10px;
}
.divComprar{
	 width: 135%;
    margin-left: -28px;
	bottom: 0px!important;
	   padding: 13px 0px 0px;
    cursor: pointer;
}

.make-3D-space .divnomeProduto{
	    text-align: center;
}
.make-3D-space .divnomeProduto p{
    color: #000!important;
    font-size: 18px;
    margin-top: 8px;
    text-align: center;
    letter-spacing: 0px;
    line-height: 22px;
}
.descricaoProduto{
	    margin-left: 10px;
    font-size: 15px;
    letter-spacing: 0px;
        height: 71px;
}
div.colors div{
	margin-top:3px;
	width:15px; 
	height:15px; 	
	margin-right:5px;
	float:left;
}
div.colors div span{
	width:15px; 
	height:15px; 
	display:block;
	border-radius:50%;
}
div.colors div span:hover{
	width:17px;
	height:17px;
	margin:-1px 0 0 -1px;
}
div.c-blue span{background:#6e8cd5;}
div.c-red span{background:#f56060;}
div.c-green span{background:#44c28d;}
div.c-white span{
	background:#fff;
	width:14px;
	height:14px; 
	border:1px solid #e8e9eb;
}
div.shadow{
	width:325px;height:440px;
	opacity:0;
	position:absolute;
	top:0;
	left:0;
	z-index:3;
	display:none;
	background: -webkit-linear-gradient(left,rgba(0,0,0,0.1),rgba(0,0,0,0.2));
    background: -o-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); 
    background: -moz-linear-gradient(right,rgba(0,0,0,0.1),rgba(0,0,0,0.2)); 
    background: linear-gradient(to right, rgba(0,0,0,0.1), rgba(0,0,0,0.2)); 
}
.product-back div.shadow{
	z-index:10;
	opacity:1;
	background: -webkit-linear-gradient(left,rgba(0,0,0,0.2),rgba(0,0,0,0.1));
    background: -o-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); 
    background: -moz-linear-gradient(right,rgba(0,0,0,0.2),rgba(0,0,0,0.1)); 
    background: linear-gradient(to right, rgba(0,0,0,0.2), rgba(0,0,0,0.1)); 
}
.flip-back{
	position: absolute;
    top: 0px;
    left: 0px;
    width: 95%;
    height: 37px;
    cursor: pointer;
  }
.cx, .cy{
	position:absolute;
	width:0px;
	top:15px;
	right:15px;
	height:3px;
	-webkit-transition: all 250ms ease-in-out;
	   -moz-transition: all 250ms ease-in-out;
		-ms-transition: all 250ms ease-in-out;
		 -o-transition: all 250ms ease-in-out;
			transition: all 250ms ease-in-out;
}
.flip-back:hover .cx, .flip-back:hover .cy{
	background:#979ca7;
	-webkit-transition: all 250ms ease-in-out;
	   -moz-transition: all 250ms ease-in-out;
		-ms-transition: all 250ms ease-in-out;
		 -o-transition: all 250ms ease-in-out;
			transition: all 250ms ease-in-out;
}
.cx.s1, .cy.s1{	
	right:0;	
	width:20px;	
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ms ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}
.cy.s2{	
	-ms-transform: rotate(50deg); 
	-webkit-transform: rotate(50deg); 
	transform: rotate(50deg);		 
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ms ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}
.cy.s3{	
	-ms-transform: rotate(45deg); 
	-webkit-transform: rotate(45deg); 
	transform: rotate(45deg);		 
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ms ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}
.cx.s1{	
	right:0;	
	width:20px;	
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ms ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}
.cx.s2{	
	-ms-transform: rotate(140deg); 
	-webkit-transform: rotate(140deg); 
	transform: rotate(140deg);		 
	-webkit-transition: all 100ms ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}
.cx.s3{	
	-ms-transform: rotate(135deg); 
	-webkit-transform: rotate(135deg); 
	transform: rotate(135deg);		 
	-webkit-transition: all 100ease-out;
	   -moz-transition: all 100ms ease-out;
		-ms-transition: all 100ms ease-out;
		 -o-transition: all 100ms ease-out;
			transition: all 100ms ease-out;
}

.arrows-perspective{
	width:335px;
	height:55px;
	position: absolute;
	top: 218px;
	transform-style: preserve-3d;
    transition: transform 5s;
	perspective: 335px;
}

.mesmoTamanho, .cardsGarantia, .cardsGarantia .product-card, .cardsGarantia .product-back, .cardsGarantia .product-front{
	    width: 325px!important;
    height: 341px!important;
}
.cardsGarantia .divTipo{
	    padding-top: 25px!important;
}
.cardsGarantia .divComprar {
    width: 135%;
    margin-left: -46px;
    bottom: 20px!important;
    padding: 17px 0px 0px;
    background-color: #006193;
    color: #fff;
    cursor: pointer;
    position: absolute;
}
.cardsGarantia .product-back .ulProduto {
    padding: 31px 11px 31px 18px;

}
.cardsGarantia .product-back .ulProduto {
      height: 311px;

}
.cardsGarantia .product-back {
    padding-bottom: 20px;

}
.cardsCotacao .divTipo {
	background-color: #d5d5d5;
	color: #FFF;
	padding: 13px 0px 0px;
	margin-top: -15px;
	width: 135%;
	margin-left: -28px;
	margin-bottom: 13px;
	cursor: pointer;
	height: 79px;
}

	.cardsCotacao .divTipo img {
		//filter: brightness(10);
	}

.cardsCotacao .botaoTabela {
	color: #484848 !important;
	background-color: #FFF;
	font-size: 14px !important;
	padding: 6px 6px 5px 6px;
	cursor: pointer;
	border-radius: 25px;
	margin-right: 5px;
	margin-top: 0px;
	width: auto !important;
	height: 26px;
}

	.cardsCotacao .botaoTabela:hover {
		background-color: #028cd2 !important;
		color: #FFF;
	}

.cardsCotacao .descricaoProduto {
	margin-left: 5px;
	font-size: 13px;
	letter-spacing: 0px;
	height: auto;
	list-style-type: none;
	text-align: left;
	margin-bottom: -6px;
	margin-top: -3px;
}

	.cardsCotacao .descricaoProduto li {
		border-bottom: 1px dotted #bbb;
		margin-bottom: 4px;
		font-family: Regular !important;
	}

.cardsCotacao .divComprar {
	font-size: 13px;
	background-color: #004568;
	color: #fff;
}

.cardsCotacao .product-card img {
	width: auto;
	height: 24px;
}
