/*-- required & default rules --*/

.loading {
    left: 210px;
    position: absolute;
    top: 74px;
}
#header,
#footer {
    width:888px;
    margin:0 auto;
}
#mycarousel p {
    color:#ffffff;
}
#slide_1 {
    display:block !important;
}
#slide_holder {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/backgrounds/bg_slideshow.png);
    background-repeat: no-repeat;
    height: 307px;
    overflow: hidden;
    position: relative;
    text-align: left;
    width: 880px;
    margin:0 auto;
    /* -- width: 1533px; */
    z-index: 1000;
}
#slide_holder_inner {
    height: 276px;
    left: 7px;
    overflow: hidden;
    position: absolute;
    top: 8px;
    width: 867px;
    z-index: 2000;
}

/*take the tour*/
#slide_holder_inner a.takeTheTour{
    position:absolute;
    z-index: 200;
    right:47px;
    bottom:74px;
    background:url(http://www.mimecast.com/mc/mimecast/images/buttons/takeTheTour.png) 0 0 no-repeat;
    display:block;
    height:30px;
    width:147px;}
#slide_holder_inner a.takeTheTour:hover{
    background-position:0 -46px;}
#slide_holder_inner a span{
    display:block;
    text-indent:-999em;}

.tour_button {
    border:3px solid red;
    width:200px;
    height:30px;
    position:absolute;
    top:30px;
    left:140px;
}
/*-- for slide divs --*/

#slide_holder_inner div {
    position: absolute;
}
/*-- for divs in html slides to position relative --*/
div#slide_holder_inner div.slide div {
    position: relative;
}
div#carousel_controls {
    /* background-image: url(images/bg_controls.png);
background-position: 0 0;
background-repeat: no-repeat; */
height: 290px;
    width: 870px;
}
/*-- for slide buttons --*/

#slide_buttons li:hover,
#pause_button,
.prev_button,
.next_button,
#hover_next_button,
#hover_prev_button,
#first_button,
#last_button {
    cursor: pointer;
    cursor: hand;
    z-index: 5000;
}
#carousel_controls #button_selected,
#carousel_controls .prev_button_disabled,
#carousel_controls .next_button_disabled,
#carousel_controls .first_button_diabled,
#carousel_controls .last_button_disabled {
    cursor: auto;
}
#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: 0px;
}
ul#slide_buttons {
    padding: 0 0 15px 0;
    position: absolute;
    left: 390px;
    bottom: 0;
    z-index: 5000;
}
ul#slide_buttons li {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/button.png);
    display: block;
    float: left;
    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(http://www.mimecast.com/mc/mimecast/images/buttons/button_selected.png);
}
ul#slide_buttons li#button_selected:hover {
}
/*-- first & last buttons --*/

#first_button {
    background-image: url(http://www.mimecast.com/mc/mimecast/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(http://www.mimecast.com/mc/mimecast/images/buttons/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-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/next.png);
    background-position: 0 -36px;
    height: 29px;
    left: 443px;
    width: 31px;
}
#next_button:hover {
    background-position: 0 0;
}
#prev_button {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/prev.png);
    background-position: 0 -36px;
    height: 29px;
    left: 388px;
    width: 31px;
}
#prev_button:hover {
    background-position: 0 0;
}
/*-- end next & prev buttons --*/


/*-- looks like pause button --*/
.pause_button {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/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(http://www.mimecast.com/mc/mimecast/images/buttons/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;
    display: none;
    overflow: hidden;
    width: 77px;
    top: 35px;
    z-index: 6000;
}
#hover_next_button span {
}
#hover_next_button {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/hover_next.png);
    background-position: 21px 35px;
    padding: 30px 0 30px 30px;
    right: 0;
}
#hover_prev_button {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/buttons/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: 20px;
overflow: visible;
top: 65px;
z-index: 6000;
width:465px;
text-align:right;
}
#slide_captions span {
}
#slide_captions h2 {
    color: #061c4b;
	font-family:Arial, Helvetica, sans-serif;
	font-size:23px;
	padding:0;
	margin-bottom:15px;
	width:465px;
	line-height:23px;
}
#slide_captions p {
    color: #333333;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	line-height:18px;
	font-weight:normal;
	padding:0;
	margin:0;
	width:465px;
	text-align:right;
}
/*-- end rules for slide captions --*/

/*-- rules for watermark --*/
/*
#water_mark {
background-image: url(images/water_mark.png);
height: 30px;
left: 202px;
width: 246px;
top: 208px;
z-index: 6000;
}

#water_mark span {
}
*/
/*-- end rules for slide captions --*/

/*-- slide number display --*/

#slide_number_display {
    background-image: url(http://www.mimecast.com/mc/mimecast/images/bg_swatch.png);
    background-position: 0 0;
    background-repeat: no-repeat;
    color: #333;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    height: 23px;
    padding: 4px;
    right: 7px;
    text-align: center;
    top: 208px;
    width: 37px;
    z-index: 5000;
}
/*-- for carousel view --*/


#row_of_slides .slide {
    display: none;
    position: absolute;
}
/*-- end for carousel view --*/				

/*-- end number display --*/

/*-- end required & default rules --*/

/* remember to define focus styles! */
:focus {
    outline: 0;
}
/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}
.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}
.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}
.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 124px;
    height: 85px;
    padding:10px 0 10px 10px;
}
.jcarousel-list li img {
    float:left;
    /*margin-right:10px;*/
}
.jcarousel-list li div {
    float:left;
    width:219px;
    text-align:left;
}
/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}
.jcarousel-prev {
    z-index: 3;
    display: none;
}
.jcarousel-skin-tango {
   /* margin: 0 5px;*/
}
