/* Tallieu & Tallieu nv - www.tnt.be*/

a:focus
{
	outline: none;
}

*, div, ul, li, h1, h2, p, img
{
	margin: 0;
	padding: 0;
}

html
{
	min-height: 100%;
	overflow-y: scroll;
}

body
{
	margin: 0;
	padding: 0;
	color: #000;
	font-size: 11px;
	line-height: 20px;
	font-family: Helvetica, Arial, "Trebuchet MS", Tahoma;
	min-width: 1000px;
	min-height: 100%;
	background: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/accolade.png) repeat-y top center;
	background-attachment: fixed;
	overflow-x: hidden;
}

div#header 
{
	position: fixed;
	left: 0px;
	right: 0px;
	top: 0px;
	height: 230px;
	height: 200px;
	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/top-accolades.png);
	background-position: top center;
	background-repeat: no-repeat;
}

div#footer 
{
	position: fixed;
	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/bottom-accolades.png);
	background-position: bottom center;
	background-repeat: no-repeat;
	bottom:0px;
	left:0px;
	right: 0px;
	height: 200px;
	z-index: 5;
}
div#footer #fader	{
	/*background: #1A7CC6;*/
	margin: 0 auto 0;
	width: 660px;
	height: 18px;
	padding-top: 104px;
	overflow: hidden;
	}
div#footer #fader p	{
	/*background: #1A7CC6;*/
	margin: 0px;
	padding: 0px;
	}
div#footer #footercontent	{
	margin: 0px auto 0;
	padding-top: 18px;
	width: 1000px;
	}
div#footer .floater	{
	float: left;
	/*font-size: 8px;
	line-height: 10px;*/
	padding: 0 2em 0 0;
}
div#footer .floater	img	{
	border: none;
	}
div#footer .text	{
	/*display: none;*/
	font-size: 8px;
	line-height: 10px;
	width: 110px;
	}
#intro div#footer .credits	{
	color: #fff;
	}
div#footer .logo	{
	float: right;
	color: #999;
	text-align: right;
	font-size: 9px;
	line-height: 0px;
	padding-right: 0em;
	padding-left: 0em;
	border: 1px solid #000;
	}
div#footer .credits	{
	float: right;
	color: #999;
	text-align: right;
	font-size: 9px;
	line-height: 12px;
	padding: 10px 0 10px 10px;
	}
#intro div#footer .credits a	{
	color:#fff;
	text-decoration: none;
	}
div#footer .credits a	{
	color: #999;
	text-decoration: none;
	padding: 0px;
	margin: 0px;
	/*line-height: 0px;*/
	vertical-align: bottom;
	}
div#footer .logo a	{
	line-height: 0px;
	vertical-align: bottom;
	opacity: 1;
	}
div#footer .logo a:hover	{
	opacity: 0.6;
	}
html#intro	body				{	background: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/intro/introbg.png) repeat-y center center; 	}
html#intro	#background		{	background: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/intro/accolade.png) repeat-y top center;position:fixed;left:0px;right:0px;top:0px;bottom:0px;	}
html#intro div#header	{	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/intro/top-accolades.png);	}
html#intro div#footer	{	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/intro/bottom-accolades.png);	}

div#left
{
	width: 200px;
	position: fixed;
	left: 50%;
	top: 50%;
	margin: -90px 0 0 -420px;
}

ul#nav
{
	list-style: none;
}

ul#nav li a
{
	font-size: 14px;
	letter-spacing: -0.7px;
	color: #000;
	text-decoration: none;
}

ul#nav li a:hover, ul#nav li.active a
{
	color: #278DCF;
}

div#content
{
	width: 800px;
	margin: 0 auto;
}

#txt
{
	padding: 200px 0 150px 0;
	float: right;
	width: 600px;
	min-height: 180px;
}



h2#logo
{
	position: fixed;
	left: 50%;
	margin: 89px 0 0 -330px;
	letter-spacing: 5px;
	text-transform: uppercase;
	font-size: 22px;
	font-weight: normal;
	/*width: 500px;*/
	/*height: 180px;*/
}

h2#logo a
{
	display: block;
	width:100%;
	height: 100%;
	background-color: transparent;
	color: #1A7CC6;
	text-decoration: none;
	/*text-indent: -9999px;*/
}

h2#logo a.europeanhouse
{
	/*background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/logo-europeanhouse.png);*/
}
h2#logo a.accesstoculture	{
	/*background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/logo-accesstoculture.png);*/
	}
p
{
	margin: 0 0 20px 0;
}

#intro h1	{
	position: fixed;
	left: 50%;
	top: 50%;
	margin: 40px 0 0 -200px;
	width: 180px;
	height: 180px;
	}
#intro h1 a	{
	display: block;
	height: 100%;
	width: 100%;
	text-indent: -999em;
	}
#intro h1#europeanhouseforculture	{
	margin: -90px 0 0 -180px;
	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/logo-europeanhouse.png);
	}
