@charset "utf-8";
/* CSS Document */
#flex, #flex2, #flex3, #flex4, #flex5, #flex6 {
background: none;
overflow: auto;
margin: 50px 0 0 0;
padding: 0;
/*IE overflow fix, position must be relative or absolute*/
position: absolute;
/*if you do not want the outline when focused on firefox and IE
use outline: none;, though not recommended as this may confuse
people who likes to do keyboard navigation */
outline: none;
width: 445px;
height: 390px;
}

#flex p, #flex2 p, #flex3 p, #flex4 p, #flex5 p, #flex6 p {
cursor: text;
}
/* general page style ends here */

/* Scroll Bar Master Styling Starts Here */

.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
}

.vscrollerbase, .vscrollerbar {
width: 10px;
top: 0;
}

.vscrollerbar {
left: 0;
}

.hscrollerbase, .hscrollerbar {
height: 10px;
left: 0;
}

.hscrollerbar {
top: 0;
}

.vscrollerbar, .hscrollerbar {
/*padding information of these elements are only used for
padding of the scroll-bar with respect to the scroll base,
the padding will automatically be turned off by the script*/
padding: 0;
/* z-index for scrollbars no longer has to be given as of version
1.7.5 for correct operation, but it is still recommended, as this
decides the z-index for content.*/
z-index: 2;
}

/* Extra */
#flex .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex .vscrollerbar {
background: none;
padding: 0;
}

#flex .vscrollerbasebeg, #flex .vscrollerbaseend {
background: none;
}

/* Extra */
#flex2 .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex2 .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex2 .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex2 .vscrollerbar {
background: none;
padding: 0;
}

#flex2 .vscrollerbasebeg, #flex2 .vscrollerbaseend {
background: none;
}

/* Extra */
#flex3 .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex3 .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex3 .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex3 .vscrollerbar {
background: none;
padding: 0;
}

#flex3 .vscrollerbasebeg, #flex3 .vscrollerbaseend {
background: none;
}

/* Extra */
#flex4 .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex4 .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex4 .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex4 .vscrollerbar {
background: none;
padding: 0;
}

#flex4 .vscrollerbasebeg, #flex4 .vscrollerbaseend {
background: none;
}

/* Extra */
#flex5 .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex5 .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex5 .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex5 .vscrollerbar {
background: none;
padding: 0;
}

#flex5 .vscrollerbasebeg, #flex5 .vscrollerbaseend {
background: none;
}

/* Extra  */
#flex6 .vscrollerbarbeg {
background: url(scroller-round.png) 0 -9px;
width: 14px;
height: auto;
cursor: pointer;
}

#flex6 .vscrollerbarend {
background: url(scroller-round.png) repeat;
width: 14px;
height: 9px;
}

#flex6 .vscrollerbase {
width: 14px;
background: url(scroller-bg.png) repeat-y;
}

#flex6 .vscrollerbar {
background: none;
padding: 0;
}

#flex6 .vscrollerbasebeg, #flex6 .vscrollerbaseend {

background: none;
}