/* 
 * åäö ÅÄÖ
 * http://www.w3.org/TR/CSS21/visudet.html#the-width-property
 * 
 * by gk, 2009-08-19 13:44
 * color: http://msdn.microsoft.com/en-us/library/aa511283.aspx
 * User-Defined System Colors: http://msdn.microsoft.com/en-us/library/aa358804(VS.85).aspx
 * http://msdn.microsoft.com/en-us/library/ms531197(VS.85).aspx
*/

html {
      margin:0px;         /* does not affect top left coors in IE6 */
      padding: 0px;
      height:100%;         /* needed for IE8 & FF */
}

body {
      xbackground-color: yellow;
      xbackground-color: #d0d8f6;
      background-color: #d1d9f6;        /* bluebg-007.png 1x1 - ej exakt */
      background-image: url(../bilder/style/bluebg-007.png);  /*1x1 */

      font-family: arial,arial;      
      font-size: 12px;
      xbackground-color: transparent;


      xposition:relative;        /* to make same abs coords in IE6 */
      margin:0px;
      padding: 0 0px 0 212px;                  /* to make room for fixed leftDiv 12+200px */
      height:100%;
/* (block:height = between content edges) i.e. vertical marginal & border & padding MÅSTE vara 0 för att den inte skall bli större */
    }

body.withMenuInTable {
      text-align:center;
      padding-left:0px;
    }

form {
      margin:0px;
      padding:0px;
    }

/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */

                   
#layoutTable       {
                    position:relative;   /* to make z-index work */
                    z-index:2;

                    margin:0px;
/* (table-height = between border outer edges) OBS vertikal marginal MÅSTE vara 0 för att den inte skall bli större */
                    height:100%;

/* IE6: you can control fixed height tables, but not % height tables. (?) */
                    xheight:600px;

/* (table-width = between border outer edges) OBS horizontal marginal MÅSTE vara 0 för att den inte skall bli större */
                    width:100%;                 /* gk-test */

                    xborder:none;                /* gk-test */
                    xborder:2px solid red;
                    padding:0px;                 /* from frame-border inner edge to cells outer border edge         */

                    xborder-spacing:0px;   /* = cellspacing, default=2px  NOT SUPPORTED IN IE6 - MUST USE cellspacing !!! */

                    xborder-collapse:collapse;
                    border-collapse:separate;    /* must use separate for FF when height=100% and border on table or cells */

                    empty-cells:show; 
                    xdisplay:block;
                    xdisplay:table;
                    xmargin-right:0;
                    table-layout:auto;    /* auto  fixed */
                   }



#layoutTable.withMenuInTable      {
                    text-align:left;
                    display:inline-table;
                   }



#layoutTableLeftCol  {
                    width:212px!important;
                    xbackground-color: #80f8f8;
                    xbackground-color: #f8f8ff;
                    xbackground-color: rgb(252,250,255);
                    background-color: #ffffff;
                    xbackground-color: #80ff80;
                    background-image: url(../bilder/style/bluebg-003.png);  /*212x1 */
                   }

#layoutTableMainCol  {
                    xmin-width:620px;             /* gk-test */
                    xwidth:620px!important;             /* gk-test */
                    xbackground-color: #80f8f8;
                    xbackground-color: #f8f8ff;
                    xbackground-color: rgb(252,250,255);
                    background-color: #ffffff;
                    xbackground-color: #80ff80;
                    background-color:white;
                    xbackground-color:red;
                    width:auto!important;                        /* gk-test */
                   }

#layoutTableRightCol  {
                    xwidth:50%;
                    xwidth:212px;
                    xwidth:auto;                        /* gk-test */
                    xbackground-color: #f880f8;
                    xbackground-color:transparent;
                    xbackground-color:red;
                    background-image: url(../bilder/style/bluebg-005.png);  /*212x1 */
                    background-repeat:repeat-y;
                    width:100%;
                   }

#layoutTable.withMenuInTable #layoutTableRightCol {
                    xwidth:auto;
                   }



.layoutTableRow {
                    xbackground-color: black;
                   }

.layoutTableCell {
                    xborder:3px solid orange;
                    xborder:none;                   /* gk-test */
                    padding:10px;                   /* =cellpadding, default=1px                 */
                   }




#layoutTableTopRow  {
                    height:60px;               /* IE6: you can control fixed height tables, but not % height tables. */
                    vertical-align: top;        
                   }

#layoutTableLeftTD {
                    padding:0px 0px 0px 12px;
                    xborder-right:1px solid #d0d8f6;
                    xbackground-color:orange;
                    xwidth:200px;
                   }

#layoutTableTopTD {
                    xheight:60px;               /* IE6: you can control fixed height tables, but not % height tables. */
                    xposition:relative;
                    padding:0;
                    xborder-right:1px solid #d0d8f6;
                    xheight:240px!important;
                    xbackground-color: #f80000;
                    xbackground-color:orange;      /* gk-test */
                    min-width:620px;             /* gk-test */
                    xwidth:auto;             /* gk-test */
                    
                   }



#layoutTableRightTD {
                    xposition:relative;
                    xheight:40px;
                    xfilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');

                    xbackground-image: url(../bilder/style/bluebg-005.png);  /*212x1 */
                    xbackground-repeat: repeat-y;
                    xbackground-position: 0px 0px;
                    xwidth:100%;             /* gk-test */

                    xpadding:!important;
                    xborder-right:1px solid #d0d8f6;
                    xmargin:0!important;

                   }



#layoutTableMainRow  {
                    xheight:auto;
                    vertical-align: top;        
                    xbackground-color: #00f800;
                    xheight:490px;               /* IE6: you can control fixed height tables, but not % height tables. */
                   }


