@CHARSET "UTF-8";
@IMPORT url("../binamic/css/box-model.css");

/********************************************************************
	WARNING:	This stylesheet is COMPLEX, there are interactions
				which may seem for no reason, or perhaps styles
				which dont have a purpose, but all of them do
				
				be very careful about modifying this stylesheet!!
				even *I* think it's too complex and would like to
				simplify it, and I'm the one who wrote it.
********************************************************************/

body{
	background-color: #000000;
	font-family: Arial;
	font-size: 12px;
	color: #000000;
	
	width: 900px;
	margin: 0 auto;
}

img{ border: 0; }

.page{
	background-color: #FFFFFF;
	position: relative;
}

#shadow{
	opacity: 1.0;
}

/********************************************************************
	DESCARGAS STYLES
********************************************************************/
.downloads{
	font-size: 12px;
}

.downloads .file{
	padding-left: 15px; 
	margin-bottom: 6px;
	color: #FFFFFF;
}

.downloads .file a{
	text-decoration: none;
	color: #FFFFFF;
}

.downloads .file a:hover{
	color: #FF0000;
}


/********************************************************************
	POPUP STYLES
********************************************************************/
.popup{
	position: absolute;
	z-index: 10;
	display: none;
	opacity: 0;
}

/********************************************************************
	FONDO POPUP STYLES
********************************************************************/
#fondo-popup{
	width: 530px;
	height: 580px;
	top: 20px;
	left: 180px;
	background-color: #000000;
	padding: 10px;
}

#fondo-popup .top{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

#fondo-popup .bottom{
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 2;
}

#fondo-popup .content{
	position: relative;
	width: 480px;
	background-color: #FFFFFF;
	padding: 90px 0 10px 50px;
}

#fondo-popup .content .thumbnail{
	margin-bottom: 10px;
}

#fondo-popup .content .fondo-left{
	margin-left: 100px;
}

#fondo-popup .content .fondo-right{
	margin-right: 60px;
}

#fondo-popup .content a{
	text-decoration: none;
	display: block;
	color: #000000;
}

#fondo-popup .content a:hover{
	color: #666666;
}

#fondo-popup .content .close{
	position: absolute;
	right: 0;
	bottom: 10px;
}

/********************************************************************
	FONDO POPUP STYLES	
********************************************************************/
#comic-popup{
	width: 500px;
	height: 532px;
	margin: 0 auto;
	padding-top: 115px;
	background-color: #000000;
	position: relative;
}

#comic-popup .top{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
}

#comic-popup .bottom{
	position: absolute;
	bottom: 0;
	left: 10px;
	z-index: 2;
}

#comic-popup .comic-menu{
	height: 11px;
	width: 491px;
	margin: 0px auto 12px auto;
}

#comic-popup .comic-menu a{
	margin: 0 9px;
}

#comic-popup .comic-menu img{
	display: block;
	visibility: hidden;
}

#comic-popup .comic-menu .cronica1{ background-image: url("../images/comic/capitulo1-off.jpg"); }
#comic-popup .comic-menu .cronica1:hover{ background-image: url("../images/comic/capitulo1-on.jpg"); }
#comic-popup .cronica1 .comic-menu .cronica1{ background-image: url("../images/comic/capitulo1-on.jpg"); }

#comic-popup .comic-menu .cronica2{ background-image: url("../images/comic/capitulo2-off.jpg"); }
#comic-popup .comic-menu .cronica2:hover{ background-image: url("../images/comic/capitulo2-on.jpg"); }
#comic-popup .cronica2 .comic-menu .cronica2{ background-image: url("../images/comic/capitulo2-on.jpg"); }

#comic-popup .comic-menu .cronica3{ background-image: url("../images/comic/capitulo3-off.jpg"); }
#comic-popup .comic-menu .cronica3:hover{ background-image: url("../images/comic/capitulo3-on.jpg"); }
#comic-popup .cronica3 .comic-menu .cronica3{ background-image: url("../images/comic/capitulo3-on.jpg"); }

#comic-popup .comic-menu .cronica4{ background-image: url("../images/comic/capitulo4-off.jpg"); }
#comic-popup .comic-menu .cronica4:hover{ background-image: url("../images/comic/capitulo4-on.jpg"); }
#comic-popup .cronica4 .comic-menu .cronica4{ background-image: url("../images/comic/capitulo4-on.jpg"); }

