/* Global Resetting */
html{
  width: 100%;
  height: 100%;
}
body {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
  /* reset font-sizes to 1em == 10px */
}
* {
  font-size: 1em;
  /* reset font-sizes to 1em == 10px */
  padding: 0;
  margin: 0;
  font-family:Verdana,Helvetica,sans-serif;
  list-style:none;
}
a img{
  border:0;
}
.clear{
  clear:both;
}

/* Layout CSS */
#Main {
  margin:20px auto;
  width:900px;
}
#Header {
  background:url(../images/blueback.gif) bottom left repeat-x;
  border-left:1px solid #ccc;
  border-right:1px solid #ccc;
  clear:left;
}
  #Header h1 {
    color:#fff;
    font-size:1.5em;
    line-height:4.5em;
    padding-left:20px;
  }
    #Menu1 {
      padding:10px 50px 0;
    }
      #Menu1 li {
        float:left;
        margin-left:2px;
        background:url(../images/menu1_right.gif) no-repeat right top;
      }
        #Menu1 li.current,
        #Menu1 li.section {
          background:url(../images/menu1_right_on.gif) no-repeat right top;
        }
        #Menu1 li a {
          display:block;
          color:#fff;
          font-weight:bold;
          font-size:1.1em;
          text-decoration:none;
          padding:5px 15px;
          background:url(../images/menu1_left.gif) no-repeat left top;
        }
          #Menu1 li a:hover {
            color:#d2ebff;
          }
          #Menu1 li.current a,
          #Menu1 li.section a {
            background:url(../images/menu1_left_on.gif) no-repeat left top;
            color:#d2ebff;
          }

#ContentContainer {
  background:#f5f5f5 url(../images/ss_watermark.gif) bottom left no-repeat;
  padding-top:20px;
  padding-bottom:20px;
  overflow: auto;
}

#Banner {
  text-align: center;
}

#Menu2 {
  margin-left: 20px;
  width: 17em;
  float:left;
  background:#f0f0f0;
  border:1px solid #ddd;
  padding:10px 10px 10px 10px;
}
  #Menu2 li {
    padding-left:15px;
    background:url(../images/menu2_arrow.gif) no-repeat left center;
  }
  #Menu2 a {
    color:#333;
    font-weight:bold;
    font-size:1.1em;
    line-height:1.6em;
    text-decoration:none;
  }
  #Menu2 a:hover {
    text-decoration:underline;
  }
  #Menu2 li.current a,
  #Menu2 li.section a {
    color:#0083C8;
  }

#Content {
  float: left;
  margin: 0px 20px;
  width:70%;
}

div.breadcrumbs {
  margin-bottom:10px;
  font-size:1em;
  color:#666;
}
div.breadcrumbs a {
  text-decoration:none;
}

#Footer {
  background:#015581;
  clear:both;
  text-align:right;
  padding-right:20px;
  border:1px solid #ccc;
  border-top:0;
}
  #Footer span {
    color:#ccc;
    font-size:1.1em;
    line-height:2em;
    font-weight:bold;
    padding-left:20px;
    background:url(../images/ss_logo.gif) no-repeat;
  }
  #Footer a {
    color:#fff;
  }
    #Footer a:hover {
      text-decoration:none;
    }


/* The rest of this file is for the second tutorial */
#NewsList,
#StaffList {
  background:#f0f0f0;
  border:1px dotted #ccc;
  padding:10px;
}

#NewsList li,
#StaffList li {
  margin: 0;
  list-style-type: none;
}
  #NewsList li.newsDateTitle span {
    color:#666;
    line-height:2em;
  }
  #NewsList li.newsDateTitle a {
    font-size:1.3em;
    font-weight:bold;
    color:#0083C8;
    text-decoration:none;
    padding-left:20px;
    background:url(../images/treeicons/news-file.gif) no-repeat left center;
  }
    #NewsList li.newsDateTitle a:hover {
      border-bottom:1px dotted #0083C8;
    }

  #NewsList li.newsSummary {
    margin-bottom:20px;
  }
    #NewsList li.newsSummary span {
      font-size:1.1em;
      line-height:1.5em;
      color:#333;
    }
    #NewsList li.newsSummary a.readMoreLink {
      color:#0083C8;
      text-decoration:none;
    }
      #NewsList li.newsSummary a.readMoreLink:hover {
        border-bottom:1px dotted #0083C8;
      }

div.newsDetails {
  margin-bottom:10px;
}

div.newsDetails p {
  color:#666;
  margin:0;
  font-size:1em;
}

div.pageComments {
  background:#f0f0f0;
  border:1px dotted #ccc;
  padding:10px;
}

#StaffList .staffname {
  clear: both;
  padding-left: 60px;
  height: 1.2em;
}

#StaffList .staffphoto {
  float: left;
  margin-left: 3px;
  margin-top: -1.2em;
}
#StaffList .staffphoto img {
  border:1px solid #AAA;
}

#StaffList .staffdescription {
  margin-left: 60px;
  margin-bottom:30px;
}

#StaffPhoto {
  float: left;
  margin-right: 10px;
}

#StaffPhoto img {
  border:1px solid #AAA;
}

#PageComments {
  list-style:none;
  background:#e9e9e9;
  border:1px solid #ccc;
  border-bottom:0;
  padding:0;
  margin:0;
}
  #PageComments li {
    list-style:none;
    padding:5px;
    margin:0;
    font-size:1em;
    border-bottom:1px dotted #bbb;
  }
    #PageComments li p span {
      font-style:italic;
    }
    #PageComments a.deletelink {
      font-weight:bold;
    }


#PageNumbers {
  font-weight:bold;
  color:#333;
  font-size:1.1em;
  text-align:center;
  padding:5px;
  border:1px solid #ddd;
  background:#e9e9e9;
}
#PageNumbers * {
  padding:0 5px;
  line-height:1.5em;
}
#PageNumbers a {
  color:#0083C8;
  text-decoration:none;
}
  #PageNumbers a:hover {
    text-decoration:underline;
  }