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

.moduletable.comments {display: table; width: 100%; margin: 30px 0 0;} 

.moduletable.comments ul.jcomments-latest li {border: 0 !important; margin: 0 !important; padding: 20px 0 !important;}  
.moduletable.comments ul.jcomments-latest .jcomments-latest-readmore {margin: 10px 0 0; text-align: center; border-top: 1px solid #eee;} 
#wrapper.slideshow {border-top: 1px solid #07AE87; border-bottom: 1px solid #07AE87; margin: 0 0 20px; padding: 30px 0 0;}    
.comentario {min-height: 40px;} 

.moduletable.comments h3 {
    color: #07AE87; 
	line-height: 1;
    margin: 10px auto -19px;
    padding: 6px 20px;
    text-align: center;
    font-size: 26px;
    font-weight: 400;
    display: table;
    background: #fff;
    position: relative;
    z-index: 1;
} 
.jcomments-latest h4, .moduletable.comments h3 {
	-webkit-transform: scale(1.0) skew(-5deg); 
    -moz-transform: scale(1.0) skew(-5deg); 
    -o-transform: scale(1.0) skew(-5deg); 
    transform: scale(1.0) skew(-5deg);
    letter-spacing: -0.5px;
}
ul.jcomments-latest .author, ul.jcomments-latest .comment {margin: 0 10px 0 20px !important; padding: 0 !important;} 
#containercomments.slideshow {width:100%; max-width: 1020px; height:auto; position:relative; margin: 0 auto;}       

#containercomments.slideshow ul {
	width:100%;
	height:160px;
	list-style:none;
	position:relative;
	overflow:hidden;
	margin: 0; 
}   

#containercomments.slideshow li:first-child {display:list-item; position:absolute;}   
#containercomments.slideshow li {position:absolute; display:none; height:120px; width: 100%;}    

.slideshow .navega {display: inline-block; margin: 0; width: 100%; text-align: center; position: absolute; bottom: 0;}          
.slideshow .navega .prevButton, .slideshow .navega .nextButton {
    line-height: 1;
    text-align: center;
    color: #6FD0A7;
    text-decoration: none;
    font-size: 40px;
	font-weight: 400;
	text-shadow: 0 0 1px #000;
	box-shadow: none; 
	padding: 0 15px;
	margin: -5px 20px;
}  
.slideshow .navega .prevButton {float: right;}    
.slideshow .navega .nextButton {float: left;}    
.slideshow .navega .prevButton:hover, .slideshow .navega .nextButton:hover{color: #0082C9; text-decoration: none; cursor: pointer;}     

/** ----------- Responsive **/  
@media (min-width: 981px) and (max-width: 1200px) {	
  #containercomments.slideshow ul {height: 180px;}    
  #containercomments.slideshow li {height: 140px;}    
  .comentario {min-height: 50px;} 
}  

@media (min-width: 769px) and (max-width: 980px) {	
  #containercomments.slideshow ul {height: 180px;}    
  #containercomments.slideshow li {height: 140px;}    
  .comentario {min-height: 50px;} 
}  

@media (min-width: 601px) and (max-width: 768px) { 
  .moduletable.comments h3 {font-size: 24px; letter-spacing: -1px;} 
  #containercomments.slideshow ul {height: 200px;}    
  #containercomments.slideshow li {height: 160px;}    
  .comentario {min-height: 60px;} 
}  

@media (min-width: 481px) and (max-width: 600px) {	
  .moduletable.comments h3 {font-size: 22px; letter-spacing: -0.5px;} 
  #containercomments.slideshow ul {height: 220px;}    
  #containercomments.slideshow li {height: 180px;}    
  .comentario {min-height: 80px; font-size: 13px;} 
} 

@media (max-width: 480px) {
  .moduletable.comments h3 {font-size: 21px; letter-spacing: -1px; padding: 6px 10px;} 
  #containercomments.slideshow ul {height: 250px;}    
  #containercomments.slideshow li {height: 210px;}    
  .comentario {min-height: 100px; font-size: 13px;} 
}