/*******************************************************************/
/*** sactobirth - Forked from DarkShades (sean@silverstripe.com) ***/
/*******************************************************************/


/****************/

/** Global CSS **/

/****************/

html {  

	background: url("../images/bg.png") repeat scroll 0 0 #FFFFFF;

}

* {

	padding: 0;

	margin: 0;

	font-family: Arial, Helvetica, sans-serif;
	list-style-type: none;

}

body {
	background: url("../images/main_bg.jpg") repeat-x fixed center top #eeeae2;
}

/* Clearing classes */

.clear {

	clear: both;

}

	.clearLeft {

		clear: left;

	}

	.clearRight {

		clear: right;

	}
	
/* Set styling for anchors */

a {

	color: #626262;

	text-decoration: none;

}

	a:hover {

		background: #ffdfff;
		color: #626262;		

		text-decoration: underline;

 	}

	a:active {

		color: #000;
		background: #ffb7ff;		

	}

	a img {

		border: none;

	}

/* Set the font size for breadcrumbs */

.breadcrumbs {

	font-size: 11px;

}

/* Re-usable RSS link with icon styling */

.commentrss {

	background: url(../images/feed-icon-14x14.png) no-repeat left center;

	padding-left: 18px;

}

	.commentrss:hover {

		background: #4D5E2F url(../images/feed-icon-14x14.png) no-repeat left center;

	}



/****************/

/** Layout CSS **/

/****************/



/* Container element to support the centering of elements */

#container {

  width: 960px;

  margin: 0 auto;

}

/* Apply padding to these elements */

#Layout,

#Footer {
    padding-left: 45px;
    padding-right: 45px;

}



/* Main 'container' element used as redundancy to add background image */

#Main {

	padding-top: 9px;
    border-left: 1px solid #FF80FB;
    border-right: 1px solid #FF80FB;
    background:url("../images/85_grad.png") repeat scroll left top transparent;

}



/* Header styling - it contains the <h1> element and a site slogan */

#headercontainer {

	margin: 0 24px 50px 23px;

}

	#Header {

		background: url(../images/header_top.gif) no-repeat top center;

		position: relative;
		

	}
	
	#Header .social{
		float:right;
	}
		#Header .social img{
			width: 25px;
			margin-top: -1px;
		}
	
		#Header h1 *, #Header h2{
			font-family: 'Alice', Arial, Helvetica, sans-serif;
		}

		#Header h1, #Header h2{
			
		    font-weight: normal;
		    letter-spacing: -0.075em;
		    padding: 25px 18px 25px 250px;

		}
		
		#Header h1{
			background: url("../images/header_bottom.gif") no-repeat scroll center bottom transparent;
			font-size: 40px;
			height: 158px;
		}
		
		#Header h2{
			position: absolute;
			margin-top: -160px;
		}
		
		#Header .address{
			float: right;
			margin-right: 10px;
			margin-top: 10px;
		}
		

			#Header h1 a {

				color: #000;

				text-decoration: none;

			}

			#Header h1 a:hover {

				text-decoration: underline;

				color: #fff;

			}

			#Header #SearchBox {

				position: absolute;

				top: 35px;

				right: 0px;

				width: 200px;
				display:none;

			}

				#Header #SearchBox * {

					display: inline;

				}

					#Header #SearchBox input.text {

						border: none;

					}



/* Left content styling - this is the side box which usually contains a menu */

#LeftContent {

	float: left;

	width: 133px;

}



/* Center content styling - containing standard content */

#CenterContent {

	padding: 10px

}

	#CenterContent.marginright {

		margin-right: 190px;

	}

	#CenterContent.marginleft {

		margin-left: 150px;

	}



/* Side bar styling - widgets and module templating uses this. class sidebarBox is a standard

	re-usable box for widgets and other pieces of functionality that fit on the right hand side

	of the layout */

#Sidebar {

	float: right;

	width: 180px;

	margin-left: 20px;

}

	#Sidebar .sidebarBox {

		border-top: 5px solid #ffdfff;

		padding: 5px;

		margin-bottom: 20px;

		font-size: 10px;

	}

		#Sidebar ul,

		#Sidebar li {

			margin: 0;

			padding: 0;

			font-size: 10px;

		}

			#Sidebar ul {

				padding-left: 15px;

			}

			#Sidebar li {

				list-style-position: outside;

				margin-bottom: 3px;

			}



/* Page numbers styling - used for pagination. Just add the class "pagination" to use this styling.

	For a guide on how to format your HTML markup in order to use this styling, please see:

	http://doc.silverstripe.com/doku.php?id=tutorial:4-site-search - alternatively, you can view

	Page_results.ss inside darkshades/templates/Layout which is where this styling for pagination is derived from */

.pagination {

	text-align: center;

	padding: 10px 0;

	color: #9ce80b;

	background: #444;

	border: 1px solid #333;

}

	.pagination .prev,

	.pagination .next,

	.pagination .pageNumber,

	.pagination .summary {

		font-size: 10px;

	}

		.pagination .pageNumber {

			border: 1px solid #666;

			padding: 3px 8px;

			background: #333;

		}

			.pagination .pageNumber:hover {

				background: #4D5E2F;

			}

			.pagination .current {

				color: #000;

				background: #666 !important;

			}

	.pagination .summary {

		margin: 5px 0 0 0;

		color: #666;

	}

	

#Results li {

	list-style-type: none;

	list-style: none;

	margin: 10px 0;

	padding-bottom: 20px;

	border-bottom: 1px solid #666;

}





/* Footer styling - usually contains copyright information and site information */

#Footer {

	clear: both;

	background: url(../images/footer_bg.gif) no-repeat bottom center;

	padding: 10px 5px;

	text-align: right;

}

	#Footer p {

		font-size: 11px;

		margin-right: 42px;

	}
	

#accordion .ui-accordion-content {padding:20px;}
#galleria {height:460px;width:650px;}
.staff {
  border-top: 1px solid #FF80FB;
  padding: 15px 0;
  clear:both;
}


.flowplayer { height: 376px; }