html, body, ul, li {
margin: 0;
padding: 0;
list-style: none;
}
@font-face {
font-family: 'GreatVibesRegular';
src: url('fonts/GreatVibes-Regular-webfont.eot');
src: url('fonts/GreatVibes-Regular-webfont.eot?#iefix') format('embedded-opentype'),
	 url('fonts/GreatVibes-Regular-webfont.woff') format('woff'),
	 url('fonts/GreatVibes-Regular-webfont.ttf') format('truetype'),
	 url('fonts/GreatVibes-Regular-webfont.svg#GreatVibesRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
    font-family: 'AndikaBasicRegular';
    src: url('fonts/Andika-Basic-fontfacekit/AndBasR-webfont.eot');
    src: url('fonts/Andika-Basic-fontfacekit/AndBasR-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Andika-Basic-fontfacekit/AndBasR-webfont.woff') format('woff'),
         url('fonts/Andika-Basic-fontfacekit/AndBasR-webfont.ttf') format('truetype'),
         url('fonts/Andika-Basic-fontfacekit/AndBasR-webfont.svg#AndikaBasicRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}
body {
background: #000 url(img/bg_enc.png) repeat-x;
font: 10px/18px AndikaBasicRegular, Georgia, Arial, Helvetica, sans-serif;
color:#999999;
}
a img {
border: none;
}
a {
text-decoration: none;
color: #EC1188;
}
a:hover {
color: #FFF;
}
#contenedor {
width: 1000px;
margin: 0 auto;
position: relative;
font-size: 1.4em;
}
#encabezado {
width: 1000px;
height: 144px;
background: url(img/logo.png) no-repeat 0 25px;
}
#logo {
position:absolute;
display: block;
width: 276px;
height: 144px;
}
#aniversario {
position: absolute;
right: -240px;
top: -1px;
width: 145px;
height: 227px;
}
#encabezado ul {
position: absolute;
left: 276px;
top: 90px;
}
#encabezado ul li, #destacados ul li {
float: left;
}
#encabezado ul li a {
display: block;
height: 38px;
background: url(img/menu.png);
}
#encabezado ul li a.empresa {
width: 93px;
}
#encabezado ul li a.novedades {
width: 94px;
background-position: -97px 0;
}
#encabezado ul li a.productos {
width: 97px;
background-position: -187px 0;
}
#encabezado ul li a.gastronomica {
width: 168px;
background-position: -284px 0;
}
#encabezado ul li a.franquicias {
width: 106px;
background-position: -452px 0;
}
#encabezado ul li a.contacto {
width: 85px;
background-position: -558px 0;
}
#encabezado ul li a.facebook {
width: 81px;
background-position: -643px 0;
}
#encabezado ul li a.empresa:hover {
background-position: 0 -38px;
}
#encabezado ul li a.novedades:hover {
background-position: -97px -38px;
}
#encabezado ul li a.productos:hover {
background-position: -187px -38px;
}
#encabezado ul li a.gastronomica:hover {
background-position: -284px -38px;
}
#encabezado ul li a.franquicias:hover {
background-position: -452px -38px;
}
#encabezado ul li a.contacto:hover {
background-position: -558px -38px;
}
#encabezado ul li a.facebook:hover {
background-position: -643px -38px;
}
.clear {
clear: both;
}
#cuerpo {
width: 1000px;
background: url(img/bg_contenedor.jpg) no-repeat;
min-height: 300px;
padding: 80px 0 40px 0;
}
#col_izq {
width: 400px;
float: left
}
#col_der {
margin-top: 70px;
width: 470px;
margin-left: 100px;
float: left;
padding: 14px;
border: 1px solid #999;
}
h1 {
font: 2.7em/1.2em 'GreatVibesRegular';
color:#CCCCCC;
margin: 0;
}
h3 {
color: #ec1188;
font-weight: bold;
letter-spacing: .2em;
font-size: .7em;
text-transform: uppercase;
margin: 0;
margin-top: 5px;
font-family: Arial, Helvetica, sans-serif;
}
.separador {
height: 1px;
width: 724px;
background: #EC1188;
margin: 20px 0 15px 0;
}
#izquierda {
width: 226px;
margin-right: 50px;
float: left;
}
#derecha {
width: 724px;
float: left;
}
.productos #derecha p, .gastronomica #derecha p {
margin-top: .4em;

}
.gastro {
position: relative;
min-height: 150px;
}
.gastro img {
position: absolute;
}
.gastro p, .gastro h3 {
margin-left: 190px;
}
.gastro h3 {
padding-top: 40px;
}
.fotos_franquicias {
background: url(img/fotos_locales.jpg);
width: 226px;
height: 180px;
position: relative;
}
.fotos_franquicias a {
display: block;
height: 180px;
width: 226px;
background:url(img/bg_a_destacados.png);
}
.fotos_franquicias a:hover {
background: none;
}
#destacados {
padding-top: 30px;
}
#destacados ul {
margin-top: 20px;
width: 1000px;
height: 275px;
background: url(img/bg_destacados2.jpg);
}
#destacados ul li a {
display: block;
height: 275px;
width: 202px;
background:url(img/bg_a_destacados.png);
}
#destacados ul li a.ultimo {
width: 192px;
}
#destacados ul li a:hover {
background: none;
}
form {
margin-top: 52px;
color: #ec1188;
font-weight: bold;
letter-spacing: .2em;
font-size: .7em;
text-transform: uppercase;
font-family: Arial, Helvetica, sans-serif;
}
input.btn {
padding: 10px 15px;
}
input.datos, textarea.datos {
border: 1px solid #999;
background: url(img/bg_input.png) right 0 repeat-y;
font-family: AndikaBasicRegular, Arial, Helvetica, sans-serif;
font-size: 1.4em;
color: #999;
width: 718px;
padding: 3px;
}
.franq {
width: 220px;
padding: 20px 0 0 100px;
float: left;
}
#pie {
height: 50px;
width: 1000px;
background: url(img/bg_pie.jpg) no-repeat;
text-align: center;
padding-top: 40px;
color:#666666;
font-size: .9em;
border-top: solid 1px #333333;
}
#pie span {
color: #EC1188;
}
.envios {
height: 112px;
text-align: center;
padding: 20px 0;
}
#home .envios {
position:absolute;
top: 150px;
right: -70px;
}

