/*
Palette:
gray: #CCCCCC;
bubble gray: #dddddd; (transparent)
blue: #0046ad;

*/

/* site-wide styles */
body {  
  font-size: 11px;
  line-height: 13px; 
  margin: 0;
  background-color: white;
  text-align: center;
}
table.layout { 
  text-align: left; 
  border-collapse: collapse;
}

img { border: 0; }
div, p, a, body, span {  
  font-family: verdana, sans;
}

/* generic template styles */
div#contentmain { 
  width: 1003px;
  height: 305px;
}

/* generic template styles */
div#skatecontentmain { 
  width: 1003px;
  height: 305px;
}

div.footer { 
  text-align: right;
  width: 1000px;
  margin: 10px auto 10px auto;
  /* font-family: Verdana;*/
  font-size: 9px;
  color: #CCCCCC;
}
div.footer a {
  text-decoration: none;
  color: #CCCCCC;
}
div.footer a:hover {
  color: #0046ad;
} 

.subfooter { 

margin-left: auto;
margin-right: auto;
width: 676px;
text-align: left;

}

div.skatefooter { 
  text-align: right;
  width: 1000px;
  margin: 10px auto 10px auto;
  /* font-family: Verdana;*/
  font-size: 9px;
  color: #CCCCCC;
}
div.skatefooter a {
  text-decoration: none;
  color: #CCCCCC;
}

div.skatefooter a:hover {
  color: #333333;
} 

table.layout { 
  width: 1010px;  /* 1001px; */
  border-collapse: collapse;
  /* margin: top right bottom left; */
  margin: 0 auto 0 auto;
  padding: 0;
  border: 0;
}
table.layout tr { /*width: 1000px;*/
  border: 0; padding: 0; margin: 0; }
table.layout td { 
  border: 0; padding: 0; margin: 0;
}
table.layout td.subnav {
  height: 40px;
}

/* compatibility: the <a><img></a> collapses in ff */
ul#nav a { width: 202px; }

/* compatibility: ie requires the <br> to straighten dropdowns */
table.layout ul.navbar br {
  display: block; /* lets the br work in ie, and not pad the bar in ff */
}
table.layout ul.navbar img {
  border: 0;
  margin-right: 1px;
}
table.layout .navbar { margin: 0; padding: 0; }
table.layout .navbar_item {
  float: left;  
  display: block;
}
table.layout td.bottommargin { height: 10px; }

.blue {
  background-color: #0046ad; 
  color: white;
}

/* suckerfish drop-downs */
ul#nav {
  font-size: 11px;
}
ul#nav ul {
  top: 44px; /* correctly sets the dropdown height in IE*/
  border-top: 1px solid white;
}

ul#nav ul li {  
  background-color: #4d4d4d;
  width: 200px;
  height: 18px;
  border-right: 1px solid white;
  border-left: 1px solid white;
  border-bottom: 1px solid white;
  padding: 2px 0 0 1em;
}

ul#nav li ul li:hover, ul#nav li ul li.sfhover {  
  background-color: #0046ad;
}

ul#nav ul li a {
  color: white; 
  text-decoration: none; 
}

/* ie7 suckerfish fix */
ul#nav li:hover, ul#nav li.sfhover {
    position: static; 
}

ul#nav  li { position: relative; }



/* elements */
/******  The infamous content bubble ***/

div.bubble {
  margin: 10px 0 0 10px;
  float: left;
  display: inline; /* ie bug fix http://www.positioniseverything.net/explorer/doubled-margin.html */

  /*font-family: Verdana;*/
  font-size: 11px;
  line-height: 13px;
  color: #000000;

  position: relative;
}
div.bwide {
  width: 518px; 
}
div.bnarrow {
  width: 254px; 
}
div.bwide div.bubbleh1 {  
  background: url('/images/minitop_bubWide_g_518x22.gif');
  height: 22px;
  line-height: 22px;
  padding-left: 10px;
  font-weight: bold;
}
div.bnarrow div.bubbleh1 {  
  background: url('/images/minitop_bubThin_g_254x22.gif');
  height: 22px;
  line-height: 22px;
  padding-left: 10px;
  font-weight: bold;
}

