/* @override 
	http://albertosanders:8888/css/style.css
	http://www.albertosanders.com/css/style.css
	http://albertosanders.com/css/style.css
*/

/* @group general */

body {
 margin: 0;
 background: url(../gui/fondo.png) no-repeat center top;
 font: .8em "Lucida Grande", Lucida, Verdana, sans-serif;
}

#main_caja {
 width: 920px;
 margin-right: auto;
 margin-left: auto;
 background: url(../gui/contenido.png) no-repeat center top;
}

h1 {
 color: #666;
 font: 260% "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 text-shadow: #999 0 1px 2px;
 position: relative;
 margin-top: 0;
 letter-spacing: -.15ex;
 z-index: 10;
}

h1 a {
 text-decoration: none;
}

h1 span {
 background: url(../gui/gradient.png) repeat-x;
 position: absolute;
 display: block;
 width: 100%;
 height: 30px;
}

h3 {
 font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 margin-bottom: 0;
}

h2 {
 letter-spacing: -.05em;
 color: #666;
 margin: 10px 0;
 text-shadow: #fff 1px 1px 1px;
 font: bold 1.3em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

#contenido {
 width: 820px;
 min-height: 400px;
 margin-left: auto;
 margin-right: auto;
 padding: 10px 40px 0;
 position: relative;
}

.margen_texto {
 margin-left: 30px;
 padding-right: 20px;
 margin-top: 20px;
}

#extensiones_headfoto {
 z-index: 1;
 margin-top: -30px;
}

#pie {
 background: url(../gui/fondo_footer.png) no-repeat center 0;
 width: 919px;
 height: 50px;
}

#col_izq {
 float: left;
 width: 300px;
 margin-right: 20px;
}

#col_der {
 overflow: hidden;
}

ul.redondo li {
 margin-left: -40px;
 list-style-type: none;
 background: url(../gui/right.png) no-repeat;
 padding-left: 20px;
 height: 17px;
 margin-top: 7px;
 padding-top: 1px;
}

ul.mini_lista {
 font-size: 85%;
}

ul.mini_lista li {
 border-top: 1px solid silver;
 list-style-type: none;
 background: url(../gui/mini_icons2/tick.gif) no-repeat 4px 6px;
 margin-left: -40px;
 padding: 3px 5px 4px 20px;
}

a {
 color: #003266;
 text-decoration: none;
}

a:hover {
 color: #316599;
}

a.linksobreoscuro {
 color: #FFFFFF;
 text-decoration: none;
 font-weight: normal;
}

a.linksobreoscuro:hover {
 color: #CCFFFF;
 text-decoration: none
}

a.link {
 background: url(../gui/mini_icons2/home.gif) no-repeat 0 4px;
 padding-left: 15px;
}

.tel {
 background: url(../gui/mini_icons2/mail_back.gif) no-repeat 0 4px;
 padding-left: 15px;
}

.mail {
 background: url(../gui/mini_icons2/mobile.gif) no-repeat 0 4px;
 padding-left: 15px;
}

.debug {
 font-family: sans-serif;
 color: white;
}

/* @end */

/* @group menu top */

#header {
 height: 120px;
 width: 920px;
 margin-left: auto;
 margin-right: auto;
 position: relative;
 font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
 background: url(../gui/fondo_head.png) no-repeat center top;
}

#header ul {
 position: absolute;
 list-style-type: none;
 top: 30px;
}

#header li {
 float: left;
 margin-left: 5px;
 background-image: url(../gui/menu.png);
 height: 20px;
 padding-top: 3px;
 padding-left: 15px;
}

#header a {
 background: url(../gui/menu.png) right 0;
 height: 22px;
 color: #424242;
 padding: 3px 10px 5px 5px;
 margin-left: -8px;
}

#header a:hover {
 color: #000;
}

#header li.menu_inicio {
 background-image: none;
 padding: 0;
 margin-top: 0;
}

#header li.menu_inicio a {
 background-image: none;
 width: 180px;
 display: block;
 margin-right: 30px;
 height: 26px;
}

#header li.menu_elegido {
 background: url(../gui/menu.png) 0 -50px;
 text-shadow: gray 1px 1px 0;
}

#header li.menu_elegido a {
 color: white;
 background: url(../gui/menu.png) right -50px;
 text-decoration: none;
}

/* @end */

/* @group galeria */

.caja_fotitos {
 background-color: #f0f0f2;
 width: 820px;
 -webkit-border-radius: 7px;
 -moz-border-radius: 7px;
 border: 1px solid #ccc;
 border-right-style: none;
 border-bottom-style: none;
 padding-top: 10px;
 padding-left: 10px;
 padding-bottom: 5px;
 position: relative;
}

