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

body {
  font-size: 62.5%;
  margin: 0;
  padding:0;
  font-family: Arial, Helvetica, sans-serif;
  text-align: center;
  margin: 20px 0;
}
div.access {
  position:absolute;
  left:-9000em
}
#wrapper {
  width: 980px;
  background-color: #FFFFFF;
  margin: 0 auto;
}
#main {
  float: left;
  padding: 13px 0 0 0;
}
img {
  border:0;
}
/*--------------------- Header ---------------------*/

#header {
  width: 980px;
  background-color: #FFFFFF;
  float:left;
  text-align:left;
}
#header #logo {
  float: left;
  padding: 0 0 15px 3px;
}
#header #navarea {
  float: right;
  padding: 42px 0 0 0;
}
#header #navarea #navbottom {
  text-align: right;
  float: right;
}
#header #navarea #navbottom form {
  margin: 0;
  padding: 0;
  float: left;
}
#header #navarea #navbottom form label {
  display:none;
}
#header #navarea #navbottom .textbox {
  font-family: Arial, Helvetica, sans-serif;
  background-color: #FFFFFF;
  border: solid 1px #c7c8c5;
  height: 16px;
  margin: 0;
  color: #808285;
  font-size: 1.2em;
  float: left;
  padding: 1px 0 0 5px;
  margin: 0 5px 0 0;
  width: 120px;
}
#header #navarea #navbottom .servicesmargin {
  margin-right: 10px;
}
#header #navarea #navbottom .servicesmargin label {
  display:none;
}
#header #navarea #navbottom #register {
  cursor: pointer;
}
#header #navarea #navbottom .submitbtn {
  margin: 0;
  border: none;
  float: left;
  margin: 0 10px 0 0;
}
#header #navarea #navbottom .submitbtnlast {
  margin: 0;
  border: none;
  float: left;
  margin: 0;
}
#header #navarea #navbottom select {
  background-color: #FFFFFF;
  border: solid 1px #c7c8c5;
  height: 19px;
  margin: 0;
  color: #808285;
  font-size: 1.2em;
  float: left;
  padding: 0 0 0 5px;
  margin: 0 5px 0 10px;
  width: 120px;
}
/*------------------------- latest news box -------------------------*/
#latestNews
{
  float: left;
  width: 948px;
  margin-bottom: 9px;
  padding: 22px 15px;
  position: relative;
  background-color: #eef2f1;
  border: dotted 1px #d1d1d1;
  font-size: 1.4em;
  font-weight: bold;
}
#latestNews .label
{
  float: left;
  padding-right: 8px;
  color: #b6bd1a;
}
#latestNews div.scrollWrapper
{
  position: relative;
  overflow: hidden;
  height: 16px;
  width: 847px;
}
#latestNews div.scrollableArea
{
  position: relative;
  height: 16px;
}
#latestNews div.scrollableArea span
{
  position: relative;
  float: left;
  padding: 0 10px 0 4px;
  background: url(images/latestnews-separator.gif) no-repeat center right;
  text-decoration: none;
  color: #808285;
}
#latestNews div.scrollableArea span a
{
  text-decoration: none;
  color: #808285;
}
/*------------------------- drop down box -------------------------*/

.dhtmlselect { /*style of DHTML Select Menu, main box */
  background-color: #FFFFFF;
  border: solid 1px #c7c8c5;
  height: 17px;
  color: #808285;
  font-size: 1.2em;
  float: left;
  padding: 0 0 0 5px;
  margin: 0 25px 0 0;
  width: 120px;
  z-index: 5;
  text-align: left;
  position: relative;
}
.dhtmlselect .downimage { /*style of "down" image to the right of the DHTML Select Menu*/
  position: absolute;
  right: -26px;
  margin: -1px 0 0 0;
}
.dhtmlselect .dropdown { /*style of Drop Down Menu that appears onMouseover */
  position: absolute;
  left: -1px;
  width: 150px;
  display: none;
  z-index: 5;
  padding-top: 5px;
}
.dhtmlselect .dropdown2 {
  border: 1px solid #c7c8c5;
  width: 150px;
}
.dhtmlselect .dropdown a { /*style of Drop Down Menu's links */
  width: auto;
  display: block;
  background: #ffffff;
  padding: 3px 0 3px 5px;
  text-decoration: none;
  color: #808285;
  z-index: 5;
  line-height: 1.1em;
}
* html .dhtmlselect .dropdown a { /*IE 6 (and below) hack */
  width: 100%;
}
.dhtmlselect .dropdown a:hover {
  background: #808285;
  color: #fff;
}
/*------------------------- end drop down box -------------------------*/


