/*===============================================|
*************************************************|
		******	******	******	*	    *
		*		*    *	*	 *	  *	  *
		*	***	******	******		*
		******* *   *	*    *		*
*************************************************|
=================================================|
PROJECT NAME: SLIDING GALLERY PLUGIN
CREATED BY: GRAY JUNIOR
EDITED ON 21 DEC 2010

URL: http://grayjr.wordpress.com/
EMAIL: GrayJr88@gmail.com
LICENSE: GPL
COPYRIGHT (C) 2010 { GRAY JUNIOR } BLOG.
ALL RIGHTS RESERVED.
NOTE: PLEASE DO NOT REMOVE THIS SECTION.
=================================================|
*************************************************|
===============================================*/

/*===============================================
CSS TOTAL RESET
===============================================*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 20px;
	font-family: inherit;
	vertical-align: baseline;
}
:focus {
	outline: 0;
}

/*===============================================
GLOBAL ELEMENTS
===============================================*/
body, html { /* DOCUMENT DEFAULT SETTINGS APPLIED THROUGHOUT THE PAGE */
	font-family: Georgia, Helvetica, Verdana;
	color: #fff;
	background: #;
}

.box-shadow-up { /* CLASS FOR SLIDE DESCRIPTION BOX SHADOW */
	-o-box-shadow: 0 -1px 5px #;
	-moz-box-shadow: 0 -1px 5px #;
	-webkit-box-shadow: 0 -1px 5px #;
	box-shadow: 0 -1px 5px #;
}

.box-shadow { /* DECLARED AS A CLASS FOR REUSABILITY */
	-o-box-shadow: 0 2px 5px #000;
	-moz-box-shadow: 0 2px 5px #000;
	-webkit-box-shadow: 0 2px 5px #000;
	box-shadow: 0 2px 5px #000;
}

/*===============================================
SLIDESHOW ELEMENTS
===============================================*/


#main h1 p {
	margin: auto;
	width: 71%;
	text-align: center;
	font-size: 25px;
	color: #242424;
	text-shadow: 0 1px 1px #111;
}

#container #main { /* POSITIONING THE OUTERMOST CONTAINER */
	position: relative;
	padding: 0px;
	margin: 0px auto 0px;
	width: 800px;
	height: 329px;
	background: #eee;
}

#container #main #actions { /* POSITIONING THE LINKS */
	position: absolute;
	top: 50%;
	margin-top: -50px;
	width: 100%;
}

#container #main #slideshow { /* POSITIONING THE SLIDESHOW */
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background: #fefefe;
	list-style: none;
	overflow: hidden;
	z-index: 10;
}

#container #main #slideshow li { /* DEFAULT SETTINGS FOR EACH SLIDES */
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#container #main #slideshow li img { /* DEFAULT SETTINGS FOR THE SLIDES */
	width: 100%;
	height: 100%;
}

#container #main #slideshow li .desc { /* STYLING AND POSITIONING OF THE SLIDES' DESCRIPTION */
	position: absolute;
	margin-top: -50px;
	padding: 10px;
	width: 100%;
	min-height: 90px;
	background: #666;
	background: rgba(11,11,11, 0.6);
}

#container #main #slideshow li .desc p {
	padding: 10px;
	color: #fff;
}

#container #main #slideshow li .desc p a, #container #main #slideshow li .desc p a:visited {
	padding: 0 10px;
	font-size: 12px;
	color: #fcb17a;
}

#container #main #slideshow li .desc p a:hover, #container #main #slideshow li .desc p a:active {
	color: #f59b26;
	text-decoration: underline;
}

#container #main #actions a { /* DEFAULT STYLE FOR THE LNKS */
	color: #555;
	text-decoration: underline;
	z-index: 10;
}

#container #main #actions a:hover { /* HOVER STYLE FOR THE LINKS */
	color: #242424;
}

.button { /* STYLE FOR THE LINK BUTTONS */
	padding: 10px 20px;
}

#container #main #actions .next { /* POSITIONING THE 'NEXT' LINK ON THE RIGHT */
	float: right;
	margin-right: -50px;
}
#container #main #actions .prev { /* POSITIONING THE 'PREVIOUS' LINK ON THE LEFT */
	float: left;
	margin-left: -70px;
}
/*===============================================
FOOTER ELEMENTS
===============================================*/
#container #footer {
	position: relative;
	margin-top: 20px;
	text-align: center;
}