/* HTML Tags ----------------------------------- */
body
{
	font-family: Arial;
	font-size: 14px;
}
/* Banner  ----------------------------------- */
#banner
{
	background-image: url('Images/banner.jpg');
	height: 110px;
}

#bannerright 
{
	/*position:absolute;
	right:10px;
	top:5px;
	display:none;*/
}

#bannerbackground
{
	/* If banner background has a plain colour, simply set background-color */
	/* background-color: #00ACC8; */
	/* If banner background has more than one colour or a gradient colour, set background with url to 1px wide backgorund image */
	/* background: url("") repeat-x #00ACC8; */
	background-image: url('Images/banner-background.jpg');
	height: 110px;
}
/* Overall layout -------------------------------------------*/
#topcontainer
{
	width: 100%;
}
/* container surrounding containing three columns below */
#content
{
	width: 100%;
	max-width: 1200px;
}
/* main column with login fields and text below them */
.column2
{
	width: 60%;
	max-width: 450px;
}

@media (min-width: 1200px)
{
	#content /* container surrounding containing three columns below */
	{
		max-width: 1200px;
	}

	.column2 /* main column with login fields and text below them */
	{
		width: 60%;
		max-width: 450px;
	}
}

@media (min-width: 900px) and (max-width: 1200px)
{
	#content /* container surrounding containing three columns below */
	{
		max-width: 1150px;
	}

	.column2 /* main column with login fields and text below them */
	{
		width: 60%;
		max-width: 400px;
	}
}

@media (min-width: 600px) and (max-width: 900px)
{
	#content /* container surrounding containing three columns below */
	{
		max-width: 850px;
	}

	.column2 /* main column with login fields and text below them */
	{
		width: 90%;
		max-width: 400px;
	}
}

@media (max-width: 600px)
{
	#content /* container surrounding containing three columns below */
	{
		max-width: 550px;
	}

	.column2 /* main column with login fields and text below them */
	{
		width: 90%;
		max-width: 400px;
	}
}

/* Headings ----------------------------------- */
h1
{
	color: #042A57;
	font-size: 16pt;
	font-family: Arial;
	font-weight: normal;
}

h2
{
	color: #689BC8;
	font-size: 13pt;
	font-family: Arial;
	font-weight: bold;
}

h3
{
	color: #787474;
	font-size: 12pt;
	font-family: Arial;
	font-weight: bold;
}

/* Form ---------------------------------------------------------------- */
.formFieldName
{
	color: #808080;
	font-size: 16px;
	font-weight: normal;
}

.textbox
{
	color: #808080;
	font-size: 16px;
	border: 1px solid #042A57;
	border-radius: 5px;
}

.checkbox
{
	font-size: 13px;
}

.buttons
{
	-moz-box-shadow: inset 0px 1px 0px 0px #689BC8;
	-webkit-box-shadow: inset 0px 1px 0px 0px #94BCE0;
	box-shadow: inset 0px 1px 0px 0px #94BCE0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #689BC8), color-stop(1, #042A57));
	background: -moz-linear-gradient(top, #689BC8 5%, #042A57 100%);
	background: -webkit-linear-gradient(top, #689BC8 5%, #042A57 100%);
	background: -o-linear-gradient(top, #689BC8 5%, #042A57 100%);
	background: -ms-linear-gradient(top, #689BC8 5%, #042A57 100%);
	background: linear-gradient(to bottom, #689BC8 5%, #042A57 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#689BC8', endColorstr='#042A57',GradientType=0);
	background-color: #689BC8;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border-radius: 6px;
	border: 1px solid #042A57;
	color: #ffffff;
	font-size: 15px;
	text-shadow: 0px 1px 0px #042A57;
}

.buttons:hover
{
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #042A57), color-stop(1, #689BC8));
	background: -moz-linear-gradient(top, #042A57 5%, #689BC8 100%);
	background: -webkit-linear-gradient(top, #042A57 5%, #689BC8 100%);
	background: -o-linear-gradient(top, #042A57 5%, #689BC8 100%);
	background: -ms-linear-gradient(top, #042A57 5%, #689BC8 100%);
	background: linear-gradient(to bottom, #042A57 5%, #689BC8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#042A57', endColorstr='#689BC8',GradientType=0);
	background-color: #042A57;
}

/* Expanding block if needed -------------------------------------------- */
.rogerwide
{
	background-color: #DDF2F7;
}

.expandicon 
{
	vertical-align: text-bottom;
	margin: 0px 1px -1px 1px;
}