@charset "CP850";
/*
	##################################### IMPORTANTE #####################################
	1.- Mantener el orden de las hojas de estilo, ya que los exploradores las renderizan 
	por orden.
	2.- La hoja de estilos específica para Internet Explorer la incluiremos mediante 
	comentario condicional dentro del marcado xHTML cuando proceda POSTERIORMENTE a 
	la llamada a master.css para que prevalezcan.
	######################################################################################
*/
/* CSS Reset inicial de estilos y comportamientos comunes e incluye fuentes especiales*/
@import url("html5-doctor-reset-stylesheet.min.css");
@import url(fonts.css);
/* CSS Donde se incluirán las etiquetas genéricas de la web */
/*
	######################################################################################
	Nombre: CSS Generics
	Descripción: CSS donde se incluirán los estilos de las etiquetas comunes de toda la web
	######################################################################################
*/
/*	CUERPO
+++++++++++++++++++++++++++++++++++++++++++++++
*/
@import url(../bootstrap/css/addons.css);
html, body {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 14px;
  color: #6f6e6e;
  background: #77b82a;
  margin: 0;
  padding: 0;
  height: 100%; }

p {
  margin: 0 0 18px 0;
  text-align: left;
  font-style: normal; }

figure {
  margin: 0; }

figcaption {
  margin: 0; }

blockquote {
  padding: 15px 30px;
  margin: 30px 30px;
  font-size: 1,1em;
  font-style: italic; }

strong {
  color: inherit;
  font-weight: normal; }

/*	FIN CUERPO
-----------------------------------------------*/
/*	ENLACES
+++++++++++++++++++++++++++++++++++++++++++++++
*/
a {
  font-style: normal; }
  a:link, a:visited {
    color: #77b82a;
    text-decoration: none; }
  a:hover, a:active {
    color: #da8338;
    text-decoration: none; }

/*	FIN ENLACES
-----------------------------------------------*/
/*	LISTADO
+++++++++++++++++++++++++++++++++++++++++++++++
*/
ul {
  list-style: none;
  margin: 10px 0;
  padding: 0; }
  ul li {
    /*background: url(../img/ico_bullet.png) no-repeat left 4px;*/
    margin: 10px 0;
    padding-left: 20px;
    font-style: italic; }

/*	FIN LISTADO
-----------------------------------------------*/
/*	FORMULARIO
+++++++++++++++++++++++++++++++++++++++++++++++
*/
form {
  margin: 0; }

input, select, textarea {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
  font-size: 12px;
  color: #515151;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #eee;
  border-right: 1px solid #eee;
  padding-left: 5px; }

input {
  height: 22px;
  line-height: 22px; }

