@font-face {
    font-family: 'bebas_neuebook';
    src: url('fonts/bebasneue_book-webfont.eot');
    src: url('fonts/bebasneue_book-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/bebasneue_book-webfont.woff2') format('woff2'),
         url('fonts/bebasneue_book-webfont.woff') format('woff'),
         url('fonts/bebasneue_book-webfont.ttf') format('truetype'),
         url('fonts/bebasneue_book-webfont.svg#bebas_neuebook') format('svg');
    font-weight: normal;
    font-style: normal;}
	
body { margin:0px;}
img { border:0px}

.logo-cajadeande { z-index:100; width:107px; height:78; position:absolute; margin-top:50px; margin-left:10px;}

/*header*/
.gray-line {
	height:30px;
	width:100%;
	background-color:#055f26;
	margin-bottom:6px;}
	
.title {
	width:100%;
	height:110px;
	width:100%;
	background: url(images/bg-encabezado.jpg) repeat-x;
	text-align:center;}

.title h1 {
	font-family: 'bebas_neuebook';
	margin:0px;
	padding:5px 0 0 0;
	font-size:60px;
	color:#fff;}
	
.title h2 {
	font-family: 'bebas_neuebook';
	margin:0px;
	padding:0px;
	font-size:25px;
	color:#fff;}
/*header*/

/*menu*/
.menu { width: 90%; margin:10px auto; text-align:center;}
.menu img { margin:5px;}
/*menu*/

/*banner*/
.banner { height:400px; width:100%; background:#1A1A1A; overflow:hidden;}

.textos-banner-izq { font-family:'Century Gothic'; float:right; height:271px; margin-top:129px; width:55%; color:#FFF;}
.textos-banner-izq h1 { padding:0px; margin:0px; font-size:19px;}
.textos-banner-izq h2 { padding:0px; margin:0px; font-size:35px;}
.textos-banner-izq h3 { padding:0px; margin:20px 0 0 0; font-size:27px;}
.textos-banner-izq h4 { padding:0px; margin:0px; font-size:15px;}

.textos-banner-der { font-family:'Century Gothic'; float:left; height:271px; margin-top:129px; width:45%; color:#FFF; text-align:right;}
.textos-banner-der h1 { padding:0px; margin:0px; font-size:19px;}
.textos-banner-der h2 { padding:0px; margin:0px; font-size:35px;}
.textos-banner-der h3 { padding:0px; margin:20px 0 0 0; font-size:27px;}
.textos-banner-der h4 { padding:0px; margin:0px; font-size:15px;}



/*animacion*/
.banner-image1 {float:left; animation:banner1 1000s 1 linear;}
@keyframes banner1 {
	0% { margin-left:-100%;}
	0.1% { margin-left:20%;}
	100% { margin-left:20%;}}
	
.banner-image2 {float:right; animation:banner2 1000s 1 linear;}
@keyframes banner2 {
	0% { margin-right:-100%;}
	0.1% { margin-right:20%;}
	100% { margin-right:20%;}}

/*animacion*/

/* Boton Banner dorado */
@-webkit-keyframes boton-dorado {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
@keyframes boton-dorado {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
  
.boton-dorado {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  text-decoration:none;
  font-family: 'bebas_neuebook';
  font-size:28px;
  color:#fff;
  margin-top:30px;
  height:39px;
  width:149px;
  padding-top:10px;
  text-align:center;
  background:#4c3007;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border: 0px;}
  
.boton-dorado:hover, .boton-dorado:focus, .boton-dorado:active {
  -webkit-animation-name: boton-dorado;
  animation-name: boton-verde;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;}
/* Boton Banner Dorado */

/* Boton Banner Rojo */
@-webkit-keyframes boton-rojo {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
@keyframes boton-rojo {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
  
.boton-rojo {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  text-decoration:none;
  font-family: 'bebas_neuebook';
  font-size:28px;
  color:#fff;
  margin-top:30px;
  height:39px;
  width:149px;
  padding-top:10px;
  text-align:center;
  background:#51030e;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border: 0px;}
  
.boton-rojo:hover, .boton-rojo:focus, .boton-rojo:active {
  -webkit-animation-name: boton-verde;
  animation-name: boton-verde;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;}
/* Boton Banner Rojo */

/* Boton Banner Verde */
@-webkit-keyframes boton-verde {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
@keyframes boton-verde {
  25% { -webkit-transform: scale(1.1); transform: scale(1.1);}
  75% { -webkit-transform: scale(0.9); transform: scale(0.9);}}
  
.boton-verde {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px transparent;
  text-decoration:none;
  font-family: 'bebas_neuebook';
  font-size:28px;
  color:#fff;
  margin-top:30px;
  height:39px;
  width:149px;
  padding-top:10px;
  text-align:center;
  background:#01210c;
  border-radius: 10px 10px 10px 10px;
  -moz-border-radius: 10px 10px 10px 10px;
  -webkit-border-radius: 10px 10px 10px 10px;
  border: 0px;}
  
.boton-verde:hover, .boton-verde:focus, .boton-verde:active {
  -webkit-animation-name: boton-verde;
  animation-name: boton-verde;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;}
/* Boton Banner Verde */

/*banner*/

/*texto*/
.texto { width:100%; text-align:center; font-family:'Century Gothic'; font-size:14px; margin:50px 0px;}
.texto-gris { color:#1A1A1A; font-weight:bold;}
.texto-dorado { color:#a87b2d; font-weight:bold;}
.texto-verde { color:#055f26; font-weight:bold;}
.texto-rojo { color:#c40117; font-weight:bold;}
/*texto*/

/*products*/
.products-list { width:90%; margin: 0 auto; text-align:center; overflow:hidden;}

.products {
	width:368px;
	height:397px;
	background:url(images/bg-products.png);
	margin:0px 15px 60px 15px;
	position:relative;
	display:inline-table;}

.products img { position:relative;}

.precio {
	width:50%;
	background:#000;
	position:absolute;
	bottom:0px;
	right:0px;
	text-align:center;
	z-index:2;
	font-family: 'bebas_neuebook';
	color:#fff;
	font-size:24px;
	text-align:right;
	padding:5px 10px;}

.precio span { font-size:15px;}
/*products*/

#dorado {background:#a87b2d;}
#rojo {background:#c40117;}
#verde {background:#055f26;}

	
.descuento {
	width:93px;
	height:79px;
	position:absolute;
	top:0px;
	float:left;
	text-align:center;
	z-index:2;}
	
.descuento h1 {
	font-family: 'bebas_neuebook';
	margin:0px;
	padding:0px;
	font-size:50px;
	color:#fff;}
	
.descuento h2 {
	font-family: 'bebas_neuebook';
	margin:0px;
	padding:0px;
	font-size:17px;
	color:#fff;}
	
.ahorre {
	width:140px;
	height:79px;
	position:absolute;
	top:0px;
	float:left;
	text-align:center;
	z-index:2;}
	
.ahorre h1 {
	font-family: 'bebas_neuebook';
	margin:5px 0px 0px 0px;
	padding:0px;
	font-size:30px;
	color:#fff;}
	
.ahorre h2 {
	font-family: 'bebas_neuebook';
	margin:-5px 0px 0px 0px;
	padding:0px;
	font-size:40px;
	color:#fff;}
		
/*nombre verde*/	
.nombre-verde {
	width:80%;
	background:#4D4D4D;
	position:absolute;
	bottom:45px;
	float:left;
	text-align:center;
	z-index:2;
	font-family: 'bebas_neuebook';
	color:#fff;
	font-size:30px;
	text-align:left;
	padding:10px 20px;
	-webkit-transform: perspective(1px) translateZ(0);
  	transform: perspective(1px) translateZ(0);
 	box-shadow: 0 0 1px transparent;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;}
	
.nombre-verde:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #055f26;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;}
	
.nombre-verde:hover, .nombre-verde:focus, .nombre-verde:active {color: white;}
.nombre-verde:hover:before, .nombre-verde:focus:before, .nombre-verde:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
/*nombre verde*/

/*nombre dorado*/	
.nombre-dorado {
	width:80%;
	background:#4D4D4D;
	position:absolute;
	bottom:45px;
	float:left;
	text-align:center;
	z-index:2;
	font-family: 'bebas_neuebook';
	color:#fff;
	font-size:30px;
	text-align:left;
	padding:10px 20px;
	-webkit-transform: perspective(1px) translateZ(0);
  	transform: perspective(1px) translateZ(0);
 	box-shadow: 0 0 1px transparent;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;}
	
.nombre-dorado:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #a87b2d;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;}
	
.nombre-dorado:hover, .nombre-dorado:focus, .nombre-dorado:active {color: white;}
.nombre-dorado:hover:before, .nombre-dorado:focus:before, .nombre-dorado:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
/*nombre dorado*/

/*nombre rojo*/	
.nombre-rojo {
	width:80%;
	background:#4D4D4D;
	position:absolute;
	bottom:45px;
	float:left;
	text-align:center;
	z-index:2;
	font-family: 'bebas_neuebook';
	color:#fff;
	font-size:30px;
	text-align:left;
	padding:10px 20px;
	-webkit-transform: perspective(1px) translateZ(0);
  	transform: perspective(1px) translateZ(0);
 	box-shadow: 0 0 1px transparent;
	-webkit-transition-property: color;
	transition-property: color;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;}
	
.nombre-rojo:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #c40117;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: 0 50%;
	transform-origin: 0 50%;
	-webkit-transition-property: transform;
	transition-property: transform;
	-webkit-transition-duration: 0.5s;
	transition-duration: 0.5s;
	-webkit-transition-timing-function: ease-out;
	transition-timing-function: ease-out;}
	
.nombre-rojo:hover, .nombre-rojo:focus, .nombre-rojo:active {color: white;}
.nombre-rojo:hover:before, .nombre-rojo:focus:before, .nombre-rojo:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
  -webkit-transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);
  transition-timing-function: cubic-bezier(0.52, 1.64, 0.37, 0.66);}
/*nombre rojo*/



/*footer*/
.gray-line-footer { height:7px; width:100%; background:#1A1A1A; margin-top:20px;}
.logo { width:367px; margin:0 auto 40px; text-align:center;}
/*footer*/


/*home*/
.home-gray-line {
	height:30px;
	width:100%;
	background-color:#1A1A1A;
	margin-bottom:6px;}
	
.cinta {
	width:100%;
	background:url(images/cinta.png) no-repeat;
	background-size:cover;
	top:0px;
	z-index:2;
	height:293px;
	position:absolute;}
	
.bg-home {
	background-color:#000;
	background-size:cover;
	background-image:url(images/bg-home.jpg);
	width:100%;
	text-align:center;
	margin:0px;
	height:150%;
	position:absolute;}
	
.texto-home {
	font-family: 'bebas_neuebook';
	color:#fff;
	margin-top:60px;}

.texto-home img { margin:30px;}
.texto-home h1 { font-family: 'bebas_neuebook'; font-size:155px; margin:0px; padding:0%;}
.texto-home h2 { font-family: 'bebas_neuebook'; font-size:45px; margin:-15px 0 0 0; padding:0%;}
.texto-home h3 { font-family: 'bebas_neuebook'; font-size:35px; margin:0px; padding:0%;}
.texto-home h3 a { font-family: 'bebas_neuebook'; font-size:35px; margin:0px; padding:0%; text-decoration:none; color:#fff;}
.texto-home h3 a:hover { font-size:40px; color:#F7931E;}

	


/*home*/