/* 

jFlow Plus Demo CSS 

Description: Demonstation CSS for jFlow Plus
Creator: Devin Walker
Date: July 29, 2010


*/


.slide img{
    width: 618px;
    height: 308px;
}
#container {
	width: 700px;
	height: 200px;
	position: relative;
	border-top: 5px solid #999;
	border-bottom: 5px solid #999;
	margin: 0 auto;
}

#slide1 span, #slide2 span, #slide3 span {
	background: url("../img/contentBg.png") repeat top left transparent;
	position: absolute;
	bottom: 20px;
	right: 20px;
	padding: 10px;
}

#slide1 h3, #slide2 h3, #slide3 h3 {
	font-family: Georgia, serif;
	color: #FFF;
	font-size: 35px;
	font-style: italic;
	margin: 0 0 10px 0;
}


.slideContent img{
    width:300px;
    border: none;
    height:130px;
    position:absolute;
    left:0;
    top:50%;
    margin-top:-65px;
}

.slideContent p a{
    text-decoration: underline;
    color: #333;
    font-family: Verdana, sans-serif;
    font-style:normal;
    font-size: 12px;
}
.slideContent p{
    margin: 0;
    color: #fff;
    font-family: Verdana, sans-serif;
    z-index: 100;

    padding-bottom: 5px;
    position: relative;
    line-height: 100%;
}


.slide-heading{
    font-size: 24px;
}

.slide-text{
    font-size: 12px;
}

.slide-href{
}

.slideContent {
    margin-top: -85px;
background: rgba(0,0,0,0.5);
height: 186px;
display: block;
width: 100%;
z-index: 412;
position: relative;
padding-top: 10px;}

#jFlowSlider{
    float: left;
}

.jFlowSlideContainer a {
	color: #F90;
	text-decoration: none;
	font-style: italic;
}

.jFlowSlideContainer a:hover {
	text-decoration: none;
	/*border-bottom: 1px dotted white;*/
}

.jFlowSlideContainer a:focus {
	position: relative;
	top: 1px;
}

.jFlowNext  {
	background:url("../../../img/arrows.png") no-repeat scroll 0 -28px transparent;
	height:140px;
	margin-top: 85px;
	width:40px;
    float: left;
	cursor:pointer;
}

.jFlowPrev  {
	background:url("../../../img/arrows.png") no-repeat scroll -93px -28px transparent;
	height:140px;
	float: left;
    margin-top: 85px;
	width:40px;
	cursor:pointer;
}

.jFlowPrev:hover {
	background-position: -93px -228px;
}

.jFlowNext:hover {
	background-position: 0px -228px;
}

#myController{
    position: absolute;
    top: 5px;
    right: 45px;
}

.jFlowControl { background:url("../../../img/bullet.png") no-repeat scroll -3px 0px transparent;  float: left; width: 24px; height: 24px;}

.jFlowControl:hover { background-position: -29px 0px; cursor: pointer; }

.jFlowSelected, .jFlowSelected:hover {background-position: -55px 0px;   }

.slideContent a{
    margin: 0;
    color: #fff;
    font-family: Verdana, sans-serif;
    z-index: 100;
    padding-left: 10px;
 
    padding-bottom: 5px;
    position: relative;
    line-height: 100%;
    display: inline-block;
}
#jFlowSlider{
    border: 1px solid #fff;
    border-radius:5px;
    width:620px;
}