* {
  margin: 0;
  padding: 0;
}

body {
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 8pt;
 color: #666666;
 margin: 0;
 padding: 0;
}

h1 {
 font-size: 2em;
 font-weight: normal;
 margin-bottom: 15px;
 COLOR: #009966;
}

h2 {
 font-size: 1.2em;
 margin-bottom: 10px;
}

h3 {
 font-size: 1.1em;
 margin-bottom: 10px;
}

a:link {
 COLOR: #009966;
 TEXT-DECORATION: underline;
}

a:visited {
 COLOR: #009966;
 TEXT-DECORATION: underline;
}

a:hover {
 COLOR: #666666;
 TEXT-DECORATION: underline;
}

img {
 border: 0;
}

select, textarea, input.text {
 border: 1px solid #D4D4D4;
}
textarea, input.text {
 padding: 2px;
}
select {
 padding: 1px 0;
}
option {
 padding: 0 2px;
}

table.catalogTable {
 border-collapse: separate;
 margin-top: 6px;
}
table.catalogTable th {
 font-weight: bold;
 color: #009966;
 background-color: #ddf9dd;
 padding: 3px;
 border-right: 6px solid #ffffff;
}
table.catalogTable th.left {
 text-align: left;
}
table.catalogTable td {
 border-bottom: 1px solid #ddf9dd;
 border-right: 6px solid #ffffff;
 padding-left: 4px;
 padding-right: 4px;
 padding-top: 6px;
}

input.button {
 font-weight: bold;
 background-color: #ddf9dd;
 color: #068668;
 border: 1px solid #068668;
}

#header {
 height: 92px;
 background-color: #ddf9dd;
}

#header-bckgrd {
 position: absolute;
 left: 304px;
 top: 45px;
 width: 200px;
 height: 45px;
 background-image: url('../images/backgr_upper.jpg');
 background-repeat: no-repeat;
}

#header-okw-logo {
 position: relative;
 top: 18px;
 right: 22px;
 float: right;
 height: 68px;
 width: 83px;
}

#tabbed-main-menu {
 padding: 0;
 height: 19px;
 padding: 1px 0 0 0;
 background-color: #068668;
 color: #ffffff;
 font-size: 8pt;
 z-index: 21;
}
#frameNaviMenu {
 position: absolute;
 left: 171px;
 top: 95px;
 z-index: 20;
}
#frameNaviMenu a {
  color: #ffffff;
  text-decoration: none;
  cursor: pointer;
}
#frameNaviMenu ul {
  list-style: none;
}
#frameNaviMenu li {
  position: relative;
  list-style: none;
}
#frameNaviMenu ul li {
  float: left;
  padding: 0 10px 0 8px;
  height: 17px;
  background: url("../images/navsep.gif") no-repeat scroll right top transparent
}
#frameNaviMenu ul li ul {
  position: absolute;
  background-color: #DDF9DD;
  border-color: #C0C0C0;
  border-style: solid;
  border-width: 0 1px 1px 1px;
  left: -1px;
  top: 15px;
  z-index: 6;
  padding: 0 4px;
  line-height: 1.5em;
  font-weight: normal;
  font-size: 0.9em;
}
#frameNaviMenu ul li ul li {
  background: none;
  float: none;
  height: auto;
  border-bottom: 1px solid #C0C0C0;
  white-space: nowrap;
  padding: 0;
}
#frameNaviMenu ul li ul li.last {
  border-bottom: 0;
}
#frameNaviMenu ul li ul li a {
  display:block;
  padding: 2px 6px;
  color: #000000;
}
#frameNaviMenu ul li ul li a:hover {
  background-color: #068668;
  color: #FFFFFF;
}






#tabbed-main-menu-list a {
  color: #ffffff;
  text-decoration: none;
}
#tabbed-main-menu-list a:link {
  color: #ffffff;
}
#tabbed-main-menu-list a:active {
 text-decoration: none
}
#tabbed-main-menu-list a:visited {
 text-decoration: none
}
#tabbed-main-menu-list a:hover {
  background-color: #ffffff;
  color: #000000;
  text-decoration: none
}

#tabbed-main-menu-list {
 position: relative;
 color: #ffffff;
 left: 180px;
 top: 2px;
 width: 750px;
}

#tabbed-main-menu-list ul {
 margin:0;
 padding:0;
 color: #ffffff;
 list-style-type:none;
 }

#tabbed-main-menu-list li,
#tabbed-main-menu-list li.first {
  margin:0;
  display: inline;
  font-weight: normal;
  border-right: 1px solid #aaaaaa;
}
#tabbed-main-menu-list li.last {
  border: 0;
}