input:focus, textArea:focus {
  background: #eee; }

/*	FIN FORMULARIO
-----------------------------------------------*/
/*	TITULARES
+++++++++++++++++++++++++++++++++++++++++++++++
*/
h1 {
  margin: 0;
  padding: 0; }

h2 {
  margin: 0;
  padding: 0;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

h3 {
  margin: 0;
  padding: 0; }

h4 {
  margin: 0;
  padding: 0;
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

h5 {
  margin: 0;
  padding: 0; }

hgroup {
  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

/*	FIN TITULARES
-----------------------------------------------*/
/*	EXTRAS
+++++++++++++++++++++++++++++++++++++++++++++++
*/
lear, .clearRight, .clearLeft {
  margin: 0;
  padding: 0;
  clear: both; }

.clearRight {
  clear: left; }

.clearLeft {
  clear: right; }

.alignLeft {
  text-align: left; }

.alignRight {
  text-align: right; }

.alignCenter {
  text-align: center; }

.centrado {
  display: block;
  margin: 0  auto; }

.reset, .nav ul, .nav ul li {
  margin: 0;
  padding: 0; }

.fl {
  display: block;
  float: left; }

.fr {
  display: block;
  float: right; }

.debug {
  outline: 1px solid red; }

/* CSS Donde se incluirá el layout de la web */
.innerContent, footer {
  width: 980px;
  margin: 0 auto;
  position: relative;
  height: auto; }

.preFooter {
  height: 235px; }

/*
	######################################################################################
	Nombre: CSS Layout web
	Descripción: CSS donde se incluirá el diseño de la web
		Tabla de contenidos:
			1.- capas globales
			2.- cabecera
			3.- menu
			4.- cuerpo
			5.- contenido
			6.- pie
	######################################################################################
*/
/*	CAPAS GLOBALES
+++++++++++++++++++++++++++++++++++++++++++++++
*/
div#global {
  width: 100%;
  text-align: center;
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto;
  margin-bottom: -235px; }

header {
  display: block; }

nav {
  display: block; }

aside {
  display: block; }

section {
  display: block; }

article {
  display: block; }

footer {
  display: block; }

/*	FIN CAPAS GLOBALES
-----------------------------------------------
*/
/*	CABECERA
+++++++++++++++++++++++++++++++++++++++++++++++
*/
/*	FIN CABECERA
-----------------------------------------------
*/
/*	MENU
+++++++++++++++++++++++++++++++++++++++++++++++
*/
/*	FIN MENU
-----------------------------------------------
*/
/*	CUERPO
+++++++++++++++++++++++++++++++++++++++++++++++
*/
.container {
  max-width: 940px !important;
  background-color: #fff;
  overflow: hidden; }

section.cabecera {
  padding-top: 3%;
  max-height: 500px;
  height: auto;
  position: relative;
  background-image: url(../img/bg_header.jpg);
  -webkit-background-size: auto 100%;
  background-size: auto 100%; }
  section.cabecera img.logo {
    max-height: 250px; }
  section.cabecera .cabecera_bg {
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
    background-image: url(../img/mano.png);
    background-position: right bottom;
    -webkit-background-size: auto 100%;
    background-size: auto 90%;
    background-repeat: no-repeat; }
  section.cabecera h1 img {
    display: inline-block; }

.tiendas {
  margin-top: 10px;
  margin-bottom: 60px; }
  .tiendas span.comingSoon {
    display: block;
    color: #fff;
    font-size: 10px;
    padding-left: 4px;
    margin-top: 2px;
    text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.6); }

.nav {
  min-height: 61px;
  height: auto;
  background-image: url(../img/bg_menu.png);
  background-repeat: repeat;
  background-position: 0 0;
  margin-top: -0%;
  z-index: 20;
  position: relative;
  margin-bottom: 20px; }
  .nav ul {
    list-style: none; }
    .nav ul li {
      display: inline-block;
      list-style: none;
      color: #fff; }
      .nav ul li img {
        max-height: 40px !important; }
      .nav ul li a:link, .nav ul li a:visited {
        color: #fff;
        font-weight: bold; }
      .nav ul li a:hover, .nav ul li a:active {
        opacity: 0.8;
        filter: alpha(opacity=80); }
  .nav ul.menuL li {
    padding-top: 12px;
    display: inline-block; }
    .nav ul.menuL li img {
      max-width: 37px; }
      @media (min-width: 768px) {
        .nav ul.menuL li img {
          max-width: 52px; } }
      @media (min-width: 992px) {
        .nav ul.menuL li img {
          max-width: 62px; } }
      @media (min-width: 1200px) {
        .nav ul.menuL li img {
          max-width: 75px;
          margin-right: 20px; } }
  .nav ul.menuR {
    padding-top: 10px;
    float: right;
    height: auto;
    text-align: left; }
    @media (min: 1200px) {
      .nav ul.menuR {
        float: right;
        text-align: right; } }
    .nav ul.menuR li {
      display: inline-block;
      padding-top: 3px; }
      .nav ul.menuR li:not(:last-child):after {
        content: '|';
        margin-right: 2px;
        padding-right: 1px; }

section.planta img, section.social img {
  margin-top: 30px;
  max-height: 300px; }

section.separador {
  height: auto; }
  section.separador img {
    width: 100%; }

section.abajo img {
  margin-top: 30px; }

/*	FIN CUERPO
-----------------------------------------------
*/
/*	CONTENIDO
+++++++++++++++++++++++++++++++++++++++++++++++
*/
section.video iframe {
  width: 90%;
  padding-left: 10%;
  min-height: 253px; }
  @media (min-width: 992px) {
    section.video iframe {
      padding-left: 20%;
      width: 80%;
      min-height: 315px; } }

.feature h2, .feature h3 {
  text-align: center;
  color: #b1b1af; }
.feature h2 {
  margin-top: 20px;
  font-size: 24px; }
.feature h3 {
  font-size: 18px;
  margin-bottom: 20px; }

.col1 {
  width: 617px;
  float: left;
  height: auto; }

.col2 {
  width: 323px;
  float: left; }

ul.paginador {
  margin: 0 auto;
  text-align: center;
  border: none;
  width: 260px; }
  ul.paginador li {
    border-bottom: none;
    display: table-cell;
    font-size: 12px; }
    ul.paginador li a {
      text-decoration: none;
      border-bottom: 2px solid white;
      font-style: normal; }
    ul.paginador li a.current {
      color: #6f6e6e;
      border-bottom: 2px solid #6f6e6e; }

#redes {
  background: #fff; }

#redes ul {
  margin: 20px auto;
  max-width: 291px;
  width: auto; }
  #redes ul li {
    display: inline;
    margin-right: 5px; }
    #redes ul li a:link, #redes ul li a:visited {
      display: inline-block;
      width: 30px;
      height: 30px;
      background-position: right bottom;
      background-repeat: no-repeat;
      -webkit-background-size: cover;
      background-size: cover; }
    #redes ul li a:hover, #redes ul li a:active {
      -webkit-transition: all 2s ease-in;
      -moz-transition: all 2s ease-in;
      -ms-transition: all 2s ease-in;
      -o-transition: all 2s ease-in;
      transition: all 2s ease-in;
      opacity: 0.8;
      filter: alpha(opacity=80); }
    #redes ul li a.fb {
      background-image: url(../img/ico_fb.jpg); }
    #redes ul li a.tw {
      background-image: url(../img/ico_tw.jpg); }
    #redes ul li a.lnk {
      background-image: url(../img/ico_lnk.jpg); }
    #redes ul li a.rss {
      background-image: url(../img/ico_rss.jpg); }
    #redes ul li a.yt {
      background-image: url(../img/ico_yt.jpg); }
    #redes ul li a.mail {
      background-image: url(../img/ico_mail.jpg); }

/*	FIN CONTENIDO
-----------------------------------------------
*/
/*	PIE
+++++++++++++++++++++++++++++++++++++++++++++++
*/
footer {
  width: 100%;
  height: 185px; }

/*	FIN PIE
-----------------------------------------------
*/
#myModal .modal-header h4 {
  font-weight: bold; }
#myModal .modal-dialog {
  height: 80% !important; }
#myModal .modal-content {
  height: 95% !important;
  overflow: auto; }
#myModal .modal-body {
  max-height: 80%;
  overflow: auto; }

/*@import url("ie.css");*/
/* Donde los programadores incluirán los fixes correspondientes que necesiten, 
evitando así romper el layout y facilitando la búsqueda de errores en caso de 
que esto ocurra */
/* Hoja de estilos de diagnóstico, que nos servirá para visualizar defectos en el marcado mientras lo creamos */
/*@import url("diagnostic.css");

 Una vez terminado es importante comentar este import*/