body {
    margin: 0px;
    padding: 0px;
    font-family: Arial, Sans-Serif, Helvetica;
    font-size: 12px;
    color: #333333;
    background: url(images/window-bg.jpg) repeat-x #ececec;
}

a {
    text-decoration: none;
}

#centreSection {
    background:url(images/page-bg.jpg) no-repeat top left;
}

#content {
    width: 969px;
    margin: 40px auto 0px auto;
}
#topbanner {
    width: 969px;
    height: 161px;
    overflow: hidden;
}
#navigation {
    margin: 0px;
    padding-left: 51px;
    height: 67px;
    width: 918px;
}
#navigation a {
    text-decoration: none;
    color: #333333;
    text-align: center;
}
#footerSection {
    clear: left;
    background: url(images/footer-bg.jpg) no-repeat;
    height: 149px;
}
#w3clogos {
    float: left;
    width: 224px;
    padding: 24px 0px 0px 65px;
}
#w3clogos a {
    width: 100px;
    height: 31px;
    display: block;
    float: left;
}
#address {
    float: left;
    padding-left: 0px;
    padding-top: 24px;
    color: #be054b;
    font-size: 11px;
    line-height: 12px;
}
#address p {
    margin:0px;
    padding:0px 0px 4px 0px;
}
.navBtn {
    width: 114px;
    height: 36px;
    float:left;
    display: block;
    padding-right: 5px;
    padding-top: 7px;
}
.pageLink {
    background: url(images/nav-stdbtn.png) no-repeat;
}
.pageLink:hover {
    background: url(images/nav-stdbtnover.png) no-repeat;
}
.pageLinkOn {
    background: url(images/nav-stdbtnover.png) no-repeat;
}
.navEnd {
    margin: 0px;
    padding: 0px;
}

/* Panels */
.leftCol {
    width: 233px;
    padding-left: 51px;
    float: left;
}
.middleCol {
    width: 394px;
    padding-left: 5px;
    float: left;
}
.rightCol {
    width: 233px;
    padding-left: 5px;
    float: left;
}
.doubleCol {
    width: 630px;
    padding-left: 5px;
    float: left;
}
.techPanel {
    width: 231px;
}
#roundedCorn {
    clear: both;
    margin-bottom: 10px;
}
.middlePanel {
    width: 392px;
}
.doublePanel {
    width: 630px;
}
.bptop {
    background-color: #547bbe;
    color: White;
    height: 20px;
    padding: 0px 0px 0px 16px;
    margin: 0px;
}
.pptop {
    background-color: #8f53a1;
    color: White;
    height: 20px;
    padding: 0px 0px 0px 16px;
    margin: 0px;
}
.wptop {
    background-color: White;
    height: 20px;
    padding: 0px 0px 0px 16px;
    margin: 0px;
    border-bottom: 1px solid #666666;
    font-weight: bold;
}
.bpmiddle {
    background-color: White;
    padding: 10px 16px 10px 16px;
    margin: 0px;
}
.ServiceLinks {
    width: 60px;
    height: 60px;
    display: block;
    float: left;
    margin: 0px 6px 0px 0px;
}
.topSpace {
    clear: both;
}
.snmiddle {
    background-color: White;
    width: 231px;
    margin: 0px;
    padding: 5px 0px 5px 0px;
    overflow: hidden;
}
.centerWhite {
    margin: 0px;
    padding: 0px 0px 10px 16px;
    background-color: #ffffff;
}

