.home2 {
    background-image:url(img/001.jpg);
    background-repeat: no-repeat;
    background-position: center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    min-height:200px;
    max-width:1200px;
    overflow:none;
    }
body {
     background-image:url(img/curtains.png);
     background-size:cover;
     background-repeat:no-repeat;
     background-position:top center;
     width:100%;
     height:100%;
     margin:0;
     padding:0;
     position:relative;
     z-index:-1;
     padding-top:30px;
 }

figure#wheel-wrap {
    position:relative;
    margin:0 auto;
    top:50%;
    width: 100%;
    height: auto;
    overflow: hidden;
}

#wheel {
    width: 50%;
    height:auto;
    position:relative;
    overflow:hidden;
    float:left;
}

#wheel img{
    left: 0px;
    width: 100%;
    height:auto;
    position:relative;
}

#leftarrow {
    position: relative;
    width: 25%;
    height: auto;
    overflow: hidden;
    float:left;
}
#leftarrow img{
   width:100%;
}
#leftarrow:hover{
   cursor: pointer;
}

#rightarrow {
    position: relative;
    float:left;
    width: 25%;
    height: auto;
    overflow: hidden;
}
#rightarrow img{
       width:100%;
}
#rightarrow:hover{
   cursor: pointer;
}

<div class="container">
<div class="row">
<div class="col-lg-12 col-sm-12">
<div class="home2" style="min-height:500px;">

<figure id="wheel-wrap">
        <div id="leftarrow">
       <img src="http://www.bluetabby.net/rr/img/leftarw.png" width="100%">
      </div>
    <div id="wheel">
   <img id="wheel2" src="http://www.bluetabby.net/rr/img/pie.png"  usemap="#Pie" />
  </div>
    <img class="marker" src="http://bluetabby.com/rr/img/marker.png" />
 <div id="rightarrow">
<img src="http://www.bluetabby.net/rr/img/rtarw.png" width="100%"></div>
</figure>

</div>