/*--------------------- Content ---------------------*/

h1 {
  font-size: 2.3em;
  font-weight:normal;
  color: #aeabab;
  margin: 0;
  padding: 0 0 4px 0;
}
h1.twotone {
  color: #aeabab;
}
h1.twotone span {
  color: #c4bfbf;
  border-left: 1px solid #999;
  padding: 0 0 0 8px;
  margin: 0 0 0 5px;
}
h2 {
  font-size: 1.4em;
  color: #999999;
  margin: 0;
  padding: 8px 0 4px 0;
  font-weight: normal;
}
h2.greybgtitle {
  color: #666666;
  background-color: #eef2f1;
  padding: 4px 0 3px 5px;
  margin: 4px 0;
}
h2.greybgtitle span {
  color: #999999;
  border-left: 1px solid #999;
  padding: 0 0 0 8px;
  margin: 0 0 0 5px;
}
h3 {
  font-size: 1.2em;
  color: #999999;
  margin: 0;
  padding: 8px 0 4px 0;
}
h4 {
  font-size: 1.2em;
  color: #999999;
  margin: 0;
  padding: 8px 0 4px 0;
}
p {
  font-size: 1.2em;
  color: #666666;
  margin: 0;
  padding: 8px 0;
  line-height: 1.25em;
}
#contentcol li {
  font-size: 1.2em;
  color: #666666;
}
.area li {
  font-size: 1.2em;
  color: #666666;
}
.errormsg {
  color: #FF0000;
  font-weight: bold;
}
#image {
  width: 980px;
  float:left;
}

#player {
  width: 980px;
  float:left;
}
/* Content and column styling*/

#content {
  float: left;
  clear: none;
  width: 980px;
  text-align: left;
  padding:0;
}
/*--------------------- Links ---------------------*/

#content a:link, #content a:visited {
  color:#666666;
  text-decoration: underline;
}
#content a:hover, #content a:focus, #content a:active {
  text-decoration: none;
}
.upper {
  float:left;
  clear: none;
  width: 980px;
  text-align: left;
  padding:0;
}
.lower {
  float:left;
  clear: none;
  width: 980px;
  text-align: left;
  padding:0;
}
.area {
  float:left;
  clear: none;
  width: 311px;
  text-align: left;
  padding:5px 7px 10px 7px;
  border:1px dotted #cccccc;
  border-right:none;
  height:335px;
  overflow: hidden;
}
.area2 {
  float:left;
  clear: none;
  width: 641px;
  text-align: left;
  padding:5px 5px 10px 5px;
  border:1px dotted #cccccc;
  border-right:none;
  border-top:none;
  height:335px;
}
.area2content {
  float:left;
  clear: none;
  text-align: left;
  padding:15px 5px 10px 5px;
}
.area2content .openImage {
  float:left;
  clear: none;
  text-align: left;
  border-right:1px dotted #cccccc;
  padding:105px 5px 117px 10px;
  margin-right:10px;
}
.area2content .copy {
  float:left;
  clear: none;
  text-align: left;
  width:220px;
  padding:0 5px 117px 10px;
  margin-right:10px;
}
.area2content .closeImage {
  float:left;
  clear: none;
  text-align: left;
  border-left:1px dotted #cccccc;
  padding:105px 5px 117px 10px;
  margin-left:10px;
}
.right {
  border-right:1px dotted #cccccc!important;
}
.topbordernone {
  border-top:none;
}
.area .findOut a, .areal .findOut a, .arear .findOut a, #contentcol .findOut a {
  background-image:url(images/find-out-more.gif);
  background-repeat:no-repeat;
  background-position:0 2px;
  padding-left:11px;
  color: #b6bd1a!Important;
  text-decoration: none!Important;
}
.area .findOut a:hover, .areal .findOut a:hover, .arear .findOut a:hover, #contentcol .findOut a:hover {
  color: #d3d776!Important;
  text-decoration: none!Important;
}
.downloadlink {
  padding-bottom: 25px;
}
.downloadlink a {
  background-image:url(images/download.gif);
  background-repeat:no-repeat;
  background-position:0 2px;
  padding-left:17px;
  color: #b6bd1a!Important;
  text-decoration: none!Important;
}
.downloadlink a:hover {
  color: #d3d776!Important;
  text-decoration: none!Important;
}
/* Grey header in content including images styling */

