@charset "utf-8";
/*Diseño, programación y CSS por Domingo Martínez
Utiliza lo que quieras de este código, pero sin plagiar la combinación única de colores, tamaños y tipografías.
*/


* {
  margin:0;
  padding:0;
  }
body {
  font: 76%/1.5 Arial, Helvetica, sans-serif;
  text-align:center;
  background-color: #000;
  }
/*contenedor*/
#contenedor {
  width: 950px;
  margin: 0 auto 0 auto;
  text-align:left;
  background-color: #fff;
  }
#contenido {
  padding-bottom:2em;

}

/*header*/
#header {
  height:80px;
  display:block;
  position:relative;
  margin:0;
  text-align:left;
  background: #E8F3FF url(../img/logo.gif) no-repeat 30px center;
  }

#header h1 {
  float:left;
  width:50%;
  display:none;
  }

/*pie de pagina*/

#pie {
  height:60px;
  position:relative;
  clear:both;
  text-transform:uppercase;
  color:#FFF;
  background: #80abff url(../img/fondo-pie.gif) no-repeat bottom;
  }
.copy {
  position:absolute;
  top:20px;right:30px;
  }

/*menús*/

ul#idioma {
  position:absolute;
  top:30px; right:30px;
  -bottom:-1px;
  margin:0;
  padding:0;
  list-style-type:none;
  }

ul#idioma li {
  float:left;
  margin:0;
  padding:0;
  }

ul#idioma li a {
  margin:0;
  padding:0 .6em;
  text-transform:uppercase;
  text-decoration:none;
  color:#00407f;
  display:block;
  -width:1em;
  }

ul#idioma li a:hover {
  color:#666;
  text-decoration:none;
  }

ul#idioma .actual a {
  color:#666;
  text-decoration:none;
  }

#menu2 {
  clear:both;
  text-align:right;
  padding-right: 20px;
  padding-top:10px;
}

#menu2 a {
  color:#006;
  text-decoration:none;
  text-transform:uppercase;

}

/*banner home*/
#home {
  float:left;
  position:relative;
  width:425px;
}
#home img {
  padding: 3px;
  margin:5px 0 0 5px;
  border:1px solid #fff;

}

#home .imgleft {
  width:425px;
  border:none;
  margin:0;
  padding:0;
}

#home h1, #home h2, #full_ciudad h1 {
  margin-top:1em;
  margin-right:20px;
  clear:both;
}
#home h1 {
  margin-bottom:1em;
}
#home h1 a {
  text-decoration:none;
  color: #00407F;
}
#home h1 a:hover {color:#80ABFF;}
#ciudad h2 {
  font-size:1.4em;
  margin-bottom:.3em;
}
#home h3 {font-size:1em;}

#ciudad {
  margin-bottom:2em;
  padding-bottom:1em;
  background:#f90 url('../img/borde-naranja-izquierda.gif') no-repeat bottom left;
}
  /*breadcumb*/
#breadcumb  {
  position:relative;
  text-transform:uppercase;
  padding:10px 20px;
  color:#E8F3FF;
  background-color:#00407F;
}
#breadcumb a {
  color: #FFF;
  text-transform:uppercase;
/*  text-decoration:none;
  font-weight:bold;*/
}
#breadcumb a:hover {color:#80ABFF;}

/*promos en home y resto*/
.promociones {
  width:46%;
  float:left;
  position: relative;
}
.promociones h2 {
  margin-top:.5em;
  margin-bottom:.5em;
  clear:both;
  background:#f90 url('../img/h2-borde-naranja.gif') no-repeat top right;
  padding:.2em 5px;
}
.promociones h2 a {
  font-weight:bold;
  font-size: .9em;
  color:#00407f;
  text-decoration:none;
}
.promociones h2 a:hover {color:#000;}
#home .homeprom, .promociones .homeprom {

  clear:both;
}
.homeprom h2 {
  font-size:1.4em;
  padding:10px 0 0 0;
  margin-bottom: 5px;
}
.homeprom h3 {
  font-size:1em;
  font-weight:bold;
  line-height:1.4;
  border-top:2px dotted #f90;
  padding-top:.3em;
  }
.homeprom p {
  margin-left:20px;
  margin-right:20px;
  line-height:1.4;
}
#ciudad a, .homeprom a {
  color:#000;
}
#home .homeprom img, .promociones .homeprom img {
  float:left;
  padding:0 16px 0 0;
  margin:0;
  margin-left:20px;
  margin-bottom:1em;
  border:none;
  background: transparent url(../img/sombra_foto.jpg) no-repeat bottom right;
}
.masinfo, .moreinfo {
  text-indent:-300em;
  padding:1em 0;
  }
.masinfo a, .moreinfo a {
  margin-left:167px;
  display:block;
  width:77px;
  height:23px;
  background: transparent url(../img/masinfo.gif) no-repeat;
}
.moreinfo a {
  background: transparent url(../img/moreinfo.gif) no-repeat;
}

