<style type="text/css">
 * {background-color:#fff999;}
body {
background-color:#fff999;
margin: 10px;
padding: 10;
font-size: 0.8em;
font-family: arial, verdana, helvetica,  sans-serif;
}
h1 {
font-family: comic-sans-ms, arial, verdana,  helvetica, sans-serif;
margin: 0 0 12px 0;
font-size: 15pt; text-decoration:underline; text-align: center;font-style:italic;
padding: 0;
color: #0000ff;
}
h2 {
font-family: comic-sans-ms, arial, verdana, sans-serif;
margin: 0 0 5px 0;
padding: 0;
font-size: 12pt; text-align: center;
color: #0000ff;
}
h3 {
font-family: comic-sans-ms, arial, verdana, sans-serif;
margin: 0 0 5px 0;
padding: 0;
font-size: 11px; text-align: center;
color: red;
}
.bl3,.bl6,.bl8,.bl10,.bl12 {background:url(image/bl.gif) 0 100% no-repeat #ffbb33; width:98%; text-align:justify }
.bl2 {background:url(image/bl.gif) 0 100% no-repeat #ffbb33; width:98%; text-align:justify; padding:10px}
.bl {background:url(image/bl.gif) 0 100% no-repeat; width:98%; text-justify}
.br {background:url(image/br.gif) 100% 100% no-repeat}
.tl {background:url(image/tl.gif) 0 0 no-repeat}
.tr {background:url(image/tr.gif) 100% 0 no-repeat}
.tr2 {background:url(image/tr.gif) 100% 0 no-repeat; padding:10px}
img {border:0}

.bl5,.bl7,.bl9,.bl11,.bl13 {background:url(image/bl.gif) 0 100% no-repeat #ffccff;  width:98%;  text-align:justify   }
.bl2 {background:url(image/bl.gif) 0 100% no-repeat #ffccff; width:98%;  text-align:justify;  padding:10px}
.bl {background:url(image/bl.gif) 0 100% no-repeat; width:98%;  text-align:justify }
.br {background:url(image/br.gif) 100% 100% no-repeat}
.tl {background:url(image/tl.gif) 0 0 no-repeat}
.tr {background:url(image/tr.gif) 100% 0 no-repeat}
.tr2 {background:url(image/tr.gif) 100% 0 no-repeat; padding:10px}
img {border:0}

imge {
float:center;
margin:0 0 5px 10px;
border:1px black;
text-align:left;
}

ul.image {list-style-image: url('arr_3.gif')}
 ul.disc {list-style-type: disc} 
 ul.circle {list-style-type: circle} 
 ul.square {list-style-type: square} 
 ul.none {list-style-type: none} 

 /* banner{
font-family: arial, helvetica, verdana, sans-serif;
line-height: 1.0;
margin: 0 0 16px 0;
padding: 0;
font-weight: +500;
color: #000000;
} */
.content>p {
margin: 0; 
}
.content>p+p {
text-indent: 1px;
}

/* a {
color: teal;
font-family: arial, verdana,  helvetica, sans-serif;
font-weight: bold; font-size: 1.0em;
text-decoration: underline;
} */
a:link {
font-family:arial; color:blue; font-weight:500;
}
a:visited {
color: blue;
}
a:hover {
background-color:pink;
}
/* All the content boxes belong to the content class. */
#content {
position: relative;
width: 55%;
min-width: 180px;
margin: 0 200px 20px 220px;
border: 0px solid black;
padding: 10px;
z-index: 3;
}  

/*
#nav{
   white-space : nowrap;
   background-color :#000000;
   float : center;
    color : White;
   width : 90%;
   border-style : solid; 
   border-color :#000000;
   border-width : 2px 0 2px 0; 
} 
#nav ul{
   padding : 0;
   margin : 0;
   float :center;
}
#nav ul li{
   display : inline;
}
#nav ul li a{
   padding-left : 1em;
   padding-right : 1em;
   background-color : #003399;
   color : White;
   font-weight : bold;
   text-decoration : none;
   float : left;
   border-right-color : #fff999;
   border-right-style : solid;
   border-right-width : 2px;
   top: 280px
}
#nav ul li a:hover{
   background-color : #99CCFF;
   color : #000066;
} */

#navleft {
position: absolute;
width: 170px;
top: 120px;
left: 20px;
font-size:0.8em; font-weight: 600;
border: 0px solid;
background-color:"";
padding: 10px;
z-index: 2;
}
#navright {
position: absolute;
width: 140px;
top:120px;
right: 15px;
font-size:0.8em; font-weight: 600;
border: 0px solid;
background-color:"";
padding: 10px;
z-index: 1;
}

#navlist {
        color: #fff999;
        background: #ffccff";
        border-bottom: 0em solid #17a;
        border-right: 0em solid #17a;
        padding: 0 1px;
        margin-left: 0;
        width: 10em;
        font: normal 10px Verdana, sans-serif;
}

#navlist li {
        list-style: none;
        margin: 0;
        font-size: 1em;
}

#navlist a {
        display: block;
        text-decoration: none;
        margin-bottom: 0.3em;
        margin-top: 0.3em;
        color: blue;
        background: #fc0;
        border-width: 1px;
        border-style: solid;
        border-color: #0000ff #0000ff #0000ff #0000ff;
        border-left: 0.1em solid #0000ff;
        padding: 0.45em 0.5em 0.1em 0.55em;
}

#navlist a#current { border-color: #5bd #035 #068 #f30; }

#navlist a {
        width: 99%;
        /* only necessary for Internet Explorer */
}

#navlist a {
        voice-family: "\"}\"";
        voice-family: inherit;
        width: 11em;
        /* Tantek-hack should only used if Internet-Explorer 6 is in standards-compliant mode */
}

#navcontainer>#navlist a {
        width: auto;
        /* only necessary if you use the hacks above for the Internet Explorer */
}

#navlist a:hover, #navlist a#current:hover {
        background: white;
        border-color: #069 #6cf #5bd #fc0;
        padding: 0.4em 0.35em 0.25em 0.9em;
}

#navlist a:active, #navlist a#current:active {
        background: #17a;
        border-color: #069 #6cf #5bd white;
        padding: 4em 0.35em 0.25em 0.9em;
}


-->
</style>
<!-- <link rel="stylesheet" type="text/css" href="ex2.css" title="Horizontal Menu"/><!-- This is used to attach the stylesheet to the page -->-->