#layoutTableMainTD {
                    background-color: cyan;
                    background-color: white;
                    xbackground-color: #f0f0FF;
      			        xborder-right: #666666 1px ridge;
      			        xborder-bottom: #666666 1px ridge;
      			        xborder-left: #666666 1px ridge;	        
      			        xwidth: 400px;
      			        padding: 10px;

                    xborder-right:1px solid #d0d8f6;
                    xwidth:600px!important;

                    font: normal normal normal small /normal xfantasy, sans-serif, "Arial", "arial", serif;

				          }




#layoutTableMainTD em {
                    xfont-variant:small-caps;
                    font-weight:bold;
                    color:red;
				          }




#layoutTableBottomRow  {
                    xheight:50px;               /* IE6: you can control fixed height tables, but not % height tables. */
                    vertical-align: bottom;        
                    xbackground-color: #0000f8;
                   }


#layoutTableBottomTD {
                    color: #666666;
                    font-size: x-small;
                    text-align: center;        
                    padding: 10px;

                    xborder-right:1px solid #d0d8f6;
                   }

/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */



body, table {
/*       font- [<-style>||<-variant> || -weight> ] ?<-size>   [ /<line-height> ]     ?<font-family> */
         xfont: normal normal normal 14pt /20pt fantasy, sans-serif, "arial" ;
         font: normal normal normal small /normal xfantasy, sans-serif, "arial" ;
      }

xinput[type="text"] {
/*       font- [<-style>||<-variant> || -weight> ] ?<-size>   [ /<line-height> ]     ?<font-family> */
         xfont: normal normal normal 14pt /20pt fantasy, sans-serif, "arial" ;
         font: normal normal normal small /normal monospace, sans-serif, "arial" ;
      }

textarea, .textbox {  /* input[type="text"] break IE7 */
/*       font- [<-style>||<-variant> || -weight> ] ?<-size>   [ /<line-height> ]     ?<font-family> */
         xfont: normal normal normal 14pt /20pt fantasy, sans-serif, "arial" ;
         font: normal normal normal small /normal monospace, sans-serif, "arial" ;
      }


/*
      font-size absolute: xx-small, x-small, small, medium, large, x-large, xx-large
      font-size relarive: smaller, larger
*/


h1       
{
text-align: left; 
font-family: arial,arial;  
color: #000000;
font-size: 16px;
font-weight: bold; 
}

h2
{
text-align: left; 
font-family: arial,arial;  
color: #000000;
font-size: 14px;
font-weight: normal; 
}
h3       
{
text-align: left;
color: #000000;
font-size: 90%;
font-weight: bold; 
}
          
          
p        
{
font-size: 90%;
}     

ul        {font-size: 90%;          
          }     

ol        {font-size: 90%;          
          }     
               
.xmeny    {background-color: #FFFFFF;
          font-size: 70%;
				  border-top: #666666 1px ridge;
				  border-right: #666666 1px ridge;
				  border-bottom: #666666 1px ridge;
				  border-left: #666666 1px ridge;	        
				  xwidth: 600px;
				  padding: 5px;
				  text-align: center;
				  text-decoration:none;
				  }
.xrand    {  border-bottom: #666666 1px ridge;
				  }
				  
.xkontakttabell  {
				         border-bottom: #666666 1px ridge;
				         width: 400px;
				          }


.xbildram {border:1px solid #000000;
          }           
.bildtext  
{
color: #666666; font-size: 60%; 
}


           
.red      {color: red;             
            }
            
hr         {color: #666666;}



/* -------------------------------------------------------------------------------- */



#leftDIV {
                    xborder:1px solid blue;
                    border:none;
                    xdisplay:inline-block;
                    height:100%;
                    width:200px;
                    xz-index:1;
                    margin:0;
                    padding:0;
                    padding-left:12px;
                    xbackground-color: #80ff80;
                    xfilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#d0d8f6', endColorStr='#FFFFFF', gradientType='1');

                    background-image: url(../bilder/style/bluebg-003.png);  /*212x1 */
                    
                  }


