body {
margin: 0px;
padding: 0px;
background: #C2BFC6;
font-family: sans-serif;
text-align: center;}

/****** [main containers] ******/

/* overall page container                       */
/* everything else fits into this               */
/* different versions for index & regular pages */
#pageblock4index{
   background-color: #E7E8E9;
   width: 773px;
   display: block;
   margin-left: auto;
   margin-right: auto;
}
#pageblock{
   background-color: White;
   width: 773px;
   display: block;
   margin-left: auto;
   margin-right: auto;
}
/* container for page header */
#headerblock{
   background: #E7E8E9;
   width: 100%;
   float: left;
}

/* container for content */
/* different versions for index & regular pages */
#contentblock4index{
   background: #77787B;
   color: White;
   float: left;
   width: 100%;
}
#contentblock{
   background: White;
   float: left;
   width: 100%;
   background-image: url(images/bgpanel.bmp);
   background-repeat: repeat-y;
   }

/* container for navigation bar */
#navblock{
   width: 100%;
   float: left;
}

/* container for images */
#imageblock{
   float: left;
   width: 100%;
}

/****** [secondary containers] ******/
/*** fit within above containers ***/

/* container for coloured bars to mimic nav */
.colourbar{
   float: left;
   width: 100%;
}

/* strapline bar */
.strapbar{
   background: #77787B;
   color: White;
   float: left;
   width: 100%;
   padding-bottom: 1em;
}

/* page menu bar */
.pagemenu{
   width: 100%;
   font-size: .5em;
   font-family: "MS Sans Serif", Geneva, sans-serif;
   font-weight: bold;
   line-height: 3em;
   float: left;
   margin-bottom: 15px;
}

/* footer */
.footerbar4index{
   float: left;
   width: 100%;
   padding-top: 1em;
   text-align: center;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: .75em;
   padding-bottom: 10px;
}
.footerbar{
   float: left;
   width: 100%;
   padding-top: 1em;
   text-align: center;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   font-size: .75em;
   background: #E7E8E9;
   color: Gray;
   padding-bottom: 10px;
}

/****** [columnar classes] ******/

/* one third % width column */
.col1third{
   width: 32%;
   float: right;
}

/* two thirds % width column */
.col2thirds{
   width: 62%;
   float: left;
   text-align: left;
   padding-left: 1em;
   padding-right: 1em;
}

/* header text column */
.colhcontent{
   float: left;
   text-align: left;
   margin-left: 5px;
   width: 540px;
}

/* header image column */
.colhimage{
   width: 212px;
   float: right;
   background-color: #E7E8E9;
   color: #333333;
   font-style: italic;
   font-size: .8em;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

/* content text column */
.colcontent{
   float: left;
   text-align: left;
   width: 520px;
   padding-left: 20px;
   font-family: Trebuchet MS, Verdana, Helvetica, Arial, sans-serif;
   font-size: 0.80em;
   font-weight: normal;
   line-height: 1.75em;
   color: #4B4247;
}

/* content image column */
.colimage{
   width: 212px;
   float: right;
   background-color: #E7E8E9;
   color: #333333;
   font-style: italic;
   font-size: .8em;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   background-image: url(images/fullbg.bmp);
   background-repeat: repeat-y;
}

/* [navbar columns] */
.colabout{
   width: 137px;
   background-color: #F7931E;
   float: left;
}
.colservices{
   width: 127px;
   background-color: #8B6BAF;
   float: left;
}
.colwhydiff{
   width: 127px;
   background-color: #00ACCD;
   float: left;
}
.colhowedoit{
   width: 127px;
   background-color: #B3D335;
   float: left;
}
.colcasestudy{
   width: 127px;
   background-color: #77787B;
   float: left;
}
.colcontact{
   width: 127px;
   background-color: #CAAC83;
   float: left;
}

/* page menu columns */
.col1{
   width: 33%;
   float: left;
}
.col2{
   width: 33%;
   float: left;
}
.col3{
   width: 33%;
   float: left;
}

/* [horizontal decorative bars] */

/* transparent padding bar */
.clearbar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #E7E8E9;
}

/* shaded padding bar */
.shadedbar{
   background-image: url(images/bglines.gif);
   background-repeat: repeat;
   float: left;
   height: 2em;
   width: 100%;
}

/* About page coloured bar */
.aboutbar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #F7931E;
}
.servicebar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #8B6BAF;
}
.whydiffbar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #00ACCD;
}
.howbar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #B3D335;
}
.casebar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #77787B;
}
.contactbar{
   width: 100%;
   float: left;
   height: 5px;
   background-color: #CAAC83;
}


/****** [various formatting classes] ******/

img{
   border: none;
}

img.r{
   float: right;
}
img.l{
   float: left;
}

a{
   text-decoration: none;
}

#headerblock h1{
   font-size: 1.25em;
   color: Gray;
}

#headerblock h3{
   font-size: 0.75em;
   color: Gray;
}

.ipplorange{
   color: #F7931E;
}

#contentblock4index .testimony{
   font-style: italic;
   font-size: .75em;
   text-align: justify;
}

#contentblock4index ul{
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   line-height: 1.5em;
   text-align: left;
}

/* colour co-ordinated text to match menu bar colours */
.txtabout{
   color: #F7931E;
   font-weight: bold;
}

.txtservice{
   color: #8B6BAF;
   font-weight: bold;
}

.txtwhydiff{
   color: #00ACCD;
   font-weight: bold;
}

.txthow{
   color: #B3D335;
   font-weight: bold;
}

.txtcase{
   color: #77787B;
   font-weight: bold;
}
.txtcontact{
   color: #CAAC83;
   font-weight: bold;
}

/* class for small print */
.smallprint{
   font-size: 0.7em;
   line-height: 1.1em;
   font-family: Arial, Helvetica, sans-serif;
}

/* links section link classes */
a.linx:link{
   color: #4B4247;
   text-decoration: none;
}
a.linx:hover{
   font-weight: bold;
}
a.linx:visited{
   color: #4B4247;
}

/* form classes */
form#mailfrm{
   background: #FFE6B2;
   width: 470px;
   padding: 10px;
   border: 1px solid Gray;
   margin: 0 auto;
}
form#mailfrm fieldset{
   width: 450px;
   display: block;
   border: 1px solid White;
   padding: 5px;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   margin-bottom: 0.5em;
   line-height: 1.5em;
}
form#mailfrm legend{
   color: Gray;
}
form#mailfrm label{
   clear: left;
   display: block;
   float: left;
   width: 100px;
   text-align: right;
   padding-right: 10px;
   margin-bottom: 1.5em;
}
form#mailfrm input {
   padding-left:0.5em; 
   margin-bottom:1.5em;
}
form#mailfrm fieldset#area label{
   width: 150px;
   line-height: 1.25em;
   padding-top: 0.18em;
   margin-bottom:0.5em;
}
form#mailfrm fieldset#area input{
   line-height: 1.25em;
   margin-bottom:0.5em;
}
form#mailfrm fieldset#comment textarea{
   margin-left: 15px;
}
form#mailfrm #btnsend, form#mailfrm #btnreset {
   color: Navy;
   padding-right:0.5em;
   cursor:pointer;
   width:205px;
   margin-left:18px;
}
form#mailfrm #btnsend:hover, form#mailfrm #btnreset:hover {
   background-position:center left; 
   color: Orange;
}
