/*########################################## * 
General css for Products Carroussel for Virtuemart * 
Design by WebDesign - sites-design.com 
* Copyright 2006 - 2017 WebDesign
* Developer : http://www.sites-design.com 
###########################################*/    

.modal .moduletable.carousel {display: none;}   

.moduletable.carousel.relacionados {margin: 30px 0;}   
.moduletable.carousel .vmheader {margin: 0;}      
.moduletable.carousel h3 {background: #000; color: #fff; text-align: center; border-top: 3px solid #777; padding: 10px 0; margin: 0;}   
    
.carousel .vmheader h2 {
background: -moz-linear-gradient(left,  rgba(255,255,255,0) 0%, rgba(156,211,45,1) 50%, rgba(255,255,255,0) 100%);
background: -webkit-linear-gradient(left,  rgba(255,255,255,0) 0%,rgba(156,211,45,1) 50%,rgba(255,255,255,0) 100%);
background: linear-gradient(to right,  rgba(255,255,255,0) 0%,rgba(156,211,45,1) 50%,rgba(255,255,255,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 );
    color: #555;
	text-shadow: 1px 1px 1px #fff;
	text-align: center;
    font-size: 20px;
    font-weight: 400;
    letter-spacing: 1px;
    line-height: 30px;
    margin: 0;
    padding: 2px 10px;
	border-top: 2px solid #aac09c;
}      

.jcarousel .PricetaxAmount.vm-display.vm-price-value, .jcarousel span.PricediscountAmount {display: none;}        

/* ----  \\\\\\\\ ----- */
   
.relacionados .span3.product-field.product-field-type-M, relacionados .product-field-desc {display: none;}      
.relacionados .vm-customfields-wrap {margin: 0 0 2px; position: relative;}       
.relacionados .addtocart-area .product-fields {background: rgba(255, 255, 255, 0.85); position: relative; width: 98%; margin: -12px 1% 0;}     
.relacionados .product-fields .product-field {float: none; margin: 0; padding: 2px 0; text-align: center; width: 100%;}      

.relacionados div.spacer {padding: 0;}      
.relacionados .cap-bot table {
    background: rgba(255,255,255,0.6); 
    height: 99%;
    margin: 0.5%;
    width: 99%;
}      
.relacionados .cap-bot td { box-shadow: none; vertical-align: middle;}      
.relacionados .popup {width: 100%; margin: 1% 0 -2% !important;}     

.relacionados figure { display: block; position: relative; overflow: hidden; margin: 0; }      
.relacionados figcaption {
  height:100%; 
  width: 100%; 
  position: absolute; 
  box-shadow: none; 
  color: #333; 
  font-size: 12px; 
  text-align: center; 
  padding: 0;
  opacity: 0.0;  
  filter: alpha(opacity=0); 
  -webkit-transition: all 0.8s ease; 
  -moz-transition: all 0.8s ease; 
  -o-transition: all 0.8s ease;     
} 

.relacionados figcaption td { background-color: transparent; padding: 0 1%;}         

.relacionados figure:hover figcaption { opacity: 0.95; } 
.relacionados figure:before {
  content: " ";
  position: absolute; 
  font-weight: 700; 
  background: none; 
  background: rgba(255,255,255,0.0); 
  text-shadow: 0 0 5px white; 
  color: black; 
  width: 24px; 
  height: 24px; 
  -webkit-border-radius: 12px; 
  -moz-border-radius: 12px; 
  border-radius: 12px; 
  text-align: center; 
  font-size: 14px; 
  line-height: 24px; 
  -moz-transition: all 0.6s ease; 
  opacity: 0.0;     
}
.relacionados figure:hover:before { opacity: 0; }       

.relacionados .cap-bot {height: 280px !important;}  
.relacionados .cap-bot:before {bottom: 0; left: auto; }  
.relacionados .cap-bot figcaption {background: rgba(255,255,255,0.97); right: 50%; bottom: 100%; width: 0; height: 0;}  
.relacionados .cap-bot:hover figcaption {right: 0; bottom: 0; width: 100%; height: 100%;}   

.relacionados .imagem {height: auto; max-height: 210px; margin: 0 auto; width: auto;}          
.relacionados .desc {
  display: block; /* ou inline-block */
  text-overflow: ellipsis;
  word-wrap: break-word;
  overflow: hidden;
  height: 56px; /* limita a 4 linhas */
  line-height: 13px;
  color: #777; 
  font-size: 13px; 
  text-align: center; 
}      
.relacionados .desc p {font-size: 13px;  margin: 0; line-height: 14px;}     
.relacionados div.img {display: inline-block;}   
.relacionados .desc img {max-height: 48px !important; display: block !important; float: left; margin: 0 1px !important;}     
.relacionados .popup .desc ul {position: relative !important; width: 100% !important;}     
.relacionados .popup .desc ul li {font-size: 13px; line-height: 14px; text-align: left; padding: 0 5px; border: 0!important;}     
.relacionados .nome {display: inline; line-height: 1; margin-top: 10px;}          
.relacionados .nome a {color: #000; line-height: 1; font-size: 17px;}    

.relacionados .cap-bot a {display: block; color:; font-size: 17px; line-height: 1;}      
.relacionados .nome a:hover {color: #777; text-decoration: none;}    
.relacionados .link a {
    color: #555;
    display: inline-block;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
    margin: 0 1% !important;
    padding: 2px 2% 0 !important;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: all 0.5s ease 0s;
    width: 94%;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
	border-radius: 0;
    border-left: 0;
    border-right: 0;
}
.relacionados .link a:hover {background: #999; color: #fff;}  
.relacionados .product-price .vm-price-desc {color: #999;}
.relacionados .product-price span.PricesalesPrice {color: #777;}        
.relacionados span.PricepriceWithoutTax, .relacionados span.PricediscountedPriceWithoutTax {font-size: 16px !important; line-height: 1;}  

.relacionados .PricebasePriceWithTax.vm-display.vm-price-value {margin: 0;}   
.relacionados .PricediscountedPriceWithoutTax.vm-display.vm-price-value {margin: -3px 0 0;}      
.relacionados span.addtocart-button {margin: -7px 0 0 5px;}  
.relacionados span.addtocart-button input.addtocart-button {font-size: 13px; font-weight: 700; padding: 1px 8px !important; margin: 0; background: #ddd; border: 1px solid #bbb; color: #777;}      
.relacionados .addtocart-button input.addtocart-button:hover, .relacionados a.modal.notify.modal_link.cboxElement:hover {background: #fff; color: #000 !important;}        

.relacionados .addtocart-area {margin: 0; padding: 2px 0;}    
.relacionados .addtocart-area form {background: none; width: 100%; display: block;}    
.relacionados .addtocart-bar {float: none; margin: 0 auto; display: inline-block;}    
.relacionados .popup span.quantity-box {border: 0; margin: -4px 0 0;}     
.relacionados .quantity-box .quantity-input {width: 20px !important; height: 18px;}
.relacionados .quantity-controls.js-recalculate {float: left; margin: -4px 0 0 2px; }     
.relacionados .popup span.quantity-controls input.quantity-plus {margin: 0; }          
.relacionados .popup span.quantity-controls input.quantity-minus {margin: -3px 0 0 -6px; }       
.relacionados input.addtocart-button {letter-spacing: 0 !important; padding: 2px 8px !important;}      
.relacionados input.addtocart-button:hover, .jcarousel a.modal.notify.modal_link.cboxElement:hover {color: #777 !important;}        
.relacionados a.modal.notify.modal_link.cboxElement {color: #777; font-size: 12px;}   
.relacionados .btn-compare.fa.fa-random {display: none;}   
.relacionados .productdetails-view .span3.product-field.product-field-type-E {padding: 0;}    
.relacionados .span3.product-field.product-field-type-E + .span3.product-field.product-field-type-E + .span3.product-field.product-field-type-E {margin-top: -10px;}    
.relacionados .product-fields .product-field {border: 0; padding: 0; border-radius: 0;}   
.relacionados .product-fields-title-wrapper strong {color: #555; font-size: 11px !important; font-weight: 400;}  
.relacionados .product-fields-title-wrapper {display: inline;}   
.relacionados .cf4all_color_btn {width: 18px; height: 15px;}  
.relacionados .cf4all_error_msg {margin: -12px 0 0; left: 0;}   
.relacionados .cf4all_button.cf4all_no_color_btn {height: 12px; padding: 2px 3px 0;}   
.relacionados .price-crossed div.PricebasePriceWithTax .PricebasePriceWithTax {font-size: 14px;}   
.relacionados .percentagem {margin: 0 0 0 50px;}   
.relacionados .PricediscountAmount.vm-display.vm-price-value {margin: -20px 0 0 0 !important;}   
.relacionados .notificar {margin-top: 2px; border: 1px solid #ddd; padding: 0 5px; text-align: center; line-height: 1;}   

/* ---************ --- */

/** Carousel **/  
.vmgroup.carousel.relacionados { 
width: 100%; 
border-bottom: 3px solid #000; 
margin: 0 0 30px;
}             
.vmgroup.carousel.relacionados .vmproduct.carousel {margin: 0;}   
.moduletable.carousel .vmgroup.carousel.relacionados .jcarousel-wrapper {
    height: 320px;
	border-top: 3px solid #555;
    margin: 0 auto;
	padding: 10px 0 0;
    position: relative;
	z-index: 1;
}       

.moduletable.carousel .vmgroup.carousel.relacionados .jcarousel {
    height: 280px;
	min-height: 280px;
	overflow: hidden;
    position: relative;
    width: 100%;
}

.moduletable.carousel .vmgroup.carousel.relacionados .jcarousel ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
    position: absolute;
    width: 20000em;
}

.moduletable.carousel .vmgroup.carousel.relacionados .jcarousel li {
    float: left;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
	border-right: 1px solid #efefef; 
    margin: 0;
    max-width: 360px;
}

.moduletable.carousel .vmgroup.carousel.relacionados .jcarousel img {
    display: block;
    max-width: 100%;
	max-height: 210px;
    height: auto !important;
	margin: 0 auto;
}

.vmgroup.carousel.relacionados .login-lpvp {float: none;}
.vmgroup.carousel.relacionados .product-price {margin: 0;}         
.vmgroup.carousel.relacionados .PricepriceWithoutTax, .vmgroup.carousel.relacionados .PricevariantModification.vm-nodisplay, .vmgroup.carousel.relacionados .PricetaxAmount, 
.vmgroup.carousel.relacionados span.PricediscountAmount, .vmgroup.carousel.relacionados .PriceunitPrice, .vmgroup.carousel.relacionados .PricesalesPriceWithDiscount {display: none;}            

/** Carousel Controls **/
.vmgroup.carousel.relacionados .navega.mod {display: inline-block; margin: 0 0 -5px; width: 100%;}     
.vmgroup.carousel.relacionados .jcarousel-control-prev, .vmgroup.carousel.relacionados .jcarousel-control-next {
    line-height: 1;
    text-align: center;
    background: none;
    color: #777;
	font-family: arial;
    text-decoration: none;
    text-shadow: 0 1px 1px #800000;
    font-size: 36px;
	border-radius: 50%; 
	padding: 0 10px;
}         
.vmgroup.carousel.relacionados .navega.mod a:hover {color: #800000; text-decoration: none;}       

/** Carousel Pagination **/ 
.vmgroup.carousel.relacionados .jcarousel-pagination {
    position: absolute;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    margin: 15px 0 0;
}

.vmgroup.carousel.relacionados .jcarousel-pagination a {
    text-decoration: none;
    display: block;
	float:left;
    font-size: 11px;
    height: 9px;
    width: 9px;
    line-height: 10px;
    background: #fff;
    color: #999;
    border-radius: 50%;
    text-indent: -9999px;
    margin: 0 2px;
	border: 1px solid #999; 
}

.vmgroup.carousel.relacionados .jcarousel-pagination a.active, .jcarousel-pagination a:hover {
    background: #800000;
    color: #fff;
    opacity: 1;
    border-radius: 0;
}

@media (min-width: 1200px) and (max-width: 1980px) {
	
}  
	
@media (min-width: 980px) and (max-width: 1199px) {
	
} 

@media (min-width: 768px) and (max-width: 979px) {
	
}    
	
@media (max-width: 767px) {
	.moduletable-carousel1 > h3, .moduletable-carousel2 > h3, .moduletable-carousel3 > h3, .moduletable-carousel4 > h3 {margin-left: 10px;}      
	.vmgroup.carousel.relacionados .jcarousel-pagination {display: none;}     
	.vmgroup.carousel.relacionados .jcarousel-control-next {margin-left: 25px;}     
	.vmgroup.carousel.relacionados .jcarousel-control-prev {margin-right: 25px;}        
}      

@media (max-width: 480px) {
   .vmgroup.carousel.relacionados .jcarousel div.spacer {max-width: 360px; margin: 0 auto;}      
   .vmgroup.carousel.relacionados .cap-bot figcaption table {margin: 0 auto; max-width: 360px !important;}       
}