/**
 * Stylesheet for Website Scouts Blankenberge
 *
 * @media	layout
 * @author	Matthias Cherlet matthicc@gmail.com
 */


	/**
	 * General Page Structure
	 */
	
		html, body {
			height: 100%;
		}
		
		body {
			font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
			/*padding-top: 40px;*/
			font-size: 11px;
			line-height: 1.48;
			color: #555;
			background: url(../img/websiteSCOUTS/BODYKerst.jpg) no-repeat top left;
			background-color: #ccffff;
		}
	
		#siteWrapper {
			width: 800px;
			position: relative;
			margin: 0 auto 0;
			min-height: 100%;
			background-color: #ffffff;
		}
	
	/**
	 * The Header
	 */
	
		#header {
			position: relative;
			height: 100px;
			width: 100%;
			background: url(../img/websiteSCOUTS/headerAchtergrond.jpg) no-repeat top left;
		}
		h1 {
			display: block;
			width: 260px;
			height: 100px;
			position: absolute;
			left: 15px;
			top: 10px;
			overflow: hidden;
		}
		h1 a {
			display: block;
			width: 260px;
			height: 100px;
			text-indent: -9999px;
			text-decoration: none;
			background: url(../img/websiteSCOUTS/LOGO.jpg) no-repeat top left;
		}
		#header h2 {
			position: absolute;
			right: 0;
			top: 0;
			height: 100px;
			width: 160px;
			text-indent: -9999px;
			/*background: url(../img/websiteSCOUTS/groepsFotoScouts.jpg) no-repeat top right;*/
			overflow: hidden;
		}
		h2{
			padding-bottom: 18px;
			
		}
		h3{
			padding-bottom: 16px;
		}
		p{
			width: 95%;
			
		}
		#content p {
			padding: 6px 0 6px 0;
		}
		#content li{
			padding-left: 12px;
		}

	/**
	 * Menubar
	 */
	
		#menubar {
		  border-top: #33cccc 1.5px;
		  overflow:hidden;
		  height: 42px;
		  line-height: 42px;
		  border-top: solid;
		}
		#menubar ul {
		  
		  margin: 0 0 5px 5px;
		  line-height: 42px;
		}		  
		
		#menubar ul li {
			
		  list-style-type: none;
		  display: inline;
		  margin-right: 5px;
		  margin-left: 5px;
		  top: 5px;
		  letter-spacing: -0.7px;
		  font-size: 13px;	
		}
		
		#menubar ul li a {
		  font-size: 13px;
		  font-variant: small-caps;
		  text-decoration: none;
		  color: #33cccc;
		  font-weight:bolder;
		}
		#menubar ul li.active a {
		  color: #336666;
		}
		
		#menubar ul li a:hover {
		  color: #333333;
		}
		#lnkLogin{
			width: 100%;
		}
		#menubar ul li#lnklogin {
		  float: right;
		}

		
	/**
	 * Content
	 */
	
		#content {
			position: relative; /* fixed needed for all IEs */
		 	padding: 30px 50px 20px 40px;
			overflow-y: auto;
			/* note that the height and such is calculated via general.js */
		}
		.clearfix{
			padding-bottom: 25px;
		}
		.clearfix a{			
			color: #333;
			padding-right: 40px;
			
		}
		#content th, td{
			padding-right: 20px;
			padding-bottom: 5px;
		}

	/**
	 * Footer
	 */

		div#footer {
		  text-align: center;
		  width: 100%;
		  position: absolute;
		  bottom: 0;
		  /*border-top: solid;*/
		 background: url(../img/websiteSCOUTS/footerAchtergrond.jpg) no-repeat top left;
		 
		  
		  height: 25px;
		  line-height: 25px;
		  overflow: hidden;
		}
		
		div#footer ul li {
			
			display: inline;
			padding: 0 4px;
		}

	/**
	 * Photos & Collections
	 */
	
		ul.photos {
			width: 702px;
			margin-left: 45px;
		}
		
		ul.photos li {
			width: 224px;
			height: 168px;
			float: left;
			position: relative;
			margin: 0 10px 10px 0;
			overflow: hidden;
		}
		
		ul.photos li a.del {
			height: 16px;
			width: 16px;
			text-indent: -9999px;
			overflow: hidden;
			/*background: transparent url(../img/icnDel.gif) no-repeat 0 0;*/
			
			position: absolute;
			top: 5px;
			right: 5px;
			z-index: 2;
			
			display: none;
		}
		
		ul.photos li:hover a.del {
			display: block;
		}