div.leftMenuFixed {   /* emulate position:fixed in IE6 */
                    position:absolute;
                    left: expression( ( 0 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + 'px' );
                    top: expression( ( 0 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + 'px' );
                    xheight:100%;
                   }                                   

body > div.leftMenuFixed {         /* modern browsers can handle position:fixed */
                    position:fixed;
                    top:0px;
                    left:0px;
                   }                                   

div.leftMenuAbsolute {               /* modern browsers can handle position:fixed */
                    position:absolute;
                    top:0px;
                    left:0px;
                    xfloat:left;
                   }                                   

.logoImg {
                    xposition:absolute;
                    xposition:relative;
                    xtop:30px;
                    xleft:-12px;
                    margin:10px;
                    border:none;
                    xborder:1px solid blue;
                    xwidth:180px;
         }




.copy      {
                    xcolor: #666666;
                    xcolor:red;
                    xfont-size: 80%;
                    xbackground-color: yellow;
                    
                    xborder:1px solid red;
                  }

.copy a          {text-decoration:underline; font-weight: 800; color: #666666;}
.copy a:hover    {text-decoration:underline; color:#000000;}


#leftDIV .copy      {
                    position:absolute;
                    left:12px;
                    margin:1px;
                    padding:0;
                    bottom:0px;
                  }


td.copy      {
                    padding:5px 12px ;
                    xtext-align:center;
                  }


/* -------------------------------------------------------------------------------- */
/* shopping cart totals div and optional iframe                                     */
/* -------------------------------------------------------------------------------- */

/* default value of font = normal normal normal medium normal "Times New Roman".    */


#shopCartDiv {    /* shopping cart summary or place holder div */
                    xbackground-color: yellow;
                    xfont: normal normal normal x-small /normal sans-serif,arial,fantasy;
                    xfont-size: x-small;
                    height:3em;  /* em = The computed font-size. ex = The height of a lowercase "x".  */
                    xmargin:10px 0;
                  }                                   

#shopCartTable {  /* shopping cart summary or place holder div */
                    xbackground-color: cyan;
                    height:100%;
                    font: inherit;
                  }                                   






/* -------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------- */
/* menu type 1 techtrade (and new batscan) version */
/* -------------------------------------------------------------------------------- */

div.leftMenu {
            xbackground-image: url(../bilder/shopping/leftboxes.png); background-repeat: no-repeat;
            xbackground-image: url(../bilder/shopping/leftboxes2.png); background-repeat: no-repeat;
            xbackground-image: url(../bilder/shopping/leftbox-001.png); background-repeat: no-repeat;
            xwidth:200;
            xheight:500px;
            font:  normal normal normal small /normal sans-serif, Arial, "Times New Roman"; 
            color: #444;
            xbackground-color: inherit;
            xbackground-color: yellow;
            xmargin-left:12px;
            xmargin-top:100px;
            xmargin:0;
            xposition:absolute;
            xtop:120px;
            xbackground-color: yellow;
            margin:10px 0;
          }


div.menu {
            font:  normal normal normal small /normal sans-serif, Arial, "Times New Roman"; 
            color: #444;
            xbackground-color: inherit;
            xbackground-color: yellow;
            xmargin-left:12px;
            xmargin-top:100px;
            xmargin:0;
            xposition:absolute;
            xtop:120px;
            xbackground-color: cyan;
            margin:10px 0;
          }



div.menu div.hs1x {
           height: 3px;
           font-size: 1px;
           line-height: 1px;
           background-color: #DDD;
           margin-top: 4px;
           margin-bottom: 4px;
          }

div.menu div.hs0 {
           height: 0px;
           font-size: 1px;
           line-height: 1px;
           xbackground-color: #DDD;
           margin-top: 4px;
           margin-bottom: 4px;
          }

div.menu div.hs1 {
           height: 10px;
           xfont-size: 1px;
           xline-height: 110px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }

div.menu div.hs2 {
           height: 30px;
           xfont-size: 1px;
           xline-height: 110px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }

div.menu div.hs3 {
           height: 40px;
           xfont-size: 1px;
           xline-height: 110px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }

div.menu div.mh1 {
           font-weight: bold; 
           xborder: solid 3px;
           xpadding-top: 10px;
           color:#444;
           background-color: inherit;
             cursor: default;
          }


div.menu div.mh3 {
           font-weight: bold; 
           xfont-weight: normal; 
           xborder: solid 3px;
           xpadding-top: 10px;
           color:red;
           background-color: inherit;
             cursor: default;
          }



div.menu div.mh1hh {
          xline-height: 55px;
          height:31px;
          font-weight: bold; 
          padding-top: 15px;
          padding-left:10px;
          padding-bottom: 0px;
          color:#000;
          xbackground-color: inherit;
          cursor: default;
          background-image: url(../bilder/shopping/leftbox-002.png); background-repeat: no-repeat;
          margin:0;
        }

div.menu div.mi1hhgk {                    /* indent 1 level */
           padding:0;
           padding-left:10px;
           margin:0;
           background-image: url(../bilder/shopping/leftbox-003.png); background-repeat: repeat-y;
          }

div.menu div.mi1 {                    /* indent 1 level */
           padding-left:10px;
          }

div.menu div.mb1 {                    /* indent 1 level */
           padding:0;
           padding-left:10px;
           margin:0;
           background-image: url(../bilder/shopping/leftbox-004.png); background-repeat: no-repeat;
           height:9px;
          }

div.menu div.mh2 {
           border: solid 8px;
          }

/* hh */
.leftMenuhh SPAN.selLink   {                  /* current selection */
             display: inline-block;
             width:100%;
             cursor: default;
             xcolor: #444;
             xbackground-color: #DDD;
             xcolor:#000099;
             xbackground-color: inherit;
             xcolor: #666666; 
             xbackground-color: #FFFFFF ;  /* gray */
             xfilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#d0d8f6', endColorStr='#FFFFFF', gradientType='1');
            }

.leftMenuhh SPAN.newMenu {
           color: red;
           background-color: inherit;
           font:  normal normal bold small sans-serif, arial ; 
          }

.leftMenuhh A {                                     /* other selections */
             display: inline-block;
             width: 100%;
             xcolor: #444;
             xcolor: #0000FF; 
             color: #666666; 
             xcolor: blue;
             background-color: inherit;
             text-decoration: none;
            }

.leftMenuhh A:hover   {                             /* pointer at other selections */
             xcolor: #FFF; 
             xbackground-color: #444 ;  /* gray */
             color: #000099; 
             xbackground-color: #d0d8f6 ;  /* gray */
             xfilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');
           }

/* gk */
div.menu span.selLink   {                  /* current selection */
             display: inline-block;
             width:100%;
             cursor: default;
             xcolor: #444;
             background-color: #DDD;
             xcolor:#000;
             xbackground-color: inherit;
             xcolor: #666666; 
             xcolor: red;
             background-color: #FFFFFF ;  /* gray */
             xfilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#d0d8f6', endColorStr='#FFFFFF', gradientType='1');
            }

div.menu span.newMenu {
           color: red;
           background-color: inherit;
           font:  normal normal bold small sans-serif, arial ; 
          }

div.menu div A {                                     /* other selections */
             display: inline-block;
             width: 100%;
             xcolor: #444;
             xcolor: #0000FF; 
             xcolor: #666666; 
             xcolor: blue;
             color: inherit;
             background-color: inherit;
             text-decoration: none;
            }

div.menu div A:hover   {                             /* pointer at other selections */
             xcolor: #FFF; 
             xbackground-color: #444 ;  /* gray */
             xcolor: #0000FF; 
             background-color: #d0d8f6 ;  /* gray */
             filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');
           }

/* hide link to login page, show only when hover */
xtd.topMenuRight div.menu div A {
             xcolor: #FF0000; 
             color: transparent;             /* moz */
             xbackground-color: #ffffff;      /* yellow */
             filter:alpha(opacity=0);        /* IE */
             background-color: transparent;  /* moz */
           }

xtd.topMenuRight div.menu div A:hover {
             color: #000000; 
             background-color: #d0d8f6 ;  /* blueish */
             filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');
           }

div.hiddenlogin a  {
             color: transparent;             /* moz */
             xbackground-color: #ffffff;      /* yellow */
             filter:alpha(opacity=0);        /* IE */
             background-color: transparent;  /* moz */
           }

div.hiddenlogin a:hover {
             color: #000000; 
             background-color: #d0d8f6 ;  /* blueish */
             filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');
           }


/* -------------------------------------------------------------------------------- */

#topMenuTable2 {                                 /* used in mailformatter.asp */
                    xwidth:620px!important;
                    xborder-spacing:2px;
                    xborder:1px solid red;
                    xborder-bottom:2px solid red;
                    xborder-bottom:2px solid #80FF80;
                    xborder-bottom:2px solid rgb(209,217,246);
                    
                    height:60px;

                    xwidth:101%;

                    xwidth:620px;      /*  196 + 212 (=408) + 100 + 112 (=212) = 620 */

                    xbackground-color:lime;
                    xdisplay:inline-table;


                    background-image: url(../bilder/style/bluebg-009-620x1.png);  /* 212x1 3 5 */
                    background-repeat: repeat-y;

                  }

