BOX INFO & Scroll modificado

<div class="wrap-box" style=">
<div class="inner">
<div class="h1-bg">Titulo<a href="#"><img src="http://img.webme.com/pic/a/artattack-web/agrandar.png" id="extender" alt="Extender imagen"></a></div>
<div class="porta"><img src="http://img.webme.com/pic/a/artattack-web/paisaje.jpg" id="portada" alt="">
<div class="box-right">
<p>Información</p>
</div>
</div>
</div>
</div>

/* artattack-web.es.tl */
.wrap-box {
background: #EFEEEE;
width: 550px;
border-radius: 10px;
border: 13px solid #DDD;
height: 220px;
margin: 0 auto;
}
.h1-bg {
background: #DDD;
width: 514px;
padding-bottom: 10px;
margin: 10px auto;
padding-top: 10px;
padding-left: 15px;
font-size: 18px;
border-radius: 5px;
}
.porta {
background: #DDD;
width: 514px;
height: 125px;
padding-bottom: 10px;
margin: 10px auto;
padding-top: 10px;
padding-left: 15px;
font-size: 18px;
border-radius: 5px;
}
#extender {
float: right;
position: relative;
bottom: 1px;
border-radius: 5px;
margin-right: 10px;
background: #CCC;
padding-bottom: 5px;
padding-top: 5px;
padding-right: 5px;
padding-left: 5px;
}
#portada {
height: 100%;
float: left;
}
.box-right {
font-size: 13px;
padding-left: 10px;
float: left;
padding-right: 5px;
background: #F1F1F1;
width: 281px;
height: 126px;
margin-left: 17px;
overflow: auto;
}
.box-right::-webkit-scrollbar {
width: 6px;
height: 6px;
border: none;
background: #D1D1D1;
}
.box-right::-webkit-scrollbar-.box-right-piece {
border: none;
position: absolute;
padding: 0;
box-shadow: none;
background: #000000;
border-radius: 30px;
}
.box-right::-webkit-scrollbar-thumb:vertical {
background-color: #A7A7A7;
border-radius: 30px;
border: none;
}
.box-right::-webkit-scrollbar-thumb:horizontal {
background-color: #A7A7A7;
border-radius: 30px;
border: none;
}