@charset "utf-8";

/**
 * - Framework Base LITE 0.1 FBSE X-HTML/CSS Bitban Technologies -
 *
 * {-----------------[ FOUNDATION ]--------------------}
 *
 * @projectname		LA VOZ DE ASTURIAS
 * @style			lva
 * @file			lva.css
 * @fileorder		2
 * @ancestor		reset
 * @media			screen
 * @pseudoNamespace	w3 (w3 -> www, wich is output alias)
 * @dependencies	reset (yui preferable and namespaced)
 * @type			core foundation (structural, behavioural, layouting and presets)
 * 
 */



/**
 * BASIS -->
 */

	html {}
	body.w3 {}


/**
 * DOCUMENT MODEL -->
 *
 * @section		all
 * @htmlsection	body
 * @type		structural / pre-theme
 * @scheme
 *				rules and conventions
 * +-----------------------------------+
 * | {{body}}                          |
 * | +-------------------------------+ |
 * | | #doc                          | |
 * | +-------------------------------+ |
 * +-----------------------------------+
 */

	#document {
		background:#eee;
		font-family:Arial, Helvetica, sans-serif;
	}


/**
 * LAYOUT / REGIONS -->
 *
 * @type		layout / structural
 * @names		reserved
 *
 * +---------------------------------------+
 * | .doc                                  |
 * | +-----------------------------------+ |
 * | | #layout                           | |
 * | | +-------------------------------+ | |
 * | | | #ad (advertisements)          | | |
 * | | +-------------------------------+ | |
 * | | | #hd (header)                  | | |
 * | | +-------------------------------+ | |
 * | | | #bd (body)                    | | |
 * | | +-------------------------------+ | |
 * | | | #ft (footer)                  | | |
 * | | +-------------------------------+ | |
 * | +-----------------------------------+ |
 * +---------------------------------------+
 */

	/* [#layout] -> */
	#layout {
		width:1002px; margin:0 auto; padding:10px 0 0 0; text-align:left;
		background:#fff;
		/* cursor:default; */ /* <- avoid cursor changes in background advertisings */
		position:relative; /* needed for stiky ad (maybe problematic) */
	}
	@media screen {
		#layout:after {content:"0419-FBSE Framework Base"; font-size:8px; color:#fbfbfb; text-align:right; display:block;}
	}
	#layout.print {width:508px;}

	/* Regions -> */
	#ad, #hd, #bd, #ft {/*width:100%;*/}

	#ad {margin-bottom:8px;}
	#hd {/*position:relative; <- issues with ie6-7 z-index stack */}
	#bd {padding-top:8px;}
	#ft {}


/**
 * GRIDS AND NESTED GRID CONSTRUCTORS -->
 * 
 * @type		contructors / behaviours
 * @names		reserved
 */

	/* [.grid] / [.tpt] - model types */
	.gd,
	.ngd {clear:both;}
	.gd .gdu,
	.ngd .ngdu {float:left; display:inline;}
	.gd .gdu,
	.ngd .ngdu {
	   /* avoid horizontal collapse when grids are empty */
		min-height:1em; height:0.10em; height:auto !important;
	}
	.gd .u-last {float:right;}


/**
 * GRID MODELS -->
 *
 * @section		any
 * @region		body
 * @type		structural
 * @scheme
 *				rules and conventions
 * +------------------------------------+
 * | #layout                            |
 * | +--------------------------------+ |
 * | | #bd (body)                     | |
 * | | +----------------------------+ | |
 * | | | .gd[n] = grid model        | | |
 * | | | +------------------------+ | | |
 * | | | | .gdu[.u-x] = grid unit | | | |
 * | | | +------------------------+ | | |
 * | | +----------------------------+ | |
 * | +--------------------------------+ |
 * +------------------------------------+
 * 
 * @notes   - Margins are percentual and substracted from sizes
 *          - Largest values sometimes are in relation with middle/s value/s
 *          - Percentages are cross-browser adapted due to rounded
 *            issues and wrong parse in IE, Opera and Chrome. FF rocks! well, as usual.
 */

	/* [.gd1] - Grid Model 1 (100%) */
	.gd1 {width:auto;}

	/* [.gd2] - Grid Model 2 ( 3/6 - 1/6 - 2/6 or 49.98%, 16.66%, 33.33% ) */
	/*          crossbrowser and margins final sizes: 15% + 2%, 49% + 2%, 32% */

	.gd2 .gdu {width:15%; margin:0 2% 0 0;}		/* 16.66 -> becomes 15 + 2(m) */
												/* well, it must be 14.97% (TODO: try to solve) */
	.gd2 .gdu.u-first {width:49%;}				/* 50    -> becomes 49 + 2(m) */
	.gd2 .gdu.u-last {width:32%; margin:0;}		/* 33.33 -> becomes 32 wo m   */


	/* [.gd3] - Grid Model 3 ( 4/6 - 2/6 or 66.66%, 33.33% ) */
	.gd3 .gdu {width:66%; margin:0 2% 0 0;}		/* 66.66 -> becomes 66 + 2(m) */
	.gd3 .gdu.u-last {width:32%; margin:0;}		/* 33.33 -> becomes 32 wo margin */


	/* [.gd4] - Grid Model 4 ( 1/6 * 6 or 16.66% * 6 ) */
	.gd4 .gdu {width:15%; margin:0 2% 0 0;}		/* 16.66 -> becomes 15 + 2(m) */
	.gd4 .gdu.u-last {margin:0;}				/* last wo margin */



