/*****************
page layout 
*****************/
/* center wrapper, min max width */
#pageWrapper {
  border: 1px solid #EA6900;
  margin: 0 auto;     /* this centers wrapper */
  width: 1024px;
  background-color: #ffffff;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  box-shadow:5px 5px 12px #bbbbcc;
  -moz-box-shadow:5px 5px 12px #bbbbcc;
  -webkit-box-shadow:5px 5px 12px #bbbbcc;
  font-size: 1.1em;
}

/* header */
#pageHeader {
  /* border: 1px solid #f00; */
  display: block;
  position:  relative;
}

#pageHeader h1 {
  float:  left;
}

#pageHeader h1 a {
  margin-left: 15px;
  height:  154px;
  width:  108px;
  display: block; 
  text-indent: -999em;  /* this hides the text */
  text-decoration: none; /* old firefox would have shown underline for the link, this explicitly hides it */
}

#pageHeader h2 {
  color: #31C9F5;
  display: block;
  font-size: 1.33em;
}

/* logo */
#logo {
  padding: 15px;
}

/* top menu */
#pageSiteMenu {
  /* border: 1px solid #bbb; */
  float: left; 
  width: 98%;
  font-size:  0.95em;
  line-height: 0.8em;
  color:#fff;
  display: block; 
  position: relative; 
  border-bottom: 1px solid #bbb;
  padding-right: 25px;
  padding-top: 15px;
}

#pageSiteMenu ul {
  width: 100%;
}

#pageSiteMenu ul li {
  float: right;
  font-weight: bold;
  border: 1px solid #bbb;
  -moz-border-top-left-radius: 14px;
  -moz-border-top-right-radius: 14px;
  -webkit-border-top-left-radius: 14px;
  -webkit-border-top-right-radius: 14px;
  border-top-left-radius: 14px;
  border-top-right-radius: 14px;
  background-color:#e6e6e6;
  background: -moz-linear-gradient(top, #efefef 0%, #e6e6e6 34%, #e6e6e6 66%, #dedede 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), colorstop(34%,#e6e6e6), colorstop(66%,#e6e6e6), color-stop(100%,#dedede));
}

#pageSiteMenu ul li a {
  padding: 10px 15px;
  display: block;
  text-decoration: none;
  color:#555; 
}

#pageSiteMenu ul li:hover { 
   background: #88a;
   background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(111,111,111,1) 0%, rgba(40,40,40, 1) 100%);   */
   background: -moz-linear-gradient(top, #454545 0%, #555 34%, #555 66%, #656565 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#454545), colorstop(34%,#555), colorstop(66%,#555), color-stop(100%,#656565));
}

#pageSiteMenu ul li:hover a {
}

#pageSiteMenu ul li a:hover {
  color:#cfe;
}

/* side menu */
#pageNav {
  float: left; 
  width: 20%;
  font-size:  0.85em;
  line-height: 0.96em;
  color:#fff;
  display: block; 
}

#pageNav ul {
  width: 100%;
  padding-bottom: 25px;
}

#pageNav ul li {
  font-weight: bold;
  border-top: 1px solid #ffffff; 
  border-left: 1px solid #eeeeee; 
  border-bottom: 1px solid #999999; 
  background: #afbfea; /* Old browsers */ 
  background: -moz-linear-gradient(left,  #afbfea 0%, #ffffff 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,#afbfea), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  #afbfea 0%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  #afbfea 0%,#ffffff 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  #afbfea 0%,#ffffff 100%); /* IE10+ */
  background: linear-gradient(to right,  #afbfea 0%,#ffffff 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#afbfea', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}

#pageNav ul li a {
  padding: 7px 15px;
  display: block;
  text-decoration: none;
  color:#557; 
}

#pageNav ul li:hover { 
   background: #88a;
   background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(111,111,111,1) 0%, rgba(40,40,40, 1) 100%);   */
   background: -moz-linear-gradient(top, #454545 0%, #555 34%, #555 66%, #656565 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#454545), colorstop(34%,#555), colorstop(66%,#555), color-stop(100%,#656565));
}

#pageNav ul li:hover a {
}

#pageNav ul li a:hover {
  color:#cfe;
}

/* content styling */
#pageContents {
  /* border: 1px solid #00f; */ 
  font-size:  0.8em;
  display: block;
  width: 78%;
  float: right;
}

#pageContents h1 {
  font-size: 2.3em;
  color: #223366;
  width: 98%;
  padding-bottom: 20px;
}

#pageContents h2 {
  font-size: 1.6em;
  color: #112255;
}

#pageContents h3 {
  font-size: 1.4em;
  color: #111111;
}

#pageContents p {
  font-size: 1.2em;
  color: #444;
}

#pageContents pre {
  background-color: #ddffee;
  font-size: 9pt;
  border: 1px solid #113311;
  padding: 10px;
  margin: 20px;
  width: 90%;
}

.productSum {
  font-size: 0.8em;
  border: 1px solid #898;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  padding: 10px;
  width: 65%;
  display: block;
  box-shadow:1px 1px 4px #ccbbcc;
  -moz-box-shadow:1px 1px 4px #ccbbcc;
  -webkit-box-shadow:1px 1px 4px #ccbbcc;
}

.floatMeRight {
  float: right;
}

.productRight {
  background-color: #fff;
  border: 1px solid #6b6;
  border-radius: 15px;
  -moz-border-radius: 15px;
  -webkit-border-radius: 15px;
  padding: 25px;
  width: 260px;
  float: right;
  clear: both;
  font-size: 0.9em;
  box-shadow:2px 2px 5px #bbccbb;
  -moz-box-shadow:2px 2px 5px #bbccbb;
  -webkit-box-shadow:2px 2px 5px #bbccbb;
}
.productRight h2 {
  font-size: 0.85em;
  color: #aa88aa;
  text-align: center;
  padding-bottom: 10px;
}

#wikitext {
  padding-right: 20px;
}

.pagetitle {
  padding-top: 25px;
  padding-right: 25px;
  padding-bottom: 30px;
  font-size: 2em;
}

.pagetitle a {
  text-decoration: none;
  font-weight: bold;
}

#google {
  padding: 25px;
}

/**********
  Footer styling
**********/
#pageFooter {
  font-size: 0.7em;
  /* border: 1px solid #f0f; */
  cursor: default;
  color: #666677;
  padding: 7px;
  background-color: #e6e6e6;
  -moz-border-radius: 5px;
  -khtml-border-radius: 5px;
  -webkit-border-radius: 5px;
   background: -moz-linear-gradient(top, #efefef 0%, #e6e6e6 34%, #e6e6e6 66%, #dedede 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), colorstop(34%,#e6e6e6), colorstop(66%,#e6e6e6), color-stop(100%,#dedede));
}

#pageFooter p {
  padding: 1.05em;      /* some air for footer */
  text-align: center; /* centered text */
}

#pageFooter p a {
  color: #aaaaaa; /* needed becouse footer link would be same color as background otherwise */
}