div.bubble .bubblecontent { 
  padding: 1em; 
  height: 220px;
  overflow: auto;
  background-color: #dddddd;
  /* http://www.quirksmode.org/css/opacity.html */
  opacity: .93;
  filter: alpha(opacity=93);
}
div.bubble .bubblecontent a {
  color: #000000;
  text-decoration: none;  
}
div.bubble .bubblecontent a:hover {  
  color: #0046ad; 
}
div.bubble h1 { 
  /* applied directly to the heading */
  font-weight: bold;
  color: #0046ad; 
  font-size: 11px;
  line-height: 13px;

  padding: 0 0 0 1em;/* t r b l */

  position: absolute;
  top: -15px;
  left: 0;
}
div.bubbleh1 { 
  /* applied to the div containing the heading */
  color: #0046ad;
  font-weight: bold;
  background-color: darkgray;
  border-bottom: 1px solid white;

  padding: 0;
  margin: 0;

  /*position: relative;*/
  height: 8px;
}

div.skatebubbleh1 { 
  /* applied to the div containing the heading */
  color: #333333;
  font-weight: bold;
  background-color: darkgray;
  border-bottom: 1px solid white;

  padding: 0;
  margin: 0;

  /*position: relative;*/
  height: 8px;
}
/* *************** */
/******  The technology lower-nav bubbles ***/

div.techbubble, div.techbubblefirst{ /* == div.bubble */
  /*margin: 18px 0 0 10px;/ * t r b l */
  margin: 10px 0 0 10px;
  padding: 0;
  float: left;
  width: 242px;
  /*font-family: Verdana;*/
  font-size: 11px;
  line-height: 13px;
  color: #000000; /* (OR #kkkkkk; OR # 0046ad;) */

}
body.technology table.layout div.techbubblefirst { margin: 10px 0 0 0; }
div.techbubble .techlower {  /* techlower==bubblecontent */
  color: #0046ad;
  width: 242px;
  height: 166px;
  overflow: auto;
  background: url('/images/Gry_techmenu_243x166.jpg');
  background-repeat: no-repeat;
  padding: 10px 10px 0 10px;
  margin: 0;
  font-size: 11px;
  line-height: 13px;
}
div.techbubble .techlower a {
  text-decoration: none;
  color: #0046ad; 
}
div.techbubble .techlower a:hover {
  color: black;
}
div.techbubbleh1 { 
  /* applied to the div containing the heading */
  color: white;
  font-weight: bold;
  background: url('/images/minitop_techmenu_b_243x22.gif');
  border-bottom: 1px solid white;
  line-height: 22px;
  padding: 0 0 0 10px;
  margin: 0;

}

div.techbubble ul { list-style-type: none; }

/* *************** */
/******  The skatetech lower-nav bubbles ***/

div.skatetechbubble, div.skatetechbubblefirst{ /* == div.bubble */
  /*margin: 18px 0 0 10px;/ * t r b l */
  margin: 10px 0 0 10px;
  padding: 0;
  float: left;
  width: 322px;
  /*font-family: Verdana;*/
  font-size: 11px;
  line-height: 13px;
  color: #000000; /* (OR #kkkkkk; OR # 0046ad;) */

}

body.skatetech table.layout div.skatetechbubblefirst { margin: 10px 0 0 0; }
div.skatetechbubble .skatetechlower {  /* techlower==bubblecontent */
  color: #333333;
  width: 322px;
  height: 166px;
  overflow: auto;
  background: url('/images/Gry_skatetechmenu_323x166.jpg');
  background-repeat: no-repeat;
  padding: 10px 10px 0 10px;
  margin: 0;
  font-size: 11px;
  line-height: 13px;
}
div.skatetechbubble .skatetechlower a {
  text-decoration: none;
  color: #333333; 
}
div.skatetechbubble .skatetechlower a:hover {
  color: #999999;
}
div.skatetechbubbleh1 { 
  /* applied to the div containing the heading */
  color: white;
  font-weight: bold;
  background: url('/images/minitop_skatetech_k_323x22.gif');
  border-bottom: 1px solid white;
  line-height: 22px;
  padding: 0 0 0 10px;
  margin: 0;

}

