﻿/*  Reset all browser defaults */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:'';}
abbr,acronym{border:0;}
a{text-decoration: none}
/* common elements */
b,strong{font-weight:bold}
.center{text-align:center}
/*  Page layout */
body{text-align:center;font-size:62.5%;font-family:Tahoma, Verdana, Arial, Sans-Serif;background:#fff}
div#wrapper{text-align:left;width:990px;margin:30px auto;position:relative}
div#header{height:108px;background:#fff url('/images/background-header.png') no-repeat left top}
div#content{padding-bottom:20px;padding-left:20px}
div#footer{clear:both;padding-bottom:5px;background:#fff url('/images/background-footer.png') no-repeat left top}
/*  header */
div#header{font-size:1.2em}
div#header h1 a{text-indent:-999em;position:absolute;width:300px;height:90px;overflow:hidden}
div#intro{text-align:right;color:#595959}
div#topnav{position:absolute;top:35px;left:5px;color:#fff}
div#topnav li{float:left;display:inline;position:relative;bottom:3px}
div#topnav li strong{position:relative;top:3px;font-size:0.9em}
div#topnav li a{color:#fff}
div#topnav .newsletter{width:400px;background:#fff;border:1px solid #000;padding:20px;color:#565656}
div#topnav .newsletter h4{font-size:1.8em}
div#topnav .newsletter p{margin:10px 0}
div#topnav .newsletter .label{width:80px}
#li-newsletter,#li-onlinestore{background:url('/images/topnav-bullet.png') no-repeat center left;padding:7px 10px 9px 20px}
#li-search{width:420px;padding:7px 3px 0 0px;text-align:right}
#li-search input.textbox{border:none;font-size:0.9em}
#li-search input.image{position:relative;top:3px}
/*  content */
div#content h2,div#content h3,div#content h4{font-family:Arial, Helvetica, Sans-Serif}
div#breadcrumb{background:#A6A6A6 url('/images/breadcrumb.png') no-repeat right top;position:absolute;top:108px;left:20px;color:#fff;height:18px;font-size:1.1em;padding:2px 25px 0 15px;z-index:9}
div#breadcrumb a{color:#fff}
div#meta{position:absolute;top:100px;right:180px;width:470px;z-index:2}
div#meta ul,div#links ul{padding:0;margin:0;list-style-type:none}
div#meta li{float:right;display:inline;margin-left:20px}
div#links{position:absolute;top:105px;right:60px;width:135px;z-index:2}
div#links li{width:130px;list-style-type:none;padding:4px 0px 4px 20px;border-top:1px solid #565656;border-bottom:1px solid #565656;color:#565656;margin:5px 0;background:url('/images/product-link-bullet2.png') no-repeat left center}
div#links li a{color:#565656}
div#links li.contact{border-color:#a80000;background-image:url('/images/product-link-bullet1.png')}
div#links li.contact a{color:#a80000}
span.label{float:left;clear:left;width:120px;margin-right:10px;font-weight:bold;color:#5d5d5d}
.textbox{border:1px solid #d6d6d6;font-size:1em;font-family:Tahoma, Verdana, Arial, Sans-Serif;background:#ffe;padding:2px}
.modalBackground{background-color:#999;filter:alpha(opacity=50);opacity:0.5}
/*  footer */
ul#ul-footer1{color:#fff}
ul#ul-footer1 li{float:left;padding:6px 10px 6px 10px;display:inline;padding-left:15px}
ul#ul-footer1 li.li-right{float:right;padding-top:3px;margin-top:9px;color:#595959;position:relative;right:20px;}
ul#ul-footer1 li.li-right a{color:#595959}
#li-verto a{font-weight:bold}
#li-terms{border-right:3px solid #fff}
ul#ul-footer2{clear:both;padding-right: 40px;font-size:1.2em}
ul#ul-footer2 li{float:right;display:inline;background:url('/images/footer-menu-bullet.png') no-repeat left center;padding:5px 0 5px 15px;margin:10px 140px 0 50px;font-size:1.1em;border-left:1px solid #b4b4b4}
ul#ul-footer2 li a{color:#595959}
ul#ul-footer2 li#li-logos{float:none;padding:0;margin:0;background:none}
/*  Menu */
div#menu{position:absolute;top:73px;left:25px;font-size:1.2em;z-index:10}
#li-contact{width:67px;position:relative}
#li-support{width:69px}
#li-solutions{width:73px}
#li-products{width:65px}
#li-training{width:168px}
#li-why{width:68px}
#li-whatsnew{background:#f85d10;border-bottom:1px solid #e1a187}
#li-whatsnew a{border:none}
#li-whatsnew a:hover{background:#e1a187}
#li-parts{background:#6684b2;border-bottom:1px solid #8ca2c5}
#li-parts a{border:none}
#li-parts a:hover{background:#8ca2c5}

/* Submenus (<ul> tags) are hidden and absolutely positioned downwards from their parent */
.menulist ul {
 display: none;
 position: absolute;
 top: 17px; 
 margin-top: 18px; /* I'm using ems and px to allow people to zoom their font */
 left: -1px;
 width: 185px;
}

/* Second and third etc. level submenus - position across from parent instead */
.menulist ul ul {
 top: -1px; margin-top: 0;
 left: 184px;
}

/*
 All menu items (<li> tags). 'float: left' lines them up horizontally, and they are
 positioned relatively to correctly offset submenus. Also, they have overlapping borders.
*/
.menulist li {
 float: left;
 display: block;
 position: relative;
 margin-right: 0px;
 border-left:1px solid #fff;
 padding-left:15px;
 background:url('/images/menu-bullet.png') no-repeat center left;
 top:-3px;
}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li {
 float: none;
 margin: 0;
 margin-bottom: 0px;
 background: #610100 url('/images/menu-bullet.png') no-repeat center left;
}
.menulist ul>li:last-child {
 margin-bottom: 1px; /* Mozilla fix */
}

/* Items in submenus - override float/border/margin from above, restoring default vertical style */
.menulist ul li li {
 background: #a80000 url('/images/menu-bullet2.png') no-repeat center left;
 border:none;
}

.menulist ul li a {
 border-bottom:1px solid #a80000;
 width: 160px;
}

.menulist ul li li a {
 border-bottom:1px solid #fff;
 width: 160px;
}

/* Links inside the menu */
.menulist a {
 display: block;
 padding: 7px 0px;
 color: #fff;
 text-decoration: none;
 position: relative;
 left: 0px;
}

/* List  items: 'hover' is mouseover, 'highlighted' are parent items to visible menus */
.menulist a:hover, .menulist a.highlighted:hover, .menulist a:focus {
 color: #FFF;
 background-color: #a80000;
}
.menulist a.highlighted {
 color: #FFF;
 background-color: #610100;
}
.menulist ul ul a:hover, .menulist ul ul a.highlighted:hover, .menulist ul ul a:focus {
 color: #FFF;
 background-color: #AA97D1;
}

/* Only style submenu indicators within submenus. */
.menulist a .subind {
 display: none;
}
.menulist ul a .subind {
 display: block;
 float: right;
}


/* 'Escaped Comment' hack for horizontal menubar width in IE5/Mac */
.menulist a {
 float: left;
}
.menulist ul a {
 float: none;
}
/* \*/
.menulist a {
 float: none;
}
/* */


/*
 HACKS: IE/Win:
 A small height on <li> and <a> tags and floating prevents gaps in menu.
 * html affects <=IE6 and *:first-child+html affects IE7.
 You may want to move these to browser-specific style sheets.
*/
*:first-child+html .menulist ul li {
 float: left;

}

* html .menulist ul li {
 float: left;
 height: 1%;
}
* html .menulist ul a {
 height: 1%;
}
/* End Hacks */

#logo 
{
    position: absolute;
    right: 20px;
    top: 10px;   
}

#basket {
    position:relative;
    top: 4px;
}

#ctl00_HyperLink1 {
    position:relative;
    top: -4px;
}

div.category {
    width: 70px;
    height: 50px;
    float: left;
    margin-left: 15px;
    margin-bottom: 5px;
    padding-left: 10px;
    
    background: url('/images/homepage-row2col1-bullet.png') no-repeat center left;
    position: relative;

    vertical-align: middle 
}

img.spotlight {
    position:relative;
    bottom:10px;
}

div#footer {
    padding-left: 20px;
}

body  {
    background:#616161 url('/images/main_bg.png') repeat-x;
}

#content, #breadcrumbs, #wrapper {
    background: #ffffff;
}