/*****************************************************************************
Hoja de estilos para www.balonmanomostoles.com version 2.1
webmaster: buzkall
NOV 2008
*******************************************************************************/

/*includes for tabs */
@import url("/tabs/ajaxtabs/ajaxtabs.css");
/*includes para tablas redondeadas */
@import url("estiloTabla.css");
/*includes para tablas redondeadas RSS */
@import url("estiloRedondo.css");

.right {float:right}
.left {float:left}

body {
background: white url("/frontend/logos/fondo_circ.jpg");
background-repeat: repeat-x repeat-y;
background-position: top left;
/*background:#1E90FF;*/
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 23px; /*interlineado*/
text-align: center; /* IE HACK, needed to center other divs */
color: #000000;
margin-bottom:10px;
}

img { border-bottom: 0px;
	  behavior: url(/frontend/css/iepngfix.htc); }

ul, li {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
}

ul.club, li.club { /*usado en Historia del club */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 23px; /*interlineado*/
}

/* ----------------------------------
reutilizables
------------------------------------*/
.left{float: left;}
.right{float: right;}

/******************************
TEXTOS
*********************************/
h1, h2, h3, h4, h6{
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000;
padding-left:10px;}

h1{
font-size: 20px;
color:red;
text-transform:uppercase;}

h2 {
font-size: 32px;
line-height: 35px;}

h3 {
font-size: 14px;
margin:10px;
text-align: justify;}

h4{
font-size: 13px;
color:#fff;
text-align:center;}

h5{ /*para los titulos de las paginas*/
font-family: "Book Antigua", Verdana, Arial, Helvetica, sans-serif;
font-size: 17px;
color:red;
padding-left:15px;
font-weight:bold;}

h6 { /* para el menu */
font-size: 12px;
text-align: left;
border:2px;}

p{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 13px;
padding-left:15px;
text-align:justify;
text-indent: 10px;
line-height: 17px; /*interlineado*/}

.resalta{ /*para fecha en cabeceras de noticias en la portada*/
font-size:15px;
color:white;
background: red;
padding:2px;
padding-left:8px;
font-weight:bold;
}

.aviso {
	background-color: #ff530a;
	color: black;
	width: 60%;
	margin: 0 auto;
	padding: 10px;
	border: 1px solid red; 
}

.ad { /*anuncio poker en estadisticas */
 font-size:12px;
 padding:2px;
 width:850px;
 margin: 0 auto;
 padding:8px;
 border:1px solid black;
}

.publi_back { /*anuncio backlink portada */
 font-size:12px;
 width:200px;
 margin: 0 auto;
 padding:8px;
 border:1px solid black;
 text-align: center;
}

.tit_negro{
 font-size:11px;
 margin: 0 auto;
 text-align: center;
 color:white;
 background: black;
}

/************ vinculos especiales ***********/

.sig_pag, .sig_pag:hover { /* para el indexado de noticias en la portada */
 font-size:12px;
 padding:5px;
 border:1px solid black;
 background-color:red;
 color:white;
 font-weight:normal; /*para evitar negrita en hover*/

float:right;
}

.ant_pag, .ant_pag:hover { /* para el indexado de noticias en la portada */
 font-size:12px;
 padding:5px;
 border:1px solid black;
 background-color:red;
 color:white;
 font-weight:normal; /*para evitar negrita en hover*/

float:left;
}

.a_pabellon {
 text-decoration: none;
 border-bottom: 0px;
 background-color: transparent;
}

/********estilo desplegables de noticias *********/
.desplegable {
font-size:11px;
color:green;
padding-left:25px;}

/******************
   correo
******************/
/* Necesario para que se muestre bien los nuevos elementos agregados */
.file {display: block;}

span a {margin-left: 1em;}

input, textarea {
 border:3px double #ccc;
 background-color:#fafafa;
}

td.correo {font-size: 12px; }

