html,
body {
  height: 100%;
  width: 100%;
}
body {  font-family: 'Yanone Kaffeesatz',  sans-serif; color:#1a171b; font-size: 18px; }

.clearfix{clear: both;}

hr {
  border-color: #1a171b;
  border-width: 2px;
  max-width: 100px;
}
hr.light {
  border-color: white;
}
a {
  -webkit-transition: all 0.35s;
  -moz-transition: all 0.35s;
  transition: all 0.35s;
  color: #1a171b;
}
a:hover,
a:focus {
  color: #00ad61;
  text-decoration: none;
}
 

h1 {font-family: 'Londrina Solid', sans-serif; font-size: 6em; color: #fff;}
h2 {font-family: 'Londrina Solid', sans-serif; font-size: 5em; color: #fff; }
h3 {font-family: 'Londrina Solid', sans-serif; font-size: 4em; color: #fff; }
h4 {font-family: 'Londrina Solid', sans-serif; font-size: 3em; color: #fff;}
h5 {font-family: 'Londrina Solid', sans-serif; font-size: 2em; color: #fff;}

.blanco{color: #fff!important;}
.rosa{color: #ad0064;}
.verde{color: #00ad61;}
.verdeorcuro{color: #004f3c;}

p {
  font-size: 18px;
  line-height:1.5em;
  margin-bottom: 2px;
  color:#282e05;
  font-weight: normal;
}

.cap{ text-transform: uppercase; }

.no-padding {  padding: 0;}
.padding-top{ padding-top: 80px; }
.padding-bottom{ padding-bottom: 80px; }
.padding-10{ padding: 10px; }

section {
  padding: 50px 0;
  min-height: 50px;
  position: relative;
}
footer { background: url(../img/bg_footer.png)  repeat-x, url(../img/bg_cont02.jpg) repeat-x; min-height: 30px; }

/*slider*/
.slick{  position: relative; top: 0;  left: 0; height: 110%; width: 100%; min-height: 110%; }
.slick .banner-responsive{  height: 100%; width: 100%; min-height: 100%;  background-size: cover; background-repeat: no-repeat; background-position: top; }
.slick .video-responsive{  width: 100%;   height: 100%;   }
.txtbanner{ top: 35%; }

.embed-container { position: relative; padding-bottom: 56.25%; height: 100%; overflow: hidden;}
.embed-container iframe, .embed-container video { position: absolute; top:0; left: 0; width: 100%; height: 100%;  min-height: 100%;  }
.embed-container #buttonbar { position: absolute; top: 70px; right:20px;  }
.embed-container #buttonbar #play {  background:#a58f4d; color:#141414; border:none; border-radius: 20px;  width: 30px; height: 30px; }

/* preloader */
#preloader {
    position: fixed;
    top:0; left:0;
    right:0; bottom:0;
    background: #000;
    z-index: 999999;
}
#loader {
    width: 80px;
    height: 80px;
    position: absolute;
    left:50%; top:50%;
    background: url(../img/loader.gif) no-repeat center 0;
    margin:-50px 0 0 -50px;
}


.tooltip_left{ background: url(../img/tooltip_left.png); font-size: 22px;width: 201px;  height: 93px;position: absolute; top: -50px;left: 0px; padding: 20px;  }
.tooltip_right{ background: url(../img/tooltip_right.png); font-size: 22px;width: 201px;  height: 93px;position: absolute; top: -50px;right: 0px; padding: 20px;  }
.tooltip_right_green{ background: url(../img/tooltip_right_green.png); font-size: 22px;width: 291px;  height: 87px;position: absolute; top: -50px;right: 20%; padding: 20px;  }
.tooltip_right_yelow{ background: url(../img/tooltip_right_yelow.png); font-size: 22px;width: 201px;  height: 93px;position: absolute; top: -50px;right: 20%; padding: 20px;  }
.tooltip_right_pink{ background: url(../img/tooltip_right.png); color: #fff; font-size: 22px;width: 201px;  height: 93px;position: absolute; top: -50px;right:10%; padding: 20px;  }



/*BG secciones*/
#nosotros{ background: url(../img/rama_01.png) right top no-repeat,  url(../img/bg_cont01.jpg); }
#galeria{ background: url(../img/rama_01.png) right center no-repeat, url(../img/rama_02.png) right top no-repeat ,url(../img/bottom_qs.png) top center no-repeat,  url(../img/bg_cont02.jpg); }
#productos{ background: url(../img/bg_cont02.jpg); }
#recetas{ background: url(../img/verdura_01.png) left center no-repeat, url(../img/verdura_02.png) right bottom no-repeat,  url(../img/bg_cont04.jpg); }
#donde{ background:url(../img/lechuga_01.png) left center no-repeat, url(../img/lechuga_02.png) right bottom no-repeat, url(../img/bg_cont01.jpg); }
#contacto{ background:url(../img/betarraga_01.png) left top 100px no-repeat, url(../img/betarraga_02.png) right bottom no-repeat,   url(../img/bottom_donde.png) top center no-repeat,   url(../img/bg_cont02.jpg); }
#galeria .vbox { border: 2px #fff solid; margin: 10px; }

.qs_top { position: absolute; bottom:-10%; z-index: 999; } 
.donde_top { position: absolute; bottom:0px; z-index: 999; } 


/*productos*/
.controls{text-align: center;  text-transform: uppercase;   width: 100%; }
.controls a{  padding: .4em .9em; margin:0 8px; border: 0; background: #afce00; color: #fff; font-size: 19px;  cursor: pointer;  text-decoration: none; transition: all 0.4s ease;}
.controls a.active,  
.controls a:hover{ outline: 0 none; background: #ae0064;}
.contmix .mix{
  display: inline-block;
}
.contmix .mix{
  display: none;
}
.contmix .mix:after{
  content: attr(data-myorder);
  color: white;
  font-size: 16px;
  display: inline-block;
  vertical-align: top;
  padding: 2% ;
}
.contmix .mix:before{
  content: '';
  display: inline-block;
}


 .modalDialogo {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0,0,0,0.8);
  z-index: 99999;
  opacity:0;
  -webkit-transition: opacity 300ms ease-in;
  -moz-transition: opacity 300ms ease-in;
  transition: opacity 300ms ease-in;
  pointer-events: none;  overflow-x: scroll;
 }

 .modalDialogo:target {
  opacity:1;
  pointer-events: auto;
 }

 .modalDialogo > div {
  width: 100%;
  position: relative;
  margin: 0% auto;
  padding: 5px 20px 13px 20px;
  background:  url(../img/bg_cont04.jpg)  !important;
  color: #fff;

 }

 .cerrar{
  background: #fff;
  color: #dc3089;
  position: absolute;
  right: 0px;
  padding: 20px;
  text-align: center;
  top: 0px;
  width: 34px;
  text-decoration: none;
  font-weight: bold;
  -moz-box-shadow: 1px 1px 3px #000;
  -webkit-box-shadow: 1px 1px 3px #000;
  box-shadow: 1px 1px 3px #000;
 }

 .cerrar:hover { background: #fff; }


/*recetas*/
.border{border: 2px solid #fff;}
.tit_modal { background: url(../img/bg_tit_modal.png) no-repeat; background-size: cover; padding: 10px 15px; margin: 5px 0px; }

 
/*mapas*/
#exTab1 .nav-pills > li > a {
  color: #fff;
  background: #00ad61;
  border: 1px solid #00ad61;
  padding:5px 20px;
  margin: 5px;
  border-radius: 0px;
}
#exTab1 .nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover {
  color: #fff;
  background: #ae0064;
  border: 1px solid #ae0064;
}



/* The form */
#formid input, #formid textarea , #formid select { width: 100%; color: #fff; padding:12px; margin:10px 0; background: #42413f; border: 1px #ccc solid;}
.boton input {
    border: 2px solid #f5df31;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    color: #fff;
    padding: 10px 50px !important;
    margin:0  5px;
    background: #f5df31;
    cursor: pointer;
  } 
.boton input:hover {
  background: none;
  }

.boton a {
    border: 2px solid #f5df31;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    color: #f5df31;
    padding: 10px 50px !important;
    margin:0  5px;
  } 
.boton a:hover {
  color: #fff;
  background: #f5df31;
  }   


/*MENU NAVEGACION*/
.navbar-default {
  border-color:none;
  font-family: 'Yanone Kaffeesatz', 'Helvetica Neue', Arial, sans-serif;
  -webkit-transition: all 0.35s;
  -moz-transition: all 0.35s;
  transition: all 0.35s;
}

.navbar-default .navbar-header .navbar-brand img{    height: 75px;  padding: 0px!important;  position: absolute; }

.navbar-default .navbar-header .navbar-toggle {
  font-weight: 700;
  font-size: 12px;
  color: #004f3c;
  text-transform: normal;
  background-color: transparent !important;
}
.navbar-default .nav > li > a,
.navbar-default .nav > li > a:focus {
  text-transform: normal;
  font-weight: 700;
  font-size: 18px;
  color: #7d6711;
}
.navbar-default .nav > li > a:hover,
.navbar-default .nav > li > a:focus:hover {
  color: #004f3c;
}
.navbar-default .nav > li.active > a,
.navbar-default .nav > li.active > a:focus {
  color: #004f3c !important;
  background-color: transparent !important;
}
.navbar-default .nav > li.active > a:hover,
.navbar-default .nav > li.active > a:focus:hover {
  background-color: transparent !important;
}

@media (max-width: 768px) {

  h1 {font-family: 'Londrina Solid', sans-serif; font-size: 4em; color: #fff;}
  h2 {font-family: 'Londrina Solid', sans-serif; font-size: 3.5em; color: #fff; }
  h3 {font-family: 'Londrina Solid', sans-serif; font-size: 3em; color: #fff; }
  h4 {font-family: 'Londrina Solid', sans-serif; font-size: 2.2em; color: #fff;}
  h5 {font-family: 'Londrina Solid', sans-serif; font-size: 1.5em; color: #fff;}

  h1,h2,h3,h4,h5,h6 { text-align: center!important; }
  p{text-align: center!important;}

  .centrado{  display: block; margin-left: auto;  margin-right: auto;}
  .txtbanner{ top: 25%; }


  .nav-tabs > li, .nav-pills > li {
      float:none;
      display:inline-block;
      *display:inline; /* ie7 fix */
       zoom:1; /* hasLayout ie7 trigger */
  }
  .nav-tabs, .nav-pills {
      text-align:center;
  }

}

@media (min-width: 768px) {

 header { padding-top: 40px; } 

  .navbar-nav {
    padding: 10px 0 20px 0;
  }
  .navbar-default {
    background: url(../img/bg_menu.png) repeat-x;
    background-size: contain;
    border-color:none;
  }
  .navbar-default .navbar-header .navbar-brand {padding: 0px 15px!important;}
  .navbar-default .navbar-header .navbar-brand img{height:auto; position: absolute!important; }

  .navbar-default .nav > li > a,
  .navbar-default .nav > li > a:focus {
    color: #7d6711;
    padding: 4px 15px 10px 5px !important;
  }
  .navbar-default .nav > li > a:hover,
  .navbar-default .nav > li > a:focus:hover,
  .navbar-default .nav > li > a.active  {
    color: #004f3c;
  }

  .navbar-default.affix {
    background-color:none;
    color: #7d6711;
  }
  .navbar-default.affix .nav > li > a,
  .navbar-default.affix .nav > li > a:focus {
    color: #7d6711;
  }
  .navbar-default.affix .nav > li > a:hover,
  .navbar-default.affix .nav > li > a:focus:hover,
  .navbar-default.affix .nav > li > a.active {
    color: #004f3c;

  }


}