p {
	padding:0.5em;
}

#setContainer {
	width:768px;
	margin:0 auto;
	text-align:left;
}

#set1, #set2, #set3 {
	width:245px;
	float:left;
	margin-left:8px;
}


/* 
	I very rarely advocate using !important, but given the above margins are set
	via an ID for when .js is off, this is the simplest answer.
*/
.s_control {
	padding:0 !important;
	display:visible !important;
}

.s_control a {
	display:block;
	height:12px;
	position:relative;
	text-decoration:none;
}

.sc_shrunk a span {
	background-position:0 0;
}

.sc_shrinking a span {
	background-position:-12px -16px;
}

.sc_expanding a span {
	background-position:-12px 0;
}

.sc_shrinking{
background-image:url(../img/leer-mas.gif);
	background-repeat:no-repeat;
}
.sc_expanding {
	background-image:url(../img/leer-menos.gif);
	background-repeat:no-repeat;
}

.s_content {
	overflow:hidden;
	margin-bottom:8px;
}

.s_content.s_shrunk {
	border-bottom:0;
}

#textContentWrap {
	margin:0 auto;
	min-width:768px;
	max-width:996px;
	text-align:left;
	padding-bottom:42px; /* make room for footer */
}

* html #textContentWrap {
	width:768px; /* if scripting is off, fix the width to 800 friendly */
	width:expression(
		(document.body.clientWidth>996) ? "996px" 
			: ((document.body.clientWidth>766) ? "auto" : "768px")
	);
}