/* CSS for layout (e.g., positioning)
 */

/* add for concerts.shtml, somehow... */
/* hr { clear: both; } */

html, body, div {
  padding:  0px;
  margin:   0px;
  border:   0px solid black;
  color:     black;
}

html, body {
  position: relative;
  height: 100%;
  width:  100%;
  background-color: blue;
}

#divAll {
  position: relative;
  width:        100%;
  height:       100%;
  min-height:   100%;
  background-color: white;
  color:            black;
}

.menuHead,
#divBanner,
#NewsContent, #PageContent {
  background-color: inherit;
}

#divLogo {
  float:    left;
  position: relative;
  height:         15%; min-height: 36px; max-height: 144px;
  left:            0px;
  width:         144px;
  border-bottom:   1px solid black;
  margin-right:    4px;
  margin-bottom:   4px;
  background-color: black; /* match field (background) of logo */
}
#banner_logo_wcw {
  height:       100%; min-height: 36px; max-height: 144px;
}

#divName {
  position: relative;
  right:            0px;
  height:          15%; min-height: 36px; max-height: 144px;
  margin-left:    148px;
  border-left:      1px solid black;
  border-bottom:    1px solid black;
  margin-bottom:    4px;
  line-height: 34px; font-size: 32px;
}
#divName table {
  height:         100%;
  width:          100%;
}


  #divHead {
    position: static; /* else IE6 and mm_menu don't get along */
  }
  #divWrap {
    position: relative;
    overflow: hidden;
    height:        152px;
    margin-bottom:   4px;
  }
  #divFoto {
    position: absolute;
    height:     152px;
    width:      100%;
    background-color: black; /* neutral margins for photos */
    color:            white;
    text-align:       center;
  }
  #divFoto img {
    display: inline;
  }

#divSlug0 {
  display:  none; /* display only when needed */
  clear:    both;
  float:    none;
  position: relative;
  width:    100%;
  height:     1px;
  background-color: red;
  /*
  z-index:    5;
   */
}

#divSlug1, #divSlugL, #divSlugR {
  position: relative;
  border-top:      1px solid black;
  height:         28px; line-height: 28px; font-size: 20px;
  border-bottom:   1px solid black;
  margin-bottom:   4px;
  text-align:       center;
}
#divSlug1 {
  clear:    both;
  width:         100%;
}
#divSlugR {
  left:            0px;
  right:           0px;
  margin-left:   143px;
}
#divSlugL {
  width:         143px;
  border-right:    1px solid black;
  margin-bottom:   4px;
}

#divBody {
  clear:    both;
  float:    none;
  overflow: auto;
  position: relative;
  top:             0px;
  bottom:          0px;
  width:         100%;
  border-bottom:   1px solid black;
}

  #divSide1,
  #divSide2 {
    float:    left;
    position: relative;
    top:            0px;
    left:           0px;
    width:        144px;
    margin-right:   4px;
  }
  #divSide2 {
    clear:    left;
    width:        148px;
    border-right:   1px solid black;
    padding-bottom: 4px;
    border-bottom:  1px solid black;
    margin-bottom: .2em;
  }
  #divNews {
    position: relative;
    overflow: auto;
    width:         143px;
    border-right:    1px solid black;
    border-bottom:   1px solid black;
    border-top:      1px solid black;
  }

#divFoot {
  clear:    none;
  float:    none;
  position: relative;
  width:         100%;
  margin-top:      4px;
  border-top:      1px solid black;
  padding-top:     2px;
  height:         24px;
  padding-bottom:  2px;
  text-align:       right;
}
#tbl_foot_logo_wcw,
#tbl_foot_logo_ccc {
  height:       24px;
  vertical-align: middle;
}
#divFoot p {
  margin:        0px;
  padding-left:  8px;
  padding-right: 8px;
}
#leftFoot {
  float:          left;
}

#NewsContent, #PageContent {
  padding-left:  6px;
  padding-right: 6px;
}

/* 
  put a border at the top of divBody, but
  only above PageContent, not above Side2
 */
#PageContent > *:first-child {
  margin-top:  0px;
  border-top:  1px solid black;
  padding-top: 6px;
}


#divMenu {
  position: relative;
  /*
  top:           0px;
  left:          0px;
   */
  width:          143px;
  border-right:     1px solid black;
  /* total height should match divFoto (152px + 4px bottom margin) */
  border-top:       1px solid black;
  padding-top:      5px;
  height:         140px;
  padding-bottom:   5px;
  border-bottom:    1px solid black;
  margin-bottom:    4px;
}

.menuHead {
  border-top:      0px solid transparent;
  padding-top:     1px;
  height:         26px; line-height: 26px; font-size: 18px;
  padding-bottom:  1px;
  border-bottom:   0px solid transparent;
  text-align:       center; 
}
/*  Some menu heads may be links, not heads of a menu; style them 
    like menu items, not links. Match colors to wcwMenus.js.
 */
.menuHead a:link, .menuHead a:visited, .menuHead a:hover {
  color:            black; /* may be overridden below */
  text-decoration:  none;
}
.menuHead a:hover {
  color:            white;
  background-color: #666666; /* match mm_menus.js */
}