div.skatetechbubble ul { list-style-type: none; }

/* *************** */
/* ****  styling the product (style) icons appearing gender and feature pages **** */


.shoeitem a p.name { 
  background-image: url('/images/minitop_prodUnderhang_160x23.gif');
  background-position: center 0px;  
  background-repeat: no-repeat;

  margin: 0;
  padding: 0px 0 0 10px;
  line-height: 23px;
  height: 23px;

  font-size: 11px;
  font-weight: bold;
}
.shoeitem a img { 
  margin: 0;
  padding: 0;
  width: 160px;
  height: 99px;
}
.shoeitem a { 
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: #0046ad;
}
.shoeitem {
  width: 160; 
  height: 125;
  float: left;
}

/**** now for skate ****/
.skateshoeitem a p.name { 
  background-image: url('/images/minitop_prodUnderhang_160x23.gif');
  background-position: center 0px;  
  background-repeat: no-repeat;

  margin: 0;
  padding: 0px 0 0 10px;
  line-height: 23px;
  height: 23px;

  font-size: 11px;
  font-weight: bold;
}
.skateshoeitem a img { 
  margin: 0;
  padding: 0;
  width: 160px;
  height: 99px;
}
.skateshoeitem a { 
  margin: 0;
  padding: 0;
  text-decoration: none;
  color: #333333;
}
.skateshoeitem {
  width: 160; 
  height: 125;
  float: left;
}

/* *************** */
body.root { 
  background: white; 
}
body.root #contentmain { 
  height: 340px;
  margin: 15px 0 0 20px;/* t r b l */
}
body.root td.nav { 
  padding-left: 10px; 
}

body.root #skatecontentmain { 
  height: 340px;
  margin: 15px 0 0 20px;/* t r b l */
}

body.root #skateflash { 
  position: absolute;
  left: 15px;
  top: 20px;
}

/* corporate site */
body.corporate { background: white; }
body.corporate .layout .navbar { margin-left: 2px; }
body.corporate  div.lower { 
  float: left; 
  margin-left: 10px;
  display: inline; /* ie bug fix http://www.positioniseverything.net/explorer/doubled-margin.html */
}

/* athletic site */
body.athletics { background: white; }
div.lower { margin-left: 10px; float: left; display: inline; }
body.athletics tr.subnavrow td ul.navbar { margin-left: 2px; }

body.athleticsroot #contentmain { 
  position: relative;
  height: 355;
}
body.athleticsroot embed, body.athleticsroot #flashcontent {
  position: absolute; 
}

body.athleticsroot table.layout tr.lowernavrow div.lowercontainer { 
  position: absolute;
  width: 990px;
}

body.athleticsroot div.lowercontainer div.lower {
  margin: 0 0px 0 10px; /* t r b l */
  float: left; 
  display: inline;  /* ie bug fix http://www.positioniseverything.net/explorer/doubled-margin.html */
}
body.athleticsroot div.footer {
  padding-top: 200px; 
}

/* technology pages */
body.technology {
  background-color: white;
}
body.technology #contentmain .words {
  font-size: 11px; 
  padding: 10px;
  vertical-align: top;
}
body.technology #contentmain {
  height: 335px;
  width: 1000px;
  border-collapse: collapse;
  margin: 1px 0 0 0;
  border-style: hidden;
}
body.technology #contentmain td {
  border: 1px solid white;
  margin: 0; padding: 0;
}
body.technology .footer { 
  margin: 0 auto 10px auto;/* t r b l */
}