.tit_prensa {
 color: #333;
 margin-bottom: 10px;
 padding-top: 10px;
 clear: both;
 font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 padding-left: 5px;
 padding-right: 100px;
}

.fotito {
 float: left;
 margin-right: 5px;
 margin-bottom: 5px;
 width: 118px;
 height: 118px;
 background: white url(../gui/loading16.gif) no-repeat 50% 50%;
 padding: 5px;
 border-color: #999;
 border-width: 1px;
 border-bottom-style: solid;
 border-right-style: solid;
}

/* @end */

/*

 @group prensa */

#col_izq_prensa {
 display: inline-block;
 width: 570px;
}

#col_der_prensa {
 width: 220px;
 position: absolute;
 top: 0;
 right: 0;
 border-left: 1px solid #ccc;
 margin-left: 10px;
 padding-right: 10px;
 padding-left: 10px;
 height: 100%;
}

.scroller {
 overflow: auto;
 padding-right: 10px;
 padding-top: 10px;
 padding-left: 0;
 height: 90%;
}

.item_col {
 margin-bottom: 10px;
 padding: 6px 5px 4px 25px;
 background: white url(../gui/right2.png) no-repeat 5px 5px;
 -webkit-border-radius: 5px;
 -moz-border-radius: 5px;
 line-height: 95%;
}

.item_col p {
 font-size: 80%;
 margin: 5px 0 0;
}

.noticia_item {
 list-style-type: none;
 width: 166px;
 height: 166px;
 position: relative;
 font: 85% "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 color: black;
 padding: 10px;
 background: url(../gui/f_foto_prensa.png) no-repeat;
 float: left;
 margin-right: 2px;
 margin-bottom: 2px;
}

div.fondo_foto_prensa {
 background: white url(../gui/loading.gif) no-repeat center center;
 width: 150px;
 height: 150px;
}

.noticia_titular {
 position: absolute;
 color: white;
 left: 15px;
 font-weight: bold;
 text-shadow: black 1px 1px 1px;
 padding-right: 20px;
 line-height: 100%;
 bottom: 20px;
}

.noticia_titular h1 {
 font-size: 140%;
 color: white;
 letter-spacing: -.1ex;
 font-weight: bold;
 text-shadow: black 1px 1px 2px;
 margin: 0 0 2px -2px;
 line-height: 90%;
}

/* @end */

/* @group paginado */

div.pagination {
 text-shadow: white 0 1px 1px;
 display: inline-block;
 font: bold 1.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
 margin-bottom: 10px;
 width: 797px;
}

div.pagination a {
 text-decoration: none;
 color: #666;
 padding-right: 5px;
 padding-bottom: 2px;
 padding-left: 5px;
 color: #666;
}

div.pagination a:hover, div.pagination a:active {
 color: #000;
}

div.pagination span.current {
 background-color: #333;
 color: #fff;
 -webkit-border-radius: 4px;
 -moz-border-radius: 4px;
 padding-right: 5px;
 padding-left: 5px;
 text-shadow: black 0 1px 1px;
}

div.pagination span.disabled {
 color: #797979;
 padding-left: 5px;
 padding-right: 5px;
}

/* @end */

/* @group scrollable */

/* @grou

p scrollable */

/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/

div.scrollable {
/* required settings */
 position: relative;
 overflow: hidden;
 width: 750px;
 height: 110px;
 float: left;
 border: 1px solid #ccc;
 padding-top: 10px;
 margin-left: 0;
}

div.scrollable_cambios {
 /* required settings */
 position: relative;
 overflow: hidden;
 width: 760px;
 height: 170px;
 float: left;
 border: 1px solid #ccc;
}

/* root element for scrollable items. Must be absolutely positioned
	and it should have a super large width to accomodate scrollable items.
	it's enough that you set width and height for the root element and
	not for this element. */

div.scrollable div.items {
 /* this cannot be too large */
 width: 20000em;
 position: absolute;
 clear: both;
}

div.scrollable_cambios div.items {
 

/* this cannot be too large */
 width: 20000em;
 position: absolute;
 clear: both;
}

/* single scrollable item */
div.scrollable div.items div {
 float: left;
 width: 180px;
 -moz-border-radius: 5px;
 margin-right: 10px;
 height: 100px;
 background: white url(loading.gif) no-repeat center center;
}

div.scrollable_cambios div.items div {
 float: left;
 width: 178px;
 height: 140px;
 background: white url(loading.gif) no-repeat center center;
 margin: 0;
 padding-left: 10px;
 padding-top: 10px;
}

/* active item */

div.scrollable div.items div.active {
 border: 1px inset #ccc;
 background-color: #fff;
}

/* prev, next, prevPage and nextPage buttons */