/***********************************
   Posiciones
**********************************/
.invi{visibility:hidden;}
.white {color:white;
font-size:11px;
 text-decoration: none;
 border-bottom: 0px dotted #fff;}

.white:hover {color:white;
font-size:11px;
 text-decoration: none;
 border-bottom: 0px dotted #fff;}

.portada {
margin: 0 auto; /* IE HACK: ie doesn't read auto margins, so body tag has text-align set to center, and here, to left. Firefox centers it with auto */
width: 930px;
border-left:2px solid gray;
border-right:2px solid gray;
text-align:left;
padding-left: 10px;
padding-right: 10px;
background:white;}

.portada2{ /*sin bordes! */
margin: 0 auto; /* IE HACK: ie doesn't read auto margins, so body tag has text-align set to center, and here, to left. Firefox centers it with auto */
width: 950px;
text-align:left;
background:white;}

.cronicas {
margin: 0 auto; /* IE HACK: ie doesn't read auto margins, so body tag has text-align set to center, and here, to left. Firefox centers it with auto */
width: 930px;
border-left:2px solid gray;
border-right:2px solid gray;
text-align:justify;
padding: 20px;
background:white;}

.footer{
margin: 0 auto; /* IE HACK: ie doesn't read auto margins, so body tag has text-align set to center, and here, to left. Firefox centers it with auto */
width: 940px;
background:#DCDCDC;
border:1px dotted black;
text-align:left;
font-size:10px;}

.cuadrado{ /* para RSS tabla redonda */
margin: 0 auto; /* IE HACK: ie doesn't read auto margins, so body tag has text-align set to center, and here, to left. Firefox centers it with auto */
width: 350px;}

.calendario{
width: 800px;
text-align:center;
margin: 0 auto;
text-align:left;
background:white;}

.partidos{
padding-top:10px;
padding-right:10px;
float:right;
/*left:400px;*/
padding-left:15px;
width: 38%;}

.noticias{ /* imp. para cada cuadro de noticias en portada */
background-position:left top;
background-repeat:no-repeat;
background-color: #fff;
margin-left:15px;
padding:10px;
padding-right:25px;
padding-left:25px;
border: 1px dashed #00f;
text-indent:25px;
font-size: 14px;
font-weight:bold;
text-align: justify;
font-family: Arial, Verdana, Helvetica, sans-serif;
line-height:18px;
}


/*tablas*/

table.partido {
 border: 1px solid #000;
 margin: 20px auto;
 background-color: #fff;

}
table.partido caption {
 font-family: Tahoma, Arial, sans-serif;
 font-weight:bold;
 color: #000;
 text-align: center;
 margin: 10px auto;
}

td.partido {  /*asi permito que las tablas sigan saliendo sin borde, pero al añadir esto en el class del th si tiene*/
	padding-left: 5px;
	padding-top: 5px;
	text-align:center;
	font-size: 13px;
	background-color: #fff;
	border: 1px solid #000;
}

/* horarios en portada */
table.horario {
	border: 1px solid #000;
	margin: 20px auto;
	background-color: #fff;
}
td.horario {
	padding-left: 5px;
	padding-top: 5px;
	font-size: 10px;
	border: 1px solid #000;
}


table.resultados {
	border: 1px solid #000;
	margin: 20px auto;
	background-color: #f00;
}

td.resultados {  /*asi permito que las tablas sigan saliendo sin borde, pero al añadir esto en el class del th si tiene*/
	padding-left: 5px;
	padding-top: 5px;
	text-align:left;
	font-size: 10px;
        font-weight:bold;
        color:#fff;
}


tr.uno {
	background-color: #ccc;
	text-align:center;
	font-size: 10px;
	border: 1px solid #fff;
}

tr.dos {
	background-color: #a9a9a9;
	text-align:center;
	font-size: 10px;
	border: 1px solid #fff;
}

p.tabla_partidos {
	text-align:justify;
	font-size: 10px;
       line-height: 1px; /*interlineado*/
}

/*******************
  hipervinculos!
********************/
a {
 text-decoration: none;
 border-bottom: 2px dotted #ff6600;
 color: #3366ff;
 background-color: transparent;}

a:hover {
  text-decoration: none;
  border-bottom: 1px dotted #ff6600; /*al ponerse encima la linea se hace continua*/
  color: #3366ff;
  /*font-weight:bold;*/ /*y el texto en negrita*/
  background-color: transparent;}

a img {
 border: none;
 text-decoration: none;
 border-bottom: 0px;}

a.img_hip { /*poniendo en el hipervinculo class="img_hip" me sale la imagen con vinculo sin subrayar*/
  text-decoration: none;
  border-bottom: 0px dotted #ff6600;
  color: #3366ff;
  background-color: transparent;
}

a.tab { /*para los vinculos externos de los tabs */
   color:#000;
   font-size:11px;
   text-decoration: none;
   float: right;
   border-bottom: 0px;
   background-position:right top;
   background-repeat:no-repeat;
   padding-right:20px;
}

a.resumen { /*para resumenes en los tabs */
   color:#000;
   font-size:11px;
   text-decoration: none;
   float: left;
   border-bottom: 0px;
   padding-right:20px;
   padding-top:0px;
   padding-bottom:0px;
}


/***********************
  IMAGENES
***********************/
img.border {  /*esto me permite recuadrar las imagenes siempre que ponga la etiqueta class="border" en la img*/
	border: 1px solid #C6C6C6;
	padding: 2px;
	margin-top: 5px;
}
img.border:hover { /*cambia el color del borde al ponerse encima, no funciona en IE6*/
	background: red;
	border: 0px solid #C6C6C6;
}
img.encuadrar{
	border: 1px solid #C6C6C6;
	padding: 3px;
	margin-top: 5px;
}

.cuadro_sinborde_movil {
    position: absolute;
	left: 235px;
    padding: 5px 5px 0px 5px;
    border-style: dotted;
    border-width:  2px;
    border-color: blue;
}

/*****************************************************
  fichas de las jugadoras
*****************************************************/
tr.fichas{
	background-color:#0099FF;
	text-align:center;
	margin:10px;
}

tr.fichas:hover{
	background-color:#33ccff;
	text-align:center;
	padding:10px;
}
td.fichas{padding:10px;
	text-align:center;}
th.fichas{padding:10px;}


/*********************************
  Tabla calendario
*********************************/

.tablaCalendario{
    background-color:#fff;
    border-style:solid;
    border-color:#666;
    border-width:1px;
    width:240px;
    /*height=180;*/
    /*cellpadding=2 cellspacing=2 */
}
.celdaTituloCalendario{
    background-color:#00f;
    font-weight:bold;
    width=100px;
    font-size:11pt;
    color:#fff;
    text-align:center;
}

.tablaCalendarioEsc{
    background-color:#fff;
    border-style:solid;
    border-color:#000;
    border-width:1px;
    font-size: 11px;
    width:750px;
}
.cal{
    text-font:verdana;
    background-color:#fff;
    font-size:9pt;
    color:#000;
    text-align:justify;
    padding-left:5px;
}

/* tabla fotos */
.CeldaTitulo {
	background-color:#39F;
    border-bottom-style:solid;
    border-bottom-color:#000;
    border-bottom-width:1px;
	text-align:center;
	font-size:12px;
}
.CeldaFotos {
    border-bottom-style:solid;
    border-bottom-color:#000;
    border-bottom-width:1px;
	text-align:center;
	font-size:12px;
}

/* tabla portada */
.tablaPortada{
    background-color:#fff;
    border-style:solid;
    border-color:#000;
    border-width:1px;
}
.tablaPortadaCelda{
    background-color:#fff;
    border-style:solid;
    border-color:#000;
    border-width:1px;
}

/****************************
LIGHTBOX EFFECT
****************************/
.black_overlay{ /* write mail */
    display: none;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    /*background: transparent url(/frontend/lightbox/images/blank.gif) no-repeat;*/ /* Trick IE into showing hover */
    z-index:1001;
    -moz-opacity: 0.8;
    opacity:.80;
    filter: alpha(opacity=80);
}

.white_content {
    display: none;
    position: absolute;
    top: 15%;
    left: 10%;
    width: 70%;
    height: 60%;
    padding: 16px;
    border: 15px solid orange;
    background-color: white;
    z-index:1002;
    overflow: auto;
}

/*******************
lightbox
***********************/
/* General Lightbox CSS */
/* Note! Replace the path to the background images with absolute URI's in case your images are not showing! */
#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none;
text-decoration: none;
border-bottom: 0px;
}

#outerImageContainer{ /* borde blanco alrd de la foto */
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 280px;
	margin: 0 auto;
	padding-bottom: 10px;
	}

