body {
	background-color: #2d2f35;
	margin: 0;
	text-align: center;
}

body, input, select, textarea {
	font-family: Arial; /* Global default font */
	font-size: 11pt;
}

h1 {
	color: #fff;
	font-size: 14pt;
	padding: 0;
	margin: 0 0 10px 0;
}

h4 {
	color: #fff;
	font-size: 14pt;
	padding: 0;
	margin: 0 0 10px 0;
}

a {
	color: #50bde3;
	text-decoration: none;
}

a:hover {
	color: #666;
}

.container {
	width: 900px;
	margin: 0 auto;
	text-align: left;
}

.banner {
	background-color: #24262a;
	border-bottom: 1px solid #474a51;
}

.banner a.logo {
	background-image: url(images/logo.jpg); /* Logo image */
	width: 222px; /* Note the image dimensions when replacing, if the replacment image is bigger/smaller ammend these as necessary */
	height: 92px;
	display: block;
	float: left;
}

.navigation {
	float: right;
}

.navigation ul, .navigation li {
	margin: 0;
	padding: 0;
}

.navigation li {
	display: inline;
}

.navigation a {
	display: block;
	margin: 0 0 0 30px;
	padding: 15px 0 9px 0;
	float: left;
	color: #fff;
	text-decoration: none;
}

/*
	This creates the blue underline on the navigation links when hovered. You can change the underline thickness and color
	or remove the underline by changing the settings below
*/

.navigation a:hover {
	border-bottom: 2px solid #50bde3;
}

/*
	This creates the blue underline on the navigation links the current page is loaded. You can change the underline thickness and color
	or remove the underline by changing the settings below
*/

.navigation a.selected {
	border-bottom: 2px solid #50bde3;
}

.featured {
	background-color: #24262a;
	border-top: 1px solid #474a51;
	border-bottom: 1px solid #474a51;
	padding: 20px;
	margin: 0px 0 0 0;
}

.featured-container {
	background: url(images/featured.gif); /* The grey/white box containing the featured content */
	width: 870px;
	height: 190px;
	margin: 0 auto;
	text-align: left;
	padding: 15px;
}

.featured-container img {
	float: left;
}

.featured-container .info {
	float: left;
	margin: 0 0 0 15px;
	color: #4f4f4f; /* Color of the text on the featured content area */
	width: 450px; 
	font-size: 10pt;
}

.featured-container .info h1 {
	color: #212121;
	font-size: 22pt;
	padding: 0;
	margin: 10px 0;
}

/*
	The moreinfo button on the featured content area on the homepage. Note the image dimensions and alter appropriately when changing the image.
*/

.featured-container .info a.moreinfo {
	width: 84px;
	height: 28px;
	display: block;
	float: right;
	margin: 5px 0 0 10px;
}

.featured-container .info a.moreinfo a:hover {
	background-image: url(images/moreinfo1.png);
	width: 84px;
	height: 28px;
	display: block;
	float: right;
	margin: 5px 0 0 10px;
}

/*
	As above, with the view line button.
*/

.featured-container .info a.viewlive {
	background-image: url(images/viewlive.jpg);
	width: 84px;
	height: 28px;
	display: block;
	float: right;
	margin: 5px 0 0 10px;
}



.content1 {
	background: url(images/content2.gif) no-repeat; /* The background gradient of the left content area */
	width: 611px;
	margin: 15px 0 0 0;
	float: left;
	padding: 24px 15px 15px 15px;
	color: #4f4f4f;
	font-size: 10pt;
text-align: justify;
}

.content1 p {
	line-height: 20px;
#line-height: 19px;
}

.content ul {
	margin: 0;
	padding: 0;
}

.content1 li {
	list-style-image: url(images/tick.jpg);
	margin: 7px;
	padding: 0;
}



.content_speakers {
	background: url(images/content3.gif) no-repeat; /* The background gradient of the left content area */
	width: 611px;
	margin: 15px 0 0 0;
	float: left;
	padding: 24px 15px 15px 15px;
	color: #4f4f4f;
	font-size: 10pt;
text-align: justify;
}

.content_speakers p {
	line-height: 20px;
#line-height: 19px;
}

.content_speakers ul {
	margin: 0;
	padding: 0;
}

.content_speakers li {
	list-style-image: url(images/tick.jpg);
	margin: 7px;
	padding: 0;
}



.content2 {
	background-image: url(images/sidecontent4.gif); /* The background box of the right content area */
	width: 227px;
	height: 197px;
	float: left;
	margin: 15px 0 0 10px;
	padding: 10px;
	color: #888;
	font-size: 10pt;
	line-height: 20px;
}

.content2 img {
	margin: 0 0 10px 0;
}

.content_photo {
	background-image: url(images/sidecontent2.gif); /* The background box of the right content area */
	width: 227px;
	height: 330px;
	float: left;
	margin: 15px 0 0 10px;
	padding: 10px;
	color: #888;
	font-size: 10pt;
	line-height: 20px;
}

.content_photo img {
	margin: 0 0 10px 0;
}

.content_cases {
	background-image: url(images/sidecontent3.gif); /* The background box of the right content area */
	width: 227px;
	height: 180px;
	float: left;
	margin: 15px 0 0 10px;
	padding: 10px;
	color: #888;
	font-size: 10pt;
	line-height: 20px;
}

.content_cases img {
	margin: 0 0 10px 0;
}

.footer {
	background-color: #24262a;
	border-top: 1px solid #474a51;
	padding: 10px;
	color: #777;
	font-size: 10pt;
	margin: 20px 0 0 0;
}

.work {
	clear: both;
}

.work img {
	float: left;
	border: 5px solid #333;
}

.work .text {
	float: left;
	width: 400px;
	margin: 0 0 0 10px;
}

/*
	Styles for the form on the contact page.
*/

label {
	clear: both;
	float: left;
	width: 100px;
	display:block;
	line-height:30px;
}

input {
	float: left;
	margin: 0 0 20px 0;
	width: 400px;
	border: 2px solid #333;
	padding: 4px;
	font-family: arial;
}

input.button {
	background-image: url(images/send.gif); /* The send button, ammend dimensions appropriately when changing image. */
	width: 84px;
	height: 28px;
	border: 0;
	padding: 0;
	clear: both;
	float: right;
	margin: 20px 100px 0 0;
}

textarea {
	float: left;
	width: 400px;
	height: 200px;
	padding: 4px;
	border: 2px solid #333;
	font-family: arial;
}