#comic-popup .comic{
	position: relative;
	width: 478x;
	height: 490px;
	margin-left: 10px;
	overflow-y: auto;
	background-color: #FFFFFF;
}

#comic-popup .comic img{
	position: absolute;
	top: 0;
	left: 0;
}

/********************************************************************
	LAS MOTOS POPUP STYLES
********************************************************************/
#las-motos-popup{
	width: 516px;
	height: 432px;
	margin-left: 225px;
	background-color: #FFFFFF;
}

#las-motos-popup .image{
	margin: 0 8px;
	display: block;
	height: 379px;
	position: relative;
}

#las-motos-popup .image img{
	position: absolute;
	top: 0;
	left: 0;
}

#las-motos-popup .buttons{
	width: 90px;
	margin: 0 auto;
	height: 32px;
	text-align: center;
}

#las-motos-popup .buttons span{
	height: 32px;
	line-height: 32px;
}

/********************************************************************
	HEADER STYLES
********************************************************************/
.page .header{
	background-image: url("../images/header.jpg");
	background-repeat: no-repeat;
	height: 161px;
	overflow: hidden;
}

.page .header ul{
	margin: 118px 0px 0 14px;
	list-style: none;
	overflow: hidden;
	padding: 0;
}

.page .header ul li{
	height: 17px;
	margin: 0;
	padding: 0;
	float: left;
	overflow: hidden;
	display: block;
}

.page .header ul li a{
	height: 17px;
	overflow: hidden;
}

.header .index{			width: 74px;	}
.header .las-motos{		width: 112px;	}
.header .calendario{	width: 126px;	}
.header .res-clas{		width: 245px;	}
.header .galeria{		width: 102px;	}
.header .enlaces{		width: 99px;	}
.header .contactar{		width: 117px;	}

/********************************************************************
	INDEX PAGE STYLES
********************************************************************/
.index .header .index{
	background-image: url("../images/menu/home-on.jpg");
	
}
.index .header .index img{
	visibility: hidden;
}

.index .hothotraces{
	width: 225px;
}

.index .hothotraces .race-info{
	padding-bottom: 10px;
}

.index .hothotraces .race-info h2{
	font-size: 14px;
	font-weight: bold;
	color: #FF0000;
	padding: 0;
	margin: 5px 0 5px 0;
}

.index .hothotraces .scrollContainer{
	margin-left: 15px;
}

.index .scrollContainer{
	position: relative;
}

.index .hothotraces .scrollArea{
	width: 200px;
	height: 370px;
	padding-right: 5px;
	margin-right: 5px;
	overflow-y: scroll;
}

.index .flash{
	padding-left: 10px;
	width: 654px;
	height: 284px;
	
	position: relative;
}

.index .bannerArea{
	color: #FFFFFF;
}

.index .bannerArea *{
	font-size: 10px;
}

.index .bannerArea p{
	line-height: 12px;
	padding: 0;
	margin: 0 0 2px 0;
}

.index .bannerArea p span{
	color: #FF0000;
}

.index .bannerArea .scrollArea{
	height: 85px;
	overflow-y: scroll;
}

.index .banner2{
	background-image: url("../images/home/banners2.jpg");
	background-repeat: no-repeat;
	width: 195px;
	height: 107px;
	padding: 45px 10px 0 16px;
	line-height: 14px;
}

.index .banner2 a{
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	margin-left: 10px;
}

.index .banner2 h2{
	font-weight: normal;
	color: #FF0000;
	margin: 0;
	padding: 0;
}

/********************************************************************
	LAS MOTOS PAGE STYLES
********************************************************************/
.las-motos .header .las-motos{
	background-image: url("../images/menu/lasmotos-on.jpg");
}
.las-motos .header .las-motos img{
	visibility: hidden;
}

.las-motos .background{
	position: absolute;
	background-color: #FFFFFF;
	width: 850px;
}

.las-motos .text{
	position: relative;
	height: 700px;
}

.las-motos .text .harley{
	position: relative;
	top: 190px;
	left: 345px;
	width: 400px;
	height: 315px;
	z-index: 10;
}

.las-motos .text .buell{
	position: relative;
	top: 190px;
	left: 345px;
	width: 400px;
	z-index: 10;
}

.las-motos .text a{
	color: #FF0000;
	text-decoration: none;
}

