/************************** Site-wide Reset Styles ***************************/
/*                     Do not change any of these styles                     */

html,body,p,ul,ol,li,a,h1,h2,h3,h4,h5,h6,table,tbody,tfoot,thead,th,form{margin:0;padding:0;border:0;outline:0;}

/* The clear class is used to correct the flow of the layout after using a
 * floated element ("float: left" in stylesheets or "align=left" on tables and
 * imgs). Usually, floating an element takes it out of the 'flow' of the
 * document, meaning that any containers or following elements will ignore the
 * size and shape of the floated element, causing ugly overlapping content and
 * missing backgrounds. The clear class forces the containing element to
 * correct its height for its contents even if it's floated. It should be used
 * by specified the clear class on any elements that contain a floated
 * elements that you wish to clear.
 * E.g.,
 * <div class="clear">
 *     <div style="float: left;"> Content </div>
 *     <img src="..." align="right" />
 * </div>
 * This method is preffered over alternate methods (such as
 * <br style="clear:both;" />) as it requires no extra html markup just for
 * styling purposes, and it is also the only known method that works in all
 * cases across all modern browsers. */
.clear:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clear{zoom:1;/*triggers hasLayout in IE*/}

/****************************** General Styles *******************************/

body, table, h1, h2, h3, h4, h5, h6 {
	/* Set this to the desired default website font */
	font-family: Arial, Helvetica, sans-serif;
	/* Set this to the desired default website font size */
	font-size: 15px;
	color: #000000;
	line-height: 1.3em;
}

/* Do not set font-size or font-family on the p tag or  any other general tags
 * other than #Body (see Layout Styles) as this will cause problems when trying
 * to set styles on container elements later on. Site wide font settings should
 * be specified on the body tag, or if you require a different font style
 * somewhere on the site, add the different font styles to a class or id on the
 * containing element. */
p {
	/* !important is required on margin to override a style on the container */
	margin: 10px 0 18px 0;
	line-height: 1.3em;
}

ul {
	margin: 10px 0 18px 30px;
	list-style-type: disc;
}

ul ul {
	margin: 0 0 0 30px;
}

a {
	color: #00568a;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

h1 {
	color: #000000;
	margin: 1em 0 0 0;
	font-size: 35px;
	font-weight: 300;
}

h2 {
	color: #000000;
	margin: 15px 0 0 0;
	font-size: 18px;
	font-weight: bold;
}

/******************************* Layout Styles *******************************/

body {
	text-align: center; /* Centers the website in IE */
	/* Causes long words that are too wide for its container to break mid-word
	 * and wrap onto the next line */
	word-wrap: break-word;
}

.pageCenter {
	/* Centers the website in all browsers except IE and cancels out the
	 * text-align: center specified on #Body */
	margin: 0 auto;
	text-align: left;
	
	/* Total width of the website. This must be specified in order to center
	 * the website. This should NEVER be more than 996px or you will get
	 * scrollbars on 1024x768 resolution screens. If your design measures
	 * wider than this, go and ask your designer about it */
	width: 958px;
}

#bannerWrapper {
	background: url(images/banner_bg.gif) top center repeat-x;
    border-bottom: 28px solid #000000;
	padding-top: 5px;
}

#banner {
	height: 226px;
	position: relative;
}

#banner h1 {
	position: absolute;
	bottom: 0px;
	left: 0px;
	margin: 0;
	padding: 0;
	
	/* Image replacement technique
	 * Use the following to replace the site title with a premade image
	 * This is useful for non-standard fonts, and is the kindest way to
	 * replace the text with an image for search engines, without using
	 * javascript 
	 * The height and width must match that of the image */
	 background: url(images/north-brisbane-truck-spares.png) top left no-repeat;
	 text-indent: -9999px;
	 width: 957px;
	 height: 173px;
}

#address {
	position: absolute;
	top: 0px;
	left: 0px;
	font-size: 18px;
	font-weight: bold;
	color: #ffffff;
}

#nav {
	position: absolute;
	top: 0px;
	right: 0px;
	font-size: 13px;
	font-weight: bold;
	color: #ffffff;
}

#nav a {
	color: #ffffff;
}

#header {
	background: #555555;
	padding: 20px 0;
}

#headerText {
	color: #ffffff;
	font-weight: bold;
	font-size: 17px;
	float: left;
	width: 275px;
	margin-right: 54px;
	padding: 20px 0;
	line-height: 160%;
}

#flashBanner {
	border: 6px solid #2f2f2f;
	padding: 7px;
	background: #ffffff;
	float: left;
}
ul.rslides {
list-style-type: none;
margin: 0;
}

#leftCol {
width:48%;
margin-right:4%;
float:left;
}
#rightCol {
width:48%;
float:left;
}



#page {
	background: url(images/page.jpg) top left repeat-x #ffffff;
}

#contentWrapper {
	padding: 50px 0;
}

#logos p {
	margin: 30px 0;
}

#footer {
	background: #555555;
	padding: 10px 0 20px 0;
}

#footer, #footer a {
	font-size: 18px;
	font-weight: bold;
	color: #ffffff;
}

#basenav {
	margin-top: 45px;
}

#basenav, #basenav a {
	font-size: 13px;
	font-weight: normal;
	line-height: 200%;
}