body { 
        background: white;
	counter-reset: section;
}

h2{counter-reset: sub-section}
h3{counter-reset: composite}
h4{counter-reset: detail}

h2:before{
    counter-increment: section;
    content: counter(section) ".";
}
h3:before{
    counter-increment: sub-section;
    content: counter(section) "." counter(sub-section) ".";
}
h4:before{
    counter-increment: composite;
    content: counter(section) "." counter(sub-section) "."
    counter(composite) ".";
}
h5:before{
    counter-increment: detail;
    content: counter(section) "." counter(sub-section) "."
    counter(composite) "." counter(detail) ".";
}

/* id for main div on main page */
#main {
        line-height: 100px; /* required for vertical alignment of text */ 
	margin-left: auto; 
	margin-right: auto; 
	text-align: center;
	border-width: 0;
	padding: 0 0 0 0;
	width:  703px; /* 7*(98+2) */
	height: 403px; /* 4*(98+2) */
}

/* used by all square divs on main page, except ! and ? */
.square {
        float: left;
	border: 1px;
	border-color: white;
	-webkit-border-radius: 10px; /* Safari 3 */
	-moz-border-radius: 10px;    /* mozilla and opera */
	border-radius: 10px;         /* CSS 3.0 */
	text-align: center;
	background: black;
	width:  98px;
	height: 98px;
	margin: 1px;
	font-weight: bold;
}

.square a {
    height: 96px;
    width:  96px;
}

.square a:link    {
    color: #83D13D; /* some green */
    font-weight: bold;
    text-decoration: none;
}
.square a:visited {
    color: orange ;
    font-weight: bold;
    text-decoration: none;
}
.square a:hover   {
    font-weight: bold;
    text-decoration: none;
}
.square a:active  {
    color: rgb(255, 0, 102) ;
    font-weight: bold;
    text-decoration: none;
}


/* used by ? and ! squares */
.tally {
        float: left;
	border: 1px;
	border-color: white;
	-webkit-border-radius: 10px; /* Safari 3 */
	-moz-border-radius: 10px;    /* mozilla and opera */
	border-radius: 10px;         /* CSS 3.0 */
	text-align: center;
	background: #444444;
	width:  98px;
	height: 98px;
	margin: 1px;
	font-weight: bold;
}

.tally a {
    height: 96px;
    width:  96px;
}
.tally a:link    {
    color: rgb(255, 234, 0) ;
    font-weight: bold;
    text-decoration: none;    
}
.tally a:visited {
    color: rgb(255, 234, 0) ;
    font-weight: bold;
    text-decoration: none;    
}
.tally a:hover   {
    color: rgb(255, 234, 0) ;
    font-weight: bold;
    text-decoration: none;    
}
.tally a:active  {
    color: rgb(255, 234, 0) ;
    font-weight: bold;
    text-decoration: none;    
}

/************************* basic style ***************************************/

/* generic class for content divs on child pages */
.content { /* main div for content */
        text-align: justify;
        background: white;
	margin-left: auto; 
        margin-right: auto; 
        border-width: 0;
	padding: 0 0 0 0;
	width:  600px;
	font: 12px Verdana;
}

.content pre { /* pre blocks are green and simple */
        background-color: #f0f5fe;
	border: 1px solid #dce9ff;
	padding-bottom: 1em;
	padding-top:    1em;
	margin-left: 6px;
	margin-right: 2px;
	margin-bottom: 1em;
	margin-top: 1em;
	padding: 6px;
	margin-right: 6px;
	font-size: 10px;
}

.topmenu { /* small menus for navigations in pages */
        -webkit-border-radius: 4px; /* Safari 3 */
	-moz-border-radius: 4px;    /* mozilla and opera */
	border-radius: 4px;         /* CSS 3.0 */
	text-align: center;
	float: left;
	border-width: 0;
	padding: 0 0 0 0;
	background: black;
	font: 9px Verdana;
	width:  600px;
	padding-bottom: 3px;
	padding-top:    3px;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: auto; 
	margin-right: auto; 
	font-size: 11px;
	margin-right: 10px;
	font-weight: bold;
}

.topmenu a:link    {
    color: rgb(0, 96, 255);
    font-weight: bold;
    text-decoration: none;
}
.topmenu a:visited {
    color: rgb(0, 96, 255);
    text-decoration: none;
}
.topmenu a:hover   {
    color: rgb(0, 180, 255);
    text-decoration: none;
}
.topmenu a:active  {
    text-decoration: none;
}

.pagetitle { /* Basic title style */
        text-align: center;
	color: #1b5b99;
	font-weight:bold;
	font-size: 20px;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}

/************************* News page *****************************************/

.news { /* used by main div in news page */
        text-align: justify;
	background: white;
	margin-left: auto; 
	margin-right: auto; 
	border-width: 0;
	padding: 0 0 0 0;
	width:  600px;
	font: 11px Verdana;
}

.news pre { /* pre blocks on news page looks better inline */
	margin-left: 2em;
	margin-right: 2em;
	margin-bottom: 1em;
	margin-top: 1em;
	font-weight: bold;
}

.npd { /* Date for posts on news pages */
    color: orange;
    font: 10px Monospace;
    background: black;
}

.npt { /* Titles for posts on news pages */
        -webkit-border-radius: 3px; /* Safari 3 */
	-moz-border-radius: 3px;    /* mozilla and opera */
	border-radius: 3px;         /* CSS 3.0 */
        text-align: left;
	color: white;
	background: black;
	border-width: 0;
	padding-left: 2px;
	padding-right: 1em;
	padding-top: 2px;
	padding-bottom: 2px;
	font: bold 11px Monospace;
}

/************************* RH0 page ******************************************/

.rh0 {
        text-align: justify;
	background: white;
	margin-left: auto; 
	margin-right: auto; 
	border-width: 0;
	padding: 0 0 0 0;
	width:  600px;
	font: 11px Verdana;
}

.rh0 a:link {
        color: #1b5b99;
	font-weight: bold;
	text-decoration: none;
}
.rh0 a:visited {
        color: black ;
	font-weight: bold;
        text-decoration: none;
}
.rh0 a:hover   {
        color: orange;
        text-decoration: none;
}

/************************* Under construction ********************************/

.uc {
        margin-top: 1em;
        text-align: justify;
        background: white;
	margin-left: auto; 
        margin-right: auto; 
        border-width: 0;
	padding: 0 0 0 0;
	width:  600px;
	font: 15px Verdana;
	font-weight: bold;
}

/************************* Contact page **************************************/

.contact {
    background: white;
    text-align: center;
    margin-left: auto; 
    margin-right: auto; 
    border-width: 0;
    padding: 0 0 0 0;
    width:  600px;
    color: orange ; 
    font-weight: bold;
    font: 25px Verdana;
}

hr {
   border: 0px; 
   height: 2px; 
   color: black ; 
   background-color: black ;
}



a:link    {
    color: #1b5b99;
    font-weight: bold;
    text-decoration: none;
}
a:visited {
    color: #1b5b99;
    text-decoration: none;
}
a:hover   {
    color: rgb(0, 180, 255);
    text-decoration: none;
}
a:active  {
    text-decoration: none;
}


li {
/* list-style-type: none;
list-style-type: disc; */
line-height: 150%;
}