.normLink {
    color: #333333;
    text-decoration: none;
}
.normLink:hover {
    color: #999999;
}
.centerWhite p {
    margin-right: 10px;
}
.spacerBlock {
    height: 5px;
    display: block;
}
.loginTxt {
    clear: left;
    float: left;
    width: 80px;
}
.loginBox {
    float: left;
    width: 110px;
    height: 13px;
    font-size: 11px;
    color: #be054b;
}
.loginArea {
    padding: 0px 16px 5px 16px;
    margin: 0px;
}
.serviceArea {
    margin: 0px;
    padding: 0px 0px 0px 16px;
}
.servicePanel {
    width: 358px;
    height: 67px;
    background: url(images/services-panel.gif) no-repeat;
    padding: 1px 16px 9px 1px;
    margin: 0px;
    font-size: 11px;
}
.servicePanel:hover {
    background: url(images/services-panel-over.gif) no-repeat;
    cursor: pointer;
}
.servicePanel img {
    margin-right: 5px;
}
.serviceTitle {
    color: #be054b;
    font-weight: bold;
    padding-top: 5px;
}
.contactform {
    font-size: 11px;
    padding-bottom: 0px;
}
.contactbox {
    font-size: 11px;
    font-family: Arial, Sans-Serif, Helvetica;
    margin: 0px 0px 10px 0px;
    width: 190px;
}
.contactBtn {
    width: 80px;
    height: 30px;
    background-color: #f1f1f1;
    border: 1px solid #cccccc;
}
.contactBtn:hover {
    background-color: #dadada;
}

/* Creative Layouts */
.creatBoxShad {
    width: 194px;
    height: 125px;
    padding: 1px 8px 10px 1px;
    background: url(images/creative-box-bg.jpg) no-repeat top left;
    float: left;
    cursor: pointer;
}
.creatBoxImage {
    width: 194px;
    height: 70px;
    border-bottom: 1px solid #666666;
}
.creatBoxImage img {
    border: none;
}
.creatBoxText {
    width: 180px;
    height: 70px;
    padding: 3px 5px 5px 5px;
    text-decoration: none;
    font-size: 11px;
    color: #000000;
    display: block;
}
.creatTitle {
    text-decoration: none;
    font-size: 12px;
    color: #be054b;
    font-weight: bold;
    padding: 0px 5px 0px 5px;
}
.creatBoxText p {
    padding: 0px 0px 0px 0px;
    margin: 2px 0px 0px 0px;
}
.creatSide {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/creative-sidenav.jpg) right no-repeat;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}
.creatSide:hover {
    background: url(images/creative-sidenav-on.jpg) right no-repeat #ddcbe3;
}

.creatSideon {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/creative-sidenav-on.jpg) right no-repeat #ddcbe3;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}

.latestProjPic {
    width: 104px;
    height: 70px;
    float: left;
    padding: 0px 3px 0px 0px;
    margin-right: 3px;
    text-align: center;
    overflow: hidden;
}
.latestProjText{
    width: 115px;
    height: 70px;
    float: left;
    padding: 0px 0px 0px 5px;
    font-size: 11px;
    display: block;
    text-decoration: none;
    color: #000000;
}
.latestProjOut 
{
    width: 227px;
    height: 70px;
    float: left;
    margin-top: 3px;
    border: 1px solid #666666;
    overflow: hidden;
    font-size: 11px;
    cursor: pointer;
}
.latestProjOut:hover
{
    background-color: #ddcbe3;
}
.latestSuccessOut 
{
    width: 227px;
    height: 70px;
    float: left;
    margin-top: 3px;
    border: 1px solid #666666;
    overflow: hidden;
    font-size: 11px;
}
.latestSuccessOut:hover
{
    background-color: #cbd7eb;
}
.latestTitle {
    text-decoration: none;
    font-size: 11px;
    color: #be054b;
    font-weight: bold;
}
.featProjOut 
{
    width: 360px;
    height: 70px;
    float: left;
    margin-top: 3px;
    border: 1px solid #666666;
    overflow: hidden;
    font-size: 11px;
    cursor: pointer;
}
.featProjOut:hover 
{
    background-color: #fef1e0;
}
.featProjText 
{
    width: 247px;
    height: 70px;
    float: left;
    padding: 0px 0px 0px 5px;
    font-size: 11px;
    display: block;
    text-decoration: none;
    color: #000000;
}

.creatPortImage {
    width: 194px;
    height: 120px;
    border-bottom: 1px solid #666666;
}
.creatPortImage img {
    border: none;
}
.creatPortText {
    width: 180px;
    height: 20px;
    text-align: center;
    padding: 5px 5px 5px 5px;
    text-decoration: none;
    font-size: 12px;
    color: #be054b;
    font-weight: bold;
    display: block;
}
.portBanner {
    width: 600px;
    height: 90px;
    padding: 1px 9px 10px 1px;
    background: url(images/creative-banner-bg.jpg) no-repeat;
}
.creatFeat {
    width: 200px;
    float: right;
    border: 1px solid #666666;
    padding: 5px 5px 5px 5px;
    margin: 0px 10px 0px 10px;
}
.featLight {
    width: 190px;
    padding: 3px 5px 3px 5px;
    background-color: #f3f3f3;
}
.featDark {
    width: 190px;
    padding: 3px 5px 3px 5px;
    background-color: #dfdfdf;
}