/* -------------------------------------------------------------------------------------- PIKACHOOSE */
/* Style the thumbnails */
.pika-thumbs{ display: none;}
	
/* The stage is the wrapper. The image fills 100% the height of the stage */
.pika-stage, .pika-textnav {width: 724px;}
.pika-stage {position: relative; left:276px; /*background: #fafafa; border: 1px solid #e5e5e5; padding: 10px 10px 40px 10px; text-align:center;*/ height:370px;}
.pika-stage img{height:100%;}
.pika-stage .caption {position: absolute; left: -276px; top: 0; width:226px;/*background: #000; background: rgba(0,0,0,0.75);  border: 1px solid #141414; font-size: 11px; 
			color: #fafafa; padding: 10px; text-align: right; bottom: 50px; right: 10px;*/}
/*	.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}*/

/* Ths play, pause, prev and next buttons */
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
	.pika-imgnav a.previous {background: url(img/prev.png) no-repeat left 45%; height: 100%; width: 50px; top: 10px; left: -326px;cursor:pointer;}
	.pika-imgnav a.next {background: url(img/next.png) no-repeat right 45%; height: 100%; width: 50px; top: 10px; right: -50px;cursor:pointer;}
	/*.pika-imgnav a.play {background: url(img/play.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display: none;cursor:pointer;}
	.pika-imgnav a.pause {background: url(img/pause.png) no-repeat 0% 50%; height: 100px; width: 44px;top:0;left:50%;display:none;cursor:pointer;}*/

/* The previous and next textual buttons */
.pika-textnav {display:none;/*overflow: hidden; margin: 10px 0 0 0;bottom:10px; position:absolute;}
.pika-textnav a {font-size: 12px; text-decoration: none; color: #333; padding: 4px;}
	.pika-textnav a.previous {float: left; width: auto; display: block;}
	.pika-textnav a.next {float: right; width: auto; display: block;*/}

/*for the tool tips*/
.pika-tooltip{/*font-size:12px;position:absolute;color:white;padding:3px; background-color: rgba(0,0,0,0.7);border:3px solid black;*/}
.pika-counter{display: none;/*position: absolute;bottom: 45px;left:15px;color:white;background:rgba(0,0,0,0.7);font-size:11px;padding:3px;-moz-border-radius: 5px;border-radius:5px;*/}

/* If using user thumbnails there's a pause well the new large image loads. This is the loader for that */		
.pika-loader{ background:url(img/loading.gif) 3px 3px no-repeat #000; background-color:rgba(0,0,0,0.9); color:white; width:60px; font-size:11px; padding:5px 3px; 
	text-align:right; position:absolute; top:15px; right:15px; }
	
/*------------------------------------------------------------ 	COLORBOX  -----------------------------------------------------------*/
/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;}
#colorbox{font-size: 1.1em;}
    #cboxTopLeft{width:25px; height:25px; background:url(img/border1.png) no-repeat 0 0;}
    #cboxTopCenter{height:25px; background:url(img/border1.png) repeat-x 0 -50px;}
    #cboxTopRight{width:25px; height:25px; background:url(img/border1.png) no-repeat -25px 0;}
    #cboxBottomLeft{width:25px; height:25px; background:url(img/border1.png) no-repeat 0 -25px;}
    #cboxBottomCenter{height:25px; background:url(img/border1.png) repeat-x 0 -75px;}
    #cboxBottomRight{width:25px; height:25px; background:url(img/border1.png) no-repeat -25px -25px;}
    #cboxMiddleLeft{width:25px; background:url(img/border2.png) repeat-y 0 0;}
    #cboxMiddleRight{width:25px; background:url(img/border2.png) repeat-y -25px 0;}
    #cboxContent{background:#fff;}
        .cboxIframe{background:#000;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:20px;}
        #cboxTitle{position:absolute; bottom:0px; left:0; text-align:center; width:100%; color:#999;}
        #cboxCurrent{position:absolute; bottom:-5px; left:0; text-align: center; width: 100%; color:#999;}
        #cboxSlideshow{position:absolute; bottom:0px; right:42px; color:#444;}
        #cboxPrevious{position:absolute; bottom:-5px; left:0; color:#444;}
        #cboxNext{position:absolute; bottom:-5px; left:63px; color:#444;}
        #cboxLoadingOverlay{background:#fff url(img/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; bottom:-5px; right:0; display:block; color:#444;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

/*
  The following provides PNG transparency support for IE6
  Feel free to remove this and the /ie6/ directory if you have dropped IE6 support.
*/
.cboxIE6 #cboxTopLeft{background:url(../images/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url../(images/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(../images/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(../images/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(../images/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(../images/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(../images/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(../images/ie6/borderMiddleRight.png);}

.cboxIE6 #cboxTopLeft,
.cboxIE6 #cboxTopCenter,
.cboxIE6 #cboxTopRight,
.cboxIE6 #cboxBottomLeft,
.cboxIE6 #cboxBottomCenter,
.cboxIE6 #cboxBottomRight,
.cboxIE6 #cboxMiddleLeft,
.cboxIE6 #cboxMiddleRight {
    _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");
}
	
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/	