/* change this file to rebrand your version of Xerte Online Toolkits */

body {
	font-family:	Arial, sans-serif;
}

#x_mainHolder {
	border:		1px solid #010101;
}

#x_headerBlock {
	color:			#FFFFFF;
	background:		#010101; /* for non-css3 browsers */
	filter:			progid:DXImageTransform.Microsoft.gradient(startColorstr="#010101", endColorstr="#010101"); /* for IE */
	background:		-webkit-gradient(linear, left top, left bottom, from(#010101), to(#010101)); /* for webkit browsers */
	background:		-moz-linear-gradient(top,  #010101,  #434343); /* for firefox 3.6+ */
	background-image:	-o-linear-gradient(#010101, #434343); /* for Opera */
}

#x_footerBlock {
	font-size:		1em;
	color:			#FFFFFF;
	background:		#010101; /* for non-css3 browsers */
	filter:			progid:DXImageTransform.Microsoft.gradient(startColorstr="#010101", endColorstr="#010101"); /* for IE */
	background:		-webkit-gradient(linear, left top, left bottom, from(#010101), to(#010101)); /* for webkit browsers */
	background:		-moz-linear-gradient(top,  #010101,  #010101); /* for firefox 3.6+ */
	background-image:	-o-linear-gradient(#010101, #010101); /* for Opera */
}

#x_footerBg {
	background-image: none;
}

#x_pageNo {
	background:	#010101;
}

h1 {
	font-size:	1em;
	margin:		0px;
}

h2 {
	font-size:	1.2em;
	margin:		5px 0px 0px;
}

h3 {
	font-size:	1em;
	margin:		0px;
}

/* see pngs in modules/xerte/parent_templates/Nottingham/common_html5 to see how replacement images for buttons should be made (with 4 states in one image file) */
/* the easiest way is to keep button dimensions the same (42 x 40px) so background-positions below don't need adjusting */

.ui-button .ui-icon.x_help {					background-image: url("help.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_help {		background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_help {		background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_help {	background-position: -84px 0px; }

.ui-button .ui-icon.x_info {					background-image: url("info.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_info {		background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_info {		background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_info {	background-position: -84px 0px; }

.ui-button .ui-icon.x_home {					background-image: url("home.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_home {		background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_home {		background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_home {	background-position: -84px 0px; }

.ui-button .ui-icon.x_glossary {				background-image: url("glossary.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_glossary {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_glossary {	background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_glossary {background-position: -84px 0px; }

.ui-button .ui-icon.x_maximise {				background-image: url("maximise.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_maximise {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_maximise {	background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_maximise {background-position: -84px 0px; }

.ui-button .ui-icon.x_minimise {				background-image: url("minimise.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_minimise {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_minimise {	background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_minimise {background-position: -84px 0px; }

.ui-button .ui-icon.x_media {					background-image: url("media.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_media {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_media {	background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_media {	background-position: -84px 0px; }

.ui-button .ui-icon.x_next {					background-image: url("next.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_next {		background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_next {		background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_next {	background-position: -84px 0px; }

.ui-button .ui-icon.x_prev {					background-image: url("previous.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_prev {		background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_prev {		background-position: -42px 0px; }
.ui-button.ui-state-active .ui-icon.x_prev {	background-position: -84px 0px; }

.ui-button .ui-icon.x_prev_hist {					background-image: url("previous_hist.png"); background-position: 0px 0px; }
.ui-button.ui-state-hover .ui-icon.x_prev_hist {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_prev_hist {	background-position: -42px 0px; }

.ui-button .ui-icon.x_colourChanger { background-image: url("colour_changer.png"); background-position: 0px 0px;}
.ui-button.ui-state-hover .ui-icon.x_colourChanger {	background-position: -42px 0px; }
.ui-button.ui-state-focus .ui-icon.x_colourChanger {	background-position: -42px 0px; }


.ui-dialog .ui-widget-header {
border: 1px solid #010101;
background: #010101 url(ui-bg_highlight-soft_75_2d2a2a_1x100.png) 50% 50% repeat-x;
color: #ffffff;
font-weight: bold;
}
.ui-button.ui-state-active .ui-icon.x_prev_hist {	background-position: -84px 0px; }