/* 
 * åäö ÅÄÖ
 * 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 {
      background-position: 0px 0px;
background-color: #FFFFFF;
font-family: arial,arial;      
font-size: 12px;
      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;
                    xbackground-color:yellow;
                    background-color:transparent;
                    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%;
                    border:none;
                    padding:0px;                 /* from frame-border inner edge to cells outer border edge         */
                    border-collapse:separate;    /* must use separate for FF when height=100% and border on table or cells */
                    empty-cells:show; 
                    
                   }

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


#layoutTableLeftFillCol  {
                   }

#layoutTableLeftCol  {
                    width:212px!important;
                    background-color: #ffffff;
                    xbackground-image: url(../bilder/style/bluebg-003.png);  /*212x1 */
                   }

#layoutTableMainCol  {
                    width:620px!important;
                    background-color: #ffffff;
                   }

#layoutTableRightCol  {
                    width:auto;
                   }

#layoutTable.withMenuInTable #layoutTableRightCol {
                   }


#layoutTableRightFillCol  {
                   }

.layoutTableRow {
                   }

.layoutTableCell {
                    border:none;
                    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;
                   }

#layoutTableTopTD {
                    padding:0;
                   }



#layoutTableRightTD {

                   }

#layoutTableRightFillTD {
                   }



#layoutTableMainRow  {
                    vertical-align: top;        
                   }


#layoutTableMainTD {
      			        padding: 10px;
                    font: normal normal normal small /normal xfantasy, sans-serif, "Arial", "arial", serif;

				          }




#layoutTableMainTD em {
                    font-weight:bold;
                    color:red;
				          }


#layoutTableBottomRow  {
                    vertical-align: bottom;        
                   }


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

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



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

xinput[type="text"] {
/*       font- [<-style>||<-variant> || -weight> ] ?<-size>   [ /<line-height> ]     ?<font-family> */
         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> */
         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%;          
          }     
               
         
.bildtext  
{
color: #666666; font-size: 60%; 
}


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



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



#leftDIV {
                    border:none;
                    height:100%;
                    width:200px;
                    margin:0;
                    xpadding:0;
                    padding-top:120px;
                    padding-left:12px;
                    
                  }


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' );

                   }                                   

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;

                   }                                   

.logoImg {
                    position:relative;
                    top:0px;
                    left:-12px;
                    margin:0;
                    border:none;
         }




#leftMenuTable  {                         /* Knappar - används ej */
                    position:absolute;
                    top:260px;
                    left:12px;
                    xmargin:10px;
                    width:150px;
                   }


.copy      
{
color: #666666;
font-size: 10px;
}

.copy a          {text-decoration:none; color:#666666;}
.copy a:hover    {text-decoration:none; color:#666666;}


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


td.copy      {
                    padding:5px 12px ;

                  }


/* -------------------------------------------------------------------------------- */
/* 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 */
                    height:3em;  /* em = The computed font-size. ex = The height of a lowercase "x".  */
                  }                                   

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






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

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

.menu {
            font:  normal normal normal small /normal sans-serif, Arial, "Times New Roman"; 
            color: #444;
            margin:10px 0;
                        
          }



.leftMenu {
xbackground-image: url(../bilder/shopping/leftboxes.png); background-repeat: no-repeat;
width:200;
height:500px;
            font:  normal normal normal small /normal sans-serif, Arial, "Times New Roman"; 
            color: #444;
            margin:10px 0;
                        
          }

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

.leftMenu DIV.hs0 {
           height: 10px;
           font-size: 1px;
           line-height: 1px;
           margin-top: 4px;
           margin-bottom: 4px;
          }

.leftMenu DIV.hs1 {
           height: 15px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }
.leftMenu DIV.hs2 {
           height: 10px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }
.leftMenu DIV.hs3 {
           height: 10px;
           background-color: inherit;
           margin-top: 0px;
           margin-bottom: 0px;
          }

.leftMenu .mh1 {
line-height: 55px;
font-weight: bold; 
padding-left:10px;
padding-bottom: 0px;
color:#000;
             cursor: default;
          }

.leftMenu .mh2 {
           border: solid 8px;
          }

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


.leftMenu SPAN.selLink   {                  /* current selection */
             display: inline-block;
             width:100%;
             cursor: default;
             color:#000099;
            }

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

.leftMenu A {                                     /* other selections */
             display: inline-block;
             width: 100%;
             color: #666666; 
             background-color: inherit;
             text-decoration: none;
            }

.leftMenu A:hover   {                             /* pointer at other selections */
             color: #000099; 
             fxilter:progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FFFFFF', endColorStr='#d0d8f6', gradientType='1');
           }

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

#topMenuTable2 {
                    
                    height:60px;
xbackground-image: url(../bilder/style/bluebg-009-620x1.png);  /* 212x1 3 5 */
                    xbackground-repeat: repeat-y;

                  }

