<article>
  <section class="first">
  <a href="#slider1" class="next">Вперед</a>

  <a href="#slider1" class="prev">Назад</a>
  <div class="slidewrap">
  <ol class="slider" id="slider1">
  <li class="intro">
  <h2>Слайдер 1</h2>
  <div class="copy col-3">
  <p>Контент</p>
  </div>
  </li>
  <li>
  <h2>Слайдер 2</h2>
  <div class="copy col-2">
  <p>Контент</p>
  </div>
  </li>
  </ol>
  </div>
  </section>
   
  <section class="second twothirds">
  <div class="slidewrap">

  <ol class="slider" id="secondSlider">
  <li class="intro">
  <h2>Слайдер 1</h2>
  <div class="copy col-2">
  <p>Контент</p>
  </div>

  </li>
  <li>
  <h2>Сладер 2</h2>
  <div class="copy">
  <p>Контент</p>
  </div>

  </li>
  <li>
  <h2>Слайдер 3</h2>
  <div class="copy">
  <p>Контент</p>
  </div>

  </li>
  </ol>
  </div>
  <ul class="nextprev">
  <li><a href="#secondSlider" class="next">Вперед</a></li>
  <li><a href="#secondSlider" class="prev">Назад</a></li>
  </ul>
  </section>

   
  <section class="third onethird">
  <ul class="nextprev">
  <a href="#hambone" class="next">Вперед</a>
  <a href="#hambone" class="prev">Назад</a>
  </ul>
  <div class="slidewrap">
  <ol class="slider" id="hambone">
  <li class="intro">

  <h2>Слайдер 1</h2>
  <div class="copy">
  <p>Контент</p>
  </div>
  </li>
  <li>

  <h2>Слайдер 2</h2>
  <div class="copy col-2">
  <p>Контент</p>
  </div>
  </li>
  </ol>

  </div>
  </section>
   
</article>

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,  
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

body {
  line-height:1;
  font-size: 62.5%;
  font-family: arial, helvetica, sans-serif;
}

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary {  
  display:block;
}

nav ul {
  list-style:none;
}

blockquote, q {
  quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content:'';
  content:none;
}

a {
  margin:0;
  padding:0;
  border:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  color: #ad2222;
  text-decoration: none;
  -webkit-transition: color .1s linear;
  -moz-transition: color .1s linear;
  -o-transition: color .1s linear;
  transition: color .1s linear;
}
a:hover {
  color: #d92b2b;
}

ins {
  background-color:#ff9;
  color:#000;
  text-decoration:none;
}

mark {
  background-color:#ff9;
  color:#000;  
  font-style:italic;
  font-weight:bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom:1px dotted #000;
  cursor:help;
}

table {
  border-collapse:collapse;
  border-spacing:0;
}

hr {
  display:block;
  height:1px;
  border:0;  
  border-top:1px solid #cccccc;
  margin:1em 0;
  padding:0;
}

input, select {
  vertical-align:middle;
}

body {
  background: url(img/bg.jpg) repeat;
}

article {
  padding: 10px 30px;
}

article.note {
  background: #fff;
  background: rgba(255,255,255, .8);
}

section {
  float: left;
  position: relative;
  padding: 5px;
  margin: 15px 0 0 0;
  background-color: #dddedf;
  background-image: -webkit-gradient(
  linear,  
  0 90%,
  0 100%, from(rgba(255,255,255, .5)), to(#d1d1d1)
  );
  background-image: -moz-linear-gradient(
  top,  
  rgba(250,250,250,.4),  
  rgba(255,255,255,.0)
  );
   
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
  box-shadow: 0 1px 2px rgba(0,0,0,.15);
}
section.twothirds { width: 54%; }
section.onethird { width: 30%; float: right; }

section ol {
  list-style: none;
  background: #fff;
  background: rgba(255,255,255,.9);
}

li {
  padding: 10px 0;
}

.slidewrap {
  border: 1px solid #deddde;
  overflow: hidden !important;
  position: relative;
  width: 100%;
}

.copy, h2 {
  padding: 0 10px;
}

.col-2 {
  -moz-column-count: 2;
  -moz-column-gap: 20px;
  -webkit-column-count: 2;
  -webkit-column-gap: 20px;
  column-count: 2;
  column-gap: 20px;
}

.col-3 {
  -moz-column-count: 3;
  -moz-column-gap: 10px;
  -webkit-column-count: 3;
  -webkit-column-gap: 10px;
  column-count: 3;
  column-gap: 10px;
}

.prev,
.next {  
  display: block;
  text-indent: -9999px;
}

.prev {  
  background-image: url(img/icon_left.gif);
  background-position: center center;
  background-repeat: no-repeat;  
}
.next {
  background-image: url(img/icon_right.gif);
  background-position: center center;
  background-repeat: no-repeat;
}

.first { position: relative; width: 100%; padding: 5px 0; }
.first .slidewrap { width: 92.6%; margin: 0 auto; }

.first .prev,
.first .next {
  float: left;
  position: absolute;
  top: 50%;
  margin: -50px 0 0 0;
  width: 3.5%;
  height: 100px;
  display: block;
}
.first .prev { left: 0; background-position: 60% 50%; }
.first .next { right: 0; background-position: 40% 50%; }

.second .nextprev { padding: 8px 0 4px 0; clear: both; float: left; width: 100%; }
.second .nextprev li { display: inline; }

.second .prev,
.second .next {
  display: block;
  width: 15px;
}
.second .prev { float: left; }
.second .next { float: right; }

.third .nextprev {
  position: absolute;
  left: -30px;
  top: 0px;
  background-color: #dddedf;
  background-image: -webkit-gradient(
  linear,  
  0 90%,
  0 100%, from(#dddedf), to(#d1d1d1)
  );
  background-image: -moz-linear-gradient(
  top,  
  rgba(250,250,250,.4),  
  rgba(255,255,255,.0)
  );
  -webkit-border-top-left-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -moz-border-radius-bottomleft: 3px;
  border-radius: 3px 0 0 3px;
  -webkit-box-shadow: -1px 0 2px rgba(0,0,0,.15);
  -moz-box-shadow: -1px 0 2px rgba(0,0,0,.15);
  box-shadow: -1px 0 2px rgba(0,0,0,.15);
}
.third .next,
.third .prev {
  display: block;
  height: 25px;
  width: 25px;
  margin-left: 5px;
}

.third .next { border-bottom: 1px solid #d1d1d1; }
.third .prev { border-top: 1px solid #ededed; background-position: 7px center; }

h2 {
  font-size: 1.3em;
}

p {  
  font: 1.2em/1.4 arial, helvetica, sans-serif;
  padding: 5px 0;
}

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script src="js/plugin.js" type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function() {
  $('.slidewrap').carousel({
  slider: '.slider',
  slide: 'li',
  nextSlide: '.next',
  prevSlide: '.prev',
  speed: 300 // ms.
  });  
  });
</script>