.carrossel { position: relative; }
.carrossel h3 { font-weight: bold; font-style: italic; }

.jcarousel { width: 100%; margin: 60px auto; position: relative; overflow: hidden; }
.jcarousel .img { width: 100%; max-width: 150px; height: auto; margin: 0 auto; }
.jcarousel .img img { width: 100%; height: auto; }
.jcarousel ul { width: 10000em; position: relative; list-style: none; margin: 0; padding: 0; }
.jcarousel li>div { width: 100%; }

/** Carousel Controls **/
.jcarousel-control-prev,
.jcarousel-control-next {
    position: absolute;
    top: 240px;
    width: 30px;
    height: 30px;
    text-align: center;   
}

.jcarousel-control-prev { left: 10px; }
.jcarousel-control-next { right: 10px; }

.jcarousel-control-prev:hover span,
.jcarousel-control-next:hover span {
    display: block;
}

.jcarousel li { float: left; width: 320px; padding: 0 65px 0 65px; }

.destaques { display: block; width: 100%; max-width: 1980px; height: 370px !important; } /*Sempre 32px de diferença do height na linha abaixo*/
.destaques>img { width: 100%; max-width: 1980px; height: 402px; position: absolute; z-index: 0;}
.destaques .carroussel { position: relative; width: 70%; z-index: 1; float: right; margin-top: 40px;}
.destaques .jcarousel { margin: 0 auto; width: 90%; }
.destaques .jcarousel-control-prev, .destaques .jcarousel-control-next { margin: 0 auto; top: 0; margin-top: 90px; }
.destaques .jcarousel-control-next { right: 30px; }
.destaques .jcarousel-control-prev { left: 30px; }
.destaques .jcarousel li { padding: 0 65px 0 65px; }

.carroussel-3 { margin-top: 90px; }

.controls { width: 100%; padding-bottom: 10px; min-height: 40px; }
.controls img { cursor: pointer; }

@media(max-width: 374px){
    .destaques .carroussel { width: 100%; float: none; }
    .destaques .jcarousel li { width: 280px; }
}

@media(min-width: 375px) and (max-width: 600px){
    .jcarousel li { float: left; width: 380px; }

    .destaques .carroussel { width: 100%; float: none; }
    .destaques .jcarousel li { width: 340px; }
}

@media(min-width: 768px) and (max-width: 1024px){
    .jcarousel li { float: left; width: 240px; }
}

@media(min-width: 1024px){
    .jcarousel li { float: left; width: 320px; }
}

@media(min-width: 1025px){
    .jcarousel li { float: left; width: 280px; }
    .destaques .jcarousel li { float: left; width: 280px; }
}