/* CSS document for 9web website */
body {font: 76%/1.5 Arial, Helvetica, sans-serif; background:#9FC6CD url(images/water_541.gif)  ; color:#6A665B  ; text-align:center; margin:10px 0;}
html {min-height: 100.01%}

/* Kill all browser defaults */
* {margin:0; padding:0;}
/* end */

/* links */
a:link, a:visited {color:#2B88A8  ; text-decoration:none;}
a:hover {text-decoration:underline;}
a {outline:none;}
h4 a:link, h4 a:visited, h5 a:link, h5 a:visited, h6 a:link, h6 a:visited {color:#4B888D  ;}
div.intro h4 a:link, div.intro h4 a:visited {color:#2B88A8;}
/* end links */

/* page containers */
p.skip {display:none;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
/* div#header {background:url(images/headerbg.png) repeat-x #020436  ;}*/
div#headerinner {margin:0 auto; text-align:left; width:910px; background:#ffffff; height:200px;}
div#contentholder {margin:0 auto; text-align:left; width:910px; background:#fff; padding:0 0 18px 0;}

/* end page containers */

/* logo */
div#logo {float:left; padding:18px;}
div#logo h1 a {background:url(images/printlogo.png) no-repeat; text-indent:-9999em; width:300px; height:70px; display:block;}
div#logo img {display:none;}
/* end logo */

/* primary navigation */
.container {float:right; font-size:1.2em;font-weight:bold;padding: 35px 15px 0px 15px;margin: 3px;background: #fff;}
div.navigation{}
div.alignleft{float:left;}
div.alignright{float:right;}

/* circle */
#navCircle {margin: 0;padding: 0 0 20px 10px;border-bottom: 1px solid #9FB1BC;}
#navCircle li {margin: 0;display: inline;list-style-type: none; }
#navCircle a:link, #navCircle a:visited {float: left;line-height: 14px;font-weight: bold;padding: 0 12px 6px 12px;text-decoration: none;color: #708491;}
#navCircle a:link.active, #navCircle a:visited.active, #navCircle a:hover {padding-bottom: 6px;color: #000;background: url(images/circle.gif) no-repeat bottom center;}
/* end primary navigation */


/* strap sentence */
div#strap {float:left; width:908px; background:url(images/strap.png) repeat-x bottom #72973E  ; border:1px solid #9CB973  ; border-bottom:none;}
div#strap h2 {color:#fff; font-size:1.8em; margin:0; font-weight:normal; padding:12px 16px; line-height:1.1; letter-spacing:1px;}
div#strap h2 a {color:#B0D572 ;}
/* end strap sentence */

/* featured projects on home page */
div#featured {float:left; background:url(images/featured.png) repeat-x bottom #EEE9DD  ; margin:0 1px; display:inline; padding:0 8px; width:910px; w\idth:892px; min-height:328px; height:auto !important; height:328px;}
div#featured h3 {margin:24px 0 8px 10px; background:url(images/headings/featured.png) no-repeat; height:28px; text-indent:-9999em;}
div#featured ul {float:left; list-style-type:none; margin:0;}
div#featured ul li {float:left; width:297px; text-indent:-999em;}
div#featured ul li a {display:block; height:247px; background-repeat:no-repeat; background-position:0 0;}
div#featured ul li a:hover {background-position:0 -254px;}

div#featured ul li#featured1 a {background-image:url(images/home-tcs.jpg);}
div#featured ul li#featured2 a {background-image:url(images/home-gos.jpg);}
div#featured ul li#featured3 a {background-image:url(images/home-soas.jpg);}
/* end featured projects on home page */

/* left and right columns */
div#homeleft {float:left; border-right:1px solid #EAE7DF  ; margin:20px 0 0 0; padding:0 18px; width:454px; w\idth:418px;}

div#subleft {float:left; border-right:1px solid #EAE7DF  ; margin:20px 0 0 0; padding:0 18px; width:549px; w\idth:513px;}

div#homeright {float:left; border-left:1px solid #EAE7DF  ; margin:20px 0 0 -1px; padding:0 18px; width:454px; w\idth:418px;}

div#subright {float:left; border-left:1px solid #EAE7DF  ; margin:20px 0 0 -1px; padding:0 18px; width:339px; w\idth:313px;}

div#content{float:left; border-left:1px solid #EAE7DF  ; margin:20px 0 0 -1px; padding:0 18px; }

div#fullwidth {float:left; background:url(images/sub-grad.png) repeat-x top; margin:0 1px 0 1px; padding:0 18px; display:inline; width:910px; w\idth:872px;}
div#left {float:left; background:url(images/sub-grad.png) repeat-x top; margin:0 0 0 1px; padding:0 18px; border-right:1px solid #EAE7DF  ; display:inline;}
div#right {float:left; background:url(images/sub-grad.png) repeat-x top; margin:0 1px 0 -1px; padding:0 18px; border-left:1px solid #EAE7DF  ; display:inline;}
.who div#left {width:591px; w\idth:554px;}
.who div#right {width:317px; w\idth:281px;}
.contact div#left {width:428px; w\idth:392px;}
.contact div#right {width:479px; w\idth:461px; padding-right:0;}
.what div#left {width:594px; w\idth:576px; background:none; margin:0; padding-left:0; padding-top:0px; min-height:300px; height:auto !important; height:300px;}
.what div#right {width:270px; padding:0; background:none; border-left:none;}
.work div#left {width:658px; w\idth:640px; padding-left:0; background:none; margin:0;}
.work div#right {width:212px; padding:0; background:none; border-left:none; margin:0;}
.utility div#left {width:656px; w\idth:620px;}
.utility div#right {width:252px; w\idth:215px;}
.news div#left {width:591px; w\idth:554px;}
.news div#right {width:317px; w\idth:281px;}

.products-list{ list-style-type:none;}
.products-list li, .products li{ float:left; display:block; background:#F7F5F2;padding:10px 12px;text-align:center;}
.products-list li {width:150px; height:150px;}
a.propic  { display:block; width:150px; height:150px; }
a.propic img {}
a.proid { width:150px; height:18px; display:block; line-height:18px; text-transform: uppercase; text-align:center; background-color: #FFF;}
div.more h2{width :200px;display:block;}
div.more{padding:0px;margin:0px;display:block;}
.cblue{float:right;}

/* end left and right columns */


/* headings */
div#left h3, div#right h3, div#fullwidth h3 {margin:24px 0 30px 0; background-repeat:no-repeat; height:28px; text-indent:-9999em;}
div#homeleft h3 {background:url(images/headings/latest.png) no-repeat; height:21px; text-indent:-9999em;}
h3.clients {background:url(images/headings/clients.png) no-repeat; height:25px; text-indent:-9999em;}
h3.ready {background:url(images/headings/ready.png) no-repeat; height:21px; text-indent:-9999em;}
.who div#left h3 {background-image:url(images/headings/senior-team.png);}
.who div#right h3 {background-image:url(images/headings/company.png);}
.who div#right .careers h3 {background:url(images/headings/careers.png) no-repeat; height:21px; text-indent:-9999em; margin:40px 0 10px 0;}
.what h3 {background:url(images/headings/what-we-do.png);}
.work h3 {background-image:url(images/headings/work.png);}
.contact div#left h3 {background-image:url(images/headings/help.png);}
.contact div#right h3 {background-image:url(images/headings/get-in-touch.png);}
.news div#left h3 {background-image:url(images/headings/news.png);}
.news div#right h3 {background-image:url(images/headings/more-news.png);}
.news div#left.archive h3 {background-image:url(images/headings/news-archive.png);}
.news div#right h3.case-studies, h3.case-studies {background-image:url(images/headings/case-studies-head.png);}
div#sitemap h3 {background-image:url(images/headings/site-map.png);}
h3.accessibility {background-image:url(images/headings/accessibility-statement.png);}
h3.terms {background-image:url(images/headings/terms-conditions.png);}
.news div#left.error h3 {background-image:url(images/headings/oops.png);}

.who div#left .careers h3 {background-image:url(images/headings/jobs.png);}
.who div#left h3.front-end-developer {background-image:url(images/headings/front-end-developer.png);}
/* end headings */

/* news */
div.date {width:40px; float:left; border:1px solid #D3D1C6  ; text-align:center; line-height:1.2; margin:10px 0 0 0;}
div.date p {margin:0;}
div.date em {font-size:1.6em; padding:2px 0; font-style:normal; font-weight:bold;}
div.date strong {display:block; background:#B0D572  ; text-transform:uppercase; color:#72973E  ; font-size:1em; padding:2px 0;}
div.newsitem ,.pagecon{float:left; background:#F7F5F2  ; border-top:1px solid #D3D1C6  ; padding:0 12px; margin:10px 0 10px 0;}
.home div.newsitem {width:372px; w\idth:348px;}
.home div.newsitem {width:500px; w\idth:348px;}
div.morenews {float:left; margin:0 0 10px 0;}
.pagecon{width:850px;}

.news div#left div.newsitem {margin:0 0 10px 0; width:554px; w\idth:530px;}
.news div#left.archive div.newsitem margin:10px 0 10px 0; width:512px; w\idth:488px;}

div.newsitem h5.date {font-size:.92em; margin:-4px 0 10px 0;}
div.newsitem h5 {font-size:.92em; margin:10px 0 10px 0;}

.news div#left h3.year {clear:left; float:left; border:1px solid #D3D1C6  ; padding:2px 6px; height:auto; margin:10px 0; background-image:none; text-indent:0; font-size:1.2em; width:554px; w\idth:540px;}

ul.newslinks {width:374px; float:left; margin:4px 0 0 40px; display:inline;}
ul.newslinks li {float:left; list-style-type:none;}
ul.newslinks li.news {float:right;}
ul.newslinks li.rss {}
ul.newslinks li.rss a {background:url(images/rss.gif) no-repeat 0 0; padding:2px 0 0 24px;}
p.rss {margin:30px 0 0 2px;}
p.rss a {background:url(images/rss.gif) no-repeat 0 0; padding:2px 0 0 24px;}
/* end news */

/*pages*/
div.pagecon {}
/*end pages*/

/* quotes */
div.quote {margin:10px 0 23px 0;}
.work div.quote {margin:10px 0 0 0; background:#F7F5F2  ; padding:10px 10px; border-top:1px solid #EAE7DF  ; border-bottom:1px solid #EAE7DF  ; width:640px; w\idth:620px;}
blockquote {padding:4px 10px 0px 20px; background:url(images/ldquo.png) no-repeat 2px 1px;}
blockquote span {background:url(images/rdquo.png) no-repeat right bottom; padding:0 20px 2px 0px; margin:0 10px 0 0;}
.home blockquote p {margin-bottom:6px;}
cite {font-style:normal; font-size:.92em; display:block; font-weight:bold;}
div.portfolio cite {margin:0 0 0 0;}
div.newsitem cite {margin:0 0 10px 0;}
.work div.quote {margin:0 0 10px 0;}
.work div.quote cite {margin:0 0 0 20px;}
div.quote h5 {margin:10px 0 0 20px; font-size:1em;}
/* end quotes */

/* footer */
div#footer {font-size:1em; margin:0 auto 10px auto; text-align:left; width:910px; color:#FFF; background-color: #72973E ; overflow: hidden;}
div#footer ul {float:left; list-style-type:none; white-space:nowrap; margin:10px 0 10px 0px; display:inline;}
div#footer ul li {float:left; padding:0 4px 0 0;}
div#footer a {color:#fff;}
div#footer p {float:right; text-align:right; margin:10px 0px 10px 0; display:inline;}
/* end footer */

/* general typography */
h3 {font-size:1.3em; margin:0 0 6px 0;}
h4 {font-size:1.2em; margin:10px 0 2px 0;}
h5 {font-size:1.1em; margin:0 0 0 0;}
h6 {font-size:.92em; margin:10px 0;}
p {margin:0 0 1em 0;}
acronym {border-bottom: 1px dashed #ccc; cursor: help;}
hr {height:1px; color:#000; border: 0; background-color: #000; margin: 10px 0;}
img {border:none;}
.what div#left h4 {margin:8px 0 10px 0;}
.error h4 {line-height:1.3; margin:0 0 20px 0;}
.error h5 {font-size:1.2em; line-height:1.3; margin:0 0 4px 0;}
h4.after {margin:30px 0 5px 0; border-bottom:1px solid #EAE7DF  ; padding:0 0 2px 0;}
/* end general typography */

/* lists */
div#left ul {margin:0 0 1em 3em;}
div#left ul li {padding:0; list-style-type:square;}
div#left ul ul {margin:.3em 0 .3em 3em;}
div#left ul ul li {list-style-type:square;}
div#left ul ul ul li {list-style-type:square;}
div#left ol {padding:0 0 0 0; margin:.5em 0 1em 3em;}

dl {margin: 0 0 10px 0;}
dt {margin: 10px 0 0 0; font-weight:bold;}
dd {margin: 0 0 0 0;}
/* end lists */

/* paragraph lists */
div.list {font-style:normal; font-weight:normal; margin: 0 0 10px 0;}
div.list p {margin:0;}
/* end paragraph lists */

/* image floats */
img.right {float:right; margin:0 0 10px 10px;}
.caption {margin:0; width:574px; border: 1px solid #E2DED1  ; background-color:#F4F1E7  ;}
.caption img {border-bottom:1px solid #E2DED1  ;}
.caption h5 {margin:0; padding:0 4px; font-size:1em; text-align:center;}
.caption p {margin:0 0 4px 0; padding:0 4px; font-size:1em; text-align:center;}
/* end image floats */

/* tables */
table, th, tr, td {font-size:1em;}
table {margin: .5em 0 1em 0; padding:0; }
th {padding: .2em .4em; background:#E3DAC5  ; text-align:left;}
td {padding: .4em;}
table caption {text-align:left; font-size:1em; font-weight:bold;}
/* end tables */

/* forms */
div.formholder {float:left; width:100%;}
form {margin: 6px 0 10px 0; float:left; background:#F4F1E7  ; padding:16px 16px 16px 16px; border-top:1px solid #E2DED1  ; border-bottom:1px solid #E2DED1  ; }
#commentform { width: 485px;}
fieldset {border:none;}
legend {font-size:1em; margin:0 0 14px 0; color:#6A665B  ; font-weight:bold;}
legend.error {color:#72973E  ;}
* html legend {margin-left:-8px;} /* fudge for IE6 to display the legend correctly */
*:first-child+html legend {margin-left:-8px;} /* fudge for IE7 to display the legend correctly */
label {cursor:pointer; font-weight:normal; display:block; float:left;margin:1px 0 6px 0;}
input, textarea, select {float:left; margin:1px 0 6px 0; border: 1px solid #E2DED1  ; background:#fff;}
input, textarea {padding:1px;}
input, textarea {font-family:Arial, Helvetica, sans-serif; font-size:1em;}
textarea {width:400px;}
option {background: #fff;}
input.checkbox {float:left; margin:0px 0 5px 0; padding:1px 0 3px 0; width:auto; cursor:pointer; border:none;}
input.button {display:inline; margin:5px 0 0 156px; width:auto; cursor:pointer; border:none; float:left; background:transparent;}
form div.line {border-bottom:1px solid #E2DED1  ; margin:0 -16px 16px -16px; height:10px; clear:left;}
form div.line hr {display:none;}
/* end forms */

/* WYSIWYG specific styles [added PS 10.03.08] */
body.mceContentBody {background: #FFF; text-align:left;}
/* lists in */
body.mceContentBody ul {margin:0 0 1em 3em;}
body.mceContentBody ul li {padding:0; list-style-type:square;}
body.mceContentBody ul ul {margin:.3em 0 .3em 3em;}
body.mceContentBody ul ul li {list-style-type:square;}
body.mceContentBody ul ul ul li {list-style-type:square;}
body.mceContentBody ol {padding:0 0 0 0; margin:.5em 0 1em 3em;}
/* lists out */
div.newsitem ul {margin:0 0 1em 3em;}
div.newsitem ul li {padding:0; list-style-type:square;}
div.newsitem ul ul {margin:.3em 0 .3em 3em;}
div.newsitem ul ul li {list-style-type:square;}
div.newsitem ul ul ul li {list-style-type:square;}
div.newsitem ol {padding:0 0 0 0; margin:.5em 0 1em 3em;}
/*commentlist*/
br.clear {clear:both;}