#topMenuTable2 tr {
                    xvertical-align:bottom;
                    vertical-align:center;
                    xvertical-align:top;
                  }

#topMenuTable2 h2 {
                    font-size:14pt;
                    xdisplay:inline;
                    margin:0;
                  }

#topMenuTable2 h4 {
                    font-size:11pt;
                    xdisplay:inline;
                    margin:0;
                  }

.topMenuLeft2 {
                   }

.topMenuRight2 {
                    xbackground-repeat: repeat-y;
                    xpadding:0px 0 0 112px;
                    xwidth:100px;
                    xbackground-color:yellow;
                   }


.logoImg2 {  /* for printing */
                    xposition:relative;
                    xmargin:0 20px 0 0;
                    margin-top:10px;
                    border:none;
                    xfloat:left;
         }

.tabdiv  {
                    border:1px solid gray;
                    padding:5px;
                    xborder-collapse:collapse;
                    xcell-padding:40px;
                    xcell-border:1px solid gray;
         }

.tabdiv td {
                    padding:0;
           }

td.pageDiv {
                    xborder-bottom:1px solid red;
                    border-bottom:1px solid blue;
                    xborder-bottom:2px solid #80FF80;
                    xborder-bottom:2px solid rgb(209,217,246);
           }



/* -------------------------------------------------------------------------------- */


#bottomAddressTable {
                    width:600px!important;
                    xborder-spacing:2px;
                    xborder:1px solid red;
                    xborder-bottom:2px solid red;
                    xborder-bottom:2px solid #80FF80;
                    xheight:60px;
                    xbackground-color:lime;

                    color: #666666;
                    font-size: x-small;
                    text-align: center;        
                    xpadding: 10px;
                  }

.bottomAddressTd {
                    padding:0px 0px;
                    xbackground-color:yellow;
                   }




#topMenuTable {
                    width:620px!important;
                    xborder-spacing:2px;
                    xborder:1px solid red;
                    border-bottom:2px solid red;
                    xborder-bottom:2px solid #80FF80;
                    height:60px;

                    xwidth:101%;

                    xwidth:620px;      /*  196 + 212 (=408) + 100 + 112 (=212) = 620 */

                    xbackground-color:lime;
                    xdisplay:inline-table;

                  }




.topMenuLeft {
                    xbackground-position: -62px;

                    background-image: url(../bilder/style/bluebg-005.png);  /*212x1 3 5*/
                    background-repeat: repeat-y;
                    xbackground-position: 196px;
                    background-position: right;                       /* funngerar ej i IE6 (stretching instead) */

                    xwidth:150px;
                    xwidth:auto;

                    padding:10px 0 0 0;

                    xbackground-color:red;
                   }

.topMenuRight {
                    background-image: url(../bilder/style/bluebg-003.png);  /*212x1 3 5*/
                    xbackground-position: 1px;

                    background-repeat: repeat-y;

                    padding:0px 0 0 112px;
                    width:100px;

                    xbackground-color:yellow;
                   }



/* ------------------------------------------------------------------------------------------------------ */
/* shopping cart */
/* ------------------------------------------------------------------------------------------------------ */


.flashing {
            xfont: bold 12pt sans-serif;
          }






.mainTD {
           xborder:1px solid red;
           xposition:relative;
         }

/* ------------------------------------------------------------------------------------------------------ */
/* contactForm                                                                                            */
/* ------------------------------------------------------------------------------------------------------ */

table.contactForm       {
                    display:inline-block;
                    xbackground-color:red;
                   }

