#body {
  margin: 0;
  padding: 0;
  text-align: center;
  background-repeat: repeat-x;
  background-position: left top;
  background-color: grey;
}
#wrapper {
  margin: 0.1em auto;
  text-align: left;
  width: 100%;
  background-color: #daebfd;
}
#header {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #daebfd;
  background-position: left top;
  font-style: italic;
  height: 190px;
  padding-left: 10px;
  background-image: url(images/lwheader1.jpg);
  background-repeat: no-repeat;
}
#header1 {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #daebfd;
  background-position: left top;
  font-style: italic;
  height: 190px;
  padding-left: 10px;
  background-image: url(images/img_5281.jpg);
  background-repeat: no-repeat;
}
#header h1 {
  font-family: Times New Roman;
  font-size: 3.5em;
  color: yellow;
}
#header1 h1 {
  font-family: Calibri;
  font-size: 3.5em;
  color: white;
}
#header2 {
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-right: 1px solid black;
  font-style: italic;
  padding-left: 10px;
  text-align: center;
  font-weight: bold;
  background-image: url(images/spt_banner.png);
  background-repeat: repeat-x;
  background-position: center top;
  background-color: transparent;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 1.6em;
  color: #3366ff;
  height: 190px;
}
#header3 {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #daebfd;
  background-position: left top;
  height: 190px;
  background-image: url(images/ydheader10.jpg);
  background-repeat: no-repeat;
}
#header3 h1 {
  font-size: 3.5em;
  color: white;
  position: absolute;
  font-family: Comic Sans MS;
  padding-left: 15px;
  z-index: 1;
}
#header4 {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  background-color: #daebfd;
  background-position: left top;
  height: 190px;
}
#header4 h1 {
  font-size: 3.5em;
  color: white;
  position: absolute;
  font-family: Comic Sans MS;
  padding-left: 15px;
  z-index: 1;
}

.css-slideshow{
   position: relative;
   max-width: 900px;
   height: 190px;
}
.css-slideshow figure{
   margin: 0;
   position: absolute;
}

.css-slideshow figure{
   opacity:100;
}
figure:nth-child(1) {
   -webkit-animation: xfade 60s 54s  infinite;
   animation: xfade 60s 54s infinite;
}
figure:nth-child(2) {
   -webkit-animation: xfade 60s 48s  infinite;
   animation: xfade 60s 48s infinite;
}
figure:nth-child(3) {
   -webkit-animation: xfade 60s 42s  infinite;
   animation: xfade 60s 42s infinite;
}
figure:nth-child(4) {
   -webkit-animation: xfade 60s 36s  infinite;
   animation: xfade 60s 36s infinite;
}
figure:nth-child(5) {
   -webkit-animation: xfade 60s 30s  infinite;
   animation: xfade 60s 30s infinite;
}
figure:nth-child(6) {
   -webkit-animation: xfade 60s 24s  infinite;
   animation: xfade 60s 24s infinite;
}
figure:nth-child(7) {
   -webkit-animation: xfade 60s 18s  infinite;
   animation: xfade 60s 18s infinite;
}
figure:nth-child(8) {
   -webkit-animation: xfade 60s 12s  infinite;
   animation: xfade 60s 12s infinite;
}
figure:nth-child(9) {
   -webkit-animation: xfade 60s 6s  infinite;
   animation: xfade 60s 6s infinite;
}
figure:nth-child(10) {
   -webkit-animation: xfade 60s 0s  infinite;
   animation: xfade 60s 0s infinite;
}

@keyframes xfade{
   0%{
      opacity: 1;
   }
   8% {
      opacity:1;
   }
   10% {
      opacity: 0;
   }
   98% {
      opacity: 0;
   }
   100% {
      opacity:1;
   }
}

@-webkit-keyframes "xfade" {
   0%{
      opacity: 1;
   }
   8% {
      opacity:1;
   }
   10% {
      opacity: 0;
   }
   98% {
      opacity: 0;
   }
   100% {
      opacity:1;
   }
}

.menu {
  top: 10px;
  width:200px; 
  background:#36f; 
  height:100%; 
  overflow:auto; 
  position: fixed;
  left: -200px; 
  z-index:500;
  -webkit-transition:0.5s;
  transition:0.5s;
}

.menu ul li a {
  display:block; 
  font:bold 12px/30px arial, sans-serif; 
  color:#ddd; 
  text-decoration:none; 
  border-bottom:1px solid #666; 
  text-align:left;
}

.menu ul li a:hover {
  color:#fff; 
  text-decoration:underline;
}

.menu ul li label {
  display:block; 
  font:bold 12px/30px arial, sans-serif; 
  color:#ddd; 
  cursor:pointer; 
  background:#36f; 
  border-bottom:1px solid #666; 
  text-transform:uppercase; 
  text-align:left;
  -webkit-transition:0.5s;
  transition:0.5s;
}

