/*-------------- main ---------------*/
#main {
	background: #ffffff;
	border-radius: 5px;
	border: 1px solid #cecece;
	height: 198px;
	width: 202px;
}

/*-------------- nanoscroller ---------------*/
.nano {
  position : relative;
  width    : 100%;
  height   : 100%;
  overflow : hidden;
}
.nano .content {
  position: absolute;
  overflow: scroll;
  overflow-x: hidden;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.nano > .pane {
  background: rgba(0,0,0,.25);
  position: absolute;
  width: 10px;
  right: 0;
  top: 0;
  bottom: 0;
  /*visibility: hidden\9;  Target only IE7 and IE8 with this hack */
  visibility: hidden;
  opacity: .01; 
  /*transition: 1s;*/
  border-radius: 5px;
}
.nano > .pane > .slider {
  background: rgba(0,0,0,.9);
  position: relative;
  margin: 0 1px;
  border-radius: 3px;
}
.nano:hover > .pane, .pane.active, .pane.flashed {
  /*visibility: visible\9;  Target only IE7 and IE8 with this hack */
	visibility: visible; /* Target only IE7 and IE8 with this hack */
	opacity: 0.77;
}

/*-------------- nano ---------------*/
.nano .content { 
	padding: 0;
}

.nano .pane {
	background: #555;
	width: 8px;
	right: 1px;
  	margin: 5px;
}