/**
 * NESTED GRID MODELS -->
 *
 * @section		any
 * @region		body
 * @type		structural
 * @notes		MUTEX type definitions used for deeper nesting.
 * 				If IE6 drops from compatibility requirements use direct child (>) instead MUTEX.
 * @scheme
 * 				rules and conventions
 * +-----------------------------------------------------+
 * | #layout                                             |
 * | +-------------------------------------------------+ |
 * | | #bd (body)                                      | |
 * | | +---------------------------------------------+ | |
 * | | | .gd[n] = grid model                         | | |
 * | | | +-----------------------------------------+ | | |
 * | | | | .gdu[.u-x] = grid unit                  | | | |
 * | | | | +-------------------------------------+ | | | |
 * | | | | | .ngd[n] = nested grid model         | | | | |
 * | | | | | +---------------------------------+ | | | | |
 * | | | | | | .ngdu[.u-x] = nested grid unit  | | | | | |
 * | | | | | +---------------------------------+ | | | | |
 * | | | | +-------------------------------------+ | | | |
 * | | | +-----------------------------------------+ | | |
 * | | +---------------------------------------------+ | |
 * | +-------------------------------------------------+ |
 * +-----------------------------------------------------+
 */

	/* [.ngd1] - Nested Grid Model 1 (100%) */
	.ngd1 {width:auto;}

	/* [.ngd2] - Nested Grid Model 2 (1/2 - 1/2) */
	.ngd2  .ngdu,
	.ngd3  .ngdu .ngd2 .ngdu,
	.ngd4  .ngdu .ngd2 .ngdu,
	.ngd4i .ngdu .ngd2 .ngdu {width:47.5%;}	/* 50 -> becomes 47.5 wo m (gap acts as margin instead) */

	/* [.ngd3] - Nested Grid Model 3 (3/4 - 1/4) from its parent */
	.ngd3  .ngdu,
	.ngd2  .ngdu .ngd3 .ngdu,
	.ngd4  .ngdu .ngd3 .ngdu,
	.ngd4i .ngdu .ngd3 .ngdu {width:74.25%;}	/* nn -> becomes nn wo m (gap acts as margin instead) */
	.ngd3  .ngdu.u-last,
	.ngd2  .ngdu .ngd3 .ngdu.u-last,
	.ngd4  .ngdu .ngd3 .ngdu.u-last,
	.ngd4i .ngdu .ngd3 .ngdu.u-last {width:22.73%;}	/* 25 -> becomes 22.73 wo m (gap acts as margin instead) */
													/* well, it must be 22.65% (TODO: try to solve) */

	/* [.ngd4] - Nested Grid Model 4 (2/3 - 1/3) from its parent */
	.ngd4  .ngdu,
	.ngd2  .ngdu .ngd4 .ngdu,
	.ngd3  .ngdu .ngd4 .ngdu,
	.ngd4i .ngdu .ngd4 .ngdu {width:65%;}
	.ngd4  .ngdu.u-last,
	.ngd2  .ngdu .ngd4 .ngdu.u-last,
	.ngd3  .ngdu .ngd4 .ngdu.u-last,
	.ngd4i .ngdu .ngd4 .ngdu.u-last {width:32%;}


	/* [.ngd4] - Nested Grid Model 4 (2/3 - 1/3) from its parent */
	.ngd4i .ngdu,
	.ngd2  .ngdu .ngd4i .ngdu,
	.ngd3  .ngdu .ngd4i .ngdu,
	.ngd4  .ngdu .ngd4i .ngdu {width:32%;}
	.ngd4i .ngdu.u-last,
	.ngd2  .ngdu .ngd4i .ngdu.u-last,
	.ngd3  .ngdu .ngd4i .ngdu.u-last,
	.ngd4  .ngdu .ngd4i .ngdu.u-last {width:65%;}



