/* Styles for geoffwilliams.me.uk
*/

body {
	font-family: sans-serif;
	height: 100%;
        padding: 0px;
        margin: 0px;
}

div {
	vertical-align: top;
}

h1 {
	color: #000000;
	background-color: #ffffff;
	font-size: 150%;
	font-weight:bold;
	font-family: sans-serif;
}

h2 {
	font-family: sans-serif;
	font-size: 100%;
	padding: 0px;
	margin: 0px;
	font-weight:bold;
}

h3 {
	font-family: sans-serif;
	font-size: 100%;
	padding: 0px;
	margin: 0px;
	font-style:italic;
}

table {
	width: 100%;
	margin:0px;
	padding:0px;
	border-collapse: collapse;
}

td {
	border-style: solid;
	border-width: 1px;
}

/*  Form Elements */

label {
	width: 10em;
	float: left;
 	text-align: right;
 	margin: 0 1em 0 0;
	padding: 0px;
	position: relative; /* or ie won't display */
}

input[type="text"] {
	background-color: #99ccff;
	width: 25em;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
}

input[type="text"]:focus {
	background-color: #ffffff;
	font-weight: bold;
}

input[type="password"] {
	background-color: #99ccff;
	width: 25em;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
}

input[type="password"]:focus {
	background-color: #ff0000;
	font-weight: bold;
}

input[type="button"] {
	text-transform:uppercase;
}

textarea {
	width: 60%;
	height: 20em;
}


#menu {
	z-index:99;
	position: relative;
	float:left;
        background-color: #ffffff;
	border:none;
        padding: 0em;
        margin: 5px;
	width:10em;
}

/* menu */
#menu ul {
	list-style-type: none;
        list-style-position: inside;
        text-align: left;
        width:100%;
	padding: 0px;
	margin: 0px;
        background-color:red;
        font-size: 70%;
	border:none;
}

#menu ul li {
  	display: block;
	border-color: #000000;
	font-weight:bold;
	color: #000000;
	text-decoration: none;
        width:100%;
        height: 2em;
        padding:0;
	margin: 0px;
        float:left;
        clear:both;
}

/* a's within li's */
#menu ul li a {
	display: block;
        width:100%;
        height:1em;
	color: #000000;
        margin: 0px;
	background-image: url('images/gradient.jpg');
	background-repeat: repeat-x;
	background-position: 50% 50%;
	background-color: #e1e5fe;
	padding-top: 0.5em;
	padding-bottom: 0.5em;
	padding-left: 5%;
	padding-right: 5%;
	text-align: left;	
	border-style:solid;
    	border-width: 1px;
	border-color: #000000;
}

#menu ul li a:hover {
	background-image: none;
	background-color: #0000ff;
	color: #ffffff;
}

a {
	text-decoration: none;
	font-weight: bold;
	color: #0000ff;

}

a:hover {
	background-color: #0000ff;
	color: #ffffff;
	text-decoration: underline;
}


/* styles for each menu level */
.menuLevel1 {
	text-indent:0.5em;
}

.menuLevel2 {
	text-indent: 1em;
}

.menuLevel3 {
	text-indent:1.5em;
}

/* Box at top of page */
.masthead {
	background-image: url('images/blue.jpg');
	background-color: #000099;
	border-style:solid;
	border-width:1px;
	border-color: #000000;
	padding: 0.5em;
        margin:5px;
	text-align: right;
	color: #ffffff;
	font-weight: bold;
	font-size: 200%;
}

/* menu and content is placed in this div */
.contentContainer {
	top: 0%;
        margin: 0px;
        padding: 0px;
	width:100%;
}

.content {
	font-family: serif;
	position: relative;
	background-color: #ffffff;
	border-style: solid;
	border-width: 1px;
	padding: 0.5em;
	margin-left: 12em;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-top: 5px;
}

.contentItem {
	border-bottom-style: solid;
	border-bottom-color: #000000;
	border-bottom-width: 1px;
}

.footer {
	clear: both;
	position: relative;
	height: 5%;
	text-align: center;
	font-size: 70%;
	background-color: #ffffff;
	padding: 0.5em;
        margin:5px;
	padding-top:5em;
}
