/* Scroll Bar Master Styling Starts Here */

/* All comments can be freely removed from the css */



/*

Your custom scrollbar images do not need to have the same size as in example images, but the 

placement of the images with respect to eachother in the image may play an important role

as some elements are auto-sized by fleXcroll. You do not need to define images for

all elements, you may want to have some transparency, or simply a filled color without

using an image. The example images in this archive is optimized for the least number of http calls,

only 2 images are needed for full operation, but you may have separate images

for each element or make different group combinations in the images, or simply have a color

defined for horizontal scrollbar and horizontal scrollbase, and get away with a single image

for vertical bar if you will only use vertical scrollbars.

*/





/* Basic styling with no images starts here */



/* IMPORTANT:

Note that, even if you are not expecting to use horizontal scrollbars,

you should at least define colors for it, e.g. you never know what font size

your users will force on the page

*/



/* .scrollgeneric is required for proper scrollbar display,

not for user customization, and is mandatory*/

.scrollgeneric {

line-height: 1px;

font-size: 1px;

position: absolute;

top: 0; left: 0;

}



/* For scrollbars, defining a color for background alongside with an image 

is always a good idea, this way the scrollbars are visible until images load */

.vscrollerbase {

/* vscrollerbase is the div that holds the scrollbar (parent of vscrollerbar) */

width: 8px;

}



.vscrollerbar {

width: 8px;



}



.vscrollerbar {

/* Main body of vertical scrollbar */

background:#0e3879;

-moz-border-radius: 10px;

    -webkit-border-radius: 10px;

    border-radius: 10px;

/* IE10 Consumer Preview */ 

background-image: -ms-radial-gradient(center top, ellipse farthest-corner, #eb5c58 0%, #c92724 100%);



/* Mozilla Firefox */ 

background-image: -moz-radial-gradient(center top, ellipse farthest-corner, #eb5c58 0%, #c92724 100%);



/* Opera */ 

background-image: -o-radial-gradient(center top, ellipse farthest-corner, #eb5c58 0%, #c92724 100%);



/* Webkit (Safari/Chrome 10) */ 

background-image: -webkit-gradient(radial, center top, 0, center top, 561, color-stop(0, #eb5c58), color-stop(1, #c92724));



/* Webkit (Chrome 11+) */ 

background-image: -webkit-radial-gradient(center top, ellipse farthest-corner, #eb5c58 0%, #c92724 100%);



/* W3C Markup, IE10 Release Preview */ 

background-image: radial-gradient(ellipse farthest-corner at center top, #eb5c58 80%, #c92724 100%);

}



.vscrollerbar{

/*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

The greater the padding, the further away the scrollbar

stops away frosm both ends. This may be used, for example,

to provide space for our "faux" arrow heads.

*/

padding:0px;



/* z-index for scrollbars define the z-index for the content, if left at

"auto" or "0", they are set to "2", if defined, content z-index is set the

same as the scrollbars. Version 1.7.5 and higher does not need this setting

to function properly, earlier versions need this for proper operation */

z-index: 2;

}



.vscrollerbarbeg {

/* Top image holder for vertical scrollbar*/

/*background: url(basebarcaps_verticalbarbody.png) -45px -30px no-repeat;

*/width: 8px;

/* Height of this class is normally set by the script, to fit the scrollbar, but Webkit (Safari's rendering

engine) currently has a bug on no-repeat for negatively positioned backgrounds, causing the top

image to repeat on certain sizes. In this style, we do not need our script to strech the

vscrollerbarbeg, so we can fix the problem by forcing the size using CSS with an !important decleration: */

height: 8px !important;

}



/* .vscrollerbarend {

Bottom image holder for vertical scrollbar

background: url(basebarcaps_verticalbarbody.png) -45px 0px no-repeat;

width: 15px;

height: 15px;

}*/









/* Following are for scrollbase images, may not always be required */



.vscrollerbase {

/* Vertical scrollbar's base body */ 

background:#b2aea3;outline:none;-moz-border-radius: 10px;

    -webkit-border-radius: 10px;

    border-radius: 10px;

}



.vscrollerbasebeg {

/* Vertical scrollbar's base top-cap */

/* This may be used for holding the up arrow */

background: url(basebarcaps_verticalbarbody.png) -30px -30px no-repeat;

width: 10px;

/* height of this element is normally auto set by the script to fit the scrollbase, to cover the base... */

height: 2px !important; /*  Safari BG repeat fix */

}



/*.vscrollerbaseend {

 Vertical scrollbar's base bottom-cap */

/* This may be used for holding the down arrow 

background: url(basebarcaps_verticalbarbody.png) -60px -30px no-repeat;

height: 15px;

width: 15px;

}*/







/* Scroll Bar Master Styling Ends Here */