@charset "UTF-8";
/* CSS Document */

/* Webster Sheryn Main Stylesheet - Copyright 2008 MightyMeta www.mightymeta.co.uk */

/* Browser Resets */

h1, h2, h3, h4, h5, h6, pre, code { font-size:1em; }

ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote, fieldset, input
{ margin:0; padding:0 }

a img, :link img, :visited img { border:none }

html, body {
	border: 0px none;
	height: 100%;
	overflow: hidden
}

/* Main HTML tag styles */

body {
	font-family: "Century Gothic", Helvetica, Arial, sans-serif;
	line-height: 120%;
	color: #FFFFFF;
	background-color: #666666;
	font-weight: lighter;
}
noscript {
	display: none;
}
#background_preloaders {
	display: none;
}
#styleswitcher {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.6em;
	color: #FFFFFF;
	height: auto;
	width: auto;
	position: absolute;
	z-index: 100;
	left: 0px;
	top: 0px;
	margin-left: 20px;
}
#styleswitcher a {
	text-decoration: none;
	color: #CCCCCC;
}
#styleswitcher a:hover {
	text-decoration: none;
	color: #FFFFFF;
}
#styleswitcher a:active {
	text-decoration: none;
	color: #FFFFFF;
}
#loading_bar_box {
	z-index: 2;
	height: auto;
	width: 100%;
	position: absolute;
	top: 0px;
	bottom: 0px;
}
#loading_bar_height {
	height: 150px;
	width: auto;
}
#loading_image {
	height: 30px;
	bottom: -50px;
	position: absolute;
	left: 50%;
	margin-left: -104px;
}
#loading_image p {
	font-family: "Century Gothic", Helvetica, Arial, sans-serif;
	font-size: 0.6em;
	line-height: 100%;
	color: #FFFFFF;
	text-align: center;
}
#loading_image img {
}
h1 {
}
h2 {
}
h3 {
	font-size: 2em;
	padding-top: 0.6em;
	padding-bottom: 0.6em;
	line-height: 120%;
	font-family: "Century Gothic", Arial, Helvetica, sans-serif;
	text-align: left;
	font-weight: lighter;
	display: none;
}
h4 {
	font-size: 1.4em;
	padding-top: 0em;
	padding-bottom: 0.6em;
	line-height: 120%;
}
h5 {
	font-size: 1em;
	padding-top: 0em;
	padding-bottom: 0.2em;
	line-height: 120%;
}
p {
	font-size: 0.8em;
	line-height: 120%;
	color: #FFFFFF;
	padding-bottom: 1em;
	padding-top: 0.8em;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: lighter;
}
a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	color: #FFFFFF;
	text-decoration: underline;
	font-weight: bold;
	height: auto;
}
a:hover {
	text-decoration: none;
}
ul {
	list-style-position: inside;
	list-style-type: disc;
}
li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .8em;
}

/* Primary DIV layout Styles */

#background_photo {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 0;
	overflow: hidden;
}
#background_photo img {
	top: 0px;
	position: absolute;
	left: 0px;
	width: 110%;
	min-width: 1000px;
}
#photo_screen {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0px;
	top: 0px;
	background-image: url(../images/blank-trans.png);
	z-index: 1;
}
#wrapper {
	position: relative;
	top: 20px;
	bottom: 20px;
	left: 20px;
	width: 100%;
	right: 20px;
	height: 100%;
	overflow: hidden;
	z-index: 3;
}
#main_box {
	height: auto;
	width: auto;
	border: 2px solid #FFFFFF;
	overflow: hidden;
	position: absolute;
	left: 0px;
	right: 40px;
	top: 0px;
	bottom: 60px;
}
#header {
	display: none;
}

/* Navigation */