#tabbed-main-menu-list span.paddedli {
 padding: 0 15px 0 4px;
}

#tabbed-main-menu-list span.paddedlifirst {
 padding: 0 15px 0 0;
}

#tabbed-main-menu-list span.paddedlilast {
 padding: 0 0 0 4px;
}

#tabbed-main-menu .expandableMenu {
 position: absolute;
 z-index: 100;
}

#tabbed-main-menu .expandableMenu a,
#tabbed-main-menu .expandableMenu a:link {
  color: #000000;
  text-decoration: none;
}
#tabbed-main-menu .expandableMenu a:active,
#tabbed-main-menu .expandableMenu a:visited {
 text-decoration: none
}
#tabbed-main-menu .expandableMenu a:hover {
  background-color: #ffffff;
  color: #000000;
  text-decoration: none
}

#tabbed-main-menu .expandableMenu ul {
 background-color: #DDF9DD;
 list-style-type:none;
}

#tabbed-main-menu .expandableMenu li {
 border: 1px solid #aaaaaa;
 padding: 2px;
}

#tabbed-main-menu #main-menu-about {
 left: 178px;
 top: 112px;
}



#main-menu {
 height: 19px;
 margin-bottom: 1px;
 background-color: #068668;
 color: #FFFFFF;
 font-size: 8pt;
}

#main-menu-list {
 position: relative;
 color: #FFFFFF;
 left: 180px;
 top: 2px;
 }

#main-menu-list a:link {
 COLOR: #009966;
 TEXT-DECORATION: underline;
}

#main-menu-list a:visited {
 COLOR: #009966;
 TEXT-DECORATION: underline;
}

#main-menu-list a:hover {
 COLOR: #666666;
 background-color: #ffffff;
 TEXT-DECORATION: underline;
}


#breadcrumb-row {
 height: 19px;
 font-size: 8pt;
 background-color: #ddf9dd;
}

#breadcrumb-list {
 position: relative;
 left: 134px;
 top: 2px;
}

#sub-menu {
 float: left;
 width: 165px;
 height: 150px;
 margin: 0 0 0 5px;
}

div#sub-menu-list dl dt {
 color: #009966;
 font-size: 1.2em;
 font-weight: bold;
 margin: 13px 0 5px 0;
 padding-left: 0;
}

div#sub-menu-list ul li {
 list-style: none;
}

div#sub-menu-list dl dd {
 margin: 0 0 5px 15px;
 padding-left: 0;
}

div#sub-menu-paypal, 
div#sub-menu-ci-animation {
 margin: 1em 0 0 0;
}

#sub-menu-textSearch {
  margin: 0px 0 0px 0px;
  width: 100%;
}

#sub-menu-textSearch input.text {
  width: 110px;
  margin-left: 0px;
}

#sub-menu-textSearch input.searchImg {
  position:relative;
  vertical-align: bottom;
}



#bckgrd-holder {
 background-image: url('../images/backgr.jpg');
 background-position: 0px 0px;
 background-repeat: no-repeat;
 height: 607px;
 min-height: 607px;
}
/* Hack for all browsers except IE6 to handle height/min-height corretly.*/
html>body #bckgrdHolder{height:auto}

#content {
 padding-top: 15px;
 margin: 0 30px 15px 180px;
}

#footer {
 text-align: center;
 font-size: 8pt;
 clear: both;
 height: 50px;
 margin-bottom: 10px;
 width: 1024px;
}

#footerMini {
 text-align: center;
 font-size: 8pt;
 clear: both;
 height: 50px;
 margin-bottom: 10px;
}

#tabbed-navi {margin:0 0 6px 0; padding:0;}
#tabbed-navi ul {margin:0; padding:0;}
#tabbed-navi li {
  list-style-type:none;
  margin:0;
  padding:6px 12px;
  display: inline;
  font-weight: bold;
  border: 1px solid #068668;
  background-color: #ddf9dd;
}
#tabbed-navi li.here {
  list-style-type:none;
  margin:0;
  padding:6px 12px;
  display: inline;
  font-weight: bold;
  border: 1px solid #068668;
  background-color: #ffffff;
}
#tabbed-navi a:link {
  color: #009966;
  text-decoration: underline;
}
#tabbed-navi a:active {
  color: #009966;
}
#tabbed-navi a:visited {
 color: #009966;
 text-decoration: underline;
}
#tabbed-navi a:hover {
  color: #666666;
  text-decoration: underline
}
#tabbed-navi-content {
 border: 1px solid #068668;
 padding: 1em;
}

/*
 * Common WebSite CSS
 */