/*prom por ciudades */
div#full_ciudad	{
  float:left;
  width: 525px;
  position:relative;
  background-color:#f4f4f4;
  }
  
 #full_ciudad p {
   margin:20px 100px;
 }
p#amplia {
  color:#666;
  font-size:10px;
  margin:0 20px 5px 10px;
}
#full_ciudad img {
  margin-top: 20px;
  border:0;
}
/*estáticas*/
#home .img-box-right	{
  margin:0;
  padding:0;
  border:none;
  float:left;
}

/*pie*/

ul#menupie  {
  position:absolute;
  top:20px;left:30px;
  padding:0;
  list-style-type:none;
  display:inline;
  }

ul#menupie li {
  padding-top:20px;
  list-style-type:none;
  display:inline;
  }
ul#menupie li a {
  border:none;
  text-decoration:none;
  color:#FFF;
  }
  
  /*títulos*/

h1 {
  font-size:1.5em;
  color:#00407F;
  margin-top:20px;
  margin-bottom: 5px;
  }

h1, h2, h3 {
  line-height: 1.2;
  font-weight:normal;
  margin-left:20px;
}
h2 {
  margin-bottom: 20px;
  font-size:1.4em;
}
#promocion p {margin:20px;}

/*imágenes*/
#promocion .imgleft  {
  float:left;
  margin: 0 15px 15px 0;
  }
  
/*promociones*/
#promocion {
  width:425px;
  float:left;
  margin-bottom:20px;
  }

#promocion h1 {
  font-size: 1.8em;
}
#promocion h2 {
  font-size:1.2em;
  background: transparent url(../img/icon/arrow_right.gif) no-repeat left;
  padding-left:20px;
}
#promocion h3 {
  font-weight:bold;
  margin-top: 2em;
}
#promocion p {font-size:1em;}
#promocion ul {
  font-size:1.1em;
  xborder-top:3px solid #00407F;
  xborder-bottom:3px solid #80ABFF;
  background-color:#FFA500;
  padding:20px 30px;
  }
#promocion li {
  margin-left:20px;
}
#promocion ul#subpromos {
  font-size: 1em;
  background-color:#FFF;
  margin:10px 30px 0 20px;
  padding:0;
}
#promocion  ul#subpromos li a  {
  color:#80ABFF;
  text-decoration:underline;
}
  
  /*galería*/
div#infoprom {
  background-color:#E8F3FF;
  width: 525px;
  float:right;
  padding-bottom:20px;
  }

#infoprom ul#extra {
  margin-top:20px;
  margin-left:30px;
  list-style:square;
  color:#ffa500;
}

#infoprom ul#extra li a {
  color:#00407F;
  font-weight:bold;
  text-decoration:none;
  }

#infoprom ul#extra li a:hover {
  color:#80ABFF;
  font-weight:bold;
  text-decoration:none;
  }

#infoprom ul#extra li.info {
  float:right;
  margin-right:20px;
  list-style:none;

}

#infoprom ul#extra li.info a {
  font-size:.95em;
  color: #fff;
  background-color:#00407F;
  padding:.4em;
  text-decoration:none;
  text-transform:uppercase;
  border-left: 5px solid #80ABFF;
}
#infoprom ul#extra li.info a:hover {
  background-color:#FFA500;
  color: #00407F;
  border-left: 5px solid #62b900;
}
/*otras promociones*/
#masproms {
  clear:both;
}
#masproms h2 {
  background:#f60 url('../img/masproms-borde.gif') no-repeat left top;
  color:#fff;
  margin:0;
  padding-left:20px;
  padding-top:5px;
  font-variant: small-caps;
  letter-spacing: .2em;
}
  #masproms ul {
    color: #f60;
    float:left;
    display:block; 
    width:30%; 
    padding:20px 0 2em 25px;
}
  #masproms li {
    color: #f60;
    margin-bottom:.5em;
}
  #masproms li a {
    color:#00407F;
    font-weight:bold;
    text-decoration:none;
}
  #masproms li a:visited {
  color: #0099FF;
}
ul#galeria {
    margin:30px 10px 10px 5px;
    padding-left:25px;
    background: transparent url('../img/camera_icon.gif') no-repeat left;
    }
    
  ul#galeria li {
    display:inline;
    margin:0;
    padding:0;
    list-style-type:none;
    }
  ul#galeria li a {
    background:#F0FFF0;
    font-size:10px;
    color:#00407F;
    padding:3px 6px;
    margin:0 0px 10px 0;
    text-decoration:none;
    border:1px solid #62b900;
    }
  ul#galeria li a:hover {
    background:#62b900;
    color:#fff;
    border:1px solid #62b900;
    }
            
  ul#galeria li a.current, ul#galeria li a:hover.current {
    color:#000;
    border:1px solid #000;
    background:#fff;
    }
#contenido #infoprom img {
  width:525px;

}