/* skatetech pages */
body.skatetech {
  background-color: white;
}
body.skatetech #contentmain .words {
  font-size: 11px; 
  padding: 10px;
  vertical-align: top;
}
body.skatetech #contentmain {
  height: 335px;
  width: 1000px;
  border-collapse: collapse;
  margin: 1px 0 0 0;
  border-style: hidden;
}
body.skatetech #contentmain td {
  border: 1px solid white;
  margin: 0; padding: 0;
}
body.skatetech div.footer { 
  margin: 0 auto 10px auto;/* t r b l */
}

body.athleticsroot div.skatefooter {
  padding-top: 200px; 
}

/* feature pages */
body.feature { background: white; }
body.feature #contentmain{ height: 335px; margin-top: 1px;}
body.feature .shoeitem {
  display: inline; /* ie bug fix http://www.positioniseverything.net/explorer/doubled-margin.html */
  margin: 10px 0 10px 10px; /* t r b l */
}
body.feature .productlist  div.productlist { 
  background-color: #e6e6e6;
  width: 1000px;
  height: 150px;
  margin-left: 2px;
  margin-top: 1px;
}
body.feature .listheader {
  color: white;
  font-weight: bold;
  width: 1000px;
  margin-top: 10px;
  margin-bottom: 0;
  line-height: 22px;
  background-image: url('/images/minitop_featured_b_1000x22.gif');
  background-repeat: no-repeat;
  background-position: center 10px;
}
body.feature .listheader div {
  height: 22px;
  margin-top: 10px;
  margin-bottom: 1px;
  padding-left: 10px;
  font-size: 11px;
}


/* product pages */
body.products { background: white; }

/* category pages */
body.category { background: white; }
body.category .mainnavrow ul, body.category .mainnavrow td,
body.category .subnavrow ul, body.category .subnavrow td { 
  padding: 0; margin: 0; 
}
body.category tr.subnavrow td ul.navbar li { margin-bottom: 0; padding-bottom: 0; } /* line-height does it in ff not ie */
body.category tr.subnavrow td ul.navbar { margin-bottom: 0; padding-bottom: 0; background-color: green; } /* line-height does it in ff not ie */
body.category .featurecontainer {
  position: relative;
  margin: 0; padding: 0;
  border: 0px;
}
body.category .featureblock { 
  position: absolute;
  left: 660px;
  top: 40px;
  width: 300px;
  border-bottom: 1px solid white;
}
body.category .featureblock a {
  margin: 0;
  padding: 0;
  border:0;
}
body.category div#contentmain { 
  height: 535px;
}
.featureblock .sidehead { 
  background: url('images/minitop_universal_b_300x22.gif');
  background-repeat: no-repeat;
  color: white;
  line-height: 22px;
  height: 22px;
  width: 300px;
  padding-left: 10px;
  font-size: 11px;
  font-weight: bold;
  margin: 0; /*1em 0 0 0;*/
}
.featureblock img { margin: 0; padding: 0; border: 0;}
.featureblock a { margin: 0; padding: 0; border: 0;}


/* *************** */
div.admin {
  position: absolute; 
  background-color: red;
  color: white;
  opacity: .50;
  filter: alpha(opacity=50);
}
div.admin a { color: white; }


/* *************z-index***************** */

/* the complete list of position: absolute styles : */
div.bubble h1 { 
  z-index: 500;
}
body.athleticsroot embed, body.athleticsroot #flashcontent {
  z-index: 100;
}
body.athleticsroot div.lowercontainer { 
  z-index: 500;
}
body.category .featureblock { 
  z-index: 500;
}
div.admin {
  z-index: 1000;
}
#nav li ul {
  z-index: 1000;
}

/* the complete list of position: relative styles : */
ul#nav  li { 
  z-index: 1000;
}

div.bubble {
  z-index: 500;
}
body.athleticsroot #contentmain { 
  z-index: 100;
}
body.category .featurecontainer {
  z-index: 500;
}