.areaHeading {
  height:20px;
  background-color:#eef2f1;
  padding: 2px 0 0 0;
}
.areaHeading h2 {
  padding:0 10px 0 10px;
  margin:0;
  font-size:1.4em;
  color:#808285;
  /*width:200px;*/
  float:left;
  font-weight: normal;
}
.areaHeading .date {
  font-size:1.4em;
  color:#808285;
  float:right;
  padding: 0 5px 0 0;
}
.areaHeading .tabs {
  padding:3px 5px 0 0;
  margin:0;
  float:right;
  width: 34px;
}
.tabs .arrow-back a {
  float: left;
  height: 14px;
  width: 14px;
  background: url(images/arrow-back2.gif) 0 0 no-repeat;
  text-indent: -9000em;
}
.tabs .arrow-back a:hover {
  background-position: -14px 0;
}
.tabs .arrow-forward a {
  float: left;
  height: 14px;
  width: 14px;
  background: url(images/arrow-forward2.gif) 0 0 no-repeat;
  text-indent: -9000em;
  margin-left: 5px;
}
.tabs .arrow-forward a:hover {
  background-position: -14px 0;
}
.areaHeading .tabs img {
  padding-left:5px;
}

.tabs .arrow-forward a, .tabs .arrow-forward a:active, .tabs .arrow-forward a:focus, .tabs .arrow-back a, .tabs .arrow-back a:active, .tabs .arrow-back a:focus {
  outline: none;
  -moz-outline-style: none;
}

/* ----------------------- homepage boxes javascript bit ---------------------- */

#ourservicesbox, #newseventsbox, #casestudiesbox {
  overflow: hidden;
  height:310px;
  width: 311px;
}


#base {
  width: 955px;
  color: #FFFFFF;
  clear: both;
}
.twitter {
  float:left;
  clear:none;
  padding:3px 5px 0 5px;
  width:16px;
}
.rssfeed {
  background:url(images/rss-feed-icon.gif) 0 7px no-repeat;
  padding-left: 22px;
}
#rightcol p.rssfeed {
  background:url(images/rss-feed-icon.gif) 0 7px no-repeat;
  padding-left: 22px;
  padding-bottom:12px;  /* Used to be 17px; but shortened to fix border error on amend sheet */
}
.floatLeft {
  float:left;
  clear:none;
}
.floatRight {
  float:right;
  clear:none;
}
.addborder {
  border:1px dotted #cccccc;
}
#breadcrumbs {
  text-align: left;
}
#breadcrumbs ul {
  margin: 0;
  padding: 0;
  height: 20px;
}
#breadcrumbs ul li {
  list-style: none;
  margin: 0;
  padding: 0 8px;
  float: left;
  border-left: #cccccc solid 1px;
  line-height: 0.8em;
}
#breadcrumbs ul li.first {
  border-left: none;
}
#breadcrumbs ul li a {
  color: #999999;
  font-size: 1.1em;
  text-decoration: none;
}
#breadcrumbs ul li a:hover {
  text-decoration: underline;
}
#contentcol {
  float: left;
  width: 448px;
  border-left: #cccccc dotted 1px;
  border-right: #cccccc dotted 1px;
  padding: 5px 8px 8px 8px;
}
#contentcolwide {
  float: left;
  width: 694px;
  border-left: #cccccc dotted 1px;
  padding: 5px 8px 8px 8px;
}
#contentcolwidenp {
  float: left;
  width: 709px;
  border-left: #cccccc dotted 1px;
  padding: 0;
}
#contentcol label {
  display:none;
}
#ourworkaddpadding {
  padding: 8px 0 44px 8px;
}
.dottedlinev {
  background: url(images/dots-vertical.gif) 460px 0 repeat-y;
}
#rightcol {
  float: left;
  width: 230px;
  padding: 5px 8px 8px 8px;
}
#rightcol label {
  display:none;
}
#rightcol h2 {
  background: #eef2f1;
  font-size: 1.4em;
  color: #808285;
  margin: 0;
  padding: 4px 0 4px 10px;
  font-weight: normal;
}
#rightcol p {
  font-size: 1.2em;
  color: #666666;
  margin: 0;
  padding: 8px 4px 8px 6px;
}
#rightcol .findOut {
  padding: 2px 4px 16px 6px
}
#rightcol .findOut a {
  background: url(images/find-out-more.gif) 0 2px no-repeat;
  padding: 0 0 0 11px;
  color: #b6bd1a!Important;
  text-decoration: none!Important;
}
#rightcol .findOut a:hover {
  color: #d3d776!Important;
  text-decoration: none!Important;
}
.divider {
  border-top: #cccccc dotted 1px;
  height: 1px;
  line-height: 1px;
  font-size: 1px;
}
.formstyle input, .formstyle select, .pennapeoplesubnav input, .pennapeoplesubnav select {
  border: 1px solid #cccccc;
  color: #999999;
  font-size: 1.2em;
}
.formstyle textarea {
  border: 1px solid #cccccc;
  color: #999999;
  font-size: 1.2em;
  width:143px;
}
#rightcol p.testimonialname {
  font-size: 1.2em;
  color: #999494;
  margin: 0;
  padding: 5px 4px 8px 6px;
}
#newseventsheader {
  padding: 8px 8px 36px 8px;
  clear: both;
}
/* ----------------- Penna People -------------------- */