/********************************************************************
	CALENDARIO PAGE STYLES
********************************************************************/
.calendario .header .calendario{
	background-image: url("../images/menu/calendario-on.jpg");
}
.calendario .header .calendario img{
	visibility: hidden;
}
.calendario .frame{
	background-image: url("../images/calendario/frame.jpg");
	width: 860px;
	height: 490px;
	padding: 45px 12px 0 27px;
}

.calendario .frame .arrow{
	padding-top: 100px;
}

.calendario .frame .hbox img{
	display: block;
}

.calendario .frame .hbox .details{
	margin-left: 20px;
	width: 235px;
	line-height: 16px;
	font-size: 11px;
}

.calendario .frame .horario{
	width: 264px;
	height: 71px;
	display: block;
	
	background-image: url("../images/calendario/descargar-off.jpg");
}

.calendario .frame .horario:hover{
	background-image: url("../images/calendario/descargar-over.jpg");
}

/********************************************************************
	RESULTADOS Y CLASIFICACION PAGE STYLES
********************************************************************/
.res-clas .header .resultados{
	background-image: url("../images/menu/result-clasif-on.jpg");
}
.res-clas .header .resultados img{
	visibility: hidden;
}
.res-clas .toggle-area{
	height: 37px;
}

.res-clas .toggle-area .resultados{
	background-image: url("../images/resultados-clasificacion/resultados/resultados-over.jpg");
	background-repeat: no-repeat;
}

.res-clas .toggle-area .resultados:hover img{
	visibility: hidden;
}

.res-clas .toggle-area .clasificacion{
	background-image: url("../images/resultados-clasificacion/clasificacion/clasificacion-over.jpg");
	background-repeat: no-repeat;
}

.res-clas .toggle-area .clasificacion:hover img{
	visibility: hidden;
}

.res-clas .navigation .resultados .resultados{
	background-image: url("../images/resultados-clasificacion/resultados/resultados-submenu.jpg");
	background-repeat: no-repeat;
	width: 850px;
	height: 30px;
	padding: 15px 0 0 35px;
	position: relative;
}

.res-clas .navigation .clasificacion .resultados{
	display: none;
}

.res-clas .navigation .clasificacion .clasificacion{
	background-image: url("../images/resultados-clasificacion/clasificacion/clasificacion-submenu.jpg");
	background-repeat: no-repeat;
	height: 30px;
	padding: 15px 0 0 35px;
	margin: 5px 0 0 179px;
	position: relative;
}

.res-clas .navigation .resultados .clasificacion{
	display: none;
}

.res-clas .navigation a img{
	display: block;
}

.res-clas .navigation .resultados .location{
	margin-right: 20px;
}

.res-clas .navigation .resultados .location .icon{
	margin-left: 10px;
}

.res-clas .navigation .location img{
	display: block;
}

/*	hide foreground image for all links in the location blocks */
.res-clas .navigation .resultados .location a:hover img{
	visibility: hidden;
}

/***************************************************************
	CITY LOGO ACTIVATION
***************************************************************/
/* MOUSE OVER ALBACETE */
.res-clas .navigation .resultados .albacete .city{
	background-image: url("../images/resultados-clasificacion/resultados/albacete-over.jpg");
}
/* TURN ON ALBACETE */
.res-clas .albacete .resultados .albacete .city{
	background-image: url("../images/resultados-clasificacion/resultados/albacete-on.jpg");
}
.res-clas .albacete .resultados .albacete .city img{
	visibility: hidden;
}

/* MOUSE OVER MONTEBLANCO */ 
.res-clas .navigation .resultados .monteblanco .city{
	background-image: url("../images/resultados-clasificacion/resultados/monteblanco-over.jpg");
}
/* TURN ON MONTEBLANCO */
.res-clas .monteblanco .resultados .monteblanco .city{
	background-image: url("../images/resultados-clasificacion/resultados/monteblanco-on.jpg");
}
.res-clas .monteblanco .resultados .monteblanco .city img{
	visibility: hidden;
}

/* MOUSE OVER VALENCIA */
.res-clas .navigation .resultados .valencia .city{
	background-image: url("../images/resultados-clasificacion/resultados/valencia-over.jpg");
}
/* TURN ON VALENCIA */
.res-clas .valencia .resultados .valencia .city{
	background-image: url("../images/resultados-clasificacion/resultados/valencia-on.jpg");
}
.res-clas .valencia .resultados .valencia .city img{
	visibility: hidden;
}

