/* --- module: effects slide --- */

/* default (dummy) */
#effectsSlide.default {
	background-image: url(../../images/pages/slider_img_default.jpg);
}
#effectsSlide.default .image {
	width: 767px;
	height: 329px;
}

/* default (the real thing) */
#effectsSlideBox {
	margin: 0px auto;
	background-color: #f5f5f5;
	position: relative;
}
#effectsSlideBox, #effectsSlide, #effectsSlide .effectsSlideItem, #effectsSlide .slideLink, #effectsSlide .effectsSlideItem {
	width: 767px; /* default width -> see "#effectsSlide .modTeaser" for content width */
}
#effectsSlide, #effectsSlide .effectsSlideItem, #effectsSlide .slideLink {
	height: 329px; /* default height */
}
#effectsSlide .slideLink {
	display: block;
}
#effectsSlide {
	position: relative; 
	overflow: hidden; 
	clear: both;
}
#effectsSlide .effectsSlideWrapper {
	width: 20000px; /* required */
	position: absolute; /* required */
}
#effectsSlide .effectsSlideItem {
	background-repeat: no-repeat !important;
	background-position: center !important;
	float: left;
	position: relative; /* vertical align bottom */
}


/* item style
---------------------------------------------------- */
#effectsSlide .modTeaser {
	background-image: url(../../images/pages/effects_slide_bkg_text.png);
	background-repeat: repeat-y;
	position: absolute; /* vertical align bottom */
	bottom: 0px; /* vertical align bottom */
	right: 0px;
	padding: 17px 32px 19px 40px;
	width: 520px; /* width of #effectsSlide minus padding */
	color: #ffffff;
	text-align: right;
	min-height: 99px;
}
#effectsSlide .modTeaser h1 {
	padding: 0px 0px 15px 0px;
}
#effectsSlide .modTeaser h1,
#effectsSlide .modTeaser h2,
#effectsSlide .modTeaser h3,
#effectsSlide .modTeaser h4,
#effectsSlide .modTeaser h5,
#effectsSlide .modTeaser h6  {
	color: #ffffff;
	font-family: 'Open Sans', sans-serif;
	display: block;
	text-transform: uppercase;
}
#effectsSlide .modTeaser a {
	color: #ffffff;
	text-decoration: underline;
}
#effectsSlide .modTeaser a:hover {
	color: #ffffff;
	text-decoration: none;
}

/* navigation style: arrows only
---------------------------------------------------- */

#effectsSlideNavigation .prev, #effectsSlideNavigation .next {
	width: 25px;
	height: 25px;
	display: block;
	margin: -177px 0px 0px 0px;
	float: left;
	position: relative;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: center;
}
#effectsSlideNavigation .prev {
	margin-left: 10px;
	background-image: url(../../images/pages/effects_slide_arrow_prev.png);
}
#effectsSlideNavigation .next {
	margin-right: 10px;
	background-image: url(../../images/pages/effects_slide_arrow_next.png);
	float: right;
}


/* navigation style: with arrows and numbers
---------------------------------------------------- */
#effectsSlideNavigation .navi {
	position: absolute;
	top: 10px;
	right: 10px;
}
#effectsSlideNavigation .navi a {
	float: left;
	opacity: 0.5;
	width: 10px;
	height: 10px;
	display: block;
	overflow: hidden;
	background-color: #ffffff;
	margin: 0px 0px 0px 3px;
}
#effectsSlideNavigation a.active {
	background-color: #669390;
	opacity: 1;
}