table.contactForm col.left {            
                    xwidth:100px;               /* OK i IE8, OK i FF */
                    xbackground-color:pink;      /* OK i IE8, OK i FF */
                    text-align:left;            /* fungerar EJ i IE8, fungerar EJ i FF */
                   }


table.contactForm col.right {
                    width:206px;
                    xbackground-color:cyan;
                    text-align:right;        
                   }

table.contactForm td.left {
                    text-align:left;        
                   }

table.contactForm td.right {
                    text-align:right;        
                   }


table.contactForm .textbox {
                     width:200px;
                   }

table.contactForm textarea {
                     width:200px;
                   }

/* ------------------------------------------------------------------------------------------------------ */

table.loginForm       {
                    display:inline-block;
                    xbackground-color:red;
                   }

table.loginForm td.left {
                    text-align:left;        
                   }

table.loginForm td.right {
                    text-align:right;        
                   }

table.loginForm tr {
                    vertical-align:bottom;
                   }


/* ------------------------------------------------------------------------------------------------------ */

div.center            {
                    text-align: center;        
                    xborder:1px solid blue;
                   }

p.address  {
                    xborder:1px solid green;
                    xwidth:200px;
                    font-style:italic;
                   }

/* ------------------------------------------------------------------------------------------------------ */


#testTable         {
                    display:inline-block;
                    display:none;
                   }

#testTable > td  {
                    width:200px;               /* fungerar EJ i IE8, OK i FF */
                    background-color:pink;     /* fungerar EJ i IE8, OK i FF */
                    text-align: left;          /* fungerar EJ i IE8, fungerar EJ i FF */
                   }

#testTable > tbody tr > td + td  {
                    width:200px;
                    background-color:cyan;
                    text-align: right;        
                   }

#xtestTable .leftCol td {            
                    width:100px;               /* OK i IE8, OK i FF */
                    background-color:pink;     /* OK i IE8, OK i FF */
                    text-align: left;          /* fungerar EJ i IE8, fungerar EJ i FF */
                   }

#xtestTable .rightCol td {
                    width:200px;
                    background-color:cyan;
                    text-align: right;        
                   }



/* nice and colorful table parts */ 
table.sortable thead { xbackground-color: #C0C0FF; xfont-size: 80%; }
table.sortable tbody { xbackground-color: #C0FFC0; xfont-size: 80%; }
table.sortable tfoot { xbackground-color: #FFC0C0; xfont-size: 80%; }

/* nice and colorful table parts */ 
table.notsortable thead { background-color: #FFC0C0; }
table.notsortable tbody { background-color: #C0FFC0; }
table.notsortable tfoot { background-color: #C0C0FF; }


/* ------------------------------------------------------------------------------------------------------ */
/* shopping cart */
/* ------------------------------------------------------------------------------------------------------ */

.mainTD, .mainTD table, .mainTD input, .mainTD select, .mainTD textarea.delAddr {
/*          font- [<-style>||<-variant> || -weight> ] ?<-size>   [ /<line-height> ]     ?<font-family> */
            xfont:  italic      normal       normal      small      /normal               sans-serif, fantasy, Arial, "Times New Roman"; 
            xfont:  italic      normal       normal      small      /normal               sans-serif, fantasy, Arial, "Times New Roman"; 
            xfont:  normal      normal       normal      11px      /normal              arial, sans-serif, Arial, fantasy,  "Times New Roman"; 
          xcolor: #666666;
          }

.mainTD textarea.delAddr, .mainTD input, .mainTD select.selCountry {
            xfont-size: 100%; 
          xcolor: #666666;
          }

.mainTD h1, .mainTD h2, .mainTD h3, .mainTD h4, .mainTD h5, .mainTD h6, .mainTD p, .mainTD div, .mainTD span, .mainTD ul, .mainTD ol  {
          xtext-align: left; 
          xcolor: #666666;
          xfont:  normal      normal       normal      11px      /normal              arial, sans-serif, Arial, fantasy,  "Times New Roman"; 
          }

.mainTD span.formError {
          text-align: right; 
          color: #FF0000;
          xfont:  normal      normal       normal      11px      /normal              arial, sans-serif, Arial, fantasy,  "Times New Roman"; 
          }

.formError {
          color:red;
          }

div.debugMessage {
          color:black;
          background-color:white;
          xborder:3px solid green;
          z-index:3;
          position:relative;
          font-size:medium;
          xmargin:10px;
          }

div.debugMessage pre.dbgFrame {
          position:relative;
          margin:0 0 10px 0;
          }

div.debugMessage pre#vbDebug {
          border:3px solid green;
          }

div.debugMessage pre#scriptDebug {
          border:3px solid blue;
          }

div.debugMessage pre#gksortDebug {
          border:3px solid cyan;
          }




/*

.mainTD h1       {font-size: 300%;}
.mainTD h2       {font-size: 250%;}
.mainTD h3       {font-size: 200%;}
.mainTD h4       {font-size: 180%;margin:0;padding:0;}
.mainTD h5       {font-size: 150%;}
.mainTD h6       {font-size: 120%;margin-bottom:0.5em;}


h4       {font-size: 180%;margin:0;padding:0;}
h5       {font-size: 150%;margin:0;padding:0;}
h6       {font-size: 120%;margin:0;padding:0;}

*/

input.qty {
            margin:0 0 0 0;  /* top right bottom left */
            padding:0px 3px 0px 3px;  /* top right bottom left */
            text-align:right;
            height:1.2em;
            width:2.5em;
          }

/* ---------------------------------- */
/* product lists                      */

table.catalog {
            xborder-collapse:collapse;
            width:100%;
            xbackground-color:yellow;
          }

table.catalog td, table.catalog th {
            xborder:1px solid transparent;
            border-style:solid;
            border-width:0px 5px;
            xborder-color:yellow;
            xborder-color:transparent;
            xwidth:auto;
            xborder-spacing:15px;
          }
/*
table.catalog .firstCol {
            border-left-width:0px;
          }

table.catalog .lastCol {
            border-right-width:0px;
          }
*/

table.catalog th {
            xborder-color:#E0E0E0;
            border-color:rgb(220,226,252);
          }


table.catalog td {
            border-color:#FFFFFF;
          }

table.catalog tr > td, table.catalog tr > th {
            xborder-color:transparent;
          }

table.catalog .pl {
            xpadding-left:5px;
          }

table.catalog .pr {
            xpadding-right:5px;
          }

table.catalog .al {
            text-align:left;
          }

table.catalog .ac {
            text-align:center;
          }

table.catalog .chgQty {
            text-align:center;
            xbackground-color:red;
          }

table.catalog .chgQty input {
            border:none;
            xborder-width:10px;
            margin:0 1px;
            padding:0;
          }

table.catalog .qty {
            xdisplay:none;
          }



table.catalog .ar {
            text-align:right;
          }


table.catalog tr {
            white-space:nowrap;
          }

table.catalog thead tr {
            xbackground-color:#E0E0E0;
            background-color:rgb(220,226,252);
            font-weight:bold;
          }
/*
table.catalog col.c1 {background-color:#88c;}
table.catalog col.c2 {background-color:#8c8;}
table.catalog col.c3 {background-color:#c88;}
table.catalog col.c4 {background-color:#8cc;}
table.catalog col.c5 {background-color:#c8c;}
table.catalog col.c6 {background-color:#cc8;}
table.catalog col.c7 {background-color:#88c;}
*/



/*


---------------------#coTab1-------------------------------
|                                                         |
| -------------------<tbody>----------------------------  |
| |                                                    |  |
| |   -------#coTab2------    -------#coTab3---------  |  |
| |   |                  |    |                     |  |  |
| |   |                  |    |   #calcCostTBody    |  |  |
| |   |                  |    |                     |  |  |
| |   |                  |    |   #totCostTBody     |  |  |
| |   |                  |    |                     |  |  |
| |   --------------------    -----------------------  |  |
| |                                                    |  |
| ------------------------------------------------------  |
|                                                         |
| -------------------#paymentTBody----------------------  |
| |                                                    |  |
| |                                                    |  |
| |                                                    |  |
| |                                                    |  |
| ------------------------------------------------------  |
|                                                         |
--------------------/#coTab1-------------------------------

*/



/* #coTab2 .sumLeft */

x#coTab1  {     /* in left td of #coTab1 */
            background-color:lime;
            xposition:relative;
         }

x#coTab2  {     /* in left td of #coTab1 */
            background-color:red;
         }

x#coTab3  {     /* in right td of #coTab1 */
            background-color:yellow;
         }

