/* 
    Document   : tabs-slideshow
    Created on : Apr 5, 2011
    Description:
        Purpose of the stylesheet follows:
        - jquery carousel / slide show
*/

/* container for slides */
.images {
    position: relative;	
    height: 323px;
    width: 618px;
    float: left;
    margin: 10px 0 10px 10px;
}

/* single slide */
.images div {
    display:none;
    position:absolute;
    top:0;
    left:0;		
    margin:0;
    height:343px;
/*    width: 618px;
    padding: 10px 0 10px 10px;*/
}

.images div img, .images div section {
    position: absolute;
}
.images div img {
    z-index: 0;
}
.images div section {
    bottom: 20px;
    z-index: 1;
    width: 598px;
    height: auto;
    background: url(../images/transparent-bg.png) 0 0 repeat;
    padding: 10px;
}
.images div section p {
    padding: 0;
    margin: 0;
    font: normal 0.9em 'Lucida Sans', 'Lucida Grande', Arial;
}
.images div section h1, .images div section h2, .images div section h3, .images div section h4, .images div section h5, .images div section h6 {
    margin: 0 0 10px 0;
    color: #FE8888;/*var*/
    font: bold 1.4em 'Lucida Sans', 'Lucida Grande', Arial;
}
.images div section a {
    color: #B63B3B;/*var*/
}
.images div section a:hover {
    color: #FE8888;/*var*/
}

/* tabs (those little circles below slides) */
.slidetabs {
    margin: 0 auto;
    text-align: center;
    display:inline-block;
    *width: 150px;/* ie hack */
    *float: left;
    padding-bottom: 5px;
}

/* single tab */
.slidetabs a { 
    width:15px; 
    height:15px; 
    margin: 0 4px; 
    float:left; 
    background:url(../images/slide-nav.png) 0 0 no-repeat; 
    display:block;
}
/* mouseover state */
.slidetabs a:hover { 
    background-position:0 -15px;
}
/* active state (current page state) */
.slidetabs a.current { 
    background-position:0 -15px;
}/


/* prev and next buttons */
#slidenav {
    width: auto;
    margin: 0 auto;
    text-align: center;
    *width:210px;
}
.forward, .backward {
    display:inline-block;
    width:27px;
    margin: 0 5px;
    height:27px;
    cursor:pointer;
    *float: left;
}

/* next */
.forward {
    background: url(../images/next-prev.png) 0 0 no-repeat; 
}.backward {
    background: url(../images/next-prev.png) 0 -27px no-repeat;
}

/* disabled navigational button. is not needed when tabs are configured with rotate: true */
.disabled {
    visibility:hidden !important;		
}