/***************************************************************
	HARLEY LOGOS FOR EACH CITY
***************************************************************/
/* The Default icon for harley */
.res-clas .navigation .resultados .location .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-off-blanco.jpg");
}
/* TURN ON HARLEY LOGO FOR ALBACETE */
.res-clas .albacete .harley .albacete .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-on.jpg");
}
.res-clas .albacete .harley .albacete .harley img{
	visibility: hidden;
}

/* TURN ON HARLEY LOGO FOR MONTEBLANCO */
.res-clas .monteblanco .harley .monteblanco .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-on.jpg");
}
.res-clas .monteblanco .harley .monteblanco .harley img{
	visibility: hidden;
}

/* TURN ON HARLEY LOGO FOR VALENCIA */
.res-clas .valencia .harley .valencia .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-on.jpg");
}
.res-clas .valencia .harley .valencia .harley img{
	visibility: hidden;
}

/***************************************************************
	BUELL LOGOS FOR EACH CITY
***************************************************************/
/* The Default icon for buell */
.res-clas .navigation .resultados .location .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-off-blanco.jpg");
}
/* TURN ON BUELL LOGO FOR ALBACETE */
.res-clas .albacete .buell .albacete .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-on.jpg");
}
.res-clas .albacete .buell .albacete .buell img{
	visibility: hidden;
}

/* TURN ON HARLEY LOGO FOR MONTEBLANCO */
.res-clas .monteblanco .buell .monteblanco .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-on.jpg");
}
.res-clas .monteblanco .buell .monteblanco .buell img{
	visibility: hidden;
}

/* TURN ON HARLEY LOGO FOR VALENCIA */
.res-clas .valencia .buell .valencia .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-on.jpg");
}
.res-clas .valencia .buell .valencia .buell img{
	visibility: hidden;
}

/********************************************************************
	CLASIFICATION STYLES
********************************************************************/
.res-clas .navigation .clasificacion .clasificacion a img{
	visibility: hidden;
}

.res-clas .navigation .clasificacion a{
	margin-right: 10px;
}

.res-clas .navigation .clasificacion .harley .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-on.jpg");
}

.res-clas .navigation .clasificacion .harley .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-off-gris.jpg");
}

.res-clas .navigation .clasificacion .harley .buell:hover{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-off-blanco.jpg");
}

.res-clas .navigation .clasificacion .buell .buell{
	background-image: url("../images/resultados-clasificacion/resultados/logo-buell-on.jpg");
}

.res-clas .navigation .clasificacion .buell .harley{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-off-gris.jpg");
}

.res-clas .navigation .clasificacion .buell .harley:hover{
	background-image: url("../images/resultados-clasificacion/resultados/logo-hd-off-blanco.jpg");
}

/********************************************************************
	RESULT TABLE STYLES
********************************************************************/
.res-clas table{
	margin-bottom: 20px;
	width: 500px;
}

.res-clas table td{
	height: 25px;
}

.res-clas table .off{
	background-color: #FFFFFF;
}

.res-clas table .on{
	background-color: #F4F4F4;
}

.res-clas .no-results{
	height: 350px;
}

.res-clas .download-results{
	display: block;
	text-decoration: none;
	font-weight: bold;
	color: #FF0000;
	margin-bottom: 20px;
}

/********************************************************************
	GALERIA PAGE STYLES
********************************************************************/
.galeria .header .galeria{
	background-image: url("../images/menu/galeria-on.jpg");
}
.galeria .header .galeria img{
	visibility: hidden;
}

.galeria .submenu a, .galeria .submenu img{
	display: block;
}

.galeria .submenu .button{		width: 349px;	}
.galeria .submenu .albacete{	height: 114px;	}
.galeria .submenu .monteblanco{	height: 118px;	}
.galeria .submenu .valencia{	height: 100px;	}
.galeria .submenu .hog{			height: 54px;	}

.galeria .submenu .albacete{					background-image: url("images/galeria/albacete-off.gif");	}
.galeria .submenu .albacete:hover{				background-image: url("images/galeria/albacete-over.gif");	}
.galeria .albacete-selected .albacete{			background-image: url("images/galeria/albacete-on.gif");	}

