* {
margin:0;
padding:0;
}
html, body {
height: auto !important;
height:100%;
min-height:100%;
}
html {
font-size:62.5%;
}
body {
color:#222;
font:1.2em 'Optima', Arial;
}
body#index {
background:url(images/bg3.jpg) fixed repeat left top; 	
}
body#page2 {
background:url(images/bg4.jpg) fixed repeat left top; 	
}
div#container {
margin:0px auto;
position:relative;
width:504px;
}
div#main {
background: transparent url(images/mainbg.png) repeat-y left top;
padding:10px 27px;
}
h1 {
background: transparent url(images/h1.png) no-repeat left 12px;
height:0px;
margin:0px auto;
overflow:hidden;
padding-top:168px; /* to hide h1 text */
width:504px;
}
h2 {
font-size:1.2em;
margin:14px 60px 8px 0;
text-align:center;
text-decoration:underline;
}
h3 {
font-size:1.1em;
margin:12px 0 4px;
}
p {
line-height:1.4em;
margin:4px 0 8px;
padding:0 20px;
text-align:justify;
}
a:link,
a:visited {
color:#000;
}
a:hover,
a:active {
color:#369;
}
ul#services {
list-style-type:square;
list-style-position:inside; 
margin:0px auto 10px;
width:310px;
}
ul#services li {
margin:2px 0;
}
blockquote {
padding:8px 10px 2.5em 20px;
position:relative;
text-align:justify;
}
div.cite {
bottom:0;
position:absolute;
right:10px;
text-align:right;
width:300px;
}
#footer {
background:transparent url(images/footer.png) no-repeat left bottom;
padding:10px 0px;
}
#footer p {
text-align:center;	
}
#footer p span {
padding:0 10px;
}
a#futurekode {
color:#1558bd;
float:right;
font-family:Verdana;
text-decoration:none;
}
a#futurekode:hover {
color:#f33307;
text-decoration:none;
}
a#futurekode span {
background:url(http://www.futurekode.com/images/futurekodeicon.png) no-repeat left top;
font-size:1.1em;
margin:0;
padding:0 0 0 20px;
}
a.backtotop {
background:url(images/backtotop.png) no-repeat left 2px;
color:#555;
float:right;
font-size:10px;
margin-top:10px;
padding-left:10px;
text-decoration:none;
}
a.backtotop:hover,
a.backtotop:active {
color:red;	
}
span.italic {
font-style:italic
}

/* menu css from cssplay.co.uk the best css site on the web! - Thanks Stu! */
#menu {
list-style:none;
padding:20px 0 0 20px;
position:absolute;
top:108px;
left:0;
width:480px;
z-index:10;
}
#menu li {
display:block;
float:left;
margin: 0 -13px -1px 0;
}
#menu li a {
display:block;
text-decoration:none;	
}
#menu li a em {
float:left;
padding:0 20px;
height:22px;
border-top:1px solid #fff;
border-bottom:1px solid #000;
position:relative;
z-index:100;
font-style:normal;
color:#fff;
background:#f93 url(images/tab_d.gif) repeat-x bottom left;
font-size:11px;
font-family:verdana;
line-height:20px;
}
#menu li a b {
font-size:0;
line-height:0;
position:relative;
border-bottom:1px solid #000;
border-top:1px solid #fff;
width:1px;
display:block;
float:left;
z-index:300;
background:#f93 url(images/tab_d.gif) repeat-x bottom left;
}
#menu li b.p1 {height:19px; background:#fff; margin-top:4px; border-top:0; z-index:100;}
#menu li b.p2 {height:19px; margin-top:2px; border-top:2px solid #fff; border-bottom:1px solid #888; z-index:100;}
#menu li b.p3 {width:2px; height:21px; margin-top:1px; z-index:100;}
#menu li b.p5 {height:20px; margin-top:2px;}
#menu li b.p6 {height:19px; margin-top:3px;}
#menu li b.p7 {height:18px; margin-top:4px;}
#menu li b.p8 {height:17px; margin-top:5px;}
#menu li b.p9 {height:16px; margin-top:6px;}
#menu li b.p10 {height:15px; margin-top:7px;}
#menu li b.p11 {height:14px; margin-top:8px;}
#menu li b.p12 {height:13px; margin-top:9px;}
#menu li b.p13 {height:12px; margin-top:10px;}
#menu li b.p14 {height:11px; margin-top:11px;}
#menu li b.p15 {height:10px; margin-top:12px;}
#menu li b.p16 {height:9px; margin-top:13px;}
#menu li b.p17 {height:8px; margin-top:14px;}
#menu li b.p18 {height:7px; margin-top:15px;}
#menu li b.p19 {height:6px; margin-top:16px;}
#menu li b.p20 {height:5px; margin-top:17px;}
#menu li b.p21 {height:4px; margin-top:18px;}
#menu li b.p22 {height:3px; margin-top:19px;}
#menu li b.p23 {height:2px; margin-top:20px;}
#menu li b.p24 {height:1px; margin-top:21px;overflow:hidden;}
#menu li b.p25 {width:1px; height:1px; background:#fff; margin-top:22px; border-top:0; overflow:hidden;}
#menu li b.p26 {width:1px; height:1px; background:#000; margin-top:23px; border:0; overflow:hidden;}