#imageContainer{ padding: 10px;}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;}

#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;}

#imageContainer>#hoverNav{ left: 0; }
#hoverNav a{ outline: none;}

#prevLink {
	left: 0;
	float: left;
	display: block;
	background: url(/frontend/lbm/images/rew-light.gif) no-repeat;
	background-position: 2px 2px;
	width: 30px;
	}

#nextLink {
	right: 0;
	float: right;
	display: block;
	background: url(/frontend/lbm/images/fwd-light.gif) no-repeat;
	background-position: -2px 2px;
	width: 30px;}

#prevLink:hover, #prevLink:visited:hover { background: url(/frontend/lbm/images/rew-light-on.gif) no-repeat; background-position: 2px 2px; }
#nextLink:hover, #nextLink:visited:hover { background: url(/frontend/lbm/images/fwd-light-on.gif) no-repeat; background-position: -2px 2px; }

#numberDisplay{ display: block; text-align: center; font: 12px Verdana, Arial, Helvetica, sans-serif; font-weight: bold; padding-top: 14px; color: #666; }

#imageDataContainer{
	font: 13px Verdana, Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #ddd;
	margin: 0 auto;
	line-height: 15px;
        padding-top:5px;}

#imageData {padding:0 10px;}

/* change width value to set the lenght of the text line under photo */
#imageData #imageDetails{ width: 90%; float: left; text-align: left; }
#imageData #caption{ font-weight: bold; padding-top: 5px; }
#imageData #bottomNavClose{ width: 32px; float: right; height: 32px; background: url(/frontend/lbm/images/closer.gif) no-repeat; background-position: 1% 50%; padding-top: 10px; }
#imageData #bottomNavClose:hover{ width: 32px; float: right; height: 32px; background: url(/frontend/lbm/images/closer-on.gif) no-repeat; background-position: 1% 50%; padding-top: 10px; }

