/* Style sheet for Top Carpets website */

/* Colours used:
background (wraptransparent): #00877b
background: #ffffff
main screen text: #000000
pulldown menu background: #000000
pulldown menu hover: #e20a17 (red)
*/


/* main links */

a:link    {color:blue;} 
a:visited {color:purple;} 
a:hover   {color:DeepSkyBlue;}
a:active  {color:purple;}
a:focus   {color:purple;}

a:link, a:hover, a:active, a:focus, a:visited {text-decoration:none; 
           background-color:transparent}

/* type selectors */

body {text-align:center; margin-left:auto; margin-right:auto; margin-top:0px; margin-bottom:0px;
      padding:0px; width:1003px; top:0px;
      font-family:tahoma, "Arial Black", arial, sans-serif; 
      font-size:0.8em; font-weight:normal; color: #000000; background-color:#ffffff;}
            /* This is legacy code left in after client changed their mind: 
         border-left:175px solid #e20a17; */

#wrap {background-color:#ffffff; border-bottom:0px; margin-bottom:0px; padding:0px;}

p {margin:0 0.8em; padding:0.3em 0; text-align:justify; }
h1, h2, h3, h4, h5, h6 {color: #00877b; 
                        font-family:tahoma, "Arial Black", verdana, arial, sans-serif; 
                        text-align:left; 
                        font-weight:bold; margin:0; padding:0.3em 0;} 
						
h1{color: #FFF; 
                        font-family:tahoma, "Arial Black", verdana, arial, sans-serif; 
                        text-align:left; 
                        font-weight:bold; margin:0; padding:0.3em 0;} 						

h1 {font-size:12pt;}
h2 {font-size:12pt; margin-left: 10px;}
h3 {font-size:1.3em;}
h4 {font-size:1.2em; margin-left:10px;}
h5 {font-size:1.1em;}
h6 {font-size: 1em;}

hr {display:none;}

ol, ul {text-align:left;}
ul.char {list-style: none;
         margin-left: 0em;
         padding-left: 0em;
         text-indent: 0em;
        }

/* ------------------- id selectors -------------------------------- */

/* all the -0's are a rather inelegant hack to achieve red side panel as per late
   in the day customer request */

#banner {height:180px; width:1003px; background-color:transparent; position:relative;
         top:0px; left:0px; padding:0; margin:0; text-align:center;}

#sidecol, #mainsect, #mainsect-wider, #rightpanel {display:inline; float:left; 
                                                   }

#sidecol {position:relative; top:-7px; left:0px;
          padding: 0; width:175px; height: 500px; background:#e20a17;}

#mainsect, #mainsect-wider {position:relative; text-align:justify; margin:1px 15px 0 15px;
           padding:0; border:0; font-size:10pt; font-weight:normal; left:-0px;}
#mainsect {width:550px;}
#mainsect-wider {width:780px;}
#mainsect p {width:95%; margin-left:10px;}

#rightpanel {float:right; width:242px; position:relative; left:-0px; top:-25px; 
              padding:0px; 
              margin:0px; border:0;}
			  
#rightpanel2 {float:right; width:240px; position:relative; left:0px; top:0px; 
              padding:0px; 
              margin:0px; border:0;
			  text-align:left;
			  border-bottom:solid thin #999;
			  border-left:solid thin #999;
			  border-right:solid thin #999;
			  border-top:solid thin #999;
			  }

#bottom {clear:both; border:none;}

#Contact {position:relative; top:-80px;}
#ContactForm {position:relative; margin-top:20px; 
              border:2px solid #003366; padding:10px;
              width:400px; top:-370px; left:365px;}
#ContactForm label{width: 70px;
                   float: left;
                   text-align: right;
                   margin-right: 3px;
                   display: block;
                  } 

#FeedbackLet {position:relative; top:32px; border:2px solid #003366; padding:10px;
               width:325px;}