#menu li em b.shdw {position:absolute; display:block; left:-4px; bottom:0; border:0; width:17px; height:17px; background: #f93 url(images/tab_a.gif) bottom left; z-index:500;}

#menu li a:hover,
#menu li a:focus, 
#menu li a:active 
{white-space:nowrap; color:#000; position:relative; z-index:500; cursor:pointer;}
#menu li a:hover em, 
#menu li a:focus em, 
#menu li a:active em 
{color:#800; background:#fc8 url(images/tab_b.gif) bottom left; border-bottom-color:#888;}
#menu li a:hover em b.shdw,
#menu li a:focus em b.shdw, 
#menu li a:active em b.shdw  
{visibility:hidden;}
#menu li a:hover b, 
#menu li a:focus b, 
#menu li a:active b 
{background:#fc8 url(images/tab_b.gif) bottom left; border-bottom-color:#888;}
#menu li a:hover b.p1, 
#menu li a:focus b.p1, 
#menu li a:active b.p1 
{background:#fff; border-bottom-color:#888;}
#menu li a:hover b.p25, 
#menu li a:focus b.p25, 
#menu li a:active b.p25 
{background:#fff; border-bottom-color:#888;}
#menu li a:hover b.p26, 
#menu li a:focus b.p26, 
#menu li a:active b.p26 
{background:#888;}

#index #menu li.index a,
#page2 #menu li.page2 a,
#index #menu li.index a:hover,
#page2 #menu li.page2 a:hover,
#index #menu li.index a:active,
#page2 #menu li.page2 a:active
{white-space:nowrap; color:#000; position:relative; z-index:600; cursor:default;}
#index #menu li.index a em,
#page2 #menu li.page2 a em,
#index #menu li.index a:hover em,
#page2 #menu li.page2 a:hover em,
#index #menu li.index a:active em,
#page2 #menu li.page2 a:active em
{color:#800; background:#fff url(images/tab_c.gif) bottom left; border-bottom-color:#fff;}
#index #menu li.index a em b.shdw,
#page2 #menu li.page2 a em b.shdw,
#index #menu li.index a:hover em b.shdw,
#page2 #menu li.page2 a:hover em b.shdw,
#index #menu li.index a:active em b.shdw,
#page2 #menu li.page2 a:active em b.shdw
{visibility:hidden;}
#index #menu li.index a b,
#page2 #menu li.page2 a b,
#index #menu li.index a:hover b,
#page2 #menu li.page2 a:hover b,
#index #menu li.index a:active b,
#page2 #menu li.page2 a:active b
{background:#fff url(images/tab_c.gif) bottom left; border-bottom-color:#fff;}
#index #menu li.index a b.p1,
#page2 #menu li.page2 a b.p1,
#index #menu li.index a:hover b.p1,
#page2 #menu li.page2 a:hover b.p1,
#index #menu li.index a:active b.p1,
#page2 #menu li.page2 a:active b.p1
{background:#fff; border-bottom-color:#ececec;}
#index #menu li.index a b.p26,
#page2 #menu li.page2 a b.p26,
#index #menu li.index a:hover b.p26,
#page2 #menu li.page2 a:hover b.p26,
#index #menu li.index a:active b.p26,
#page2 #menu li.page2 a:active b.p26 {
width:1px; height:1px; background:#fff; margin-top:23px; border-top:0px; overflow:hidden;
}


.SM {
color:#333333;
padding-left:40px;
}
.RE {
color:#996633;
padding-left:40px;
}
.RE span,
.SM span {
margin-left:-30px;
}

div#top {
margin:0px auto 2em;
width:200px;
}
div#top a {
background:url(images/cvkey.gif) no-repeat left center;
font-weight:bold;
display:block;
margin:3px 0 0 2.3em;
padding-left:1em;
}
.clearer {
clear:both;
font-size:0;
height:0;
line-height:0;
overflow:hidden;
}

/* drop down contact details */

#dropdownpanel {
left: 0;
position: fixed;
top: 0;
visibility:hidden;
width: 100%;
z-index:100;
}
#dropdownpanel .contentdiv {
background: url(images/dropdown.gif) repeat-x left top;
color: #fff;
position:relative;
}
#dropdownpanel .contentdiv p {
font:1.4em Lucida Sans, Arial, Verdana;
margin:0;
padding:4em 0 0;
text-align:center;
}
#dropdownpanel .contentdiv p span {
margin:0 1.4em;
}
#dropdownpanel .contentdiv p span a {
color:#fff;
}
#dropdownpanel .contentdiv span.clicktoclose {
background:url(images/clicktoclose.png) no-repeat left top;
height:40px;
position:absolute;
bottom:0px;
right:0px;
width:400px;
}
#dropdownpanel .control {
background: transparent url(images/panel.png) 25% center no-repeat;
border-top: 3px solid #1f5ad4;
color: white;
font-weight: bold;
height: 24px;
line-height: 24px;
padding-bottom: 3px;
}