/**
 * GRIDS / NESTED GRIDS SKINS -->
 *
 * @type			skins - aspect
 * @dependencies	grid models
 * @apply			grid models
 *
 */

	.skin-gd2 {
		margin-bottom:18px;
		background:url(../images/bg_fcol_dotted1-y_gd2.gif) repeat-y 60.2% 0; /* 485 px */
	}
	.skin-gd3 {
		margin-bottom:18px;
		background:url(../images/bg_fcol_dotted1-y.gif) repeat-y 67% 0;
	}
	.skin-gd4 {
		margin-bottom:18px;
		background:url(../images/bg_fcol_dotted1-y_gd4.gif) repeat-y 0 0;
	}
	.skin-ngd2 {
		/* margin-bottom:30px; */
		background:url(../images/bg_fcol_dotted1-y.gif) repeat-y 50% 0;
	}
	.skin-ngd3 {
		/* margin-bottom:30px; */
		background:url(../images/bg_fcol_dotted1-y.gif) repeat-y 75.8% 0;
		background-position:76% 0;
	}
	.skin-ngd4 {
		/* margin-bottom:30px; */
		background:url(../images/bg_fcol_dotted1-y.gif) repeat-y 66.5% 0;
	}
	.skin-ngd4i {
		/* margin-bottom:30px; */
		background:url(../images/bg_fcol_dotted1-y.gif) repeat-y 33.5% 0;
	}