#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	/* Remove the next 3 lines to validate as CSS2 */
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block;
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}

/* Iframe CSS */
#lightboxIframe {
	z-index: 20;
	display: block;
	border: none;
	border-top: 1px solid #ddd;
	height: 400px;
	width: 600px;
	overflow: auto;
	position: absolute;
	top: 40px;
	left: 10px;
	}
#lightboxImage {
	position: absolute;
	top: 40px;
	left: 10px;
	}

/********************
  drop shadow on boxes
*********************/
#shadow-container {
	position: relative;
	left: 3px;
	top: 3px;
	margin-right: 3px;
	margin-bottom: 3px;
}

#shadow-container .shadow2,
#shadow-container .shadow3,

#shadow-container .container {
	position: relative;
	left: -1px;
	top: -1px;}

#shadow-container .shadow1 { background: #F1F0F1;}
#shadow-container .shadow2 { background: #DBDADB;}
#shadow-container .shadow3 { background: #B8B6B8;}

#shadow-container .container {
	background: #ffffff;
	border: 1px solid #848284;
	padding: 10px;}


/************** calendario para portada */
.calborder { background-color: #fff; border: 1px #A1A5A9 solid; }


/* Link colors and attributes */
/* This is the main link style */
a.psf		{ text-decoration: none; font-size:10px;}
a.psf:link	{ color: #0066FF; text-decoration: none; font-size:10px;}
a.psf:visited	{ color: #0066FF; }
a.psf:active	{ color: #3366CC; text-decoration: none; font-size:10px;}
a.psf:hover	{ color: #000099; text-decoration:  none; }

.V9G { font-family: Verdana, Geneva, Arial, Helvetica, sans-serif; font-size: 9px; color: #666666; }


/********postit */
#postit{
position:absolute;
width:300;
padding:5px;
background-color:yellow;
font-family: Verdana, Geneva, Arial, helvetica, sans-serif;
color: #000000;
font-size: 10px;
border:1px solid black;
visibility:hidden;
z-index:100;
a color: #000000;
}