body {
	margin: 0;
	padding: 0;
	font-family: 'Trebuchet MS', Geneva, sans-serif;
	font-size: 80%;
	background-color: #fff;
	color: #00447c;
}
#page {
	width: 1060px;
	margin: 0 auto;
	padding-bottom: 40px;
}
#page h1 {
	margin: 0;
}
#page h1 a {
	width: 1000px;
	height: 252px;
	background-image: url("/static/images/TREDS_Employee_Banners.13ef5a0f8ee3.png");
	background-repeat: no-repeat;
	margin: 0 0 19px;
	display: block;
}
#parentpage {
	width: 1060px;
	margin: 0 auto;
	padding-bottom: 40px;
}
#parentpage h1 {
	margin: 0;
}
#parentpage h1 a {
	width: 1000px;
	height: 252px;
	background-image: url("/static/images/TREDS_Parent_Banners.572d2b66c844.png");
	background-repeat: no-repeat;
	margin: 0 0 19px;
	display: block;
}
h1 span {
	display: none;
}

#sidebar {
	width: 240px;
	float: left;
	text-align: right;
}
#sidebar p, #sidebar h3 {
	margin: 4px 40px 4px 0;
	font-size: 85%;
}
#sidebar h3 {
	margin: 18px 40px 0;
	font-size: 100%;
}
#sidebar a {
	text-transform: uppercase;
}



#content {
	width: 580px;
	margin-left: 280px;
}
#content p {
	line-height: 150%;
	margin: 16px 0;
}

ul#nav, ul#topNav {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
ul#nav > li {
	margin-bottom: 5px;
}

ul#nav > li ul.static {
	list-style-type: none;
	padding: 0;
	margin-left: 0px;
	margin-bottom: 18px;
}
ul#nav > li ul.static li {
	padding: 2px 40px 2px 0;
}
ul#nav > li ul.static li a {
	text-transform: none;
}
ul#nav > li ul.flyout {
	list-style-type: none;
	padding: 0;
	margin-left: 210px;
	margin-top: -28px;
	display: none;
	position: absolute;
}
ul#nav > li ul.flyout li {
	padding: 2px 0;
	padding-right: 39px;
	text-align: left;
	border-bottom: 1px solid #fff;
	background-color: #4e84b9;
	padding: 4px 6px;
	width: 180px;
}
ul#nav >li ul.flyout li a {
	text-transform: none;
	color: #fff;
	text-decoration: none;
}
ul#nav >li ul.flyout li a:hover {
	color: #bbdbfa;
}

ul#topNav {
	position: absolute;
	margin-top: -68px;
	margin-left: 692px;
	
}
ul#topNav li {
	float: left;
	margin-right: 11px;
}

h2 {
	font-size: 160%;
	width: 360px;
	margin-top: 23px;
}

th, td {
	font-size: 90%;
}

a {
	color: #00447c;
}
a:hover {
	color: #5988af;
}

a img {
	border: 0;
}
img {
	display: block;
}

form div {
	margin: 12px 0;
}
form div.inline, div.form div.inline {
	float: left;
	margin-right: 8px;
	margin-top: 0;
}
form label {
	display: block;
	font-size: 95%;
}
form div.checkbox label, form div.radio label {
	display: inline;
}
form div.error-message {
	color: #800;
	font-size: 85%;
	margin: 2px 0 0;
}

form #goals {
	margin: 0;
}


div.error-message a {
	color: #c00;
}
input.error {
	border: 1px solid #c00000;
	margin: 1px;
}
label.error {
	color: #c00000;
}

ul.spaced li {
	margin-bottom: 14px;
}

#blog-container {
	
}

#blog-content {
	float: left;
}

/* TREDS: result messages after a save or action. Green when it worked, light red when it did not. */
p.message {
	padding: 8px 12px;
	margin: 12px 0;
	border: 1px solid #f1a7a7;
	border-radius: 3px;
	background-color: #fde2e2;
	color: #8a1f1f;
	font-weight: bold;
}
p.message.success {
	border-color: #8cc96b;
	background-color: #e6f9d3;
	color: #1e5e1e;
}

/* TREDS: dashboard notifications (Office Dashboard -> Notifications). The text is pasted into
   the editor with its own sizes (10pt to 27px); show it all at one readable size. Bold,
   colour and line breaks are kept. */
.notification, .notification * {
	font-size: 12px !important;
	line-height: 1.5 !important;
}

/* TREDS: the parent portal's page background, a pale green from the leaf in the parent banner's
   logo, so it reads differently from the employee portal. */
body.parent-portal {
	background-color: #f1f7e6;
}
