@charset "UTF-8";

/* -------------------------------------------------------------------------- *\
The style for the slideshow code.

The HTML structure for the slideshow is such:
	The slideshow is contained in a div, called #feature-slider
	Each slide is a div called .slider-slide
	Each slide is composed of an image (.slider-image-container)
		and a heading (.slider-heading-container)
		
		The image container holds the slide image (and a link if one is
			specified for the slide)
			
		The heading container holds the two lines of text per slide
			h1.news-item-heading is the 'title' and may contain a link.
			h2.news-item-summary is the image summary and may contain a link.
			
			
To use images of a different dimension, set the following options:
	image height and width in #feature-slider
	image height and width in #feature-slider .slider-slide.
	margin-bottom to the negative image height in #feature-slider .slider-slide

The position of the slide text is set by horizontal padding, and absolute positioning
	The padding is on .news-item-heading and .news-item-summary
	The vertical positioning is on .slider-heading-container 
  
\* -------------------------------------------------------------------------- */


/* --- Slider container and slide style ------------------------------------- */
#feature-slider {

	/* Customizable options: */
	background-color: black; /* Fade through this color */
	height: 325px; /* Image dimensions */
	width: 480px;
	margin: 0 0 10px 10px;
	
	/* Non-customizable */
	position: relative;
	padding: 0;
	font-size: 16px;
	float: right;
}

#feature-slider .clear {
	height: 0px;
	line-height: 0px;
	font-size: 0px;
	visibility: hidden;
}

#feature-slider .slider-slide {
	
	/* Customizable: */
	background-color: black; /* Only relevant if image is transparent */
	height: 325px; /* Image dimensions */
	width: 480px;
	margin-bottom: -325px; /* Set to - image height */
	
	/* Non-customizable */
	position: relative;
	z-index: 10;
}
#feature-slider .slider-slide.inactive {
}
#feature-slider .slider-slide.active {
}

/* --- Slide Headers -------------------------------------------------------- */

#feature-slider .slider-slide .slider-image-container {
	width: 100%;
	height: 100%;
}

#feature-slider .slider-slide .slider-image-container a img {
	width: 100%;
	height: 100%;
	border: none;
}

#feature-slider .slider-slide .slider-heading-container {
	/* Customizable: */
	bottom: 28px; /* How far off the bottom edge are the text elements?  Allow room for padding */
	height: 41px; /* The total height of the two text lines (add up height,padding on .news-item-heading and .news-item-summary) */
	
	/* Non-customizable */
	width: 100%;
	position: absolute;
}
#feature-slider .slider-slide .slider-heading-container .news {
	display: none;
}
/* The top line of text on each slide */
#feature-slider .slider-slide .slider-heading-container .news-item-heading {
	/* Customizable */
	padding: 4px 30px; /* 30px from the edge, and a little vertical space */
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	font-family: Verdana, serif;
	text-align: right;
	
	line-height: 18px; /* Set to font-size + 4px */
	height: 18px; /* Same as line-height */
	
	/* Non-customizable */
	margin: 0 !important;
}
#feature-slider .slider-slide .slider-heading-container .news-item-heading,
	#feature-slider .slider-slide .slider-heading-container .news-item-heading a {
	
	color: white; /* Colour of the top line of text */
}
/* The bottom line of text on each slide */
#feature-slider .slider-slide .slider-heading-container .news-item-summary {
	/* Customizable */
	padding: 0 30px; /* 30px from the edge */
	font-size: 12px;
	font-style: italic;
	font-weight: normal;
	font-family: Verdana, sans-serif;
	text-align: right;
	
	line-height: 15px; /* Set to font-size + ~4px */
	height: 15px; /* Same as line-height */
	
	/* Non-customizable */
	margin: 0 !important;
}
#feature-slider .slider-slide .slider-heading-container .news-item-summary,
	#feature-slider .slider-slide .slider-heading-container .news-item-summary a {
	
	color: white; /* Colour of the bottom line of text on each slide */
}
#feature-slider .slider-slide .slider-heading-container a {
	text-decoration: none; /* Disable underlines/borders for all links */
}

/*
The button bar is turned off, no further customizations below this.
*/

/* --- Slider button bar ---------------------------------------------------- */
#feature-slider .slider-button-container {
	position: relative;
	z-index: 20;
	margin-top: 290px;
	padding: 0 20px;
	height: 35px;
	font-size: 14px;
	
	display: none;
}

#feature-slider .slider-button-container ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#feature-slider .slider-button-container ul li {
	float: right;
	margin: 7px 1px 7px 2px;
	background-color: #666;
}
#feature-slider .slider-button-container ul li a {
	display: block;
	width: 9px;
}
#feature-slider .slider-button-container ul li a:hover,
	#feature-slider .slider-button-container ul li.active {
	background-color: red;
}

#feature-slider .slider-button-container a {
	text-decoration: none;
}

#feature-slider .slider-button-container a.slider-prev-button {
	background: #666 url(file:///C|/Users/Owner/AppData/Local/Temp/Temp2_tideviewslideshow.zip/tideviewslideshow/images/left_arrow.gif) no-repeat center center;
}
#feature-slider .slider-button-container a.slider-next-button {
	background: #666 url(file:///C|/Users/Owner/AppData/Local/Temp/Temp2_tideviewslideshow.zip/tideviewslideshow/images/right_arrow.gif) no-repeat center center;
}

#feature-slider .slider-button-container a.slider-prev-button,
	#feature-slider .slider-button-container a.slider-next-button {
	
	width: 30px;
	padding: 0;
	margin: 7px 1px 7px 2px;
	display: block;
	float: right;
	
}