#miniPageContent {
 margin: 5px 10px 10px 10px;
}

.clear {
 clear: both;
}

.iContent {
 width: 800px;
}

.errorList {
 padding: 1em 0;
}
.errorItm {
 font-weight: bold;
 color: #DD0000;
}

span.corners-top, span.corners-bottom,
span.corners-top span, span.corners-bottom span {
  background-repeat:no-repeat;
  display:block;
  font-size:1px;
  height:5px;
  line-height:1px;
}

span.corners-top {
  background-image: url( '../images/corners_white_left.gif');
}

span.corners-top span {
  background-image: url( '../images/corners_white_right.gif');
  background-position: 100% 0;
}

span.corners-bottom {
  clear: both;
  background-image: url( '../images/corners_white_left.gif');
  background-position: 0 100%;
}

span.corners-bottom span {
  background-image: url( '../images/corners_white_right.gif');
  background-position: 100% 100%;
}

.panel {
  background-color: #ddf9dd;
  padding: 0px 10px;
}

.panel span.corners-top, .panel span.corners-bottom {
  margin: 0 -10px;
}

.required {
 color: #DD0000;
}


div#newIndicator {
 position: relative;
 text-align: right;
 right: 8px;

}
div#newIndicator span {
 background-color: #fffab4;
 font-weight: bold;
}


div#productListing {
 width: 775px;
}
div#productListing .catalogTable {
 width: 775px;
}
div#productListing .catalogTable tr.new {
 background-color: #fffab4;
}
div#productListing .pageingSection {
 width: 775px;
 text-align:right;
 padding-top: 6px;
}


/*
 * CSS for group/group list/ types
 */
.typeSection,
div#productGroupList .productGroup,
div#productListing,
div#subGroupListing,
div#subGroupListing dl {
 margin: 10px 0 0 0;
}

div#productGroupHeader {
  float: left;
  margin: 0 10px 10px 0;
}

div#productGroupHeader span.image {
 float: left;
 width: 150px;
 margin: 0 10px 10px 0;
}

div#productGroupHeader div.text {
 float:left;
 margin: 0 0 10px 0;
 max-width: 600px;
}

div#productGroupList .productGroup dd.text li,
div#productGroupHeader div.text li,
div#productGroupHeader dd.text li,
div#productTechData div.text li {
 margin-left: 20px;
 list-style-image: url('../images/li_icon.gif');
}

div#productGroupMediaList table.catalogTable {
 width: 775px;
}
/* used to mark areas active for image toggle
   not used currently
span.imgToggleMarker,
li.imgToggleMarker span {
 border-bottom: 1px dotted #009966;
}*/
.imgToggleHighlight {
 COLOR: #009966;
}

div#productGroupList .productGroup dt,
.typeSection dt,
div#subGroupListing dt {
 float: left;
 margin: 0 5px 0 0;
}

div#productGroupList .productGroup dd,
.typeSection dd,
div#subGroupListing dd {
 float: left;
 width: 620px;
}
div#subGroupListing dt {
 width: 150px;
}

div#productGroupListDescription {
 width: 775px;
}

/*
 * Applications
 */
#applicationsList h3.shortDesc {
 margin-left: 17px;
}
#applicationsList .imageList img {
 margin-right: 10px;
}

/*
 * CSS for simple product group list
 */
#simpleProductGroupList ul {
 margin-top: 10px;
}
#simpleProductGroupList ul li {
 list-style-type: none;
 width: 300px;
 float: left;
 line-height: 1.7em;
}

/*
 * CSS for classes..
 */
div.classSection {
 width: 613px;
}

div#classMediaList table.catalogTable {
 width: 619px;
}

div.classSection h2 {
  line-height: 30px;
  vertical-align: middle;
  text-align: center;
  background-color: #ddf9dd;
  color: #009966;
  margin-bottom: 5px;
}

div.classSection td {
 width: 150px;
 vertical-align: top;
 text-align: center;
 padding-right: 4px;
 padding-bottom: 5px;
}

div.classSection span.image {
  height: 136px;
  width: 150px;
  display: block;
}

div.classSection div.name {
  display: table-cell;
  height: 30px;
  width: 150px;
  vertical-align: middle;
  text-align: center;
  background-color: #068668;
  color: #FFFFFF;
  padding: 2px 0;
}

/*
 * CSS for product page
 */

div#productContent {
 display: block;
 margin: 0 10px 10px 0;
 float: left;
 width: 570px;
}


div#productContent span.image {
  float: left;
  height: 136px;
  width: 150px;
  margin: 0 8px 0 0;
}