.menu ul li label:after {
  content:""; 
  display:block; 
  width:6px; 
  height:6px; 
  border:3px solid #888; 
  border-color:transparent transparent #999 #999; 
  float:right; 
  margin-top:9px;
  -webkit-transform:rotate(45deg);
  transform:rotate(45deg);
  -webkit-transition:0.5s;
  transition:0.5s;
}

.menu ul li label:hover {
  color:#fff; 
  background:#33f;
}

.menu input {
  position:absolute; 
  left:-9999px; 
  display:none;
}

.menu ul > li > a {padding:0 10px;}
.menu ul ul > li > a {padding:0 10px 0 20px;}
.menu ul ul ul > li > a {padding:0 10px 0 30px;}
.menu ul ul ul ul > li > a {padding:0 10px 0 40px;}

.menu ul > li > label {padding:0 10px;}
.menu ul ul > li > label {padding:0 10px 0 20px;}
.menu ul ul ul > li > label {padding:0 10px 0 30px;}
.menu ul ul ul ul > li > label {padding:0 10px 0 40px;}

.menu ul {padding:0; margin:0; list-style:none;}

.menu ul ul {
  position:relative; 
  max-height:0; 
  overflow:hidden;
  -webkit-transition:0.4s;
  transition:0.4s;
}

.menu ul input:checked ~ ul {max-height:750px; /* make this higher than the highest sub menu */
transition:1s;
-webkit-transition:1s;
}

.menu ul input:checked + label {background:#555; padding-left:20px;}
.menu ul ul input:checked + label {background:#666; padding-left:30px;}
.menu ul ul ul input:checked + label {background:#777; padding-left:40px;}

.menu ul input:checked + label:after {
  border-color:transparent transparent #eee #eee;
  -webkit-transform:rotate(-45deg);
  transform:rotate(-45deg);
}

.menu ul:after {content:""; display:block; width:1px; height:100%; background:#666; position:absolute; top:0; left:0;}
.menu ul ul:after {width:10px; background:#555; box-shadow:5px 0 5px -2px rgba(0,0,0,0.4);} 
.menu ul ul ul:after {width:20px; background:#666;}
.menu ul ul ul ul:after {width:30px; background:#777;}

#menuopenclose {position:absolute; left:-9999px; display:none;}
.menuopenclose span {position:absolute; left:-9999px;}
.menuopenclose {display:block; width:30px; height:15px; border:5px solid #36f; border-width:5px 0; position:fixed; left:10px; top:10px; cursor:pointer; z-index:500;
-webkit-transition:0.5s;
transition:0.5s;
}
.menuopenclose:before,
.menuopenclose:after {content:""; display:block; width:30px; height:5px; background:#36f; position:absolute; left:0; top:5px;} 

#menuopenclose:checked ~ .menu {left:0;}
#menuopenclose:checked ~ .menuopenclose {left:210px; border-color:transparent; background:white; border-radius:30px;}

#menuopenclose:checked ~ .menuopenclose:before {background:#000;
-webkit-transform:rotate(45deg);
transform:rotate(45deg);
}
#menuopenclose:checked ~ .menuopenclose:after {background:#000;
-webkit-transform:rotate(-45deg);
transform:rotate(-45deg);
}
#content {
  border-left: 1px solid black;
  border-right: 1px solid black;
}
#panel {
  font-family: Arial,Helvetica,sans-serif;
  background-color: #daebfd;
  text-align: center;
  width: 200px;
  overflow: auto; 
  position: relative;
  float: left;
}
#main {
  border-left: 1px solid black;
  color: black;
  padding-top: 12px;
  padding-right: 15px;
  font-family: Arial,Helvetica,sans-serif;
  background-color: white;
  padding-left: 15px;
  text-align: justify;
}
#main h6 {
  font-size: 1em;
  color: #009900;
  margin-top: 0px;
}

#main h1 {
  text-align: left;
}

#footer {
  border: 1px solid black;
  background-color: black;
  clear: both;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 0.7em;
  color: white;
  padding-left: 5px;
}

#cftext {
  float: left;
  padding-right: 10px;
}

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

tbody {
  text-align: center;
}
thead {
  text-align: center;
}
h1 {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 1.7em;
  line-height: 1em;
}
.callout {
  border: 2px outset black;
  padding: 5px;
  float: right;
  color: white;
  font-size: 0.9em;
  width: 180px;
  margin-top: 10px;
  margin-left: 10px;
  font-weight: inherit;
  background-color: #3366ff;
}
.centre {
  border: 1px solid #3366ff;
  margin: 1em auto;
  padding: 5px;
  color: #000000;
  width: 100%;
  background-color: #daebfd;
  text-align: center;
}
.centre p {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 0.9em;
}
#copyright {
  float: right;
  padding-right: 5px;
}
.poetry {
  text-align: center;
}
.author {
  text-align: right;
}
.comic {
  font-family: Comic Sans MS;
}
.bluebold {
  font-weight: bold;
  color: #3366ff;
}
.small {
  font-size: 0.8em;
}
.italic {
  font-style: italic;
}