d/* CSS/html by Neil Paterson & Design by Will Price, Civic. */

* {margin:0; padding:0}
body {font-family:arial, verdana, tahoma, helvetica, sans-serif; font-size:91%; padding:0 0 30px 0; margin:0; text-align:center}
#holder {text-align:left; margin:0 auto; width:986px; background:#fff url(../images/css_bg_main.gif) top center repeat-y; }
.wrapper {padding:20px 0 0 0; margin:0 50px 20px 50px}
#content {padding:0 0 30px 0; clear:both}
#left {width:521px; float:left; padding:0 0 15px 0; position:relative}
	body#error #left {width:100%}
#right {width:285px; float:right; padding:0 0 15px 0}
#right div.feeds img {display:none;}

/* main navigation */
ul#nav {position:relative; text-align:left; padding:0; min-height:102px; margin:0}
	* html ul#nav {height:106px}
ul#nav li{line-height:150%; margin:18px 0 0 0; display:block; float:left; width:134px; background:url(../images/css_bg_nav.gif) center left no-repeat; padding:28px 0 0 16px; color:#808080; font-size:75%; position:relative}
ul#nav li.first {margin:18px 0 0 80px}
	* html ul#nav li.first {margin:18px 0 0 80px;}
ul#nav li.last {width:auto;}
ul#nav li a{text-transform:uppercase; color:#009fda; font-weight:bold; font-size:135%; display:block; position:absolute; top:11px; left:15px; border:none}
ul#nav li a:hover, body#about ul#nav li a#nav2, body#work ul#nav li a#nav3, body#news ul#nav li a#nav4, body#contact ul#nav li a#nav5 {color:#808080; text-decoration:none; border:none;}
ul#nav li.logo {float:left;padding:0; margin:0; width:111px; height:96px; display:block; border:none; text-align:left}
ul#nav li.logo a{padding:0; margin:0; width:111px; height:96px; display:block; position:relative; top:0; left:0; line-height:100%}
ul#nav li.logo span {cursor:pointer; width:111px; height:96px; display:block; background:#fff url(../images/css_logo.gif) top left no-repeat; position:absolute; top:0; left:0; text-indent:-9999px}
ul#nav li.error {background:none; float:right; width:auto; font-size:100%}
ul#nav li.error span {color:#009fda}

/* thumbnails */
#right p.thumbs {line-height:100%; margin:0 0 10px 0; padding:0; min-height:200px}
#right p.thumbs img, #right p.thumbs a {margin:0; padding:0; float:left; border-bottom:none;}
ul.thumbs {margin:0 0 15px 0; padding:8px 0 0 0; font-size:91%; min-height:200px; line-height:100%;}
ul.thumbs li {list-style-type:none; float:left; padding:0; margin:0; line-height:100%; background:none; position:relative; display:inline}
ul.thumbs li img, ul.thumbs li a {float:left;}
ul.thumbs li a {margin:0; padding:0; float:left; border:none}
ul.thumbs li a:hover {border:none;}
ul.thumbs li a span {text-indent:-9999px; display:none;}
ul.thumbs li a:hover span {background:url(../images/css_thumb_hover.png); position:absolute; top:0; left:0; width:100%; height:100%; z-index:100; display:block; cursor:pointer}
	* html ul.thumbs li a:hover span {display:none;}
body#about ul.thumbs a span, body#about ul.thumbs a:hover span {display:none;} 
body#about ul.staff {min-height:555px}
body#about ul.staff img {float:left; margin:0; padding:0;}
body#work ul.thumbs {min-height:254px; line-height:100%;}
body#home ul.thumbs {min-height:71px;}
/* on states for portfolio thumbs */
body.port1 ul.thumbs li.t1 span, body.port2 ul.thumbs li.t2 span, body.port3 ul.thumbs li.t3 span, body.port4 ul.thumbs li.t4 span,
body.port5 ul.thumbs li.t5 span, body.port6 ul.thumbs li.t6 span, body.port7 ul.thumbs li.t7 span, body.port8 ul.thumbs li.t8 span,
body.port9 ul.thumbs li.t9 span, body.port10 ul.thumbs li.t10 span, body.port11 ul.thumbs li.t11 span, body.port12 ul.thumbs li.t12 span, body.port13 ul.thumbs li.t13 span, body.port14 ul.thumbs li.t14 span, body.port15 ul.thumbs li.t15 span
 {background:url(../images/css_thumb_hover.png); position:absolute; top:0; left:0; width:71px; height:71px; z-index:100; display:block}