p#desc  {
  font:.95em Georgia, Times, serif;
  font-style:italic;
  color: #555;
  float:right;
  margin-right:20px;
  padding:5px;
}
#promocion p.precio {
  font-size:14px;
  font-weight:bold;
  color:#00407F;
  background: transparent url(../img/icon/arrow_right.gif) no-repeat left;
  padding-left:20px;
  margin-bottom:0;
}
#promocion p.precio span {
  font-size:10px;
  font-weight:normal;
}

/*MAPA MAPA MAPA */
/* set the size of the definition list <dl> and add the background image */
div#mapahome {
float:left;
}
#imap {
  display:block;
  width:525px; 
  height:648px; 
  background: #fff url(../img/supermapa525.gif) no-repeat; 
  position:relative;
  }

/* set up the definition list <dt><a> to hold the background image for the hover state */
#imap a#title {
  display:block; 
  height:0; 
  width:525px; 
  padding-top:648px; 
  background: #fff url(../img/supermapa525.gif) no-repeat; 
  overflow:hidden; 
  position:absolute; 
  left:0; top:0; 
  background:transparent; 
  cursor:default;}
/* the hack for IE pre IE6 */
* html #imap a#title {
  height:648px; _height:492px; he\ight:0;}

/* the <dt><a> hover style to move the background image to position 0 0*/
#imap a#title:hover {
  background-position: 0 0; 
  z-index:10;}

/* place the <dd>s in the correct absolute position */

#imap dd {position:absolute; padding:0; margin:0;}
#imap #picl {left:193px; top:300px; z-index:20;}
#imap #picpl {left:163px; top:337px; z-index:20;}
#imap #picpul {left:183px; top:370px; z-index:20;}
#imap #picag {left:233px; top:383px; z-index:20;}
#imap #piccue {left:140px; top:419px; z-index:20;}
#imap #picpo {left:205px; top:400px; z-index:20;}
#imap #picpalo {left:170px; top:437px; z-index:20;}
#imap #picsorb {left:100px; top:475px; z-index:20;}
#imap #pichue {left:135px; top:392px; z-index:20;}

/*
#imap #picl {left:340px; top:185px; z-index:20;}
#imap #picpl {left:310px; top:222px; z-index:20;}
#imap #picpul {left:335px; top:253px; z-index:20;}
#imap #picag {left:383px; top:266px; z-index:20;}
#imap #piccue {left:286px; top:303px; z-index:20;}
#imap #picpo {left:352px; top:285px; z-index:20;}
#imap #picpalo {left:320px; top:322px; z-index:20;}
#imap #picsorb {left:246px; top:359px; z-index:20;}
#imap #pichue {left:278px; top:278px; z-index:20;}
*/



/* style the <dd><a> links physical size and the background image for the hover */
#imap a#lorca, #imap a#puerto, #imap a#pulpi, #imap a#aguilas, #imap a#cuevas, #imap a#pozo, #imap a#palomares, #imap a#sorbas, #imap a#huercal {
  display:block; 
  width:80px; 
  height:24px;
  background:transparent; 
  text-decoration:none; 
  z-index:20;}

/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {
  display:none;}

/* move the link background image to position 0 0 when hovered */
#imap a#lorca:hover, #imap a#puerto:hover, #imap a#pulpi:hover, #imap a#aguilas:hover, #imap a#cuevas:hover, #imap a#pozo:hover, #imap a#palomares:hover, #imap a#sorbas:hover, #imap a#huercal:hover {
  background-position:0 0;}

/* define the common styling for the span text */
#imap a:hover span {
  position:absolute;
  width:170px; 
  display:block; 
  font-family:arial; 
  font-size:.9em; 
  background:#fff; 
  color:#000; 
  border:1px solid #4682B4; 
  padding:5px;
}
/* the hack for IE pre IE6 */
* html #imap a:hover span {
  /*width:525px; 
  w\idth:513px;
  */}
/* move the span text to a common position at the bottom of the image map */
/*#imap a:hover span {
  left:75px; top:75px;}*/
  
#imap a#lorca:hover span {
  left:130px; top:150px;}
#imap a#puerto:hover span {
  left:160px; top:114px;}
#imap a#pulpi:hover span {
  left:135px; top:82px;}
#imap a#aguilas:hover span {
  left:87px; top:68px;}
#imap a#cuevas:hover span {
  left:186px; top:32px;}
#imap a#pozo:hover span {
  left:118px; top:50px;}
#imap a#palomares:hover span {
  left:150px; top:13px;}
#imap a#sorbas:hover span {
  left:86px; top:68px;}
#imap a#huercal:hover span {
  left:192px; top:59px;}

/* add the style for the link span text - first line */
#imap a span:first-line {
  font-weight:bold; 
  font-style:italic;}

/*restringido*/
#breadcumb .restringido {
  position:absolute;
  right:30px;
  top:12px;
  font-size:10px; 
  background: transparent url('../img/icon_key.gif') no-repeat left;
  padding-left:15px;
}

#breadcumb .restringido a {
  text-decoration:none;
  text-transform:lowercase;
}

/*tipo*/
.small {font-size:10px; text-transform:none;}