.galeria .submenu .monteblanco{					background-image: url("images/galeria/monteblanco-off.gif");	}
.galeria .submenu .monteblanco:hover{			background-image: url("images/galeria/monteblanco-over.gif");	}
.galeria .monteblanco-selected .monteblanco{	background-image: url("images/galeria/monteblanco-on.gif");	}

.galeria .submenu .valencia{					background-image: url("images/galeria/valencia-off.gif");	}
.galeria .submenu .valencia:hover{				background-image: url("images/galeria/valencia-over.gif");	}
.galeria .valencia-selected .valencia{			background-image: url("images/galeria/valencia-on.gif");	}

.galeria .submenu .hog{							background-image: url("images/galeria/visita-galeria-hog-off.gif");		}
.galeria .submenu .hog:hover{					background-image: url("images/galeria/visita-galeria-hog-over.gif");	}

.galeria .submenu a img{
	visibility: hidden;
	overflow: hidden;
}

.galeria .descargar{
	text-align: right;
}

.galeria .imageFrame{
	margin: 0 17px 17px 0;
	width: 497px;
	height: 390px;
	padding-top: 5px;
	background-color: #000000;
}

.galeria .imageFrame .image{
	height: 364px;
	position: relative;
}

.galeria .imageFrame .image img{
	position: absolute;
	margin: 0 5px;
}

.galeria .imageFrame .image-counter{
	margin-right: 10px;
	font-weight: bold;
	color: #FFFFFF;
}
	
.galeria .imageFrame .navigation{
	width: 200px;
	margin: 5px auto 0;	
}

/********************************************************************
	ENLACES PAGE STYLES
********************************************************************/
.enlaces .header .enlaces{
	background-image: url("../images/menu/enlaces-on.jpg");
}
.enlaces .header .enlaces img{
	visibility: hidden;
}

.enlaces .frame{
	background-image: url("../images/enlaces/frame.jpg");
	width: 900px;
	height: 401px;
	padding-top: 35px;
}

.enlaces .icon{
	position: relative;
	text-decoration: none;
	color: #000000;
}

.enlaces .icon:hover{
	color: #99999;
}

.enlaces .icon .image{
	position: relative;
	height: 76px;
}

.enlaces .icon .image img{
	position: absolute;
	bottom: 0;
	left: 0;
}

.enlaces .icon .image .hidden{
	position: relative;
	visibility: hidden;
}

.enlaces .icon .link{
	text-align: center;
}

.enlaces .row1{
	width: 353px;
	margin: 10px auto;
}

.enlaces .row2{
	width: 840px;
	margin: 10px auto;
}

.enlaces .row3{
	width: 840px;
	margin: 10px auto;
}

/********************************************************************
	CONTACTAR PAGE STYLES
********************************************************************/
.contactar .header .contactar{
	background-image: url("../images/menu/contactar-on.jpg");
}
.contactar .header .contactar img{
	visibility: hidden;
}
.contactar .frame{
	background-image: url("../images/contactar/frame.jpg");
	width: 478px;
	height: 340px;
	padding: 80px 370px 0 50px;
}

.contactar .frame .entry{
	border: 0;
	background-color: #000000;
	color: #FFFFFF;
}

.contactar .frame .nombre{
	background-image: url("../images/contactar/box-nombre.jpg");
	height: 36px;
	width: 225px;
}

.contactar .frame .nombre .entry{
	margin-top: 13px;
	margin-left: 10px;
	width: 200px;
}

.contactar .frame .mail{
	background-image: url("../images/contactar/box-mail.jpg");
	height: 36px;
	width: 230px;
}

.contactar .frame .mail .entry{
	margin-top: 10px;
	margin-left: 10px;
	width: 212px;
}

.contactar .frame .asunto{
	background-image: url("../images/contactar/box-asunto.jpg");
	height: 36px;
	width: 238px;
}

.contactar .frame .asunto .entry{
	margin-top: 7px;
	margin-left: 10px;
	width: 220px;
}

.contactar .frame .comentario{
	background-image: url("../images/contactar/box-comentario.jpg");
	height: 125px;
	width: 380px;
}

.contactar .frame .message{
	color: #FF0000;
	font-size: 12px;
	margin-left: 100px;
	width: 280px;
}	

.contactar .frame .comentario .entry{
	margin-top: 13px;
	margin-left: 10px;
	width: 355px;
	height: 100px;
	font-family: Arial;
	font-size: 12px;
}