/* news section */
div.story {border-bottom:1px solid #ddd; padding:0 0 12px 0; margin:0 0 10px 0}
body#home div.story {border:none; padding:0;}

/* standard headings, fonts and links */
h1,h2,h3,h4,h5,h6{}
h1{font-weight:normal; font-size:271%; color:#808080; letter-spacing:-0.03em; padding:16px 0 0 0; display:block; clear:both; margin:0 0 23px 0;}
	* html h1{letter-spacing:-0.1em; padding:12px 0 0 0}
h1 span {color:#009fda}
h2, body#news #right h2 {position:relative; color:#009fda; border-bottom:3px solid #009fda; margin:0 0 7px 0; padding:0 0 5px 0; font-size:111%; display:block; float:none;}
h2 a.rss {background:url(../images/css_rss.gif) center left no-repeat; height:16px; width:16px; display:none; text-indent:-9999px; position:absolute; top:3px; right:0; border-bottom:1px dotted #fff}
#right h2 a {color:#009fda; text-decoration:none}

#right h2.bird span {background:url(../images/css-h2-bird.gif) center right no-repeat; padding:0 27px 0 0}
#right h2.pipes span {background:url(../images/css-h2-pipes.jpg) center right no-repeat; padding:0 22px 0 0}
#right h2.flickr span {background:url(../images/css-h2-flickr.jpg) center right no-repeat; padding:0 22px 0 0}
#right h2.delicious span {background:url(../images/css-h2-delicious.jpg) center right no-repeat; padding:0 22px 0 0}
h3{color:#4DBCE5; margin:0 0 10px 0; padding:13px 0 0 0; font-size:100%}
body#news h3, body#home h3 {color:#4DBCE5; margin:0 0 10px 0; padding:3px 0 0 0; font-size:100%; border:none; display:inline; float:left; width:auto}
body#news h4, body#home h4 {padding:0; margin:2px 0 0 0; display:inline; float:right; width:auto; color:#009FDA; font-weight:normal; background:#CCECF8 url(../images/css_h3_left.gif) center left no-repeat; font-size:91%;}
body#news h4 span, body#home h4 span {background:url(../images/css_h3_right.gif) center right no-repeat; padding:2px 8px 0 8px; display:block;  height:17px;}
	* html body#news h4 span, * html body#home h4 span {width:100px}
body#news p, body#home p {clear:both}
img {border:none;}
p {color:#555; line-height:145%; margin:0 0 15px 0; font-size:95%;}
a {color:#EC008C; border:none; border-bottom:1px dotted #EC008C; text-decoration:none}
a.image, a.image:hover {border:none;}
a:hover {color:#555; border-bottom:1px dotted #fff; text-decoration:none}
#right p, #right ul {font-size:91%;}
a.newWin {background:url(../images/newWin.gif) 0 5px no-repeat; padding:0 0 0 13px; position:relative; height:1%}
a.external {padding:0 0 0 10px; background:url(../images/css_li.gif) 0 5px no-repeat; position:relative; height:1%}
a.plain {text-decoration:none; border:none;}
#wide p.plain img {margin:0; padding:0; float:left;}
ul {margin:0 0 15px 0}
#right ul#pipes li {line-height:140%;}
li {color:#555; padding:0 0 0 12px; background:url(../images/css_li.gif) 0 5px no-repeat; position:relative; margin:0 0 4px 0}
#right ul#pipes li span {clear:both; display:block;}
img.newWin, #left img.newWin {margin:0 5px 0 0}
#right ul.logos {height:110px;}
#right ul.logos li {background:none; padding:0; margin:0; display:block; float:left; text-indent:-9999px; clear:none;}
#right ul.logos li.sun {width:94px; height:25px; background:url(../images/partner-sun.jpg); margin:0 5px 0 0 }
#right ul.logos li.oracle {width:185px; height:25px; background:url(../images/partner-oracle.jpg) center left}

#right ul.logos li.C2 {width:125px; height:76px; background:url(../images/partner-c2.jpg) center left; margin-top:5px}

body#home #right a.wideImage {width:285px; height:93px; display:block; text-indent:-9999px; background:url(../images/visualisation.jpg); border:none; text-decoration:none;}
body#home #right a:hover {border:none; text-decoration:none;}

/* misc */
table{font-size:100%}
img{border:0}
img.fr, img.floatRight {float:right; margin:0 0 5px 5px!important}
img.fl, img.floatLeft {float:left; margin:0 5px 5px 0!important}
hr{height:1px; border:0; line-height:1px; clear:both; color:#000; background:#000}label{}caption{font-weight:bold; text-align:left} ul{list-style-type:none}
.clear{clear:both; height:1px; line-height:1px; font-size:1px; margin-top:-1px; display:block; width:100%;}
#left img {margin:0 7px 0 0}
#left a img {margin:0;}
/* forms */
form{margin:0; padding:0; border:0}
fieldset{border:0}
input {border:1px solid #009fda; padding:2px; width:279px; margin:0 0 7px 0}
.voteContainer input {border:none; padding:0; width:auto; margin:0 5px 0 0}
input, select, textarea{font-size:91%; font-family:arial, verdana, tahoma, helvetica, sans-serif}
input, select{vertical-align:middle}
textarea{vertical-align:top; border:1px solid #009fda; padding:2px; width:279px; height:119px; margin:0 0 7px 0}
label {clear:both; color:#4DBCE5; display:block; margin:0 0 7px 0; font-weight:bold; font-size:100%;}
legend {display:none}
input.submit {background:url(../images/css_li.gif) center left no-repeat; padding:0 0 0 10px; margin:0 0 15px 0; border:none; width:auto; clear:both}
hr.clearfix {margin:0; width:886px; height:1%; text-indent:-9999px; border:none; background:#fff; float:left; display:block; clear:both;}
.hide {display:none}

/* footer */
div#footer {min-height:140px; clear:both; padding:0 50px 0 50px; background:url(../images/css_bg_footer.gif) bottom center no-repeat; font-size:75%;}
	* html div#footer {height:140px;}
div#footer ul {border-top:1px solid #009fda; padding:20px 0 0 0}
div#footer ul li {float:left; width:150px; color:#009fda; background:none; padding:0; line-height:150%;}
	* html div#footer ul li {margin:0;}
div#footer ul li.last {width:135px}
div#footer ul li a {position:relative}
div#footer ul li.last a {display:block;width:110px;height:74px;background:url(../images/css-rar.gif) no-repeat;text-indent:-5000px;border:0}
/*span.iso27001 {width:54px; height:41px; display:block; float:left; background:url(../images/iso27001.jpg); text-indent:-9999px; margin:0 1px 0 0; font-size:1%; color:#fff}
span.iso9001 {width:47px; height:41px; display:block; float:left; background:url(../images/iso9001.jpg); text-indent:-9999px; margin:0 1px 0 0; font-size:1%; color:#fff}
span.ukas {width:32px; height:41px; display:block; float:left; background:url(../images/ukas.jpg); text-indent:-9999px; font-size:1%; color:#fff}*/

/* map styling */
#map1, #map2, #map3 {width:519px; height:400px; border:1px solid #009fda}

/* flickr thumbs */
#flickr {margin:0 0 35px 0; padding:8px 0 0 0; height:140px; line-height:100%;}
#flickr ul li, #flickr img, #flickr ul li a {width:70px!important; height:70px!important; float:left; margin:0; padding:0;}
#flickr a {margin:0; float:left; border:none;}

/* this is required */
#pipes {}

/* slider */
#slider-nav {position:absolute; top:-1px; right:0; z-index:100; list-style:none; margin:0; padding:0; padding-bottom:9px; font-size:91%;}
#slider-nav li {display: inline; margin:0; padding:0; background:none; }
#slider-nav li a {float:left; padding:0 6px 0 6px; border-right:1px solid #767676; text-decoration:none; border-bottom:none;}
#slider-nav li.last a {border:none; margin:0; padding:0 0 0 6px; border:none;}
#slider {margin: 0 auto; overflow: hidden; height: 402px; width: 521px; position: relative;}
#slider-wrapper {width: 1563px; height: 402px;	position: relative;}
.slider-content {width: 521px; height: 402px; text-align: center; position: absolute;}
#content1 {left: 0; top: 0;}
#content2 {left: 521px; top: 0;}
#content3 {left: 1042px; top: 0;}

/* tooltips */
.tool-tip {text-align:left; color:#009fda; z-index: 13000; line-height:140%; font-size:81%;text-align:left; cursor:pointer; position:absolute; z-index:100; background:url(../images/css_tooltip.png) top left no-repeat; padding:8px 20px 15px 34px; color:#009fda; display:none; font-weight:bold; height:72px; width:116px; display:block; font-weight:normal}
* html .tool-tip {background:url(../images/css_tooltip.gif) top left no-repeat}
.tool-title {font-weight: bold;	margin: 0;	color:#009fda}

/* table */
table {width:100%; margin:0 0 10px 0; border-collapse:collapse; padding:0}
table th {color:#009fda; border-bottom:3px solid #009fda; margin:0 0 7px 0; padding:0 0 5px 0; font-size:111%; background:#fff;}
table td {padding:3px;}
table tr.odd {background:#E5F5FB}

form#xmasRegistrations input 
form#xmasRegistrations p label {clear:none; color:#555; display:inline; margin:2px 0 0 0; font-weight:normal; font-size:100%;}
form#xmasRegistrations p.submit label {clear:none; color:#555; display:inline; margin:0 0 7px 0; font-weight:normal; font-size:100%;}
form#xmasRegistrations p.submit span {clear:both; display:block; width:800px; margin:0 0 3px 0}
form#xmasRegistrations p.submit input {border:none; width:auto; margin:3px 7px 0 0; float:left;}