div#productTechData {
  float:left;
  width:208px;
}

/*Override catalog table because of IE7 margin-top bug */
div#productData table.catalogTable,
div#productTechData table.catalogTable,
div#searchCriteria table.catalogTable {
  margin-top: 0px;
}

div#productTechData table.catalogTable td,
div#searchCriteria table.catalogTable td {
 padding: 3px 2px 0 2px;
}

div#productTechData table.catalogTable tr.sectionStart td {
 padding-top: 9px;
}

div#productTechData table.catalogTable div.text {
 margin-left: 15px;
 display: none;
}
div#productTechData table.catalogTable .expanded div.text {
 display: block;
}


div#productData {
 clear: both;
 padding-top: 6px;
}

div#productData table {
 width: 570px;
}

div#productData table td.description,
div#productListing table td.description,
div#productListing table td.material,
div#productListing table td.ipCode,
div#productListing table td.color {
  vertical-align: middle;
}


td.prodThumb {
 vertical-align: middle;
 width: 60px;
 background-color: #FFFFFF;
}
td.partno {
 width: 80px;
 vertical-align: middle;
}


div#productListing table td.length,
div#productListing table td.width,
div#productListing table td.height {
  vertical-align: middle;
  text-align: right;
}
div#productData table td.basket {
  width: 120px;
  text-align: right;
}
div#productData table td.basket a {
  color: #E08B16;
}

div#subGroupRelations .header,
div#productData div#furtherInfo .header,
div#subGroupListing div#subGroupHeader {
 font-weight: bold;
 text-align: center;
 color: #009966;
 background-color: #ddf9dd;
 padding: 3px;
 border-right: 6px solid #ffffff;
}
div#productData div#furtherInfo .group {
 padding: 6px 3px 3px 3px;
 border-right: 6px solid #ffffff;
 vertical-align: text-bottom;
}

div#productData div#furtherInfo dl {
 display: none;
}
div#productData div#furtherInfo .expanded dl {
 display: block;
}

div#subGroupRelations .header {
 text-align: left;
}
div#subGroupRelations .subGroupDesc {
 background-color: #DDF9DD;
 padding: 6px 4px 0 4px;
 border-right: 6px solid #ffffff;
}
div#subGroupRelations .subGroupDesc li {
  margin-left: 20px;
}
div#subGroupRelations img.arrow {
 background-image: url('../images/go-down.png');
}
div#subGroupRelations .collapsed img.arrow {
 background-image: url('../images/go-right.png');
}
div#subGroupRelations .collapsed tbody,
div#subGroupRelations .collapsed .subGroupDesc {
 display: none;
}


div#productData div#furtherInfo dt {
 float: left;
 width: 456px;
 margin: 0 0 0 19px;
 padding: 6px 6px 0 0;
 border-bottom: 1px solid #ddf9dd;
 display: inline;
}

div#productData div#furtherInfo dd {
 padding: 11px 4px 0 4px;
 float: left;
 width: 80px;
 text-align: right;
 border-bottom: 1px solid #ddf9dd;
}

img.arrow {
 height: 11px;
 width: 11px;
 background-image: url('../images/go-right.png');
 background-repeat: no-repeat;
}
.expanded img.arrow {
 background-image: url('../images/go-down.png');
}


/*
 * CSS for product search
 */
div#searchModule {
  width:800px;
}

div.keywordSearchBox {
  margin: 10px 5px 10px 0;
  width: 750px;
  float: left;
}
div.productSearchBox {
  margin: 0px 5px 10px 0;
  width: 750px;
  float: left;
}

#textSearch {
  margin: 5px 0 5px 5px;
  width: 100%;
}

#textSearch input.text {
  width: 350px;
  margin-left: 64px;
}

#searchMenu {
 clear:both;
  float:left;
  margin-bottom:5px;
  margin-top:1em;
  width:180px;
}

#searchNavi {
  padding-top: 6px;
  width: 100%;
}

#searchNavi ul {
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin: 0;
  padding: 0;
}

#searchNavi li {
  display: block;
  font-weight: bold;
  margin: 1px 0 1px 1px;
  padding: 0;
}

#searchNavi li a {
  display: block;
  padding: 4px;
  background-color: #cde9cd;
  width: 100%; /*otherwise IE will add a gap between rows*/
}

#searchNavi li a.active {
  background-color: #F9F9F9;
  color: #666666;
  text-decoration: none;
}

#characs {
  margin: 10px 0;
  float: left;
  width: 420px;
}

#characs .panel {
  background-color:#F9F9F9;
}

#characs span.corners-top, #characs span.corners-bottom {
  background-image: url( '../images/corners_lgreen_left.gif');
}