.colFeat {
    width: 170px;
    float: left;
    border: 1px solid #666666;
    padding: 5px 5px 5px 5px;
    margin: 0px 20px 0px 0px;
}
.colfeatLight {
    width: 160px;
    padding: 3px 5px 3px 5px;
    background-color: #f3f3f3;
}
.colfeatDark {
    width: 160px;
    padding: 3px 5px 3px 5px;
    background-color: #dfdfdf;
}
.wideFeat {
    width: 590px;
    border: 1px solid #666666;
    padding: 5px 5px 5px 5px;
    margin: 10px 0px 10px 0px;
}
.widefeatLight {
    width: 580px;
    padding: 5px 5px 5px 5px;
    background-color: #f3f3f3;
}
.widefeatDark {
    width: 580px;
    padding: 5px 5px 5px 5px;
    background-color: #dfdfdf;
}
.widefeatLight a {
    color: #333333;
    text-decoration: none;
}
.widefeatLight a:hover {
    color: #999999;
}
.widefeatDark a {
    color: #333333;
    text-decoration: none;
}
.widefeatDark a:hover {
    color: #999999;
}

.thinText {
    float: left;
    width: 370px;
}
.sideFeat {
    width: 220px;
    border: 1px solid #666666;
    padding: 5px 5px 5px 5px;
    margin: 0px 10px 30px 20px;
    float: right;
}
.sidefeatLight {
    width: 210px;
    padding: 5px 5px 5px 5px;
    background-color: #f3f3f3;
}
.sidefeatDark {
    width: 210px;
    padding: 5px 5px 5px 5px;
    background-color: #dfdfdf;
}
.sidefeatLight a {
    color: #333333;
    text-decoration: none;
}
.sidefeatLight a:hover {
    color: #999999;
}
.sidefeatDark a {
    color: #333333;
    text-decoration: none;
}
.sidefeatDark a:hover {
    color: #999999;
}

.backBtn {
    width: 60px;
    height: 21px;
    display: block;
    background: url(images/creative-sidenav.jpg) right no-repeat;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 7px 0px 0px 10px;
    margin-top: 5px;
    float: right;
}
.backBtn:hover {
    background: url(images/creative-sidenav-on.jpg) right no-repeat #ddcbe3;
}

.gallerymain {
    width: 194px;
    height: 150px;
    border: 1px solid #000000;
    margin-bottom: 2px;
}
.galleryPrevs img {
    margin: 3px 2px 0px 0px;
    border: 1px solid #000000;
}

/* Technical */
.techSide {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/technical-sidenav.jpg) right no-repeat;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}
.techSide:hover {
    background: url(images/technical-sidenav-on.jpg) right no-repeat #cbd7eb;
}

.techSideon {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/technical-sidenav-on.jpg) right no-repeat #cbd7eb;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}
.techBoxShad {
    width: 194px;
    height: 125px;
    padding: 1px 8px 10px 1px;
    background: url(images/creative-box-bg.jpg) no-repeat top left;
    float: left;
    cursor: pointer;
}
.techBoxImage {
    width: 194px;
    height: 70px;
    border-bottom: 1px solid #666666;
}
.techBoxImage img {
    border: none;
}
.techBoxText {
    width: 180px;
    height: 70px;
    padding: 3px 5px 5px 5px;
    text-decoration: none;
    font-size: 11px;
    color: #000000;
    display: block;
}
.techbackBtn {
    width: 60px;
    height: 21px;
    display: block;
    background: url(images/technical-sidenav.jpg) right no-repeat;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 7px 0px 0px 10px;
    margin-top: 5px;
    float: right;
}
.techbackBtn:hover {
    background: url(images/technical-sidenav-on.jpg) right no-repeat #cbd7eb;
}
.statusgreen {
    width: 22px;
    height: 20px;
    margin: 0px 5px 0px 5px;
    background: url(images/technical/statgreen.gif) no-repeat;
    float: left;
}
.statusblank {
    background-image: none;
}