.pennapeoplesubnav input {
  width: 248px;
  margin-top: 6px;
  padding-left: 3px;
}
.pennapeoplesubnav select {
  width: 253px;
  margin-bottom: 3px;
}
.pennapeoplesubnav .submitbutton {
  width: 74px;
  padding-left: 0;
  border: none;
}
#content .pennapeoplenav, #content .ourworknav {
  margin: 0;
  padding: 0;
  clear: both;
}
#content .pennapeoplenav li, #content .ourworknav li {
  margin: 2px;
  padding: 0;
  list-style: none;
  float: left;
}
#content .pennapeoplenav li a, #content .ourworknav li a {
  margin: 0;
  padding: 2px 4px;
  border: 1px solid #cccccc;
  display: block;
  text-decoration: none!Important;
  font-size: 1.4em;
  width: 12px;
  text-align: center;
  color: #cccccc!Important;
}
#content .ourworknav li a {
  width: 11px;
}
#content .pennapeoplenav li.all a {
  width: 38px;
}
#content .ourworknav li.all a {
  width: 30px;
}
#content .pennapeoplenav li a:hover, #content .pennapeoplenav li a.on, #content .ourworknav li a:hover, #content .ourworknav li a.on {
  background: #cccc33;
  color: #FFFFFF;
}
#content .pennapeopleprofile {
  clear: both;
}
#content .pennapeopleprofile .pennapeoplepic {
  padding: 20px 0 0 0;
}
#content .pennapeopleprofile .pennapeoplepic img {
  border: solid 1px #cccccc;
}
#content .pennapeopleprofile .pennapeopleinfo {
  width: 444px;
  float: left;
  padding-right: 16px;
}
#content .pennapeopleprofile .pennapeopleinfo h2 {
  background-color: #eef2f1;
  margin: 16px 0 6px 0;
  padding: 4px 5px;
  color: #666666
}
#content .pennapeopleprofile .pennapeopleinfo h2 span {
  color: #999999;
  padding: 0 0 0 0px;
  margin: 0 0 0 0px;
}
#content .pennapeopleprofile .pennapeopledetails {
  width: 232px;
  float: left;
}
#content .pennapeopleprofile .pennapeopledetails h3 {
  background-color: #eef2f1;
  margin: 16px 0 6px 0;
  padding: 4px 5px;
  color: #666666;
  font-size: 1.4em;
  font-weight: normal;
}
#content .pennapeopleprofile .pennapeopledetails p {
  color: #999999;
}
#content .pennapeopleprofile .pennapeopledetails strong {
  color: #666666;
  font-weight: normal;
}
/*--------------------- our work ---------------------*/

.ourworkarea .area {
  float:left;
  clear: none;
  width: 340px;
  text-align: left;
  padding:5px 7px 10px 7px;
  border-top:1px dotted #cccccc;
  border-right: none;
  border-bottom: none;
  border-left: none;
  height:320px;
}
.ourworkarea .addborderright {
  border-right:1px dotted #cccccc!Important;
}

/*--------------------- Search ---------------------*/

