/*
ESPECIALES
Contiene toda la estructura de despliegue de los especiales y manejo de sistema de slice
*/

* { margin: 0; padding: 0;}

body {background: #666; margin: 0 auto; text-align: center; }

/*ESTRUCTURA*/

div#especialMicro { width: 700px; margin: 0px auto; text-align: center; position: relative; background: #FFF; }
div#especialHeader { width: 700px; height: 65px; background: #C00; color: #FFF; }

div#especialHeader h2 { font: 1.2em Arial, Helvetica, sans-serif; float: right; background: url(i/bullet_h2_star.gif) left no-repeat; margin: 20px 10px; padding: 0px 0px 0px 30px;}
div#especialHeader .flotar { float: left; margin: 5px; border:0;}

div#especialContent { width: 100%; height: 400px; background: #FFF; color: #333; }
div#especialMenu { width: 700px; overflow: hidden; margin: 0px auto; background: url(i/bk_especiales_nav.jpg) top center #FFF; color: #333; border-top: 4px solid #900; }

/*MENU*/

#especialMenu ul, #especialMenu li { font: .9em/1.2em Arial, Helvetica, sans-serif; display: inline; list-style-type: none; }
#especialMenu li, #especialMenu li#position1-tab { width: 100px; float: left; text-align: center; } /*  <--CONTROL DE SLICE, DEBE MARCAR EL DIV DE INICIO DE SLICE  ----  #especialMenu li#position1-tab  */
#especialMenu a img { margin: 0px auto; padding: 2px; border: 1px solid #DDD; display: block; background: #FFF; filter:alpha(opacity=60); -moz-opacity:.60; opacity:.60; }
#especialMenu a:hover img, #especialMenu a:link#current img, #especialMenu a:visited#current img { margin: 0px auto; padding: 2px; border: 1px solid #DDD; display: block; background: #FFF; filter: alpha(opacity=100); -moz-opacity:1; opacity:1; }
#especialMenu a:link, #especialMenu a:visited { text-decoration: none; display: block; color: #333; padding: 10px 0px 30px 0px; outline: none;}

#especialMenu a:link#current, #especialMenu a:visited#current, #especialMenu a:hover { background: url(i/bk_especiales_nav_hover.jpg) top center; color: #C00; padding: 10px 0px 30px 0px; }

#especialMenu a:hover { background: url(i/bk_especiales_nav_hover.jpg) top center; color: #C00; padding: 10px 0px 30px 0px; }

#izq, #der { width: 350px; overflow: hidden; margin: 0px; padding: 0px; float: left; }
#der { width: 330px; margin-top: 26px;}
#izq img, #der img { margin: 0px auto; padding: 0px; text-align: center; }
#izq p, #der p { font: 11px/14px Arial, Helvetica, sans-serif; color: #333; text-align: left; padding: 4px 8px; }
#izq h3, #der h3 { font: 16px/14px Arial, Helvetica, sans-serif; font-weight: bold; color: #C00; text-align: left; padding: 6px 8px; clear: both; }
#bfbajada { width: 90%; overflow: hidden; background: #DDD; border: 1px solid #CCC; margin: 0px 8px; padding: 4px; }
#bfbajada img { float: left; margin: 4px; }
#bfbajada p { font: 10px/12px Arial, Helvetica, sans-serif; font-weight: bold; color: #333; text-align: left; }

#ffbajada { width: 100px; overflow: hidden; background: #DDD; border: 1px solid #CCC; margin: 0px 8px; padding: 4px;}
#ffbajada img { margin: 4px; }
#ffbajada p { font: 10px/12px Arial, Helvetica, sans-serif; font-weight: bold; color: #333; text-align: left; }

#ffbajada.c_izq { float: left; }
#ffbajada.c_der { float: right; }

/*DIV PARA SLICE*/

#scroller { width: 700px; margin: 0 auto; overflow: hidden;}

#content { width: 5250px;}

#frame { overflow: hidden; margin: 0 auto; width: 700px; position: relative;}

#frame, #scroller, .section { height: 400px; }

.container { width: 700px; margin: 0 auto; position: relative;}

.section { width: 700px; float: left; margin: 0px auto; text-align: center; background-color: #FFC;}