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

/*------just needed for demo pages only---------*/
#wholeSite { position:absolute; visibility:visible; left:50%; top:50px; width:1000px; height:1200px; z-index:1; margin: 0 0 0 -500px; }

/*-------------------common---------------------*/
body { font-family: Arial, Calibri, "Helvetica Neue", Helvetica, sans-serif; font-size: 12px; margin: 0 0 0 0; line-height: 16px; outline-style:none; outline-width:0; }
a { outline-style:none; outline-width:0; }
p { margin-top: 0px; margin-bottom: 0px; outline-style:none; outline-width:0; }
.subText { font-size: 10px; line-height: 14px; }
h1 { font-size: 12px; text-transform: uppercase; color: #990000; margin: 0 0 4px 0; }
h2 { font-size: 12px; color: #000066; margin-top: 0px; margin: 0 0 2px 0; text-transform: capitalize; }
h3 { font-size: 10px; text-transform: uppercase; color: #990000; margin: 0 0 2px 0; }
.wholeSiteTable { top: 20px; position: absolute; left: 50%; margin: 0 0 0 -490px; padding: 0 0 50px 0; }
.addressDetails { position:absolute; visibility:visible; width:143px; padding: 0 10px 0px 15px; font-size: 10px; color: #000066; line-height: 13px; margin: 0 0 70px 10px; bottom: 10px; z-index: 1000; background-color: #FFF; }
a:link { color: #000; text-decoration: underline; outline-style:none; outline-width:0; }
a:visited { color: #000; text-decoration: underline; outline-style:none; outline-width:0; }
a:hover { color: #009; text-decoration: underline; outline-style:none; outline-width:0; }
a:active { color: #009; text-decoration: underline; outline-style:none; outline-width:0; }

h2 a:link { color: #009; text-decoration: underline; outline-style:none; outline-width:0; }
h2 a:visited { color: #009; text-decoration: underline; outline-style:none; outline-width:0; }
h2 a:hover { color: #900; text-decoration: underline; outline-style:none; outline-width:0; }
h2 a:active { color: #900; text-decoration: underline; outline-style:none; outline-width:0; }

/*-----------------drop shadow------------------*/
.dropShadowTOP { background-image: url(images/DropShadow/DropShadow_03.jpg); background-repeat: repeat-x; width: 960px; }
.dropShadowMiddleCell { min-height: 650px; }
.dropShadowLEFT { height: 650px; background-image: url(images/DropShadow/DropShadow_12.jpg); background-repeat: repeat-y; }
.dropShadowRIGHT { background-image: url(images/DropShadow/DropShadow_13.jpg); background-repeat: repeat-y; height: 650px; }
.navigationTopBgStrips { font-size: 3px; height: 5px; }
.navigationBackground { background-color: #FFF; }
.dropShadowBOTTOM { background-image: url(images/DropShadow/DropShadow_22.jpg); background-repeat: repeat-x; height: 10px; width: 940px; }
.footerCredits { position:absolute; visibility:visible; width:960px; font-size: 10px; color: #CCC; line-height: 13px; margin: 0 0 70px 10px; bottom: -30px; z-index: 1000; background-color: #FFF; }
.footerCredits a:link { color: #CCC; text-decoration: none; outline-style:none; outline-width:0; }
.footerCredits a:visited { color: #CCC; text-decoration: none; outline-style:none; outline-width:0; }
.footerCredits a:hover { color: #666; text-decoration: underline; outline-style:none; outline-width:0; }
.footerCredits a:active { color: #666; text-decoration: underline; outline-style:none; outline-width:0; }

/*------------------navigation LEFT-----------------*/

#navigationLeft { position:absolute; visibility:visible; width:158px; z-index:12; padding: 0px; line-height: 15px; margin: 90px 10px 0 0; }
#navigationLeft p { margin-bottom: 6px; }
#navigationLeft p a { color: #FFF; background-color: #009; padding: 3px 0px 3px 15px; text-decoration: none; display: block; outline-style:none; outline-width:0; }

/*note! for the products link I have swopped the styles so that the link is highlighted when NOT rolled over*/
#navigationLeft p a:link, #navigationLeft p a:visited, 
#navigationLeft p.products a:hover, #navigationLeft p.products a:active 
{ color: #009; background-color: #EEE; padding: 3px 0px 3px 15px; text-decoration: none; display: block; outline-style:none; outline-width:0; }

#navigationLeft p a:hover, #navigationLeft p a:active, 
#navigationLeft p.products a:link, #navigationLeft p.products a:visited
{ color: #FFF; background-color: #009; padding: 3px 0px 3px 15px; text-decoration: none; display: block; outline-style:none; outline-width:0; }




/*------------------navigation TOP-----------------*/

#navigationTop { position: absolute; top: 30px; width: 960px; left: 50%; margin: 0 0 0 -480px; z-index: 40; text-decoration: none; text-align: center; height: 80px; }
#logo { height: 80px; width: 168px; left: 0px; top: 0px; position: absolute; }
#navigationTopProducts,
#navigationTopProducts.navigationTopText a:link,
#navigationTopProducts.navigationTopText a:visited,
#navigationTopProducts.navigationTopText a:hover,
#navigationTopProducts.navigationTopText a:active,
#navigationTopProducts.navigationTopTextOneline a:link,
#navigationTopProducts.navigationTopTextOneLine a:visited,
#navigationTopProducts.navigationTopTextOneLine a:hover,
#navigationTopProducts.navigationTopTextOneLine a:active
{ position: absolute; left: 168px; top: 0px; *top: -50px; width: 792px; height: 80px; }

/*FOR ie 7 only to get white bottom border for links*/
#navigationTopProducts.navigationTopText a:link { *color: #000; *text-decoration: none; *background-color: #FFF; }
#navigationTopProducts.navigationTopText a:visited { *color: #000; *text-decoration: none; *background-color: #FFF; }
#navigationTopProducts.navigationTopText a:hover { *color: #FFF; *text-decoration: none; *background-color: #999; }
#navigationTopProducts.navigationTopText a:active { *color: #FFF; *text-decoration: none; *background-color: #999; }

#navigationTopProducts .navigationTopTextOneline a:link { *color: #000; *text-decoration: none; *background-color: #FFF;  }
#navigationTopProducts .navigationTopTextOneLine a:visited { *color: #000; *text-decoration: none; *background-color: #FFF; }
#navigationTopProducts .navigationTopTextOneLine a:hover { *color: #FFF; *text-decoration: none; *background-color: #999; }
#navigationTopProducts .navigationTopTextOneLine a:active { *color: #FFF; *text-decoration: none; *background-color: #999; }


.navigationTopText a, .navigationTopTextOneLine a { font-family: "Arial Narrow", "Franklin Gothic Demi Cond", "American Typewriter Condensed", sans-serif; line-height: 12px; text-decoration: none; text-align: center; text-transform: uppercase; font-size: 11px; font-weight: bold; color: #FFF; *color: #000; width: 66px; float: left; height: 80px; outline-style:none; outline-width:0; }

.navigationTopText a { padding: 26px 0 0 0; }
.navigationTopTextOneLine a { padding: 31px 0 0 0; }

.navigationTopText a img, .navigationTopTextOneLine a img { float: left; text-align: center; width: 66px; border-bottom-style: solid; border-width: 0 0 3px 0; z-index: 50; overflow: visible; }
.navigationTopText a img { margin-top: -50px; *margin-top: 0px; }
.navigationTopTextOneLine a img { margin-top: -43px; *margin-top: 7px; }

.navigationTopText a img:link { border-bottom-color: #FFFFFF; }
.navigationTopText a img:visited { border-bottom-color: #FFFFFF; }
.navigationTopText a img:hover { border-bottom-color: #0000FF; }
.navigationTopText a img:active { border-bottom-color: #0000FF; }

.navigationTopTextOneLine a img:link { border-bottom-color: #FFFFFF; }
.navigationTopTextOneLine a img:visited { border-bottom-color: #FFFFFF; }
.navigationTopTextOneLine a img:hover { border-bottom-color: #0000FF; }
.navigationTopTextOneLine a img:active { border-bottom-color: #0000FF; }

/*--------------------home----------------------*/
#imageLargeLeft { position:absolute; visibility:visible; width:396px; height:560px; z-index:11; margin: 90px 0 0 168px; }
#imageLargeMiddle { position:absolute; visibility:visible; width:396px; height:560px; z-index:11; margin: 90px 0 0 366px; }
#imageLargeRight { position:absolute; visibility:visible; width:396px; height:560px; z-index:11; margin: 90px 0 0 564px; }
#homeLogo { position:absolute; visibility:visible; width:70px; height:60px; z-index:13; margin: 180px 0 0 728px; }
#homeSubTitle { visibility:visible; width:396px; height:111px; z-index:14; text-align: center; font-style: italic; font-size: 18px; color: #990000; line-height: 22px; position: absolute; margin: 260px 0 0 564px; }
#homeSmallImage { position:absolute; visibility:visible; left:613px; width:164px; height:216px; z-index:15; bottom: 20px; }
#homeBottomRightText { position:absolute; visibility:visible; left:395px; width:356px; z-index:15; bottom: 70px; font-style: italic; color: #999; text-align: left; padding: 0 20px 0 20px; font-size: 11px; }
#homeCaption { visibility:visible; left:416px; width:183px; z-index:16; bottom: 20px; position: absolute; font-size: 10px; line-height: 13px; color: #000066; }

/*--------------------client list & case histories----------------------*/
#clientListTable { position: relative; visibility: visible; width: 792px; top: 90px; left: 168px; margin: 0 0 80px 0; }
#clientListTable  table  tr td { border-color: #990000; border-width: 1px 0 0 0; border-style: solid; padding: 10px 10px 10px 0; font-size: 11px; line-height: 14px; }
#clientListTable table tr th img { border-color: #990000; border-width: 1px 0 0 0; border-style: solid; padding: 10px 0 0 0; }

/*--------------------ethical & environmental----------------------*/
#ethicalTable { position: relative; visibility: visible; width: 792px; top: 90px; left: 168px; margin-bottom: 110px; }
#ethicalTable table tr td { padding: 0px 10px 00px 0; font-size: 11px; line-height: 14px; }
#ethicalTable table tr th.ruleAbove10high { border-color: #990000; border-width: 1px 0 0 0; border-style: solid; }
#ethicalTable table tr th img { padding: 0px 10px 15px 0; }

/*--------------------PACKAGING----------------------*/
#packagingTable { position: relative; visibility: visible; width: 792px; top: 90px; left: 168px; margin-bottom: 110px; }

/*-----------------sixColumnTable = meet the team = our products ------------------*/
#sixColumnTable { position: relative; visibility: visible; width: 792px; top: 90px; left: 168px; font-size: 11px; padding: 0 0 6px 0; }
.sixColumnTableIntroCell, .sixColumnTableIntroCellTwoRows, .sixColumnTableIntroCellThreeRows { padding: 0px 5px 10px 0; width: 127px; float: left; }
.sixColumnTableIntroCellTwoRows { height: 460px; }
.sixColumnTableIntroCellThreeRows { height: 690px; }
.jobTitle { font-style: italic; }
.personnel { float: left; width: 132px; padding-bottom: 10px; height: 230px; }
#sixColumnTable table tr td { min-height: 260px; }

#sixColumnTable h2 { padding-top: 5px; text-decoration: none; }
#sixColumnTable p { padding-right: 5px; padding-bottom: 0px; text-decoration: none; }
#sixColumnTable a:link, #sixColumnTable .personnel a:link, #sixColumnTable .sixColumnTableIntroCell p a:link
{ color: #000; background-color: #FFF; text-decoration: none; display: block; outline-style:none; outline-width:0; height: 280px; }
#sixColumnTable a:visited, #sixColumnTable .personnel a:visited, #sixColumnTable .sixColumnTableIntroCell p a:visited
{ color: #000; background-color: #FFF; text-decoration: none; display: block; outline-style:none; outline-width:0; height: 280px; }
#sixColumnTable a:hover, #sixColumnTable .personnel a:hover, #sixColumnTable .sixColumnTableIntroCell p a:hover
{ color: #000; background-color: #ddd; text-decoration: none; display: block; outline-style:none; outline-width:0; height: 280px; }
#sixColumnTable a:active, #sixColumnTable .personnel a:active, #sixColumnTable .sixColumnTableIntroCell p a:active
{ color: #000; background-color: #CCC; text-decoration: none; display: block; outline-style:none; outline-width:0; height: 280px; }


/*-----------------products individual pages------------------*/
#productsLeftText { position: absolute; visibility: visible; width: 188px; font-size: 11px; padding-right: 10px; margin-bottom: 80px; margin: 90px 0 0 168px; }
#productsLeftText p { line-height: 15px; padding: 4px 0 3px 0; }

#productsLeftText ul { line-height: 14px; text-indent: 0px; margin-left: 0px; list-style-type: none; margin-top: 0px; margin-bottom: 30px; }
#productsLeftText ul li { list-style-type: none; margin-bottom: 7px; }
#productsBottomLeftText { position: absolute; visibility: hidden; width: 188px; font-size: 11px; padding-right: 10px; bottom: 20px; left: -198px; }
#productsBottomRightText { position: absolute; visibility: visible; width: 178px; font-size: 10px; padding-right: 10px; bottom: 20px; left: 396px; padding: 0 10px 0 10px; font-style: italic; line-height: 14px; }
#productsRightText { position: absolute; visibility: visible; width: 178px; text-align: center; font-size: 11px; line-height: 15px; padding: 0 10px 0 10px; margin: 90px 0 0 762px; }
.productsSmallImage { visibility:visible; left:0px; width:198px; z-index:15; bottom: 0px; }

/*-----------------ALL products page------------------*/
#allOurProducts { position: absolute; visibility: visible; font-size: 11px; margin: 90px 0 0px 168px; width: 792px; }
.allOurProductsIntroCell { padding: 0px 5px 10px 0; }
#allOurProducts table tr td a h2 { padding-top: 5px; text-decoration: none; }
#allOurProducts table tr td a p { padding-right: 5px; padding-bottom: 10px; text-decoration: none; }
#allOurProducts table tr td a:link { color: #000; background-color: #FFF; text-decoration: none; display: block; }
#allOurProducts table tr td a:visited { color: #000; background-color: #FFF; text-decoration: none; display: block; }
#allOurProducts table tr td a:hover { color: #000; background-color: #CCC; text-decoration: none; display: block; }
#allOurProducts table tr td a:active { color: #000; background-color: #EEE; text-decoration: none; display: block; }

/*-----------------other pages------------------*/
#textFullWidthLH { position: absolute; visibility: visible; width: 386px; font-size: 11px; padding-right: 10px; margin-bottom: 80px; margin: 90px 0 0 168px; }
#textFullWidthRH { position: absolute; visibility: visible; width: 376px; font-size: 11px; padding-right: 10px; margin-bottom: 80px; margin: 90px 0 0 564px; padding-left: 10px; }
#captionFullWidthBL { position: absolute; visibility: visible; width: 386px; font-size: 11px; padding-right: 10px; bottom: 20px; left: -396px; }
#captionFullWidthBR { position: absolute; visibility: visible; width: 376px; font-size: 10px; padding-right: 10px; bottom: 20px; left: 396px; padding-left: 10px; font-style: italic; line-height: 14px; }
.clientListIntro { padding-right: 198px; padding-bottom: 10px; }
.padding10left { padding-left: 10px; }

/*-----------------form pages------------------*/
form { margin-top: 0px; margin-bottom: 0px; }
#form1 table tr td input, #form2 table tr td input { width: 290px; }
#form1 table tr td #enquiry, #form1 table tr td #answer1, #form1 table tr td #answer2 { width: 295px; }

#form1 table tr td #Reset, #form2 table tr td #Reset { width: 70px; }
#form1 table tr td #Send, #form2 table tr td #Add { width: 210px; }

#form1 table tr td #Reset:link, #form2 table tr td #Reset:link, #form1 table tr td #Send:link, #form2 table tr td #Add:link  { color: #000; }
#form1 table tr td #Reset:visited, #form2 table tr td #Reset:visited, #form1 table tr td #Send:visited, #form2 table tr td #Add:visited  { color: #000; }
#form1 table tr td #Reset:hover, #form2 table tr td #Reset:hover, #form1 table tr td #Send:hover, #form2 table tr td #Add:hover  { color: #00F; }
#form1 table tr td #Reset:active, #form2 table tr td #Reset:active, #form1 table tr td #Send:active, #form2 table tr td #Add:active  { color: #00F; }

#imageLargeLeft small a { font-family: Arial, Helvetica, sans-serif; font-size: 9px; position: absolute; left: 406px; width: 386px; bottom: 10px; }
#imageLargeLeft small a:link { color: #000; text-decoration: underline; }
#imageLargeLeft small a:visited { color: #000; text-decoration: underline; }
#imageLargeLeft small a:hover { color: #00F; text-decoration: none; }
#imageLargeLeft small a:active { color: #00F; text-decoration: none; }

#clientListTable table tr td img .noRightPadding { padding-right: 0px; }
.ruleAbove10high { border-top-width: 1px; border-top-style: solid; border-top-color: #990000; height: 10px; padding: 0; }
.bottomSpacer { height: 85px; position: relative; width: 792px; bottom: 0px; clear: both; }

.halfLineSpacesInTable { font-size: 5px; height: 7px; }
#productsLeftText .intros { line-height: 16px; padding-bottom: 20px; }
.captionRunIn { font-size: 8px; font-weight: bold; text-transform: uppercase; font-style: normal; }
#clientListTable table tr th.noTopSpace img { padding-top: 0px; }
#BRClogo { height: 101px; width: 70px; bottom: 101px; position: relative; left: 316px; visibility: visible; }


/*-----------------competition------------------*/
.rosette { float: right; padding: 5px 0 0 0; margin: 0 0 2px 20px; }
.rangeRight { text-align: right; }
.displayText { font-size: 12px; line-height: 20px; font-family: "Arial Black", "Arial Bold", Gadget, sans-serif; color: #999; }
.displayText a:link { color: #999; text-decoration: underline; }
.displayText a:visited { color: #999; text-decoration: underline; }
.displayText a:hover { color: #000; text-decoration: underline; }
.displayText a:active { color: #000; text-decoration: underline; }
.competitonBrief { font-family: "Courier New", Courier, monospace; font-weight: bolder; }

.jobsLinkText { display: inline; cursor: hand; }
#packagingText { width: 360px; left: 0px; position: absolute; top: 555px; }