.statusyellow {
    width: 22px;
    height: 20px;
    margin: 0px 5px 0px 5px;
    background: url(images/technical/statyellow.gif) no-repeat;
    float: left;
}
.statusred {
    width: 22px;
    height: 20px;
    margin: 0px 5px 0px 5px;
    background: url(images/technical/statred.gif) no-repeat;
    float: left;
}
.statusname {
    width: 130px;
    height: 20px;
    float: left;
    margin: 0px 0px 0px 0px;
    font-size: 11px;
}
.statusdate {
    width: 60px;
    height: 20px;
    float: left;
    margin: 0px 0px 0px 0px;
    font-size: 11px;
    color: #be054b;
    text-align: right;
}
.sul {
    border-bottom: 1px solid #cccccc;
    height:16px;
    color: #000000;
    font-weight: bold;
    margin-bottom: 2px;
}
.statusdesc {
    width: 500px;
    float: left;
    margin: 0px 0px 10px 10px;
}

/* News */
.newsbox {
    width: 600px;
    border-top: 1px solid #dddddd;
    padding-top: 3px;
    margin: 0px 0px 2px 0px;
}
.fullnewstitle {
    font-weight: bold;
    margin: 0px 0px 0px 0px;
    width: 600px;
    float: left;
    padding: 0px 0px 0px 0px;
}
.fullnewsdetail {
    color: #999999;
    width: 300px;
    float: left;
    margin: 0px 0px 0px 0px;
}
.fullnewsmore {
    float: right;
    width: 300px;
    text-align: right;
    margin: 0px 0px 0px 0px;
    color: #be054b;
    text-decoration: none;
    display: block;
}
.fullsnippet {
    clear: both;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 5px 0px;
}
/* Re define */

h1 {
    font-size: 24px;
    margin: 0px 0px 8px 0px;
}
h2 {
    font-size: 14px;
    margin: 0px 0px 8px 0px;
}
h3 {
    font-size: 12px;
    color: #be054b;
    font-weight: bold;
    margin: 0px 0px 0px 0px;
}
.productHeader {
    font-size: 18px;
    margin: 0px 0px 8px 0px;
    color: #777777;
}
p {
    margin: 0px 0px 10px 0px;
}

.newsLight 
{
    width: 190px;
    background-color: #eeeeee;
    display: block;
    padding: 5px;
    color: #444444;
}
.newsDark 
{
    width: 190px;
    background-color: #dddddd;
    display: block;
    padding: 5px;
    color: #444444;
}

.newsLight:hover {
    background-color: #fef1e0;
}
.newsDark:hover {
    background-color: #fef1e0;
}
.spacer {
    margin-bottom: 10px;
}

.peopleBox {
    width: 60px;
    height: 60px;
    float: left;
    border: 1px solid #cccccc;
    margin: 0px 3px 3px 0px;
    text-align: center;
    font-weight: bold;
    font-size: 11px;
    color: #000000;
    overflow: hidden;
}
.orangeOn {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/about-sidenav-on.jpg) right no-repeat #fef1e0;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}
.orangeOff {
    width: 216px;
    height: 17px;
    display: block;
    background: url(images/about-sidenav.jpg) right no-repeat #ffffff;
    color: #000000;
    font-size: 11px;
    text-decoration: none;
    padding: 3px 0px 0px 15px;
}
.orangeOff:hover {
    background: url(images/about-sidenav-on.jpg) right no-repeat #fef1e0;
}


/* Facebook Link */
.affLinks {
    border: none;
    padding: 0px 0px 0px 1px;
    margin: 3px 0px 0px 0px;
    display: block;
}

.hoverbox {
    background: url(images/creative-box-poparrow.png) left top no-repeat;
    width: 226px;
}
.hoverboxText {
    width: 184px;
    background: url(images/creative-box-pop.png) bottom no-repeat;
    padding: 5px 5px 5px 5px;
    margin: 0px;
    border: 1px solid #666666;
    border-left: none;
    float: right;
}