#main_navigation {
	height: 100%;
	width: 100px;
	border-right: 2px solid #FFFFFF;
	overflow: hidden;
	position: absolute;
	left: 0px;
	top: 0px;
}
#main_navigation ul {
	list-style-type: none;
	width: 100px;
	display: block;
	overflow: hidden;
	height: 100%;
	position: absolute;
}
#main_navigation li {
	list-style-type: none;
	padding-top: 5px;
	list-style-position: outside;
	display: inline;
}
#main_navigation a {
	text-transform: uppercase;
	text-decoration: none;
	font-size: .9em;
	font-weight: bold;
	padding-right: 10px;
	padding-left: 4px;
	display: block;
	width: 86px;
}
#main_navigation a:hover {
	background-color: #9FC1BA;
}
#main_navigation #main_nav_select {
	background-color: #9FC1BA;
}
.home_button {
	height: 18%;
	display: block;
	position: absolute;
	top: 0%;
}
.services_button {
	height: 7%;
	border-top: solid 2px #FFFFFF;
	top: 18%;
	display: block;
	position: absolute;
}
.profile_button {
	height: 8%;
	border-top: solid 2px #FFFFFF;
	top: 25%;
	display: block;
	position: absolute;
}
.projects_button {
	height: 35%;
	border-top: solid 2px #FFFFFF;
	top: 33%;
	display: block;
	position: absolute;
}
.news_button {
	height: 10%;
	border-top: solid 2px #FFFFFF;
	top: 68%;
	display: block;
	position: absolute;
}
.testimonials_button {
	height: 6%;
	border-top: solid 2px #FFFFFF;
	top: 78%;
	display: block;
	position: absolute;
}
.contact_button {
	height: 16%;
	border-top: solid 2px #FFFFFF;
	border-bottom: solid 2px #FFFFFF;
	top: 84%;
	display: block;
	position: absolute;
}
#sub_navigation {
	height: 100%;
	width: 100px;
	border-right: 2px solid #FFFFFF;
	overflow: hidden;
	position: absolute;
	left: 102px;
	top: 0px;
}
#sub_navigation ul {
	list-style-type: none;
	width: 100px;
	display: block;
	overflow: hidden;
	height: 100%;
	position: absolute;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
	line-height: 100%;
}
#sub_navigation li {
	list-style-type: none;
	list-style-position: outside;
}	
#sub_navigation a {
	text-transform: uppercase;
	text-decoration: none;
	font-size: 0.9em;
	font-weight: bold;
	padding-right: 10px;
	padding-bottom: 5px;
	padding-left: 4px;
	padding-top:3px;
	border-bottom: 2px solid #FFFFFF;
	display: block;
	width: 86px;
}
#sub_navigation a:hover {
	background-color: #7C9D9F;
}
#sub_navigation #sub_nav_select {
	background-color: #7C9D9F;
}

/* Secondary DIV layout styles */

#content_box {
	top: 0px;
	bottom: 0px;
	left: 204px;
	right: 0px;
	height: auto;
	width: auto;
	position: absolute;
}
#content_box ul {
	padding-top: .5em;
	padding-bottom: .5em;
}
.title_services{
	background-image: url(../images/title-services-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_profile{
	background-image: url(../images/title-profile-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_richard{
	background-image: url(../images/title-richard-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_eilir{
	background-image: url(../images/title-eilir-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_frederieke{
	background-image: url(../images/title-frederieke-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_anne{
	background-image: url(../images/title-anne-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_staff{
	background-image: url(../images/title-staff-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_studio{
	background-image: url(../images/title-studio-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
	z-index: 300;
}
.title_news{
	background-image: url(../images/title-news-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_testimonials{
	background-image: url(../images/title-testimonials-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
.title_contact{
	background-image: url(../images/title-contact-trans.png);
	text-indent: -900em;
	height: 100px;
	width: 600px;
	right: 0px;
	top: 0px;
	position: absolute;
}
#copyright {
	font-size: 0.9em;
	position: absolute;
	right: 40px;
	bottom: 35px;
}
#copyright a {
	color: #FFFFFF;
	text-decoration: underline;
	font-weight: normal;
}
#copyright a:hover {
	color: #FFFFFF;
	text-decoration: none;
}
#copyright #jencredit {
	font-size: 0.65em;
	padding: 0px;
	margin-left: 40px;
}
#loading_bar {
	display: none;
}
.clearfloat {
	clear: both;
	height: 1px;
	width: auto;
}