 /* Este css controla el look and feel de la ventana de selección pr clasificación */

/* Manejo estructural, los ids son usados para tamaño y posición, las clases para definiciones gráficas*/

#publicidad_clasif{
position: absolute;
width: 427px;
height: 324px;
top:8px;
left: 108px;
text-align: left;
}

#publicidad_clasif_items{
position: absolute;
width: 215px;
height: 324px;
top:8px;
left: 323px;
text-align: left;
}


#publicidad_clasif #banner{
position:absolute;
width:336px;
height: 280px;
left:45px;
top:22px
}

#items #banner {
width:215px;
height: 324px;
}

#marcas,
#modelos,
#items{
position:absolute;
width:215px;
height:324px;
overflow:hidden;
top:8px
}

#marcas h3,
#modelos h3,
#items h3,
#publicidad_clasif h3{
margin-top:6px;
}

#marcas ul,
#modelos ul,
#items ul{
    margin:6px 0 12px 0px;
}

#marcas ul li a,
#modelos ul li a,
#items ul li a{
padding-top: 2px;
display:block;
height:14px
}

#modelos h3 span,
#modelos ul li a span {
position: absolute;
/*right:22px; G.N. */
right:42px;/* C.A. */
}
/*Agregado por Cesar Arguinzones*/
#modelos h3 span {
    padding-left:99px;
    position:relative;
    right:0;
}
#modelos {
    background-color:#EEEEDD;
}
#items {background-color: transparent !important;}
#modelosSlide {
    background-color:#BBBBAA;
    margin-top: -6px;
    height: 324px;
}
* html #modelosSlide {
    margin-top: 0px;
}
#modelosSlide h3 {
    padding-top:6px;
}
* html #modelosSlide h3 {
    padding-top:0px;
}
#items abbr {
    padding-left:40px;
    position: relative !important;
    left:0 !important;
}
#items span {
    padding-left:44px !important;
}
#publicidad_clasif #banner-444x456px a img {
    text-align:left;
}
#marcas #scrollarea_marcas #content_marcas li a {color:#000000;}
/*FIN -- Agregado por Cesar Arguinzones*/
#modelos
#items h3 span,
#items ul li a span {
position: absolute;
right: 8px}

#items h3 abbr,
#items ul li a abbr{
position: absolute;
left: 80px;
}



#marcas {
width:108px;
left: 0px;
z-index:30;
}

#modelos {
left: 108px;
z-index:20;
}

#modelos ul li a abbr{
color:#555544;
size: 9px;
}

#items{
left: 320px;
z-index:10;
}

/* diseno, declaración inicial de clases */

#marcas h3,
#modelos h3,
#items h3{
    font-family:sans-serif,"lucida Grande", Verdana, Helvetica;
    font-size:9px;
    }

.marcas_roll,
.modelos_roll,
.items_roll,
.marcas_off ul li a:hover,
.modelos_off ul li a:hover,
.items_off ul li a:hover
{
    background-color:#ffff00
}

.marcas_roll h3,
.modelos_roll h3,
.items_roll h3{color:#996600;}



.modelos_invisible,
items_invisible{
    visibility:hidden;
}

.marcas_off{
    background-color:#999988
}
.modelos_off,
.marcas_off ul li a.selected,
 #publicidad_clasif{
    background-color:#bbbbaa
}

.items_off,
.modelos_off ul li a.selected,
 #publicidad_clasif #banner{
    background-color:#ddddcc}

.marcas_off h3{color:#666655;}
.modelos_off h3{color:#555544;}
.items_off h3{color:#444433;}

#marcas ul li,
#modelos ul li,
#items ul li{
    display:block;
    font-family:sans-serif,"lucida Grande", Verdana, Helvetica;
    font-size:11px;
    color:black;
    position: relative;
}

#marcas ul li{
color:white }


#marcas ul li a:link,
#modelos ul li a:link,
#items ul li a:link,
#marcas ul li a:visited,
#modelos ul li a:visited,
#items ul li a:visited,
#marcas ul li a:hover,
#modelos ul li a:hover,
#items ul li a:hover
{
    color:black
}

marcas ul li a:link,
#marcas ul li a:visited
{
color: white }



/* diseno, declaración de tabs de cada seccion */




/* Estos son los contenedores de los scrollstabs */
#scrollbar_marca,
#scrollbar_modelo,
#scrollbar_items{
    position:absolute;
    width:1px;
    z-index:55;
    height:301px;
    top:29px;
    overflow: visible;
    left:-14px !important;
    left:-16px;
    z-index:200}


#scrollbar_modelo{

left: 93px !important;
left: 93px;
}

#scrollbar_items{
left: 308px !important;
left: 308px;
}


/* Estas son las areas donde va el contenido al que se le hace scroll */
#scrollarea_marcas,
#scrollarea_modelo,
#scrollarea_items{
    height:301px;
    overflow:hidden;
}


/* Estos son los tabs que permiten mover el contenido */

#scrolltab_marca,
#scrolltab_modelo,
#scrolltab_items{
    position:absolute;
    z-index:60;
    top:8px;
    z-index: 220;
    }

#scrolltab_marca,
#scrolltab_modelo,
#scrolltab_items,
#scrolltab_marca a,
#scrolltab_modelo a,
#scrolltab_items a{
    display:block;
    width:17px;
    height:49px;
    background-image: url(../images/tabs_class.png) !important;
    background-image: url(../images/tabs_class.gif);
    background-repeat: no-repeat;
    background-position: left top;
}
#scrolltab_marca{
    background-position: left top;}
#scrolltab_marca a
    {background-position: left top;}

#scrolltab_modelo{
    background-position: -27px top;}
#scrolltab_modelo a
{background-position: -27px top;}
    
#scrolltab_items{
    background-position: -53px top;}
#scrolltab_items a
    {background-position: -53px top;}

#scrolltab_marca a:hover,
#scrolltab_marca a:active
{background-position: left -50px;}
    
#scrolltab_modelo a:hover,
#scrolltab_modelo a:active
{background-position: -27px -100px;}


#scrolltab_items a:hover,
#scrolltab_items a:active
{background-position: -53px -50px;}