x#coTab3 #totCostTBody  {     /* #coTab3.body2 */
            xbackground-color:cyan;
         }

x#coTab1 #paymentTBody  {     /* #coTab1.body2 */
            background-color:blue;
         }

x#coTab1 #paymentTBody input {     /* #coTab1.body2 */
            xposition:relative;
         }


/* ---------------------------------- */
/* Valuta & Land                      */

table.sumLeft select {
            xbackground-color:#DDD;
            xwidth: 100%;
            width: 12em;
          }

/* ---------------------------------- */
/* betalning & belopp                 */

table.sumRight {
            xtable-layout: fixed;
            xborder-collapse: collapse;   /* separate collapse */
            text-align:left;
          }

table.sumRight .sumCol1 {
            xbackground-color:pink;
            xwidth: 7em;
          }

table.sumRight .sumCol2 {
            xbackground-color:pink;
            width: 6em;
            text-align:right;
          }

table.sumRight tr.amountRow, table.sumRight tr.amountTot {
            xbackground-color:#DDD;
            xborder-top:5px solid green;
            xwhite-space: nowrap;
          }

table.sumRight tr.amountRow td {
            xbackground-color:#DDD;
            border-top:1px solid gray;
            xwhite-space: nowrap;
          }

table.sumRight tr.amountRow td.amount {
            xbackground-color:#DDD;
            xwhite-space: nowrap;
            xborder-top:1px solid gray;
            xborder-bottom:2px solid gray;
            xpadding-top:5px;
            xfont-size:larger;
            xbackground-color:green;
            text-align:right;
          }

table.sumRight tr.amountTot td {
            font-weight:bold;
          }

table.sumRight tr.amountTot td {
            xbackground-color:#DDD;
            xwhite-space: nowrap;
            xborder-top:1px solid gray;
            border-bottom:2px solid gray;
            padding-top:5px;
            xfont-size:larger;
          }



/* ---------------------------------- */
/* betalning: paypal eller giro       */

table.payment {
            xtable-layout: fixed;
            xborder-collapse: collapse;
          }


table.payment .payCol1 {
            xbackground-color:pink;
            xpadding-right:10px;
            xwidth: 5em;
            xtext-align:center;
            width: 30px;
          }

table.payment .payCol2 {
            xbackground-color:green;
            xpadding-left:5px;
            xpadding-right:5px;
            xwidth: 15em;
            xtext-align:right;
            width: 230px;
          }


table.payment tr {
            vertical-align:top;
          }


table.payment h4 {
            margin:0px;
          }

table.delivery h4 {
            margin:0px;
          }

table.payment input {
            xmargin-top:6px;
          }

table div.logoPictures {
            xvertical-align:middle;
            xbackground-color:green;
            xdisplay:block;
          }

