@charset "utf-8";
		
		body {
			font:normal 0.8em/1.4em Arial, Helvetica, sans-serif;
			text-align:center;
			background:url('../img/body-bg.jpg');
			}

		#wrapper {
			margin:40px auto 0 auto;
			width:924px;
			height:574px;
			position:relative;
			background:transparent url('../img/wrapper-bg.png') no-repeat top left;
			}
			
		#container {
			width:704px;
			height:570px;
			position:absolute;
			right:2px;
			top:2px;
			text-align:left;
			}

		/*
		 *		HEADER
		 *********************************/

		#header {
			position:absolute;
			bottom:0;
			left:0;
			width:100%;
			height:111px;

			}
			
		#header h1 {
			width:236px;
			height:64px;
			margin:10px 30px 0 20px;
			float:left;
			}
			
		#header h1 a,
		#header h1 a:visited,
		#header h1 a:hover {
			display:block;
			width:100%;
			height:100%;
			background:url('../img/logo-porteners.gif') no-repeat top left;
			text-indent:-3000px;
			}
			
		#mailto-link,
		#mailto-link:visited {
			color:#000033;
			position:absolute;
			left:90px;
			bottom:15px;
			}

		#mailto-link:hover {
			text-decoration:none;
			}
			
		#contact {
			margin-top:10px;
			}
			
		.contact-data {
			list-style-type:none;
			background:url('../img/contact-dots.gif') repeat-y top left;
			float:left;
			margin-right:25px;
			}
			
		.contact-data li {
			margin-left:10px;
			font-weight:bold;
			color:#000033;
			}
			
		.contact-data li span {
			color:#ff3300;
			text-transform:uppercase;
			display:inline-block;
			width:25px;
			}

		/*
		 *		INTRO
		 *********************************/
			
		#intro {
			position:absolute;
			bottom:111px;
			left:0;
			width:100%;
			height:87px;	
			background:none;
			}
			
		#intro p {
			width:570px;
			color:#fff;
			font-weight:bold;
			padding:7px 0 0 0;
			}

		/*
		 *		CONTENT
		 *********************************/

		#main {
			height:373px;
			width:100%;
			position:absolute;
			top:0;
			left:0;	
			overflow:hidden;
			}

		/**
		 *		NAVIGATION
		 ***************************/

		#navigation {
			position:absolute;
			top:30px;
			left:20px;
			list-style-type:none;
			width:280px;

			}
			
		#navigation li {
			margin-bottom:10px;
			}
			
		#navigation li a,
		#navigation li a:visited {
			color:#6c8db2;
			text-transform:uppercase;
			font-weight:normal;
			font-size:150%;
			text-decoration:none;
			}
			
		#navigation li a:hover, 
		#navigation li a.active,
		#navigation li a.active:visited,
		#navigation li a.active:hover {
			color:#cf0b0b;
			}

		/**
		 *		CONTENT
		 ***************************/

		#content {
			position:absolute;
			top:20px;
			left:20px;
			width:620px;
			height:310px;	
			padding:10px 20px;
			background:transparent url('../img/content-bg.png') no-repeat center center;
			display:none;
			zoom:1;
			}

		#contents {
			overflow-y:scroll;
			padding:10px 20px 10px 10px;
			height:180px;
			width:430px;
			line-height:140%;
			color:#444;
			background:#fff;
			margin-top:10px;
			}
			
		#content h2 {
			height:30px;
			line-height:30px;
			font-weight:bold;
			color:#cf0b0b;
			text-transform:uppercase;
			font-weight:normal;
			font-size:150%;
			}

		#contents p {
			margin-bottom:15px;
			
			}
			
		#contents ul {
			margin-left:30px;
			}

		#content #page-photo {
			position:absolute;
			right:20px;
			top:50px;
			}
		
		#content #page-logo {
			position:absolute;
			right:180px;
			bottom:10px;
			}
		
		#content #back-link {
			position:absolute;
			left:20px;
			bottom:10px;
			}
			
		#back-link,
		#back-link:visited {
			color:#6c8db2;
			text-transform:uppercase;
			font-weight:normal;
			font-size:150%;
			text-decoration:none;	
			height:35px;
			line-height:35px;
			}
			
		#back-link:hover {
			color:#ff3300;
			}

		/*
		 *		CONTACT
		 *********************************/

		#contact-form {
			position:absolute;
			top:20px;
			left:20px;
			width:620px;
			height:310px;	
			padding:10px 20px;
			background:url('../img/contact-bg.png') no-repeat top left;
			text-align:left;	
			}
			
		#contact-form form fieldset {
			width:300px;
			height:270px;
			float:left;
			}
			
		#contact-form form fieldset:first-child {
			margin-right:15px;
			}
			
		#contact-form form fieldset label {
			display:block;
			vertical-align:top;
			line-height:32px;
			margin-bottom:5px;
			}
			
		#contact-form form fieldset label span {
			float:left;
			display:block;
			width:110px;
			text-align:left;
			font-weight:bold;
			color:#fff;
			}
			
		#contact-form form fieldset label input,
		#contact-form form fieldset label textarea {
			display:inline-block;
			}
			
		#contact-form form fieldset label input.text {
			border:1px solid #ccc;
			padding:4px 5px;
			width:170px;
			}

		#contact-form form fieldset label input.submit {
			display:block;
			height:2.2em;
			padding-bottom:2px;
			font-weight:bold;
			position:relative;
			left:2px;
			}
			
		#contact-form form fieldset label textarea {
			font:normal 1em/1.4em Arial, Helvetica, sans-serif;
			border:1px solid #ccc;
			padding:4px 5px;
			width:170px;
			height:130px;
			}

		#form-message {
			padding:10px;
			}

		.ok {
			background: 			#edffe4;
			border:					1px solid #9cd580;
			color:					#386522;
			font-weight:			bold;
			}
			
		.error {
			background: 			#ffe1d3;
			border:					1px solid #cd6951;
			color:					#842310;
			font-weight:			bold;
			}

		#contact-form #contact-logos {
			position:absolute;
			right:20px;
			bottom:-12px;
			}


		/**
		 *		SLIDESHOW
		 ***************************/

		#slideshow {
			display:none;
			position:absolute;
			right:20px;
			top:20px;
			width:420px;
			height:265px;
			background:transparent url('../img/slideshow-bg.png') no-repeat center center;	
			}
			
		#slideshow img {
			position:absolute;
			top:10px;
			left:10px;
			z-index:8;
			width:400px;
			height:245px;
			}

		#slideshow img.current {
			z-index:10;
			}


		#slideshow img.prev {
			z-index:9;
			}

		/**
		 *		CLEARERS
		 ***************************/

		.clearer {
			width:100%;
			height:1px;
			clear:both;
			}
			
		.clearfix:after {
			content:".";
			display:block;
			height:0;
			clear:both;
			visibility:hidden;
			}
			
		.clearfix {
			display:inline-block;
			}
			
		/* Hides from IE-mac \*/
		* html .clearfix { height: 1%;}
		.clearfix {display: block;}
		/* End hide from IE-mac */


		.left         { float:left; }
		.right        { float:right; }
		img.left      { margin-right:1em; margin-bottom:1.8em; }
		img.right     { margin-left:1em; margin-bottom:1.8em; }
		.text-right   { text-align:right; }
		.half         { width:45%; /* Not exactly half to account for paddings, margins etc. */ }
		
		.hide{ /* Hide stuff without resorting to display:none; */
			visibility:hidden;
			width:0!important;
			height:0!important;
			line-height:0!important;
			padding:0!important;
			margin:0!important;
		}