body {margin: 0; padding:0; font: 1em "Lucida Grande", verdana, arial, sans-serif; background: #f9f9f8 ;}

#headwrap {padding-bottom:.25em; width: 100%;float:left; position:relative;

background: #ffffff; /* Old browsers */
background: -moz-linear-gradient(top, #ffffff 0%, #e1e0dc 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e1e0dc)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ffffff 0%,#e1e0dc 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ffffff 0%,#e1e0dc 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ffffff 0%,#e1e0dc 100%); /* IE10+ */
background: linear-gradient(top, #ffffff 0%,#e1e0dc 100%); /* W3C */

border-bottom: 1px solid #999;
box-shadow: 0px 0px 8px rgba(50, 50, 50, 0.75);
color: #444;}

header{ margin:0; padding:.5em 0 0 0;width: 40%;float:right; text-align:right;}

header p a {font-size:90%;}

a{text-decoration:none;}

header p {margin: 0; padding: 0; padding-bottom:.25em;}

nav {margin: 0; padding: 1em 0; float: left; width: 60%; position: absolute; text-align: left;}

nav ul {margin: 0; padding: 0; }

nav ul li {float: left; list-style: none; margin: 0 0 0 .5em; padding: 0 0 0 .5em; border-left: 1px solid #999;}

nav ul li:first-child {border: none;}

nav ul li a {margin: 0; padding: 0; color: #444;line-height:2.5em; display:block; padding: 0 0 .35em 0;}

section {clear: both; margin: 0; padding: .75em;}

article {clear:both;width: 58%; margin: 0 1em 1em .5em; padding:.5em; float:left; }

section article ul { margin:0; padding:0; padding-left:.5em;}

section article ul li {font-size:1.1em;text-shadow: 1px 1px 1px #aaa;list-style: none; padding: .5em; padding-left: 35px; background-image: url(/images/tick.png);background-repeat: no-repeat;}

h1 {width:99%; font: 1.8em "Trebuchet MS", verdana, arial, sans-serif; margin: 0; padding: 0; padding-top:.5em; padding-left:.5em;}

h2 {font: 1.2em "Trebuchet MS", verdana, arial, sans-serif; font-weight: bold;}

section aside {margin: 0 0 2em 0; padding-top: 1em; width: 33%; max-width:300px; float: left; border: 1px solid #999; border-radius:10px 10px 10px 10px;

background: #fff url(/images/bg.jpg);}

section aside p {margin: .5em 3em 0 .5em;}
#arrow {float: right; margin: 0; padding: 0;text-align: right; position:relative;

/*Start arrow animation*/

animation:arrowmove 3s 1;
-moz-animation:arrowmove 3s 1; /* Firefox */
-webkit-animation:arrowmove 3s 1; /* Safari and Chrome */
}

@keyframes arrowmove
{
from {top:-100px; opacity: 0;}
to {top:0px; opacity: 1;}
}

@-moz-keyframes arrowmove /* Firefox */
{
from {top:-100px; opacity: 0;}
to {top:0px; opacity: 1;}
}

@-webkit-keyframes arrowmove /* Safari and Chrome */
{
from {top:-100px; opacity: 0;}
to {top:0px; opacity: 1;}
}

/*End arrow animation and start form styles*/

section aside form textarea {background: transparent;font-size: .75em; margin: .5em; padding:.5em; width: 90%; min-height: 200px; border: 1px solid #999; border-radius:10px 10px 10px 10px;}

section aside form input {background: transparent;font-size: .75em; margin: .5em; padding:.5em; width: 90%; border: 1px solid #999; border-radius:10px 10px 10px 10px;}

section aside form input:focus, section aside form textarea:focus {background: #eee;}

section aside form label {position:absolute; left: -999em;}

.submitbut {width: auto;}

.error_strings{clear: both;margin:0;padding:0 0 0 .5em;color: #f00000; text-shadow: 1px 1px 0px #a8a596;}

/*End form styles and start footer*/

footer {margin: 0; padding: 0; padding-left: ; width: 100%; float:left; border-top: 1px solid #999; box-shadow: inset 0px 5px 10px 0px #111; background: #222 url(/images/footbg.jpg); }

footer h2 {padding-top:1em;}

footer, footer a {color: #ddd; text-decoration: none;text-shadow: 1px 1px 0px #222;}

footer ul li {margin: 0; padding: 0; list-style-type: none; }

footer aside li {list-style-type: none; }

footer aside {  width: 30%; float:left; padding-left:.75em;}

footer ul li ul {margin: 0; padding: 0;}

footer aside ul {margin: 0; padding: 0;}

.date {text-align:right;font-size:.75em;margin-right:1em; color: #aaa}

.cw{display:block;clear:both; text-align:center;padding-top:2em;font-size:.75em;}

#contact li {width: 40%; float:left; background: none; font-size:1em;text-shadow: none; padding: 1em; padding-left: 0;}

/*End footer and Start targetting small screens*/

@media (max-width: 700px) {
	#headwrap, header, nav{clear:both;}
	#headwrap {padding-bottom:0;}
	header{width:100%;  text-align:center; margin-bottom:.25em;}
	header p{font-size:1.5em;}
	h1 {margin:0; padding:0;}
	nav {position:relative; width: 100%;}
	nav ul li a img {height:20px;}
	nav ul li a {line-height:1em;letter-spacing:-1px;}
	nav ul li{padding-left:.25em; margin-left:.25em;}
	article {width:100%;margin:0; padding:0;}
	section aside {clear: both; width: 100%;max-width:100%; float:none; margin:0;padding:0;}
	footer aside {clear: both; width: 96%;  padding-top:1em;}
	footer {text-align:center;}
	.imagelink {width:33%;float:left;}
	#contact li {width: 98%; float: none;}
}

/*End targetting small screens and start targetting large screens*/

@media (min-width: 2400px) {
	section{font-size:125%;}
	section aside {width: 33%;max-width:400px;}
}

/*Page specific styles*/
.box {padding:.5em;margin:0 .5em .5em 0; border: ; border-radius:10px 10px 10px 10px; background: url('/images/strip.png');}

.box h2 {text-align:center; margin:0; padding:0; font-size: 2em;}

.box p {padding-left: .5em; font-style:italic;}

.one h2, .one p, .two h2, .two p, .three h2, .three p {float:left;}

.box.one:hover h2 {color: #019119; text-shadow: 1px 1px 1px #666;}
.box.two:hover h2 {color: #ff5b00; text-shadow: 1px 1px 1px #666;}
.box.three:hover h2 {color: #ab0000; text-shadow: 1px 1px 1px #666;}

.box ul li {clear:both; font-size: 90%; line-height:1em; padding-left: 18px; padding-top: 1px;background-image: url(/images/lilarrow.png);background-repeat: no-repeat;}

.bio {float:left; vertical-align:; margin:.5em;}

.bio img {float:left; margin: 0 .5em .5em;}

.Surname {visibility: hidden; position:absolute;}