#topMenuTable2 tr {
                    vertical-align:center;
                  }

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

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

.topMenuLeft2 {
                   }

.topMenuRight2 {
                   }


.logoImg2 {  /* for printing */
                    margin-top:10px;
                    border:none;
         }

.tabdiv  {
                    border:1px solid gray;
                    padding:5px;
         }

.tabdiv td {
                    padding:0;
           }

td.pageDiv {
                    border-bottom:1px solid black;
           }



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


#topMenuTable {
                    width:620px!important;
                    xborder-bottom:2px solid red;
                    height:60px;

                  }




.topMenuLeft {
background-image: url(../bilder/toplogo.jpg);  /*212x1 3 5*/
                    xbackground-repeat: repeat-y;
                    xbackground-position: 196px;
                    xbackground-position: right;                       /* funngerar ej i IE6 (stretching instead) */
height:100px;
                    xwidth:150px;
                    xwidth:auto;
padding:10px 0 0 0;
}

.topMenuRight {
                    xbackground-image: url(../bilder/style/bluebg-003.png);  /*212x1 3 5*/
                    xbackground-position: 1px;
                    xbackground-repeat: repeat-y;
                    padding:0px 0 0 112px;
                    width:100px;
}



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


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






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

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

table.contactForm       {
                    display:inline-block;
                   }

table.contactForm col.left {            
                    text-align:left;            /* fungerar EJ i IE8, fungerar EJ i FF */
                   }


table.contactForm col.right {
                    width:206px;
                    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;
                   }

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;        
                   }

p.address  {
                    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> */
          }

.mainTD textarea.delAddr, .mainTD input, .mainTD select.selCountry {
          }

.mainTD h1, .mainTD h2, .mainTD h3, .mainTD h4, .mainTD h5, .mainTD h6, .mainTD p, .mainTD div, .mainTD span, .mainTD ul {
          }

.mainTD span.formError {
          text-align: right; 
          xcolor: #FF0000;
          }

.formError {
          color:red;
          }

div.debugMessage {
          color:black;
          background-color:white;
          z-index:3;
          position:relative;
          font-size:medium;
          }

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 {
            width:100%;
            xbackground-color:yellow;

          }

table.catalog td, table.catalog th {
            border-style:solid;
            border-width:0px 5px;
          }
/*
table.catalog .firstCol {
            border-left-width:0px;
          }

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

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


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

table.catalog tr > td, table.catalog tr > th {
          }

table.catalog .pl {
          }

table.catalog .pr {
          }

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

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

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

table.catalog .chgQty input {
            border:none;
            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:rgb(220,226,252);
            font-weight:bold;
          }



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

table.sumLeft select {
            width: 12em;
          }

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

table.sumRight {
            text-align:left;
          }

table.sumRight .sumCol1 {
          }

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

table.sumRight tr.amountRow, table.sumRight tr.amountTot {
           }

table.sumRight tr.amountRow td {
            border-top:1px solid gray;
          }

table.sumRight tr.amountRow td.amount {
            text-align:right;
          }

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

table.sumRight tr.amountTot td {
            border-bottom:2px solid gray;
            padding-top:5px;
          }



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

table.payment {
          }


table.payment .payCol1 {
            width: 30px;
          }

table.payment .payCol2 {
            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;
                  }


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

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

.ohTable .theadRow {
                    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;
                    white-space:nowrap;
                   }