/* These are the styles for all puzzle pages.  Individual puzzle pages
** may override some of these settings, but for the most part, they
** will apply to all puzzle displays.  The outer display styles will
** define only how the puzzle section is contained, and possibly its
** colors and display attributes.
*/

  #puzzle-header {
    position:relative;
    width:100%;
    height:120px;
  }
  #puzzle-header H1 { }
  #puzzle-header H2 { }

  #puzzle-content {
    position:relative;
    width:100%;
    padding:0px;
    margin:0px;
  }

  #puzzle-content #puzzle-applet {
    /* Set width and height in client css */
    margin:10px auto;
  }
  #puzzle-content #puzzle-applet APPLET {
    margin:0px auto;
  }

  #puzzle-content #puzzle-printable {
    width:650px;
    height:auto;
    margin:10px auto;
    padding-bottom:20px;
  }
  #puzzle-content #puzzle-printable #GridImg {
    float:right;
  }
  #puzzle-content #puzzle-printable DL {
    width:200px;
    margin:0px;
    padding:0px;
    margin-top:15px;
    margin-left:20px;
    float:left;
  }
  #puzzle-content #puzzle-printable DL#puzzle-column-1 {
    margin-top:-15px;
    margin-left:0px;
  }
  #puzzle-content #puzzle-printable DT {
    padding-top:15px;
    padding-bottom:10px;
    font-size:15px;
    font-weight:bold;
  }
  #puzzle-content #puzzle-printable DD {
    margin:0px;
    padding:0px;
    margin-left:20px;
    text-indent:-20px;
    font-size:12px;
  }


  #puzzle-content #puzzle-list {
    width:650px;
    margin:0px auto;
  }
  #puzzle-content #puzzle-list DL {
    width:100%;
  }
  #puzzle-content #puzzle-list DT {
    display:block;
    width:100%;
    font-size:18px;
    font-weight:bold;
    text-align:center;
    padding-top:25px;
    clear:both;
  }
  #puzzle-content #puzzle-list DD {
    display:block;
    width:300px;
    margin:0px 10px;
    font-size:12px;
    text-align:center;
    float:left;
  }
  #puzzle-content #puzzle-list DD A {
    font-size:12px;
  }

  .puzzle-solution {
    display:none;
    position:absolute;
    top:50px;
    left:25px;
    width:386px;
    height:405px;
    background-color:#FFF;
  }
  BODY > .puzzle-solution { position:fixed; }


  #puzzle-solution-ifr {
    width:390px;
    height:410px;
    z-index:100;
    border:none;
  }
  #puzzle-solution-div {
    z-index:101;
    border:2px solid #000;
  }
  #puzzle-solution-inner {
    width:376px;
    height:390px;
    margin:5px;
  }
  #puzzle-solution-inner A {
    display:block;
    width:100%;
    height:15px;
    font-size:12px;
    font-weight:bold;
    text-decoration:none;
    text-align:center;
    color:#D00;
  }

  #puzzle-footer {
    clear:both;
    width:100%;
  }
  #puzzle-footer UL {
    display:block;
    width:100%;
    margin:0px;
    padding:0px;
    height:25px;
  }
  #puzzle-footer UL LI {
    display:block;
    width:33%;
    margin:0px;
    padding:0px;
    float:left;
    text-align:center;
  }
  #puzzle-footer #copyright {
    font-size:10px;
    color:#AAA;
    text-align:center;
  }