#carousel1 { width: 100%; overflow: hidden; height: 220px; position: relative; }
#carousel1 .viewport { float: left; width: 100%; height: 180px; overflow: hidden; position: relative; }
#carousel1 .buttons { display: block; width: 50px; height: 50px; font-size:28px; line-height:1em; float: left; }
#carousel1 .buttons:hover { border: none; }
#carousel1 .prev { background: #DE2A2B; color:#FFFFFF !important; padding:9px 18px !important; position:absolute; left:0; }
#carousel1 .prev:hover { border: none; }
#carousel1 .next { background: #DE2A2B; color:#FFFFFF !important; padding:9px 18px !important; position:absolute; right:0; }
#carousel1 .next:hover { border: none; }
#carousel1 .disable { visibility: hidden; }
#carousel1 .overview { list-style: none; position: absolute; padding: 0; margin: 0; left: 0; top: 0; }
#carousel1 .overview li { float: left; margin: 0px 13px; padding: 0px 0px; background:#FFFFFF }
#carousel1 .overview li img { padding:11px; width: 212px; }

@media only screen
and (min-width: 0px)
and (max-width: 700px) {
#carousel1 .viewport { width: 80%; }
}