@charset "utf-8";
/* CSS Document */
body {
	background-color:	White;
	color:				#0000FF;
	font-family: Arial, Helvetica, sans-serif;
}
.button:hover {
	background-color:	#CCCCCC;
	color:				White;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none
}
.button {
	background-color:	Blue;
	color:				White;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none
}
.buttonlink:link {
	color:				White;
	font-family: Arial, Helvetica, sans-serif;
	text-decoration: none
}
.buttonlink:visited {
	color:				White;
	text-decoration: none
}
.buttonlink:active {
	color:				White;
	text-decoration: none
}
.pagetitle {
	color:				Blue;
}
.subheading {
	color:				#009;
}
.copyright {
	color:				#000000;
	font-size:			9px;
}
p {
	font-family: Arial, Helvetica, sans-serif;
	font-weight:		bold;
}
h2 {
	font-family: Arial, Helvetica, sans-serif;
	color:				#999999;
}
hr {
	color:				Black;
}

link{
	color:#CCCCCC;
}

.alcentre {
	text-align: 		center;
}

h1{color:#FF0000;}

h3{color:#FF0000;}

h4{color:#cccccc;}

h5{color:#cccccc;}

h6{color:#0000FF;}

img{margin: 7px; }

.centre{margin-left: auto; margin-right: auto; text-align: center}

.right{float:right;}

.left{float:left;}

table {
    border:             0px solid black;
    padding:            5px;
    border-collapse:    collapse;   /* This solves the gap problem */
    margin:             5px;
}

/* this here is a joint selector, as it selects a pseudo-class within a regular class */
/* it is the more precise but verbose way */
.hover-effect:hover {
    background:         #CCCCCC;
    }