#content .searchphrase {
  font-size: 1.6em;
  color: #999999;
  float: left;
}
#content .pagination {
  font-size: 1.4em;
  color: #999999;
  float: right;
}
#content .pagination .resultslabel {
  float: left;
  padding-top: 2px;
}
#content .pager {
  float: left;
  padding: 2px 0 2px 4px;
}
#content .pagination .pager a, #content .pagination .pager .disabled, #content .pagination .pager .current {
  color: #cccccc;
  border: 1px solid #cccccc;
  padding: 1px 3px;
  font-size: 1em;
  text-decoration: none;
}
#content .pagination .pager .current, #content .pagination .pager a:hover {
  background: #cccccc;
  color: #FFFFFF;
}


/*--------------------- Footer ---------------------*/

#footer {
  width: 980px;
  padding: 20px 0 5px 0;
  clear: both;
  color: #808285;
}
#footer .greybar {
  height: 20px;
  background-color:#eef2f1;
  padding: 5px 9px 0 9px;
  font-size: 1.4em;
  margin-bottom: 12px;
}
#footer .greybar a {
  color: #999999;
  text-decoration: none;
}
#footer .greybar a:hover {
  text-decoration: underline;
}
#footer .greybar img {
  vertical-align: bottom;
}
#footer .greybar #ourservices {
  cursor: pointer;
  float:left;
  padding: 0 0 0 17px;
}
#footer .greybar .ourservices {
  background: url(images/plus.gif) 0 0 no-repeat;
}
#footer .greybar .ourservicesopen {
  background: url(images/minus.gif) 0 0 no-repeat;
}
#footer #footernav {
  position: relative;
}
#footer #footernav ul {
  padding: 0;
  margin: 0;
  float: left;
}
#footer #footernav li {
  list-style: none;
  margin: 0;
  padding: 0;
  float: left;
}
#footer #footernav a:link, #footer #footernav a:visited {
  display:block;
  text-align:center;
  color: #808285;
  font-size: 1.2em;
  text-decoration: none;
  padding: 0 13px 0 13px;
  border-right: solid 1px #808285;
}
#footer #footernav .last a:link, #footer #footernav .last a:visited {
  padding: 0 0 0 13px;
  border-right: none;
}
#footer #footernav a:hover, #footer #footernav a:focus, #footer #footernav a:active, #footer #footernav .on {
  text-decoration: underline;
}
#footer .copyright {
  font-size: 1.2em;
  float: right;
}
#footer .footerlogos {
  clear: both;
  border-top: #eef2f1 solid 1px;
  margin-top: 45px;
  padding-top: 10px;
  text-align: left;
}
#footer .servicesbox {
  clear: both;
  padding: 30px 0 0 0;
  text-align: left;
  color: #999999;
}
#footer .serviceshide {
  display: none;
}
#footer .servicesbox .col {
  float: left;
  width: 326px;
}
#footer .servicesbox .col ul {
  margin: 0;
  padding: 10px;
  list-style: none;
}
#footer .servicesbox .col ul li {
  margin: 0;
  padding: 0 0 12px 0;
  list-style: none;
  background: url(images/bullet.gif) 0 6px no-repeat;
}
#footer .servicesbox .col ul li a {
  padding: 0 0 0 12px;
  color: #999999;
  text-decoration: none;
  font-size: 1.6em;
}
#footer .servicesbox .col ul li a:hover {
  text-decoration: underline;
}
#footer .servicesbox .col ul ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#footer .servicesbox .col ul li li {
  margin: 0;
  padding: 1px 0 2px 0;
  list-style: none;
  background: url(images/bullet2.gif) 2px 6px no-repeat;
}
#footer .servicesbox .col ul li li a {
  color: #999999;
  text-decoration: none;
  font-size: 1.2em;
}
#footer .servicesbox .middlecol {
  border-left: 1px dotted #cccccc;
  border-right: 1px dotted #cccccc;
}
.servicesboxactive {
  display: block;
}

#content td {
font-family: Arial, Helvetica, sans-serif;
font-size: 1.2em;
color: #666666;

}

#content .table-results { border-collapse: collapse; }

#content .table-results thead { background-color : #EEF2F1; }

#content .table-results td {
    margin : 0px;
    padding : 6px;
    border:1px solid #CCCCCC;
    text-align:left;
    vertical-align:middle;
}


/*------------------- Form Validation ------------------*/

label.error,   p.error {
    width: 250px; display: block; float: right; color: red; padding-left: 10px; 
} 
p.error {
    width: 350px; float: left; color: red;  
}