body {
	background: #C1C1C1;
	background-image: url('images/gradbg-light_blue.png');
	/*background-image: url('images/gradbg-red_white.png');*/
	color: #000000;
	margin: 0;
}
hr {
	color: #000000;
	background-color: #000000;
	height: 0;
	border: 0;
	border-bottom: 1px solid #000000;
}
h1 {
	background-image: url('images/titlebar.jpg'); 
	color: white;
	font-size: 1em;
	font-weight: bold;
	margin: 0px;
	padding: 2px;
	padding-left: 4px;
}
h2 {
	text-align: center;
	font-weight: bold;
	font-size: 1em;
}
a:active { }
a:active:hover { }
a:hover { }
a:visited { }
a:visited:hover { }
img {
	border: 0; /* get rid of border around images */
}

/*Custom classes --------------------------------------------------------------
-----------------------------------------------------------------------------*/

div.body {
	width: 96%;
	height: 100%;
	padding: 0 2% 0 2%;
}
div.left-body-edge {
	background-image: url('images/l.gif');
	background-position: left;
	background-repeat: repeat-y;
	/*background-attachment: fixed;*/
	/* although this affects rendering performance, it is needed otherwise the background is only rendered */
	position: fixed; 
	/* required for the z-index property to work and for */
	z-index: 1; 
	/* make sure this div and its background will stay in front of everything. */
	width: 15px;
	height: 100%;
}
div.right-body-edge {
	background-image: url('images/r.gif');
	background-position: right;
	background-repeat: repeat-y;
	height: 100%;
	position: fixed; 
	right: 0px;
	width: 15px;
	z-index: 1;
	/* 100% shit fica emcima ele bloqueia click */
}
div.header {
	width: 100%;
	height: 100px; /* calibrated: from the height of "logo.jpg" */
	background-color: black; 
	background-image: url('images/back.jpg'); 
	background-repeat: no-repeat; 
	background-position: top right;
	min-width: 784px; /* equal to div.sidecol-layout */
}
div.header div.logo {
	float: left;
}
div.header div.menu {
	float: right;
}
div.footer {
	background-image: url(images/footer_bg.png); 
	height: 32px;
	line-height: 32px; /* centers text vertically */
	text-align: center;
	color: #FFFFFF;
}
div.sidecol-layout {
	width: 100%;
	min-width: 784px; /* calibrated: 468 + 150 + 150 */
	height: 400px; /* required by firefox 2 because something fucks up */
	overflow: hidden; 
	/* required by firefox 2 to hide the "float drop" bug. we have not been able to find
	a solution for it yet. */
	/* border: 2px solid black; */
}
div.sidecol-layout div {
	float: left;
	height: 400px;
	/*border: 1px solid black;*/
}
div.sidecol-layout div.lcol { /* left column */
	min-width: 150px;
	width: 20%;
}
div.sidecol-layout div.lcol ul {
	margin-left: 0;
	padding-left: 1em;
	font-size: 12px; /* that is small enough in all displays */
}
div.sidecol-layout div.mcol { /* middle column */
	clear: right; 
	min-width: 484px; /* calibrated: the width of a banner (468px) plus horizontal padding x 2 */
	/* padding: 0px; */
	/* warning: don't use padding for the columns because it gets calculated on top of the percentage
	values, resulting in the browser rendering it as 101% for example. */
	width: 60%;
	position: relative;
	/*border: 1px solid red;*/
}
div.sidecol-layout div.mcol div.content {
	width: 97%; /* a value slightly less than 100% that approximates the value for "left" */
	text-align: center;
	left: 8px;
	position: relative;
	/* fuck. there is simply no way to add padding or margin here and get this box to stay centered
	inside its container. this happens in ie7 and firefox 2. we have to resort to the "left" property
	for left padding and to a width percentage slightly less than 100% for right padding. */
	/*border: 1px solid black;*/
}
div.sidecol-layout div.rcol {
	clear: right;
	/*margin-left: -16px;*/
	/* required to solve the "float drop" bug in firefox 2 */
	min-width: 150px;
	position: relative;
	width: 20%;
}