#characs span.corners-top span, #characs span.corners-bottom span {
  background-image: url( '../images/corners_lgreen_right.gif');
}

#characs table td {
  padding: 3px;
  vertical-align: baseline;
}

#textSearch input.searchImg {
  position:relative;
  top:7px;
}

div.batterySearchBox {
  margin: 0 4px 10px 0;
  width: 373px;
  float: left;
}

div.displaySearchBox {
  margin: 0 0 10px 0;
  width: 373px;
  float: left;
}

/*
 * CSS for material
 */
.pageingSection {
 width: 765px;
}
.pageingSectionTop {
 width: 762px;
 text-align:left;
 padding: 3px 3px 0;
 margin-top: 6px;
 background-color: #ddf9dd;
}
.pageingSectionTop .header {
  float:left;
  color: #009966;
  font-weight: bold;
  width:170px;height:17px;
}
.pageingSectionTop .paging {
  float:left;
  text-align:right;
  width:592px;
}

/*
 * CSS for login
 */
div#loginError {
  color: red;
}

div#loginBox {
  width: 650px;
  margin: 0 0 20px 0;
}
div#termsofuse {
 width: 600px
}

/*
 * CSS for watchlist
 */
.watchlistFull {
  padding: 8px 0 12px 0;
}
.watchlistFull table.watchlistTable {
  width: 798px;
}
.watchlistConReq table.watchlistTable {
  width: 800px;
}
table.watchlistTable td.desc {
  width: 475px;
}
table.watchlistTable td.desc div.comment {
  padding-top:6px;
}
table.watchlistTable td.desc div.comment textarea {
  width: 460px;
}
table.watchlistTable td.qty {
  width: 55px;
  text-align: right;
}
table.watchlistTable td.qty span {
  padding-right: 10px;
}
table.watchlistTable td.qty input {
  text-align: right;
  margin-right: 5px;
}
table.watchlistTable td.action{
  width: 60px;
}

/*
 * CSS for watchlist contact request
 */
#contactForm h2 {
  color: #009966;
  font-size:1.5em;
}
#contactForm .formRow {
  margin-bottom: 5px;
}
#contactForm .formLabel {
  display-inline: block;
  float: left;
  width: 120px;
}
#contactForm input.text {
  width: 320px;
}
#contactForm input.text.long {
  width: 672px;
}
#contactForm select {
  width: 326px;
}
#contactForm input.street {
  width: 241px;
}
#contactForm input.streetNo {
  width: 70px;
}
#contactForm textarea {
  width: 320px;
  height: 100px;
}
#contactForm textarea.long {
  width: 672px;
  height: 150px;
}


/*
 * CSS for product search results
 * ( Search criteria table uses same style as product techdata table -> see productTechData)
 */

/*
 * BoxOver tooltiptext style
 */
.tttHeader {
 width: 415px;
 padding: 2px 5px;
 border: 1px solid #068668;
 font-weight: bold;
 background-color: #068668;
 color: #FFFFFF;
 font-size: 1em;
}

.tttBody {
 width: 415px;
 padding: 5px;
 border: 1px solid #068668;
 background-color: #DDF9DD;
 font-size: 1em;
}

/* CSS for registration and change password */
div.registrationBox {
  margin: 10px 5px 10px 0;
  width: 600px;
  float: left;
}
div.registrationBox form {
 padding-top: 1em;
}
div#loginBox th,
div.registrationBox th {
 padding-right: 5px;
 text-align: left;
}
div.registrationBox td {
 padding: 2px 0 3px 5px;
}
div.registrationBox input {
 width: 300px;
}
div.registrationBox input#streetNo {
 width: 50px;
}
div.registrationBox input#street {
 width: 246px;
}
div.registrationBox input.btn {
 width: auto;
}


/* CSS for short url */
div.shortUrlBox {
  width: 650px;
  margin: 0 0 20px 0;
}
div.shortUrlBox form {
 padding-top: 1em;
}
div.shortUrlBox form th {
 padding-right: 5px;
 text-align: left;
}
div.shortUrlBox form input#url {
 width: 400px;
}

div.shortUrlBox blockquote {
 margin: 1em 2em;
 font-weight: bold;
}

/* css for contact */
.contactErrorList {
 padding: 1em 0;
}
.contactErrorList .errorItm {
 font-weight: bold;
 color: #DD0000;
}




/* *** Float containers clear fix:
 http://www.csscreator.com/attributes/containedfloat.php *** */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
  height: 1%;
}
.clearfix {
  display: block;
}
/* End hide from IE-mac */
