/**
 * *lite CSS - "like a KISS ? - lite is that easy !"
 *
 * this is an ultimate source ordered tableless layout solution ;)
 * the lite.css file is the base style which should remain untouched. it is meant to be imported at the top of your own stylesheet using @import
 * and the definitions can be overriden to suit your needs on the next lines there... for more info see the project page: http://sf.net/projects/litecss
 * 
 * @author: luciash d' being aka Lukáš 'luci' Mašek <luci2008 at ground dot cz>
 * @license: LGPL
 *
 * enjoy ! -- luci
 */

body {
	display: table;/* keep "display: table" here to push the right column to the right when some unwrappable stuff appears in the center column */
	font-family: sans-serif;
	font-size: 80%;/* the body font-size must be in percents to scale the fonts in IE properly */
	margin: 0; padding: 0;
	width: 100%;/* this is needed to keep the width to the maximum available */
}
html>body {
	font-size: 0.75em;/* redefine the body font-size for all modern browsers - ignored by old IEs */
}
/* and this is a special workaround for IE 7 */
*:first-child+html
body {
	font-size: 80%;
}

/* *** THE MAIN LAYOUT *** */
#header {
	height: auto;
	width: 100%;
}

#c1c2 {
	display: block;/* keep "display: block" here to prevent layout breakage (mostly in Firefox) */
	float: left;/* from IE 5.5 to IE 7 it works only when it is floated this way */
	width: 100%;
}
/* here we redefine the float for standards compliant browsers */
#c1c2[id] {
	float: right;
}
/* and this is a special workaround for IE 7 again */
*:first-child+html
#c1c2 {
	float: left;/* for IE 7 it must be redefined back to left */
	margin-left: -180px;
	padding-left: 180px;
	width: auto;
}

#c1c2
    #wrapper {
		float: right;
		width: 100%;
		min-width: 100%;/* this is especially needed by IE 7 */
	}

#c1c2
	#wrapper
		#col1 {}

#c1c2
	#wrapper
		.marginleft {
			margin-left: 180px;/* change this in your stylesheet too when you change the width of #col2 */
		}

#c1c2
	#wrapper
		.marginright {
			margin-right: 180px;/* change this in your stylesheet too when you change the width of #col3 */
		}

#c1c2
	#wrapper
		#col1> .content {
				width: auto !important;
				width /**/:100%;/* workaround for IE 5.x:
				tables set to 100% width need parent element width of 100% as well*/
	    	}

#c1c2
	#col2 {
		float: right;/* from IE 5.5 to IE 6 it works only when it is floated this way */
		margin-right: -100%;/* this way we set the position of the second column (appears visually as first column) in all browsers */
		overflow: hidden;/* prevent overflowing of the content out of the column */
		width: 180px;
	}

/* here we redefine the float for standards compliant browsers and IE 7 */
#c1c2[id]
	#col2 {
		float: left;/* this time IE 7 differs from its predecessors */
	}

/* another workaround for IE 7 */
*:first-child+html
#c1c2[id]
	#col2 {
		margin-left: 0;
	}

#col3 {
	float: left;/* for all versions of IE from 5.5 to 7 it works only when it is floated this way again */
	margin-left: -180px;/* once more a speciality for IE to display the 3rd column; change this if you change the width too */
	overflow: hidden;/* prevent overflowing of the content out of the column */
	width: 180px;
}

/* ... and this way we display the third column in all other good browsers than MSIE */
html>/*leave this comment here - it acts as an universal anti-IE hack !*/body
#col3[id] {
	float: right;
	margin-right: -100%;
}

/* next comes footer */
#footer {clear: both; width: 100%;}
.footerbgtrap {background-color: transparent;}/* this is needed as a little workaround because MSIE tends to display the footer partly without the background specified */

/*div {border-width: 1px; border-style: solid; padding: 10px; margin: 5px}*/ /* <- if you want to debug with outlines, put this at the bottom of your stylesheet  */

/* some common html elements default styling */
h1 {font-size: 2.4em}
h2 {font-size: 2.1em}
h3 {font-size: 1.8em}
h4 {font-size: 1.5em}
h5 {font-size: 1.2em}
h6 {font-size: 0.9em}
