﻿/*-- required & default rules --*/


.loading {

position: absolute;
top: 74px;
}

.slide_holder {
height: 220px;
*height: 180px;
overflow: hidden;
position: relative;
text-align: right;
width: 260px;
z-index: 1000;
}
.slide_holder_inner {
height: 220px;
*height: 180px;
left: 7px;
overflow: hidden;
position: absolute;
width: 255px;
z-index: 2000;
}

.slide_holder2 {
text-align: left;
width: 260px;
height: 165px;
*height: 150px;
overflow: hidden;
/*position: absolute;*/
z-index: 1000;
}

.slide_holder_inner2 {
height: 165px;
*height: 150px;
left: 7px;
right: 5px;
overflow: hidden;
/*position: relative;*/
width: 255px;
z-index: 2000;
}

.slide_holder_inner div {
position: absolute;
}
div.slide_holder_inner div.slide div {
position: relative;
}
div.carousel_controls {
background-position: 0 0;
background-repeat: no-repeat;
height: 20px;
width: 235px;
background:#fff; 
border:1px solid #d4d4ca;
z-index: 4000;
margin-top: 150px;
margin-right:10px;
}

div.carousel_controls2 {
background-position: 0 0;
background-repeat: no-repeat;
width: 235px;
background:#fff; 
border:1px solid #d4d4ca;
z-index: 4000;
margin-top: 0px;
margin-right:10px;
}


/*-- for slide buttons --*/

.slide_buttons li:hover, #pause_button, .prev_button, .next_button, #first_button, #last_button {
cursor: pointer;
z-index: 5000;
}
.slide_buttons li span, #pause_button span, .prev_button span, .next_button span, #first_button span, #last_button span, 
.hover_next_button span, .hover_prev_button span, #water_mark span {
margin-left: -10000px;

}
.slide_buttons li, #pause_button, .prev_button, .next_button, #first_button, #last_button, #water_mark {
background-repeat: no-repeat;
overflow: hidden;
top: 5px; float:left;
}
ul.slide_buttons {
padding: 15px 7px 15px 15px;
padding:0;
position: absolute;
left: 60px;
top: -7px;
top:5px;
z-index: 5000;
list-style:none; 
margin:0;
float:left;
vertical-align: baseline;
}
ul.slide_buttons li {
background-image: url('/site images/button.gif');
display: block;
float: right;
height: 9px;
list-style: none;
margin: 0 0 0 3px;
padding: 2px;
width: 10px;
}
ul.slide_buttons li:hover {
}
ul.slide_buttons li#button_selected {
background-image: url('/site images/button_selected.gif');
}
ul.slide_buttons li#button_selected:hover {
}

slide_buttons2 {
padding: 15px 7px 15px 15px;
padding:0;
position: relative;
left: 60px;
top: -7px;
top:5px;
z-index: 7000;
list-style:none; 
margin:0;
float:right;
vertical-align: baseline;
}

.slide_buttons2, .slide_buttons2:visited {
background: url('/site images/button.gif') no-repeat left top;
float:right;
cursor:pointer;
width:11px;
height:11px;
margin: 2px 0 0 3px;
}

.slide_buttons2:hover {
cursor:pointer;
background-image: url('/site images/button_selected.gif');
text-decoration:none;
}

.slide_buttons2_selected, .slide_buttons2_selected:visited {
background: url('/site images/button_selected.gif') no-repeat;
float: right;
height:11px;
list-style: none;
margin: 2px 0 0 3px;
padding: 0px;
width:11px;
}
.slide_buttons button_selected:hover {
}
/*-- first & last buttons --*/

#first_button {
background-image: url('../site images/first.png');
height: 29px;
left: 354px;
width: 34px;
background-position: 0 -36px;
}
#first_button:hover {
background-position: 0 0;
}
#last_button {
background-image: url('../site images/last.png');
height: 29px;
left: 474px;
width: 34px;
background-position: 0 -36px;
}
#last_button:hover {
background-position: 0 0;
}

/*-- end first & last buttons --*/

/*-- next & prev buttons --*/
#nex_prev_buttons {
position: absolute;
left: 0;
z-index: 5000;
}
.next_button {
background: url('/site images/next-btn.gif') no-repeat top center;
height: 13px;
width: 7px;
float:right;
}
.next_button:hover {
background: url('/site images/next-btn-o.gif') no-repeat top center;
}
.prev_button {
/*background-image: url(images/prev.png);*/
background: url('/site images/prev-btn.gif') no-repeat top center;
height: 13px;
width: 7px;
float:right
}
.prev_button:hover {
background: url('/site images/prev-btn-o.gif') no-repeat top center;
}
/*-- end next & prev buttons --*/


/*-- looks like pause button --*/
.pause_button {
background-image: url('../site images/pause.png');
background-position: 0 -36px;
height: 29px;
left: 419px;
width: 24px;
}
.pause_button:hover {
background-position: 0 0;
}
/*-- looks like play button --*/
.paused_button {
background-image: url('../site images/play.png');
background-position: 0 -36px;
height: 29px;
left: 419px;
width: 24px;
}
.paused_button:hover {
background-position: 0 0;
}

/*-- hover next & hoverprev buttons --*/

.hover_next_button, .hover_prev_button {
height: 125px;
background-repeat: no-repeat;
overflow: hidden;
width: 77px;
top: 35px;
z-index: 6000;
}
.hover_next_button span {
}
.hover_next_button {
background-image: url('../site images/hover_next.png');
background-position: 21px 35px;
padding: 30px 0 30px 30px;
right: 0;
}
.hover_prev_button {
background-image: url('../site images/hover_prev.png');
background-position: 8px 35px;
padding: 30px 30px 30px 0;
left: 0;
}

/*-- end next & prev buttons --*/

/*-- rules for slide captions --*/

.slide_captions {
color: #333;
left: 8px;
overflow: visible;
top: 5px;
z-index: 6000;
}
.slide_captions span {
font-family: Tahoma;
font-size: 15px;
height: 20px;
line-height: 20px;
overflow: visible;
}

/*-- end rules for slide captions --*/


/*-- slide number display --*/

.slide_number_display {
background-image: url('../site images/bg_swatch.png');
background-position: 0 0;
background-repeat: no-repeat;
color: #333;
font-family: Arial, Helvetica, sans-serif;
font-size: 15px;
height: 23px;
padding: 4px;
right: 7px;
text-align: center;
top: 208px;
width: 37px;
z-index: 5000;
}

/*-- for carousel view --*/

.row_of_slides {
position: absolute;
top: 0;
}
.row_of_slides .slide {
position: absolute;
padding:0;
width: 245px;
float:right;
}
				
/*-- end for carousel view --*/				

/*-- end number display --*/

/*-- end required & default rules --*/

/*-- example rules --*/
#slide_holder {
float:right; width: 255px;
}