div.paySubmit {
            xbackground-color:green;
            text-align:center;
          }

table div.logoPictures * {
            vertical-align:middle;
            xmargin:0px;
            xpadding:0px;
          }

table tr.checkLogo {
            vertical-align:top;
            xbackground-color:green;
          }


table.payment div {
            xborder:1px solid red;
          }




/* ---------------------------------- */
/* kunduppgifter & leveransadress     */

table.delivery {
            xtable-layout: fixed;
            xborder-collapse: collapse;
          }

table.delivery p {
            text-align:left;
          }

table.delivery .delCol1 {
            xbackground-color:pink;
            padding-right:10px;
            width: 5em;
          }

table.delivery .delCol2 {
            xbackground-color:green;
            padding-left:5px;
            padding-right:5px;
            width: 15em;
            text-align:right;
          }

table.delivery input {
            xbackground-color:cyan;
            xwidth: 100%;
            width: 13.5em;
          }

table.delivery textarea {
            xbackground-color:yellow;
            width: 100%;
            xmargin: 0px 0px 0px 0px;
            xwidth: 24em;
            overflow: hidden;
            xpadding-right:10px;
          }

table.delivery select.selCountry {
            xmargin: 0px 0px 0px 0px;
            xbackground-color:yellow;
            xwidth: 22em;
            xwidth: 100%;
            width: 14em;
          }

/* ---------------------------------- visible */



div.picLeft, div.picRight, div.picCenter  {
           xborder:1px dotted red;
            text-align:center;
            xdisplay:inline-block;
            font-style:italic;
            xoverflow:visible;        /* hidden visible */
            xwhite-space:nowrap;       /* normal nowrap pre */
            xpadding:0;
            xmargin:0;
            xline-height:0;
            margin:10px;
          }

div.picLeft img, div.picRight img, div.picCenter img {
            width:100%;
            xmargin:0;
            xpadding:0;
          }

div.picLeft p, div.picRight p, div.picCenter p {
            margin:0;
            xpadding:0;
          }

div.picLeft {
            float:left;
            margin-left:0px;
            xbackground-color:#ffc0c0;
          }

div.picRight {
            float:right;
            margin-right:0px;
            xbackground-color:#c0ffc0;
          }

div.picCenter {
            display:inline-block;
            align:center;
            xtext-align:center;
            xbackground-color:#c0c0ff;
          }


hr {
            xcolor:red;
            xborder-color:red;
            xbackground-color:red;
          }


/* ----------------------------



#coTab1   { background-color:cyan; }
#coTab2   { background-color:lime; }
#coTab3   { background-color:yellow; }
#coTab4   { background-color:pink; }
#coTab5   { background-color:red; }

*/

/* ---------------------------- */
/* weblog                       */
/* ---------------------------- */

.webLogTable {
                    white-space:pre;
                   }

.webLogTable .theadRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

span.weblogDetails h4 {
                    margin-bottom:0;
                  }

span.weblogDetails pre {
                    border:1px solid red;
                    margin-top:0;
                    font: normal normal normal 10pt /normal monospace, fantasy, sans-serif, "Arial", "arial", serif;
                  }


.tfootTdTest {
                    font-weight:bold;
                    background-color:lime;
                   }

/* ---------------------------- */
/* webOrders                    */
/* ---------------------------- */