#intro h1#accesstoculture	{
	margin: -90px 0 0 0px;
	background-image: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/logo-accesstoculture.png);
	}

#submenu	{
	position: fixed;
	left: 50%;
	margin: 240px 0 0 -200px;
	background: url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/submenu.png) no-repeat top left;
	height: 333px;
	width: 150px;
	list-style-type: none;
	padding: 30px 0 30px 50px; 
	}
#submenu li	{
	color: #000;
	}
#submenu li a	{
	text-decoration: none;
	color: #000;
	font-size: 14px;
	}
#submenu li:first-letter	{
	color: #f00;
	letter-spacing: 1px;
	}
#submenu li.active a	{
	color: #f00;
	}


/* content styles */
#txt	{
	font-size: 12px;
	}
#txt p	{
	padding: 0px;
	margin: 10px 0;
	}
#txt ul	{
	list-style-type: square;
	padding: 15px 0 15px 15px;
	}
#txt h1
{
	text-transform: uppercase;
	font-size: 16px;
	line-height: 30px;
	color: #f14;
	margin: 0 0 10px 0;
	font-weight: normal;
}

#txt h2	{
	margin: 20px 0 5px 0;
	font-size: 16px;
	font-weight: normal;
	color: #1A7CC6;
	padding: 0;
	
	}
#txt h3	{
	color: #1A7CC6;
	text-transform: uppercase;
	padding: 10px 0 5px;
	margin: 0px;
	font-size: 16px;
	font-weight: normal;
	}
#txt a, #fader a	{
	text-decoration: none;
	color: #1A7CC6;
	border-bottom: 1px dotted #999;
	}
#txt ul.thumbs	{
	list-style-type: none;
	padding: 0px;
	margin: 0px;
	}
#txt ul.thumbs li	{
	float: left;
	padding: 0px 0px;
	margin: 0px 10px 10px 0;
	height: 110px;
	width: 144px;
	overflow: hidden;
	list-style-type: none;
	
	
	}
#txt ul.thumbs li a{
	border: 1px dotted #639ED6;
	padding: 4px 0;
	display: block;
	height: 100px;
	text-align: center;
	}
#txt ul.thumbs li a:hover	{
	border-style: solid;
	}
#txt ul.thumbs li a img	{
	border: 0px;
	}


/* lightbox */
	#overlay	{
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		/*bottom: 0;*/
		right: 0;
		display: none;
		background: rgba(153,153,153,0.8) !important;
		background: transparent url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/rgba255.255.255.0.9.png);
		z-index: 6;
		}
	.lightboxcontainer	{
		/*width: 640px;
		height: 380px;*/
		top: 50%;
		left: 50%;
		margin-left: -335px;
		margin-top: -300px;
		/*background: #000;*/
		padding: 15px;
		position: fixed;
		z-index:7;
		}	
	.lightboxcontainer .close	{
		position: absolute;
		top: 0px;
		right: 0px;
		height: 30px;
		width: 30px;
		background: transparent url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/close.png) no-repeat top right;
		-background: transparent url(http://phpstack-251309-1518079.cloudwaysapps.com/_images/close-8b.png) no-repeat top right;
		z-index: 10;
		cursor: pointer;
		}
	.lightboxcontent	 {

	-moz-box-shadow: 0px 0px 5px #888;
		-webkit-box-shadow: 0px 0px 5px #888;
		box-shadow: 0px 0px 5px #888;
		border: 10px solid #000;
		margin: 0px;
		line-height: 0px;
		font-size: 0px;
		position: relative;
		}	
		.lightboxcontent img	{
			margin: 0px;
			padding: 0px;
			}
	.lightboxcontent .lightboxnav	{
		position: absolute;
		bottom: 0px;
		left: 0px;
		right: 0px;
		width: 100%;
		height: 50px;
		background: #050608;
		color: #1A7CC6;
		display: none;
		text-align: center;
	}
	.lightboxcontent .lightboxnav .next,
	.lightboxcontent .lightboxnav .prev	{
	cursor: pointer;
	line-height: 50px;
	position: absolute;
	top: 0px;
	left: 50%;
	display: block;
	height: 50px;
	margin: 0px -50px 0 0; 
	font-size: 18px;
	line-height: 50px;
	font-weight: bold;
	text-transform: uppercase;
	width: 50px;
	}
	.lightboxcontent .lightboxnav .prev	{
	
	margin: 0px 0px 0 -50px;
	}

	
/* in case we have netbooks, seems to work in everything but IE */
@media all and (max-height: 580px) {
	#content	{
		overflow: hidden;
		
		}
	#intro #content	{
		height: 400px;
		}
	#txt	{
		padding-bottom: 0px;
		}
	div#header, h2#logo	{
		position: absolute;
		}
	div#footer	{
		position: relative;
		top: auto;
		bottom: auto;
		}

	#intro h1, div#left	{
		top: 290px;
		position: absolute;
		}
	
}