#FeedbackForm {position:relative; top:10px;left:200px; border:2px solid #003366; padding:10px;
               width:325px; text-align:left;}

/* From when TV was embedded
  .TV1 {position:relative; top:20px; left:150px; height:290px; width:248px; }
  .TV1 .hide {display:none;}
  .TV1:hover,
  .TV1 a:hover .hide {display:block;}         
  .TV1 .promimg {position:absolute; top:0px; left:0px;  }
*/

.sidewrite {position:absolute; top:150px; right:260px; width:100px; text-align:right; }

.TV0, .TV1 {position:relative; left:150px; height:230px; width:248px; top:0px;}
.TV0 {top:20px; height:250px;}

.promimg {position:absolute; top:0px; left:0px; }

.BigTV {position:absolute; top:-100px; left:0px; border:5px solid #000000;}

.pamphlet {position:relative; top:20px; left:70px; width:420px;}
.pamphlet img {margin-right:0px; margin-bottom:5px; border:2px solid;}

/* ----------- Class Selectors ---------------- */

.afterGrn {clear:both; padding-top:12px; padding-left:10px;}

.bold {font-weight:bold;}
.boldc {font-weight:bold; text-align:center;}
.bigbold {font-size:1.2em; font-weight:bold; }
.bigboldj {font-size:9pt; font-weight:bold; text-align:justify; margin:9px 0 0 12px; 
           line-height:11pt; }
.biggertext {font-size:1.1em;}
.clear {clear:both;}
.italic {font-style:italic;}
.bolditalic {font-style:italic; font-weight:bold;}

.eightyper {width:80%;}
 
.frontpage {position:relative; top:5px; left:-141px; 
             height:auto; width:939px; border:0; margin:0;
            padding:0; float:left;}

.frontpage a img {border:0px;}

.frontpageimg {position:absolute; top:5px; left:0px; }

.HeadOffice {position:relative; left:365px; top:-220px; width:400px; border:none; }
.HeadOffice table {border:none;}

.Province {position:relative; left:320px; top:-220px; width:490px;}
.Province table {margin:1em 0.8em; font-size:0.8em; text-align:left;}
.Province td {border-width: 1px;
              border-style: solid;
              border-color: #000000;}

.Gauteng table {margin:10px;}


.hr {border-top:1px solid #000000; margin:0.7em 0.8em 0.5em;}
.hrsect {border-top:3px double #000000; margin:0.7em 0.8em 0.5em;}
.hrdash {border-top:1px dashed #000000; margin:0.7em 10.8em 0.5em;}

.column1, .column2 {position:relative; top:20px; width:380px; display:inline; float:left;}
.column1 {left:25px;}
.column2 {top:-0px;}
.column1 p, .column2 p {width:85%;}

.LeftAlign {text-align:left;}
.RightAlign {text-align:right;}
.centre {text-align:center;}
.indented {padding-left: 50px; padding-right: 50px; text-align:left;}

.UpdateLine {text-align:right; font-size: 75%; padding-top:20px;}
.small {font-size:75%;}
.numberedlist ul li {list-style:decimal inside;}

.imgfl, .imgfr {padding: 0 1em;}
.imgflnopad {float:left; padding:0px; margin:10px;}
.imgflnopadnomarg {float:left; padding:0px; margin:0px; border:none; }
.imgnopadcntr {padding:0px; display: block; 
                 margin-left:auto; margin-right:auto; }
.imgpadcntr {padding: 0px 0px 5px 0px; display:block;
                 margin-left:auto; margin-right:auto; }
.imgfr {float:right;}
.imgflnb {float:left; border:none; text-decoration:none; }
.imgframe {border:3px solid #000000;}
.imglogo {position: absolute; top:10px; left:10px; float:left;}

.imginbox {display:inline; padding-top:0px;}
.beforeimg {padding-top:-3px;}


img.imgcntr {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.imgcntrb {text-align:center; border:1px solid #000000;}
.imgcntrnb {display:block; margin-left:auto; margin-right:auto; border:none; text-decoration:none;}

.pad10 {padding-left:10px;}
.pad15 {padding-left:15px;}
.pad20 {padding-left:20px;}
.pad40 {padding-left:40px;}
.pad50 {padding-left:50px;}
.pad75 {padding-left:75px;}
.pad85 {padding-left:85px;}
.pad100 {padding-left:100px;}
.pad120 {padding-left:120px;}
.pad150 {padding-left:150px;}
.pad220 {padding-left:215px;}

.marg10 {margin-left:10px;}
.marg20 {margin-left:20px;}
.marg75 {margin-left:75px;}

.RetailBack, .CorpBack, .HospBack,
.ResBack, .FinBack {background-repeat:no-repeat; height:620px; margin-left:30px;}

.RetailBack {background-image: url('images/AboutUs4RetailBack.jpg');}
.CorpBack {background-image: url('images/AboutUs4CorpBack.jpg');}
.HospBack {background-image: url('images/AboutUs4HospBack.jpg');}
.ResBack  {background-image: url('images/AboutUs4ResBack.jpg');}
.FinBack  {background-image: url('images/AboutUs4FinBack.jpg');}

.sidelogo {position:absolute; top:261px; text-align:center; left:0px;
           color:#ffffff; background-color:#ab1416;
           padding-bottom:3px; width:175px;
           font-family: tahoma, arial, sans serif;
           font-size:10pt; font-weight:bold;  }
.sidelogo .ht200 {height:200px; }
.sidelogo .ht330 {height:330px; }
.sidelogo .ht360 {height:360px; }
.sidelogo .ht389 {height:389px; background-color:#e20a17;}
.sidelogo .ht400 {height:400px;}
.sidelogo .ht350 {height:350px;}
.sidelogo .ht600 {height:600px;}
.sidelogo .ht800 {height:800px;}
.sidelogo .ht885 {height:885px;}
.sidelogo .ht1600 {height:1600px;}
.sidelogo .ht2837 {height:2837px;}
.sidelogo .ht3407 {height:3407px;}

.sidelogo2 {position:relative; left:0px; text-align:center;
            background-color:#ffffff; width:145px; border-left:15px solid #ab1416;
            border-right:15px solid #ab1416; 
            font-family: tahoma, arial, sans serif;
            font-size:10pt; font-weight:bold; }
.sidelogo2 .ht500 {height:1003px;}

.sidelogo2 img {border:2px solid #ffffff;}
.sidelogo2 a:hover img {border-color:DeepSkyBlue;}

.sidelogo2 .xspc {padding-bottom:10px; }

.makeblock {position:relative; top:570px; background-color:#ab1416;} 
.makeblock .ht210 {height:210px;}
.makeblock .ht470 {height:470px;}
.makeblock .ht550 {height:550px;}

.makeblock2 {position:relative; top:1060px; background-color:#ab1416;} 
.makeblock2 .ht180 {height:180px;}
.makeblock2 .ht560 {height:560px;}

.makespace {padding-bottom:17px;}


.indexsidelogoup {position:absolute; top:-220px; left:0px;}

/*.sidelogo2 a:link, .sidelogo2 a:visited {color: transparent; border:1px solid transparent;}

.see a:link {color:blue;}

.sidelogo2 a:hover {color: transparent; border:1px solid transparent;} */

.timeline {position:relative; }

.srch1 {font:10px; height:15px; border:none; }
.srch2 {position:relative; top:5px; left:25px; font:5px; height:25px;}


.sidepos1 {position: relative; top:20px; left:10px;}
.sidepos2 {position: relative; top:20px; left:60px;}

.standout {font-size:110%; font-weight:bold; padding-bottom:10px;}

.shortwidth {width:80%;}

.repos255 {position:relative; top:-255px;}
.repos295 {position:relative; top:-295px;}
.repos390 {position:relative; top:-390px;}
.repos330 {position:relative; top:-330px;}

.button {border:none; background:url("images/unpressed.png") no-repeat top left;
         padding:2px 7px; margin:5px 0px 0px 25px;}
.button:hover {border:none; background:url("images/pressed.png") no-repeat top left;
         padding:2px 7px; margin:5px 0px 0px 25px;}


/*-------------------  Picture Block --------------------------------------*/

.pictureblock5, .pictureblock3 {position:relative; 
               top:0px; left:10px; 
               display: block; border:none; }

.pictureblock3 { width: 468px; height: 880px;  }
.pictureblock5 { width: 780px; height: 1315px; }

.pictureblockLS { width:780px; height:1500px;}

.pictureblock ul {position:absolute: top:0px; left:0px; padding:0; margin:0; 
                  list-style:none; border:0; }

.pictureblock ul li {display:inline; float:left; margin: 2px 2px 2px 2px; 
                     padding-right:45px; border:none;}
                    
.pictureblock ul li .bigpic,
.pictureblock ul li .bigpic2, 
.pictureblock ul li .bigpic3 {position:absolute; visibility:hidden; z-index:200;}

.pictureblock ul li .bigpic  {top:90px;}
.pictureblock ul li .bigpic2 {top:10px;}
.pictureblock ul li .r2 {top:212px;}
.pictureblock ul li .r3 {top:334px;}
.pictureblock ul li .r4 {top:458px;}
.pictureblock ul li .r5 {top:584px;}
.pictureblock ul li .r6 {top:708px;}
.pictureblock ul li .r7 {top:832px;}
.pictureblock ul li .r8 {top:954px;}

.pictureblock ul li .rp2 {top:256px;}
.pictureblock ul li .rp3 {top:422px;}
.pictureblock ul li .rp4 {top:590px;}
.pictureblock ul li .rp5 {top:760px;}
.pictureblock ul li .rp6 {top:930px;}
.pictureblock ul li .rp7 {top:1100px;}

.pictureblock ul li:hover .bigpic,
.pictureblock ul li a:hover .bigpic,
.pictureblock ul li:hover .bigpic2,
.pictureblock ul li a:hover .bigpic2 {visibility:visible; z-index:200; 
                                      border:4px solid #000000;} 

.pictureblock .pt {height:165px; width:103px;}
.pictureblock .ptl {height:165px; width:146px;}
.pictureblock .ls {height:122px; width:146px;}
.pictureblock .landscape {width:146px;}

.pictureblock .pos1 {left: 25px;}
.pictureblock .pos2 {left:173px;}
.pictureblock .pos3 {left:321px;}
.pictureblock .pos4 {left:233px;}
.pictureblock .pos5 {left:381px;}
.pictureblock .pos6 {left:100px;}
.pictureblock .pos7 {left:248px;}
.pictureblock .pos8 {left:158px;}
.pictureblock .pos9 {left:306px;}
.pictureblock .pos10{left:135px;}
.pictureblock .posR {left:460px;}
.pictureblock .posRls {left:360px;}
.pictureblock .posLS{left:150px;}
.pictureblock .posPT{left:200px;}

.imgcaption p { font-size: 6pt;
                  font-family: tahoma, Arial, sans-serif;
                  text-align: right; color:#000000;}
.imgcaption img {float:left; padding:0px; margin:0px; border:none; text-decoration:none;}


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


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

/* class selectors for menu */

#pulldownmenu a:link, #pulldownmenu a:visited {text-decoration:none; 
                      color: #ffffff; } /* colour for menu writing */

#pulldown {padding:0; width:1003px; margin:0px; 
           font-size:9pt; font-weight:bold; position:absolute; left:0px; top:126px; }

#pulldown, 
#pulldown ul {padding:0 0 0 0; list-style-type:none; }

/* background colour of menu bar */
#pulldown li {float:left; padding:0px 0px 2px 10px; margin-top:4px;           
              border: 1px solid #000; 
              border-width:1px 1px 1px 1px;
              border-color:#00877b #FFFFFF #00877b #FFFFFF;
              background-color:transparent;
              list-style-type:none; height:12px;}

#pulldown li li {float:none;}

/* a hack for IE5.x and IE6 */
#pulldown li a li {float:left;}

/* the height & line-height cause the first column to be collapsed in Opera/Mozzila */
#pulldown li a {display:block; float:left;
                height:19px; padding-left:16px; padding-right:7px; 
                text-decoration:none; white-space:nowrap;}

/* the background colour here defines the overlay color as you move down the menu */
#pulldown li:hover {position:relative; z-index:20; background:#e20a17;
                    border-color:#e20a17 #e20a17 #e20a17 #e20a17; height:19px;
                    padding-top:4px; top:-4px;} 
#pulldown a:hover {z-index:20; position:relative;
                   text-decoration:none;}

/*------------ Side menu --------------------------------------------------------*/

.sidemenu {font-size:8.5pt; font-weight:bold;
           background-color:transparent;  
           padding:0; margin:0; z-index:50;}

/* where there are two decendant selectors, the first in list is for IE8 & Opera while
   the second is for Firefox */

.sidemenu ul {list-style:none; margin-left:5px; padding-left:1.25em; text-indent:-1.25em;}   

.sidemenu .up {display:inline;}
.sidemenu .down {display:none;}

.sidemenu>ul li {list-style:none; padding-bottom: 2px; border-bottom:1px solid #717273;}

.sidemenu ul li .show ul li .up2,
.sidemenu ul li a .show ul li .up2 {display:inline;}

.sidemenu ul li .show ul li .down2,
.sidemenu ul li a .show ul li .down2 {display:none;} 


/* first in list is for Safari, 2nd in list is for IE8, 3rd is for Firefox */

.sidemenu ul li ul,
.sidemenu ul li .show,
.sidemenu ul li a .show {left:-12px; padding-left:5px; border:0;} /* insert display:none; for hidden menu */

.sidemenu ul li ul li,
.sidemenu ul li .show ul li,
.sidemenu ul li a .show ul li {border:0; }

.sidemenu ul li a:link, 
.sidemenu ul li a:visited {color:#ffffff;}

.sidemenu ul li a:hover {color:#ff9e02;}

.sidemenu ul li:hover .up,
.sidemenu ul li a:hover .up   {display:none;}

.sidemenu ul li:hover .down,
.sidemenu ul li a:hover .down {display:inline;}


.sidemenu ul li:hover ul,
.sidemenu ul li:hover .show,
.sidemenu ul li a:hover .show {display:block; background-color:#e20a17;}

.sidemenu ul li:hover .show ul li:hover .up2,
.sidemenu ul li a:hover .show ul li a:hover .up2   {display:none;}
.sidemenu ul li:hover .show ul li:hover .down2,
.sidemenu ul li a:hover .show ul li a:hover .down2 {display:inline;}
 


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

.slide {position:relative; text-decoration:none; text-align:left; color:#00877b; 
        font-size:10pt; font-weight:bold; 
        left:-20px; overflow:hidden;}

.slide ul li {text-decoration:none; line-height:25px;}

.slide ul li a:link, .slide ul li a:visited {text-decoration:none; color:#00877b;}
/* added to slide when sliding taken out */
.slide ul li ul li {font-size: 10pt; font-weight:normal; color:#000000;}

/*
.slide ul li span,
.slide ul li ul,
.slide ul li a:hover ul {display:none; font-size: 10pt; font-weight:normal; color:#000000;}
*/

.slide ul li ul li {line-height:12pt;}

/*
.slide ul li a:hover {color:#e20a17; }

.slide ul li span,
.slide ul li:hover ul,
.slide ul li a:hover ul {display:block;}
*/


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

/* 45 degree cut on bottom right hand corner*/

.cutbrc {background: transparent; width:auto; margin:0; padding:0;}

.cutbrc .top, .cutbrc .cutoffbottom {display:block; background:transparent;}

.cutbrc .b1, .cutbrc .b2, .cutbrc .b3, .cutbrc .b4, .cutbrc .b5,
.cutbrc .b6, .cutbrc .b7, .cutbrc .b8, .cutbrc .b9, .cutbrc .b10 {
         display:block; overflow:hidden; height:1px; background:#e20a17; 
         border-left:1px solid #e20a17; border-right:1px solid #e20a17;}
.cutbrc .b1  {margin:0 10px 0 0;}
.cutbrc .b2  {margin:0 9px  0 0;}
.cutbrc .b3  {margin:0 8px  0 0;}
.cutbrc .b4  {margin:0 7px  0 0;}
.cutbrc .b5  {margin:0 6px  0 0;}
.cutbrc .b6  {margin:0 5px  0 0;}
.cutbrc .b7  {margin:0 4px  0 0;}
.cutbrc .b8  {margin:0 3px  0 0;}
.cutbrc .b9  {margin:0 2px  0 0;}
.cutbrc .b10 {margin:0 1px  0 0;}

.cutbrc .boxcontent {display:block; background-color:#e20a17; height:32px;
                     padding-top:15px; padding-left:10px;   
                     border-left:1px solid #e20a17; 
                     border-right:1px solid #e20a17; text-align:left;
                     color:#ffffff; font-size:13pt; font-weight:bold;}

.cutbrc .placeimg {position:absolute; top:4px; left:165px;}

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

/* 45 degree cut on bottom right hand corner (transparent) */

.cutbrcGrn {background:transparent; margin:5px 0 0 7px; float:left; }
/* the .w's are only because of IE7 and lower which don't seem to be able to understand
   width if float:left is used.  For all other browsers this would be unnecessary.
   width has been calculated by taking number of (charcters in heading x 8px)+100px */
.w4  {width:132px;}
.w5  {width:140px;}
.w6  {width:148px;}
.w7  {width:156px;}
.w8  {width:164px;}
.w9  {width:172px;}
.w10 {width:180px;}
.w11 {width:188px;}
.w12 {width:196px;}
.w13 {width:204px;}
.w14 {width:212px;}
.w15 {width:220px;}
.w20 {width:260px;}
.w25 {width:300px;}
.w27 {width:316px;}
.w30 {width:340px;}
.w34 {width:372px;}
.w41 {width:428px;}
.w46 {width:468px;}
.w52 {width:516px;}
.wmax {width:550px;}

.cutbrcGrn .top, .cutbrcGrn .cutoffbottom {display:block; background:transparent; width:inherit;}

.cutbrcGrn .b1, .cutbrcGrn .b2, .cutbrcGrn .b3, .cutbrcGrn .b4, .cutbrcGrn .b5,
.cutbrcGrn .b6, .cutbrcGrn .b7, .cutbrcGrn .b8, .cutbrcGrn .b9, .cutbrcGrn .b10 {
           display:block; overflow:hidden; height:1px; background:#00877b; 
           border-left:1px solid #00877b; border-right:1px solid #00877b;}
           
.cutbrcGrn .b1  {margin:0 10px 0 0;}
.cutbrcGrn .b2  {margin:0 9px  0 0;}
.cutbrcGrn .b3  {margin:0 8px  0 0;}
.cutbrcGrn .b4  {margin:0 7px  0 0;}
.cutbrcGrn .b5  {margin:0 6px  0 0;}
.cutbrcGrn .b6  {margin:0 5px  0 0;}
.cutbrcGrn .b7  {margin:0 4px  0 0;}
.cutbrcGrn .b8  {margin:0 3px  0 0;}
.cutbrcGrn .b9  {margin:0 2px  0 0;}
.cutbrcGrn .b10 {margin:0 1px  0 0;}

.cutbrcGrn .boxcontent {display:block; background-color:#00877b;
                     margin-top:6px;
                     padding-top:5px; padding-left:10px;   
                     border-left:1px solid #00877b; 
                     border-right:1px solid #00877b; text-align:left;
                     color:#ffffff; font-size:10pt; font-weight:bold;}
/* ----------------------------------------------------------------------------*/




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

/*  Timeline table */


#history table {
border-width: 1px;
border-style: solid;
border-color: #000000;
border-collapse: collapse;
border-right:0;
border-top:0;
border-bottom:0;
text-align:left;
margin:1em 0.8em;
}

#history th, #history td {
border-width: 1px;
border-style: solid;
border-color: #000000;
border-left:0;
border-right:0;
border-top:0;
}

#history td {vertical-align: top; }

#history .makeline {border-left: 1px solid #000000; border-bottom:0;}
#history .nobot {border-bottom:0;}

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

#Contact table {border:none; margin:0; padding:0; width:500px;}
#Contact th, #Contact td {border:none;}
#Contact td {vertical-align:top; padding-right:2px;} 

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


.column ul {
  margin: 0;
  padding: 0;
  list-style: none;
  font-weight: bold;
}
 
.column li {
  line-height: 20px;
  margin: 0;
  padding: 0;
} 

.column .settop {margin-top:10px; }
.column .settop2 {margin-top:0px; }
.column .col0 {margin-left: 20px; }
.column .col1 {margin-left: 100px; }
.column .col2 {margin-left: 300px; }

.column .colreset  {margin-top:-260px;}
.column .colreset2 {margin-top:-300px;}
.column .colreset3 {margin-top:-160px;}
.column .colreset4 {margin-top:-120px;}
.column .colreset5 {margin-top:-200px;}
.column .colreset6 {margin-top:-280px;}

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

.map {display:block; position:relative; top:0px; left:0px; width: 291px; height:242px;
      background-image: url('images/map.jpg'); background-repeat:no-repeat;
      overflow:visible;}

.map ul {list-style:none;}

/* although ids and classes are supposed to be very similar, this does not work if you
   make #mapWC etc. classes - they MUST be ids */

/* this would work very nicely if IE7 and lower did not have a problem
.map ul li a#mapWC {position:absolute; display:block; background-color:transparent; 
                    height:20px; width:70px; 
                    left:30px; top:200px;}
.map ul li a#mapWC:hover {position:absolute; left:-11px; top:151px; display:block; 
                  width:144px; height:91px; overflow:visible;
                  background-image: url('images/mapWC.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

BUT - because IE does not refresh if nothing changes (i.e. background remains transparent,
and there is no need to redraw) it is necessary to put in the "dummy.gif", which does not
exist, to force a redraw.  
*/


.map ul li a#mapWC {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent; 
                    height:20px; width:70px; 
                    left:30px; top:200px;}
.map ul li a#mapWC:hover {position:absolute; left:-11px; top:151px; display:block; 
                  width:144px; height:91px; overflow:visible;
                  background-image: url('images/mapWC.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapNC {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:75px; width:75px; 
                    left:40px; top:100px;}
.map ul li a#mapNC:hover {position:absolute; left:-3px; top:70px; display:block;
                  width:162px; height:138px; overflow:visible;
                  background-image: url('images/mapNC.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapEC {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:50px; width:100px; 
                    left:130px; top:170px;}
.map ul li a#mapEC:hover {position:absolute; left:99px; top:152px; display:block;
                  width:137px; height:79px; overflow:visible;
                  background-image: url('images/mapEC.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapFS {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:50px; width:75px; 
                    left:145px; top:110px;}
.map ul li a#mapFS:hover {position:absolute; left:128px; top:86px; display:block;
                  width:103px; height:81px; overflow:visible;
                  background-image: url('images/mapFS.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapNW {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:50px; width:75px; 
                    left:120px; top:50px;}
.map ul li a#mapNW:hover {position:absolute; left:100px; top:43px; display:block;
                  width:112px; height:70px; overflow:visible;
                  background-image: url('images/mapNW.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapGP {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:20px; width:30px; 
                    left:190px; top:63px;}
.map ul li a#mapGP:hover {position:absolute; left:182px; top:54px; display:block;
                  width:112px; height:70px; overflow:visible;
                  background-image: url('images/mapGP.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapNP {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:40px; width:65px; 
                    left:200px; top:13px;}
.map ul li a#mapNP:hover {position:absolute; left:173px; top:-1px; display:block;
                  width:105px; height:65px; overflow:visible;
                  background-image: url('images/mapNP.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapMP {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:40px; width:45px; 
                    left:220px; top:53px;}
.map ul li a#mapMP:hover {position:absolute; left:201px; top:34px; display:block;
                  width:81px; height:75px; overflow:visible;
                  background-image: url('images/mapMP.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

.map ul li a#mapKZ {position:absolute; background-image: url('images/dummy.gif'); background-color:transparent;
                    height:60px; width:45px; 
                    left:220px; top:100px;}
.map ul li a#mapKZ:hover {position:absolute; left:203px; top:95px; display:block;
                  width:81px; height:75px; overflow:visible;
                  background-image: url('images/mapKZ.gif'); background-color:transparent;
                  background-repeat:no-repeat;}

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

.cssnav
{
position: relative;
font-family: arial, helvetica, sans-serif;
background: url(images/overbtn.gif) no-repeat;
white-space: nowrap;
display: block;
width: 171px;
height: 50px;
margin: 0;
padding: 0;
}

.cssnav a
{
display: block;
color: #000000;
font-size: 11px;
width: 171px;
height: 50px;
display: block;
float: left;
color: black;
text-decoration: none;
}

.cssnav img
{
width: 171px;
height: 41px;
border: 0
}

* html a:hover
{
visibility:visible
}

.cssnav a:hover img
{
visibility:hidden
}

.cssnav span
{
position: absolute;
left: 35px;
top: 15px;
margin: 0px;
padding: 0px;
cursor: pointer;
} 

a.footer 
	{ 	
	color:#00877b; 
	font-size: 11px; 
	font-family: Arial, Helvetica, sans-serif;
	text-decoration:none;
	}
		
a:hover.footer 
	{ 
	color:#00877b; 
	font-size: 11px; 
	font-family: Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}

a:visited.footer 
	{
	color:#00877b; 
	font-size: 11px; 
	text-decoration:none; 
	font-weight: none;
	}
	
/*--------------------------------------------------------------------------*/

.slide2 {position:relative; text-decoration:none; text-align:left; color:#00877b; 
        font-size:10pt;
        left:-20px; overflow:hidden;}

.slide2 ul li {text-decoration:none; line-height:25px;}

.slide2 ul li a:link, .slide ul li a:visited {text-decoration:none; color:#00877b;}
/* added to slide when sliding taken out */
.slide2 ul li ul li {font-size: 10pt; font-weight:normal; color:#000000;}

/*
.slide ul li span,
.slide ul li ul,
.slide ul li a:hover ul {display:none; font-size: 10pt; font-weight:normal; color:#000000;}
*/

.slide2 ul li ul li {line-height:12pt;}

/*
.slide ul li a:hover {color:#e20a17; }

.slide ul li span,
.slide ul li:hover ul,
.slide ul li a:hover ul {display:block;}
*/

/* Branch Pages */
a.branch
{
	color: #00877b; 
	font-size: 16px; 
	text-decoration:underline; 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}
a:hover.branch
	{ 
	color:#666; 
	font-size: 16px; 
	font-family: Arial, Helvetica, sans-serif;
	text-decoration:underline;
	}

a:visited.branch
	{
	color: #333; 
	font-size: 16px; 
	text-decoration:underline;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	}
.sidelogo .bl {height:1210px;}

/* Branch Table */

.branch { width:420px;}
.branch td {border-width: 1px;
              border-style: solid;
              border-color: #000000;
			  font-size:0.8em;}