.ohTable {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.ohTable .theadRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

.ohTable .tfootRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

.ohTable td {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }


.orTable {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.orTable .theadRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

.orTable td {
                    xwhite-space:pre;
                    xwhite-space:nowrap;
                   }

.orTable td.payMsg {
                    white-space:normal;
                    width:200px!important;
                    xposition:relative;
                    xborder:1px solid red;
                    background-color:pink;
                   }

.fldEmpty {
                    background-color:silver;
                   }

.fldNull {
                    background-color:aqua;
                   }

.fldZlen {
                    background-color:yellow;
                   }

.regPaidAgent option:first-child {
                    background-color:aqua;
                   }

td.PMtext {
                    white-space:normal;
                    xwidth:200px!important;
                    width:300px;
                    xposition:relative;
                    xborder:1px solid red;
                    background-color:lime;
                    height:20px;
                    overflow:hidden;
                    display:inline-block;
                   }


div.paidAgentMsg {
                    background-color:lime;
                   }

tbody > tr > td > div.DivPMtext {
                    white-space:normal;
                    xwidth:200px!important;
                    width:150px;
                    xposition:relative;
                    xborder:1px solid red;
                    background-color:pink;
                    height:20px;
                    overflow:hidden;
                    xdisplay:inline-block;
                   }




/*
------------------------------------------
16 HTML 4 named web colors
black gray silver white maroon red purple fuchsia green lime olive yellow navy blue teal aqua 

Light VGA colors: silver white lime yellow aqua 

orange (added in CSS 2.1)
------------------------------------------


Web-Safe Colors (6 shades of each RGB value)
00 33 66 99 CC FF

------------------------------------------
*/


/* ----------------------------------------------------------------------------- */
/* 
/* http://en.wikipedia.org/wiki/Web_colors
/* 
/* http://msdn.microsoft.com/en-us/library/ms531197(v=vs.85).aspx
/* 
/* ----------------------------------------------------------------------------- */


/* ---------------------------- */
/* 3-column orderhead table     */
/* ---------------------------- */

.ohTable3 {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.ohTable3 .theadRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

.ohTable3 td {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.ohTable3 {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.ohTable3 .theadRow {
                    font-weight:bold;
                    background-color:#d0d8f6;
                   }

.ohTable3 td {
                    xwhite-space:pre;
                    white-space:nowrap;
                   }

.ohTable3 td.adrLbl {
                    xwhite-space:pre;
                    white-space:normal;
                    background-color:lime;
                   }

.ohTable3 td.payMsg {
                    white-space:normal;
                   }



/* ---------------------------- */
/* webshop layout table         */
/* ---------------------------- */
div.hsep {
                    xbackground-color:#d0d8f6;
                    background-color:yellow;
                    height:10px;
                    background-image: url(../bilder/style/bluebg-007.png);        /* 1x1 */
                    xbackground-image: url(../bilder/style/bluebg-009-620x1.png);  /* 212x1 3 5 */
                    xbackground-image: url(../bilder/style/bluebg-003.png);  /*212x1 3 5*/
                    xbackground-image: url(../bilder/style/bluebg-005.png);  /*212x1 3 5*/

                    background-repeat: repeat;
                    xbackground-repeat: repeat-y;
                    background-position: left;                       /* funngerar ej i IE6 (stretching instead) */
                    
                    margin:10px 0px;
                    xpadding:0;
                    xborder:none;
                   }

div.hsepL {
                    xbackground-color:#d0d8f6;
                    xbackground-color:yellow;
                    height:100%;
                    xbackground-image: url(../bilder/style/bluebg-007.png);        /* 1x1 */
                    xbackground-image: url(../bilder/style/bluebg-009-620x1.png);  /* 212x1 3 5 */
                    background-image: url(../bilder/style/bluebg-005.png);  /*212x1 3 5*/
                    xbackground-image: url(../bilder/style/bluebg-003.png);  /*212x1 3 5*/

                    background-repeat: repeat-y;
                    background-position: left;                       /* funngerar ej i IE6 (stretching instead) */
                    width:50%;
                    float:left;
                    xborder:none;
                    xmargin:0;
                    
                   }

div.hsepR {
                    xbackground-color:#d0d8f6;
                    xbackground-color:yellow;
                    height:100%;
                    xbackground-image: url(../bilder/style/bluebg-007.png);        /* 1x1 */
                    xbackground-image: url(../bilder/style/bluebg-009-620x1.png);  /* 212x1 3 5 */
                    xbackground-image: url(../bilder/style/bluebg-005.png);  /*212x1 3 5*/
                    background-image: url(../bilder/style/bluebg-003.png);  /*212x1 3 5*/

                    background-repeat: repeat-y;
                    background-position: right;                       /* funngerar ej i IE6 (stretching instead) */
                    width:50%;
                    float:right;
                    xborder:none;
                    xmargin:0;
                    
                   }

/* added 2010-10-09 intallation and user guide */

table.guide .f1 { /* light (Button Face) field label */
        background-color:#E0E0E0;
        background-color:#F0F0F0;
      }

table.guide .chk1 { /* checkbox container, light (Button Face) field label */
        background-color:#F0F0F0;
        xbackground-color:#E0E0E0;
        xbackground-color:#D0D0D0;
        position:relative;
        padding:0 3px;
        xdisplay:inline-block;
        font:9pt "Arial";
        white-space:nowrap;
        xheight:9px;
        xword-break:nobreak;
        xword-wrap:nowrap;
      }

table.guide .chk1 span { /* checkbox */
        width:8px;
        height:8px;
        border:2px inset #E0E0E0;
        display:inline-block;
        margin:0 5px;
        padding:0px 0px 0px 0px;  /* t r b l */
        top:2px;
        position:relative;
        background-color:#FFFFFF;
        font:normal normal normal 8pt sans-serif,serif,"Arial";
      }

table.guide .chk1 span span { /* checkbox content */
        position:relative;
        top:-2px;
        left:1px;
        border:none;
        margin:0;
        padding:0;
        background-color:transparent;
      }


table.guide .f2 { /* darker field label - clickable */
        background-color:#C0C0C0;
        background-color:#D0D0D0;
        background-color:#E0E0E0;
      }

table.guide .f3 { /* small button */
        background-color:#E0E0E0;
        background-color:#F0F0F0;
        border:2px outset #F0F0F0;
        padding:0px 8px;
        font:8pt "Arial";
      }

table.guide .f4 { /* medium button */
        background-color:#E0E0E0;
        background-color:#F0F0F0;
        border:2px outset #F0F0F0;
        padding:0px 15px;
        font:8pt "Arial";
      }

table.guide .f5 { /* light field label green */
        background-color:#E0E0E0;
        background-color:#F0F0F0;
        color:#008000;
        font:8pt "Arial";
      }

table.guide div.ic { /* image container */
        position:relative;
        xborder:10px solid #0000FF;
      }

table.guide div.HLBox { /* highlight box */
        position:absolute;
        border:2px solid #FF0000;
      }

table.guide td.c1 { /* td col 1 */
        xwidth:340px;
        xpadding-left:200px;
        xborder:2px solid #FF0000;
        xbackground-color:#00FFFF;
      }

table.guide td.c2 { /* td col 2 */
        xwidth:200px;
        padding-left:20px;
        xborder:2px solid #FF0000;
        xbackground-color:#FFFF00;
      }

table.guide td.c2 h4 { /* header */
        text-align:left;
        xpadding-left:20px;
      }

table.guide td.c2 p { /* text */
        text-align:left;
        xpadding-left:20px;
      }

table.guide td.c2 ul { /* unordered list */
        text-align:left;
        padding-left:20px;
      }

table.guide td.c2 ol { /* ordered list */
        text-align:left;
        padding-left:20px;
      }

table.shopPage h4 { /* header */
        margin:0;
        padding:0;
      }


table.inputFormLeft tr td:first-child  {
                    xwidth:200px;
                    xbackground-color:cyan;
                    text-align: right;        
                   }