/*----------------------------------------------------------------------------
Style Sheet for all layout styles

Template Name:   JJ Vooloo
Version:         1.0
Author:          JoomlaJunkie
Support:         hhttp://forum.joomlajunkie.com
Template Guide:  hhttp://guides.joomlajunkie.com

Stylesheet Index:
	$1 - Info
	$2 - Structural CSS
	
NOTE: Always make a backup of your stylesheets before editing!
NB!! Use the search function to find a section, eg: search for $2 for Sidebar menu
----------------------------------------------------------------------------*/
/* $1 - Info
----------------------------------------------------------------------------*/

/*This calls the other css files!!*/
@import url("customise.css");

/***This css file is usually used by Joomla,
however we structure our templates a little
differently for optimized use, we have seperated
out the structural css with the colors etc:
This css file must not be edited unless you want
to change the structure of the template


**For STRUCTURAL CSS, please edit this layout! 
(this contains the dimensions and main page
layout, only to be edited if you want to change
the page structure)

**For all graphical elements, typography, colors,
fonts and main joomla styles, edit the customise.css
and or color.css (could be yellow.css if using 
multiple themes)
***/

/*TIP
**Use the (editor_css.css) css document to add 
styles that will be used in the backend editor when
adding or editing content, this will help you maintain
a consistent look and feel throughout your website 
for more information, please email info@joomlajunkie.com
or read the readme file that came with your template*/

/* $2 - Structural CSS
----------------------------------------------------------------------------*/
body {
	background: #f5f4e9 url(../images/body-bg.jpg) repeat-x;
	margin: 0;
}

.syndicate {
	position: absolute;
	bottom: 11px;
	right: 20px;
}

#wrapper {
	width: 780px;
	margin: 0 auto;
}

#top {
	width: 780px;
	height: 127px;
	background: url(../images/header-bg.jpg) no-repeat left top;
    position: relative;
}


#top h1 a {
	background:url(../images/logo-branding.gif) no-repeat;
	position: absolute;
	left: 30px;
	top: 23px;
	width: 203px;
	height: 47px;
	margin: 0;
	padding: 0;
	color: #79B30B;
	text-indent: -7887px;
	z-index: 100;
}

#top h1 {
	margin: 0;
	padding: 0;
}

#top-seperator {
	width: 780px;
	height: 13px;
	background: url(../images/top-seperator.gif) no-repeat left top;
	overflow:hidden;
}

#header {
	background: url(../images/header-img.jpg) no-repeat left top;
	height: 280px;
	width: 780px;
}

#contentwrap {
	width: 780px;
	background: url(../images/faux-bg.gif) repeat-y;
	overflow:hidden;
	position: relative;
}

#left {
	float: left;
	width: 525px;
	margin-left: 15px;
	display:inline;
	}

#right {
    float: left;
	width: 225px;
	margin-right: 15px;
}

.padding {
	padding: 0px 10px 10px 10px;
}

#footer {
	background: url(../images/footer-bg.jpg) no-repeat left top;
	height: 47px;
	width: 780px;
}
#sidebar-footer {
	height: 36px;
	margin: 0;
	border-bottom: 5px solid white;
	background-color: #E6E4D9;
	background-image: url(../images/validation-bg.gif);
	background-repeat: repeat-x;
}

a.validcss {
	background: url(../images/button-validation-css.gif) no-repeat left top;
	display: block;
	height: 18px;
	width: 85px;
	float: left;
	margin-left: 10px;
	margin-top: 10px;
	text-indent: -7887px;
}

a.validhtml {
	background: url(../images/button-validation-w3c.gif) no-repeat left top;
	display: block;
	height: 18px;
	width: 85px;
	float: right;
	margin-right: 10px;
	margin-top: 10px;
	text-indent: -7887px;
}