/*
There are two kinds of columns - 
1) main page columns, separated using margin-right. These extend all the way down the page
2) box columns which are separated using a vertical separator, either visible or invisible - these can extend right down the page, though it's then best to use column type 1, but are generally to be use in the 6 column layout section to create boxes and areas which span one or more of the 6 columns
*/

body { background-color:#FFFFFF; background-image:url(../images/v7_vnunet_leftmarginbg_2.gif); background-repeat:repeat-y; font-family:verdana,arial,helvetica,sans-serif; font-size:xx-small; color:#000000; margin:0px }

/* image styles */
.floatleftimageplain { float:left; margin:3px 5px 5px 0px }
.floatrightimageplain { float:right; margin:3px 0px 5px 5px }
.floatleftimagehiplain { float:left; margin:0px 5px 5px 0px }
.floatrightimagehiplain { float:right; margin:0px 0px 5px 5px }
.floatleftimage { float:left; margin:3px 5px 5px 0px; border:1px solid #C0C0C0; background-color:#FFFFFF }
.floatleftimagehi { float:left; margin:0px 5px 5px 0px; border:1px solid #C0C0C0; background-color:#FFFFFF }
.floatrightimage { float:right; margin:3px 0px 5px 5px; border:1px solid #C0C0C0; background-color:#FFFFFF }
.floatrightimagehi { float:right; margin:0px 0px 5px 5px; border:1px solid #C0C0C0; background-color:#FFFFFF }
.top170image { margin-bottom:6px }
/* end image styles */

/* gaps and rules, some combined */
/* gaps are now generally a separate div which is placed between the items to be separated i.e. boxgap */
.boxgap { font-size:1px; height:2px; margin-bottom:10px; clear:both }
.boxgap1 { font-size:1px; height:1px; margin-bottom:1px; clear:both }
.boxgap6 { font-size:1px; height:2px; margin-bottom:4px; clear:both }
.boxgap24 { font-size:1px; height:2px; margin-bottom:22px; clear:both }
.boxgap48 { font-size:1px; height:2px; margin-bottom:46px; clear:both }
.boxgapline { font-size:1px; height:1px; border-bottom:1px solid #AAAAAA; margin-bottom:10px; clear:both  } /* was border #DDE5EE */
.boxgaplinedark { font-size:1px; height:1px; border-bottom:1px solid #003366; margin-bottom:10px; clear:both  }
.rulehead { border-top:1px solid #AAAAAA; padding-top:4px }
.rulepale { font-size:1px; height:1px; border-bottom:1px solid #99BBDD; clear:both }
.rulemid { font-size:1px; height:1px; border-bottom:1px solid #AAAAAA; clear:both }
.gap30aboveline { height:1px; margin-top:29px; font-size:1px; border-bottom:1px solid #99BBDD; clear:both }
.ruleheadtext { font-weight:bold; margin-top:3px }

/* end rules and gaps */

/* vertical separators - not perfect yet, but we can adapt and improve these styles */
/* you can make new styles to make them deeper or less deep */
/* these also create the gaps between your box columns, instead of using margin-right - you must therefore use the invisible one of these to create a margin - this is to make all boxes behave in the same way and use the same style, whether they have a visible separator or not */
.boxverticalvis { float:left; margin:3px 6px; width:1px; height:80px; background-color:#99BBDD }
.boxverticalinvis3 { float:left; width:3px; height:10px; }
.boxverticalvis140 { float:left; margin:3px 6px; width:1px; height:140px; background-color:#99BBDD }
.boxverticalinvis { float:left; margin:3px 6px; width:1px; height:10px }
/* end vertical separators */

/* straps and tongue and groove styles */
.strap { background-color:#99BBDD; color:#FFFFFF; text-align:center; padding-top:3px; height:20px }
.strap2 { background-color:#99BBDD; color:#FFFFFF; text-align:right; padding-top:3px; height:20px; padding-right:5px;}
.strap2tng { background-color:#99BBDD; color:#FFFFFF; text-align:center; padding-top:2px; height:20px; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366 }
.tngstrap { height:20px; padding:2px 0px 0px 6px; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366; background-color:#99BBDD; font-weight:bold; color:#FFFFFF }
.tngstrap2 { height:20px; padding:2px 0px 0px 6px; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366; background-color:#99BBDD; font-weight:bold; color:#FFFFFF; text-align:center }
.tngstrap3 { height:20px; padding:2px 0px 0px 0px; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366; background-color:#99BBDD; font-weight:bold; text-align:center; color:#FFFFFF } /* THIS ONE */
.tngstrap4 { padding:2px 0px 0px 6px; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366; background-color:#99BBDD; font-weight:bold; color:#FFFFFF }
.tng { height:15px; padding:0px 0px 0px 6px; border-top:1px solid #FFFFFF; border-bottom:1px solid #003366; background-color:#DDE5EE; color:#003366 }
.tngdeep { padding:0px 0px 1px 6px; border-top:1px solid #FFFFFF; border-bottom:1px solid #003366; background-color:#DDE5EE; color:#003366 }
.tngdeep2 { padding:0px 0px 1px 6px; border-top:1px solid #FFFFFF; border-bottom:1px solid #003366; background-color:#99BBDD; color:#003366 }
.tngdeep3 { padding:0px 0px 1px 6px; border-top:1px solid #FFFFFF; border-bottom:1px solid #003366; background-color:#DDE5EE; color:#003366 }
.tnglist { margin-top:4px; margin-bottom:3px }
/* end tongue and groove and straps */

/* boxes with and without widths */
/* if using a tinted multicol box, you must use the boxtint and the boxcolxxxpadl and padm/padr styles to create the padding inside - there are no examples of using the 355 tint to create a 2x170px tinted box, but it's just the same in principle as the 3x170 and the 2x262 version inside the tinted 540 box*/
/* with freesize tinted boxes, use the tintboxinner box inside to create the padding */
.tintbox { width:100%; background-color:#DDE5EE }
.tintboxlight { width:100%; background-color:#EAEFF4 }
.tintboxinner { padding:3px 4px 6px 4px }

.boxtint540 { float:left; width:540px; background-color:#DDE5EE  }
.box2tint540 { float:left; width:540px; background-color:#EEEFEF  }
.boxtint540tng { float:left; width:540px; background-color:#DDE5EE; border-top:1px solid #DDE5EE; border-bottom:1px solid #003366  }
.boxtint540tng2 { float:left; width:540px; background-color:#DDE5EE; border-top:1px solid #003366; border-bottom:1px solid #003366  }
.box540 { float:left; width:540px  }

.boxcol421 { float:left; width:421px; }

.boxtint355 { float:left; width:355px; background-color:#DDE5EE  }
.boxcol355 { float:left; width:355px }
.boxcol535 { float:left; width:535px }


.boxcol262 { float:left; width:262px }
.boxcol262l { float:left; width:262px; margin-right:16px }
.boxcol262padl { float:left; width:256px; margin:3px 0px 3px 3px }
.boxcol262padr { float:left; width:256px; margin:3px 3px 3px 0px }

.boxtint185 { float:left; width:185px; background-color:#DDE5EE  }
.boxcol185padl { float:left; width:179px; margin:3px 0px 6px 3px }

.boxcol170 { float:left; width:170px }
.boxcol170padl { float:left; width:167px; margin:3px 0px 6px 3px }
.boxcol170padm { float:left; width:167px; margin:3px 0px 6px 0px }
.boxcol170padr { float:left; width:167px; margin:3px 3px 6px 0px }

.boxcol162 { float:left; width:162px; }
.boxcol165 { float:left; width:165px; }
.boxcol207 { float:left; width:207px; }
.boxcol111 { float:left; width:111px; }

.rubadubstyle { font-weight:bold; font-style:italic; color:#FF11BB }

/* feedback styles vb new */
#bodyleftcol235 { width:235px }
#bodycol505 { width:505px }
.boxcol320 { float:left; width:320px }
#navtop { position:relative; left:0px; width:235px; height:22px; background-image:url(http://images.vnunet.com/v7_images/feedback/fb_navtop.gif); background-repeat:no-repeat; }
#navsides { position:relative; left:0px; width:235px; height:168px; background-image:url(http://images.vnunet.com/v7_images/feedback/fb_navsides.gif); background-repeat:repeat;}
#navbottom {  position:relative; left:0px; width:235px; height:22px; background-image:url(http://images.vnunet.com/v7_images/feedback/fb_navbottom.gif); background-repeat:no-repeat; z-index:2 }