/* CSS Document */
#jSlideDiv1{
  width:185px;
  margin:0px auto;
}

#jSlideDiv1 .carousel{
    padding: 0px;
    margin: 0px;
    position: relative;
	overflow:hidden;
}

    #jSlideDiv1 .carousel button { /*Don't remove this. we still use this for individual demos. only the front pages use images as of now*/
        float: left;
    }              
    #jSlideDiv1 .carousel a.prev, #jSlideDiv1 .carousel a.next {
        display: block;
        float: left;
        width: 14px;
        height: 60px;
        text-decoration: none;
        background: url("../images/demo_arrow_left.gif") left 30px no-repeat;
    }
        #jSlideDiv1 .carousel a.next {
            background: url("../images/demo_arrow_right.gif") right 30px no-repeat;
        }
            #jSlideDiv1 .carousel a.next:hover {
                background-image: url("../images/demo_arrow_right.gif");
            }
            #jSlideDiv1 .carousel a.prev:hover{
                background-image: url("../images/demo_arrow_left.gif");
            }    
            #jSlideDiv1 .carousel a:hover, #jSlideDiv1 .carousel a:active{
                border: none;
                outline: none;
            }                 
    #jSlideDiv1 .carousel .jCarouselLite{
        border: 0px;
        float: left;
        background-color: #fff;
        
        /* Needed for rendering without flicker */
        position: relative;
        visibility: hidden;
    }


/* SEC */
#jSlideDiv2{
  width:185px;
  margin:0px auto;
}

#jSlideDiv2 .carousel2{
    padding: 0px;
    margin: 0px;
    position: relative;
	overflow:hidden;
}

    #jSlideDiv2 .carousel2 button { /*Don't remove this. we still use this for individual demos. only the front pages use images as of now*/
        float: left;
    }              
    #jSlideDiv2 .carousel2 a.prev, #jSlideDiv2 .carousel2 a.next {
        display: block;
        float: left;
        width: 14px;
        height: 60px;
        text-decoration: none;
        background: url("../images/demo_arrow_left.gif") left 30px no-repeat;
    }
        #jSlideDiv2 .carousel2 a.next {
            background: url("../images/demo_arrow_right.gif") right 30px no-repeat;
        }
            #jSlideDiv2 .carousel2 a.next:hover {
                background-image: url("../images/demo_arrow_right.gif");
            }
            #jSlideDiv2 .carousel2 a.prev:hover{
                background-image: url("../images/demo_arrow_left.gif");
            }    
            #jSlideDiv2 .carousel2 a:hover, #jSlideDiv2 .carousel2 a:active{
                border: none;
                outline: none;
            }                 
    #jSlideDiv2 .carousel2 .jCarouselLite2{
        border: 0px;
        float: left;
        background-color: #fff;
        
        /* Needed for rendering without flicker */
        position: relative;
        visibility: hidden;
    }