0byt3m1n1

Path: /data/applications/aps/tikiwiki/7.0-0/standard/htdocs/styles/lite/ [ Home ]
File: lite.css
/**
 * *lite CSS - "like a KISS ? - lite is that easy !"
 *
 * this is the ultimate source ordered tableless floating full-width or fixed-width fluid 2-1-3 and crossbrowser compatible 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 directive
 * and the definitions can be overriden to suit your needs on the following lines there... for more info see the project page: http://sf.net/projects/litecss
 * 
 * @author: luciash d' being <luci (at) tiki (.) org>
 * @license: LGPL
 *
 * enjoy ! -- luci
 */
 
body {
	display: table;/* display: table is mandatory for the top block element (doesn't have to be body; can be re-set to any other child wrapper)
			to handle occassional main content which become too wide such as bigger images, long links or tables. thanks to this property
			the layout will behave nicely as it would in a table while keeping the document semanticaly clean. it means the content will
			expand to the right and at the same time it will not overflow the last column but rather gently push it further aside */
	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;/* change this in your stylesheet when you change the width of #col2 */
	padding-left: 180px;/* and this too */
	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;/* also change this in your stylesheet 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}