/**
 * MODULE CONSTRUCTOR (CLASS) -->
 *
 * @type		constructor
 *
 */

	/* [.mod] - module basis and parts */
	.md {
		/*position:relative;*/ /* <-- relative need for opera bug (disappearing content when scroll down) only when is placed outside any grid or template, interferes with z-index on layers in ie6 */
		margin-bottom:10px; padding:0 0 1px 0; /* FF padding bug */
	}
	.md .hd {clear:both; line-height:100%;}
	.md .bd {}
	.md .ft {}

	/* [hn] - module header "Hn headings" */
	.md .hd .title {font-size:18px; font-weight:bold; text-transform:lowercase;}
	.md .hd .title a {text-decoration:none;}

	/* [.subtitle] - body subtitles */
	.md .bd .subtit {}

	/* [.mg] - image */
	.md .mg {}

	/* [.mt] / [.mtflow] - text zone */
	.md .mt {display:block; overflow:hidden; zoom:1;}
	.md .mtflow {display:block;}

	/* [.more] - further info link */
	.md .hd .more {padding:2px 0 0; text-align:right;}
	.md .ft .more {text-align:right;}
	.md .hd .more:before {content:" ";}
	.md .hd .more a,
	.md .ft .more a {font-size:13px; font-weight:bold; text-decoration:underline; vertical-align:text-bottom;}

	/* module skins and types -> */

	/* skins */
	/* @comment: "designers are the worse". Designers, please!, consolidate design to avoid lines, and lines of code */
	.md.skin-md1 {
		padding-top:12px;
		background:url(../images/bg_md_skin-m1_sep-t_checkerboard.gif) repeat-x top;
	}
	.md.skin-md1 .hd {padding:2px 0 5px;}
	.md.skin-md1 .hd .title {color:#a9b6a9;}

	.md.skin-md2 {
		padding-top:8px;
		border-top:1px dotted #787878;
	}

	/* skin md3 and "neverending" variants to paint the micropixel same (designers sucks as usual) */
	.md.skin-md3 {
		padding-top:12px;
		background:url(../images/bg_md_skin-m3_sep-t_checkerboard.gif) repeat-x top;
	}
	.md.skin-md3 .hd {padding:2px 0 5px;}
	.md.skin-md3 .hd .title {color:#02a6d6;}
	.md.skin-md3 .hd .title a {color:#02a6d6;}
	.md.skin-md3 .hd .title a:hover {color:#04617b;}

	/* b */
	.md.skin-md3b {border-top:1px solid #a9b6a9;}
	.md.skin-md3b .hd {padding:12px 0 5px;}
	.md.skin-md3b .hd .title {color:#02a6d6;}
	.md.skin-md3b .hd .title a {color:#02a6d6;}
	.md.skin-md3b .hd .title a:hover {color:#04617b;}

	/* i (inverse) */
	.md.skin-md3i {
		padding-top:12px;
		background:url(../images/bg_md_skin-m1_sep-t_checkerboard.gif) repeat-x top;
	}
	.md.skin-md3i .hd {padding:2px 0 5px;}
	.md.skin-md3i .hd .title {color:#02a6d6;}
	.md.skin-md3i .hd .title a {color:#02a6d6;}
	.md.skin-md3i .hd .title a:hover {color:#04617b;}


	/* types */
	.md.type-md3 .hd {margin:0 0 6px 0;}


/**
 * PRESET CLASSES AND BEHAVIOURS -->
 *
 * @type		presets / behaviours
 * @names		reserved
 */

	/* float and clear presets */
	.fr {float:right; display:inline;}
	.fl {float:left; display:inline;}
	.cl {clear:left;}
	.cr {clear:right;}
	.clr {clear:both;}
	.clf {clear:both; height:0; font-size:1px; line-height:0px;}

	/* inline block display rule */
	.blk {display:block;}
	.iblk {display:-moz-inline-stack; display:inline-block; zoom:1; *display:inline;}

	/* [.noflow] - noflow block preset */
	.noflow {display:block; overflow:hidden; zoom:1;}

	/* [.fullheight] - full height columns method (be careful my friend) */
	.fullheight {overflow:hidden;}
	.fullheight .fcol {margin-bottom:-100%; padding-bottom:100%; zoom:1;}

	/* visibility rules */
	.nodisp {display:none;}
	.stealth {visibility:hidden;}

	/* alignment rules (text) */
	.t-ct {text-align:center;}
	.t-rt {text-align:right;}
	.t-lt {text-align:left;}

	/* [.lnk] */
	.lnk {cursor:pointer;}

	/* font size presets */
	.fnt1 {font-size:10px;}
	.fnt2 {font-size:11px;}
	.fnt3 {font-size:13px;}
	.fnt4 {font-size:14px;}
	.fnt5 {font-size:16px;}
	.fnt6 {font-size:18px;}
	.fnt7 {font-size:20px;}
	.fnt8 {font-size:22px;}
	.fnt9 {font-size:24px;}
	.fnt10 {font-size:26px;}

	/* round borders */
	.rnd-1 {
		-moz-border-radius:2px; -khtml-border-radius:2px; -ms-border-radius:2px; -webkit-border-radius:2px;
		border-radius:2px;
	}

/**
 * ADJUST RULES -->
 *
 * @type		adjustment rules
 *
 */

	/* [.hspace] - horizontal interspace */
	.hspace {margin:0 16px;}

	/* [.vspace] - vertical interspace */
	.vspace {margin:0 16px;}

	/* [.tspace] - top space */
	.tspace {margin-top:3px;}

	/* [.bspace] - bottom space */
	.bspace2 {margin-bottom:5px;}
	.bspace8 {margin-bottom:20px;}

	/* [.append[n]] - Right margin appends */
	.append0 {margin-right:3px;}
	.append1 {margin-right:4px;}
	.append2 {margin-right:5px;}
	.append3 {margin-right:7px;}
	.append4 {margin-right:9px;}
	.append5 {margin-right:9px;}
	.append6 {margin-right:12px;}
	.append7 {margin-right:15px;}
	.append8 {margin-right:20px;}
	.append9 {margin-right:25px;}

	/* [.prepend[n]] - Left margin prepends */
	.prepend1 {margin-left:4px;}
	.prepend2 {margin-left:5px;}
	.prepend3 {margin-left:7px;}
	.prepend4 {margin-left:9px;}
	.prepend5 {margin-left:10px;}
	.prepend6 {margin-left:12px;}
	.prepend7 {margin-left:15px;}
	.prepend8 {margin-left:20px;}
	.prepend9 {margin-left:25px;}


/**
 * CLEARING -->
 *
 * @type		behaviour
 */

	/* SELF CLEARING (yui method) */

	#ad:after, #hd:after, #bd:after, #ft:after,
	.gd:after, .ngd:after,
	.md:after, .md .hd:after, .md .bd:after, .md .ft:after,
	.item:after {clear:both; display:block; height:0; content:" "; font-size:0; visibility:hidden;}

	#ad, #hd, #bd, #ft,
	.gd, .ngd,
	.md, .md .hd, .md .bd, .md .ft,
	.item {zoom:1;}

	/* [.cf] - standard clearfix (enhanced method) */
	.cf:after {clear:both; display:block; height:0; content:" "; font-size:0; visibility:hidden;}
	.cf {display:inline-block;}
	/* start commented backslash hack \*/
	* html .cf {height:1%;}
	.cf {display:block;}
	/* close commented backslash hack */


/**
 * HACKS / WORKAROUNDS
 *
 * @type		hacks / workarounds
 * @count		2
 * @target		any non IE browser (IE hacks in separate sheet)
 * 
 */

	/* Opera */
	@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0)
	{
		head~body #opera { display:block; }
		/* @ref: [.ngd3] - Nested Grid Model 3 (3/4 - 1/4) */
		.ngd3 .ngdu.u-last,
		.ngd2 .ngdu .ngd3 .ngdu.u-last,
		.ngd4 .ngdu .ngd3 .ngdu.u-last {width:23%;}
	}

	/* Safari */
	@media screen and (-webkit-min-device-pixel-ratio:0)
	{
		#safari { display:block; }
	}


	/* HACKs Count: 3 */
	/* total:3 */



/**
 * DEBUG / COMMENTING -->
 *
 * @region		any
 * @type		debug / informative
 * 
 */

 	.TODOmsg {font-size:11px; color:#ccc; margin:0 0 2px 0; padding:2px;}