a.less, a.more, a.prevPage, a.nextPage {
 display: block;
 width: 18px;
 height: 18px;
 background: url(../gui/left.png) no-repeat;
 float: left;
 margin: 52px 5px;
 cursor: pointer;
 font-size: 1px;
}

/* mouseover state */

a.less:hover, a.more:hover, a.prevPage:hover, a.nextPage:hover {
 background-position: 0px -18px;
}

/* disabled navigational button */

a.disabled {
 visibility: hidden !important;
}

/* next button uses another background image */

a.more, a.nextPage {
 background-image: url(../gui/right.png);
 clear: right;
}

/*********** navigator ***********/

div.navi {
 height: 20px;
 width: 130px;
 margin-left: 47%;
}

div.navi a {
 width: 8px;
 height: 8px;
 float: left;
 margin: 3px;
 background: url(../gui/navigator.png) 0 0 no-repeat;
 display: block;
 font-size: 1px;
}

div.navi a:hover {
 background-position: 0 -8px;
}

div.navi a.active {
 background-position: 0 -16px;
}

p.intro { border-bottom: 1px solid #ccc; margin-bottom: 20px; padding: 20px 0 30px 0; width: 100%;
}

p#cross-links { border-bottom: 1px solid #ccc; margin-bottom: 30px; padding-bottom: 30px }
		
noscript p, noscript ol { color: #a00; font-size: 13px; line-height: 1.4em;
}

noscript a { color: #a00; text-decoration: underline }

noscript ol { margin-left: 25px; }

a:focus { outline:none }

img { border: 0 }

.stripViewer .panelContainer .panel ul {
margin: 0 15px 0 30px;
}

.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
	margin: 20px 0;
	position: relative;
	width: 820px;
 overflow: hidden;
}

/* These 2 lines specify style applied while slider is loading */
.csw {width: 100%; height: 460px; background: #fff; overflow: scroll}
.csw .loading {margin: 200px 0 300px 0; text-align: center}
.stripViewer { /* This is the viewing window */
position: relative;
overflow: hidden; /* this is the border. should have the same value for the links */
margin: auto;
width: 700px; /* Also specified in  .stripViewer .panelContainer .panel  below */
height: 460px;
clear: both;
background: #fff;
}
		
.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */
position: relative;
left: 0; top: 0;
width: 100%;
list-style-type: none;
/* -moz-user-select: none; // This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */
}

.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
float:left;
height: 100%;
position: relative;
width: 700px; /* Also specified in  .stripViewer  above */
}

.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
	padding: 10px;
}

.stripNav {
 margin: auto;
}

.stripNav ul { /* The auto-generated set of links */
	list-style: none;
}

.stripNav ul li {
 margin-right: 2px;
}

.stripNav a {
display: block;
padding: 1px 5px 2px;
 margin-bottom: 5px;
 width: 350px;
}
		
.stripNav li a:hover {
 color: black;
}
		
.stripNav li a.current {
	background: #666;
	color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
		
.stripNavL, .stripNavR { /* The left and right arrows */
	position: absolute;
	top: 230px;
	text-indent: -9000em;
}
		
.stripNavL a, .stripNavR a {
	display: block;
	height: 40px;
	width: 40px;
}
		
.stripNavL {
			left: 0;
}
		
.stripNavR {
	right: 0;
}

.stripNavL {
	background: url("images/arrow-left.gif") no-repeat center;
}
		
.stripNavR {
	background: url("images/arrow-right.gif") no-repeat center;
}

/* @end */

/* @group faq */

#faq_main {
 width: 820px;
 display: inline-block;
}

#faq_nav {
 line-height: 1;
 text-align: center;
 font-weight: bold;
 font-size: .9em;
 display: inline-block;
 text-shadow: #333233 1px 1px 1px;
 width: 820px;
}

#faq_nav ul {
 height: 38px;
 padding: 0;
}

#faq_nav li {
 float: left;
 list-style-type: none;
}

#faq_nav a {
 color: #fffeff;
 width: 130px;
 height: 26px;
 display: block;
 margin-right: 10px;
  -webkit-border-radius: 7px;
 -moz-border-radius: 7px;
 font-size: .9em;
 background: url(../gui/sprite.png) repeat-x 0 -110px;
 padding-top: 5px;
 padding-left: 10px;
 padding-right: 10px;
}

#faq_nav a.current {
 color: #fffeff;
 background-color: #666566;
 background-image: none;
}

#faq_main #panes {
 height: 320px;
 position: relative;
}

#faq_main #panes div.panas {
 top: 20px;
 display: none;
 position: absolute;
}

#panes h4 {
 margin: 0 0 15px;
 text-shadow: #cccbcc 1px 1px 0;
 font: bold 1.2em "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

#panes h4 a {
 margin: 0 0 10px;
 color: #797979;
 text-shadow: #fffeff 1px 1px 1px;
}

/* @end */