@charset "utf-8";
/* CSS Document*/
body, html  { margin:0 auto; padding:0; font-family: 'Lato', sans-serif; font-size:12px; font-weight:300; height: 100%; background:url(../img/fondo.jpg) no-repeat center top; background-size:100% auto; }
a { transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; text-decoration:none; }
.animado { transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; }
div { position:relative; float:left;  }
.contenedor { display: inline-block; width:100%; margin:0; text-align:center; padding: 0; position:relative; }
.contenedor { 
  background: #301A0C;
 }
.centro { display:inline-block; width:100%; margin:auto; position:relative; text-align:left; float:none; max-width: 1200px; }
.linea { border-right:1px solid #0f6cb5; padding: 0 12px; }
.btnmenu { color:#0f6cb5; }
.btnmenu:hover { color:#ccc; }
.btnw { color:#fff; padding: 0 35px 0 0; }
.btnw:hover { color:#ddd; }
.margen { width:100%; height:130px; background:#ccc; }

.menu_text{
    float:right; padding:40px 50px 0 0; color:#0f6cb5;
}
.datos_checkout{
  width: 410px; float: none; margin: auto;
}

.recientes_dest { 
    display: none;
    top: 14%;
    right: 9%;
    z-index: 9999;
    width: 21%;
    color: #434343;
    background: rgba(255,255,255,0.98);
    font-size: 13px;
    text-align: center;
    padding: 10px 20px;
    position: fixed;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
    box-shadow: 4px 4px 5px 0px rgba(0,0,0,0.75);
}

.text_img{    
	position: absolute;
	padding: 0px 25%;
    top: 40%;
	color: white;
    font-size: 200%;
  text-transform: uppercase;
    font-weight: 700;}
.overlay_img{    
	height: 100%;
    width: 100%;
    transition: .5s ease;
    background-color: rgba(0,0,0,.5);}

.blogimg:hover {
    filter: grayscale(50%);
}
.blogimg {
    filter: grayscale(0%);
    transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease;
}

img.logo {   
  width: 75px;
}


.btncat {
  text-transform: uppercase;
}
.text_octavo {
    width: 100%;
    text-align: center;
    color: #5F2D0A;
    padding: 9% 0;
    font-weight: 700;
    font-size: 1.5em;
    text-transform: uppercase;
}

.letras_on { text-decoration: none; color: white; font-weight: 400;}
.letras { text-decoration: none; color: white; font-weight: 100;}
.letras_on:hover { color: #B6602F; }

.octavo { width:250px; margin: 30px 10px; height:240px; border-top:4px solid #3b7cca; cursor:pointer; }
.octavo:hover { margin: 0 10px; }
.octavoff { width:250px; margin: 0 10px; height:240px; border-top:4px solid #3b7cca; cursor:pointer; }
.octavoff:hover { width:250px; margin: 0 10px; }
.octavos { width:100%; height:100%; opacity:0; filter:alpha(opacity=0); }
.octavos:hover { width:100%; height:100%; opacity:1; filter:alpha(opacity=100); }
.octavosff { width:100%; height:100%; opacity:1; filter:alpha(opacity=100); }
.octavosff:hover { width:100%; height:100%; opacity:1; filter:alpha(opacity=100); }
.escritorio { display:inline-block; }
.movil { display:none; }

.piemenu { color: #fff; display: inline-block; font-size: 18px; font-weight: 300; margin: 13px 0 13px 20px; }
.btn_mnf { color: #fff; display: inline-block; font-size: 18px; font-weight: 300; margin: 0 35px; }
.btn_mnf:hover { color: #0f6cb5; }
.btn_mnfWb { color: #fff; display: inline-block; font-size: 18px; font-weight: 300; margin: 0 35px; }
.btn_mnfWb:hover { color: #808284; }
.redespie { padding:10px 40px 0 0; float:right; }

.campos { width:96%; height:40px; border:1px solid #dadada; border-bottom:2px solid #dadada; font-size:25px; color:#002d62; margin: 0 0 7px 0; padding: 0;  font-family: 'Roboto', sans-serif; font-weight:300; padding:0 2%; }

.btnenviar { display:inline-block; float:right; width:135px; text-align:center; cursor:pointer; background:none; margin:10px auto 15px; padding: 0 0 5px 0; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; border:2px solid #fff; }
.btnenviar:hover { background:#0f6cb5; border:2px solid #0f6cb5; }
.menubtnmovil { display:none; }

.btncat { width:180px; height:145px; padding:35px 0 0 0; border:5px solid #fff; margin: 0 5px; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; cursor:pointer; }
.btncat:hover { border:5px solid #0f6cb5; background:#0f6cb5; }
.btncat_on { width:180px; height:145px; padding:35px 0 0 0; margin: 0 5px; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; cursor:pointer; border:5px solid #0f6cb5; background:#0f6cb5; }
.btncatxt { position:absolute; left:0; bottom:0; height:50px; width:100%; font-size:18px; color:#fff; font-weight:300; }

.btncatm { width:80px; height:75px; padding:5px 0 0 0; border:2px solid #fff; margin: 0 3px; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; cursor:pointer; text-align:center; }
.btncatm:hover { border:2px solid #0f6cb5; background:#0f6cb5; }
.btncatm_on { width:80px; height:75px; padding:5px 0 0 0; margin: 0 3px; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; cursor:pointer; border:2px solid #0f6cb5; background:#0f6cb5; text-align:center; }
.btncatxtm { position:absolute; left:0; bottom:0; height:30px; width:100%; font-size:9px; color:#fff; font-weight:300; }

.btnd { width:100%; height:49px; background:#3b7cca; font-size:18px; color:#fff; padding:6px 0 0 0; cursor:pointer; text-align:center; overflow:hidden; }
.btnd:hover { background:#a7a9ac; }
.btnc { width:100%; height:39px; background:#3b7cca; font-size:15px; color:#fff; padding:16px 0 0 0; cursor:pointer; text-align:center; margin: 5px 0 0 0; }
.btn_off {  pointer-events: none;  background:#a7a9ac; }
.btnc:hover { background:#a7a9ac; }
.infonut { position:absolute; left:0; bottom:-35px; width:calc(100% - 30px); width:-moz-calc(100% - 30px); padding: 3px 0 0 30px; height:21px; background:url(../img/info.png) no-repeat left center; background-size: auto 100%; color:#3b7cca; font-size:14px; font-weight:700; text-align:left; cursor:pointer; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease; }
.infonut:hover { color:#fff; }

.centro_tI { font-size:36px; color: #407cc9; padding: 20px 30px; font-weight: 700; float: none;  }
.cafe100 { width: 100%; border-bottom: 1px solid #84724b; color: #301A0C; font-size: 14px; }
.quinto { width:calc(20% - 40px); width:-moz-calc(20% - 40px); padding: 15px 20px; }
.quintomon { width:calc(20% - 70px); width:-moz-calc(20% - 70px); padding: 15px 50px 15px 20px; text-align: right; }
.carritohead { font-weight: 700; }

.centroblog { display:inline-block; width:1100px; margin:auto; position:relative; text-align:left; float:none; padding:50px 0; }
.blogG { width:50%; height:600px; }
.blogS { width:50%; height:300px; }
.blogH { width:100%; height:300px; }
.blogV { width:300px; height:100%; }

.formularios { display: inline-block; float: none; font-size: 13px; font-weight: 300; margin: auto auto 100px auto; position: relative; text-align: left; width: 380px; color: #fff; }
.inputxt { background: #fff none repeat scroll 0 0; border: 1px solid #a7a9ac; color: #666; display: inline-block; font-family: "Lato",sans-serif; font-size: 14px; font-weight: 300; height: 20px; margin: 0 0 20px; padding: 10px 15px; width: 350px; }

.inputsub { background: #3b7cca; border: none; color: #fff; cursor: pointer; display: inline-block; font-family: "Lato",sans-serif; font-size: 18px; font-weight: 300; height: 40px; margin: 20px 0; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease;  width: 180px; float: right; }

.inputsubn { background: #3b7cca; border: none; color: #fff; cursor: pointer; display: inline-block; font-family: "Lato",sans-serif; font-size: 18px; font-weight: 300; height: 40px; margin: 20px 0; transition-duration: 0.2s; -webkit-transition: all 300ms ease; -moz-transition: all 300ms ease;  width: 180px; float: none; }

.btnacceso { font-size:18px; color:#fff; font-weight:500; }
.btnacceso:hover { color:#666; }

.check_input { width: calc(100% - 20px); width: -moz-calc(100% - 20px); border: #7b5032 1px solid; color: #301A0C; padding: 5px 10px; margin: 0 0 10px 0; }
.check_input_mit { width: calc(47% - 20px); width: -moz-calc(47% - 20px); border: #7b5032 1px solid; color: #301A0C; padding: 5px 10px; margin: 0 0 10px 0; }
.derecha { float:right; }
.izquierda { float:left; }

.formcheck { width: 90%; background: #fff; margin: 0 5% 100px 5%; }
.insidecheck { padding: 15px 30px; width: calc(100% - 60px); width: -moz-calc(100% - 60px); }
.checktercia { width: 33.33%; }
.checkdestacado { font-weight: 700; text-decoration: underline; } 


 .contenedor_menu{
    height:40px; 
    background:#0f6cb5;
}

/* Acordion Image Slider */
.accordion {
  width: 100%;
  max-width: 1080px;
  height: 250px;
  overflow: hidden;
  margin: 50px auto;
}

.accordion ul {
  width: 100%;
  display: table;
  table-layout: fixed;
  margin: 0;
  padding: 0;
}

.accordion ul li {
  display: table-cell;
  vertical-align: bottom;
  position: relative;
  width: 16.666%;
  height: 250px;
  background-repeat: no-repeat;
  background-position: center center;
  transition: all 500ms ease;
}

.accordion ul li div {
  display: block;
  overflow: hidden;
  width: 100%;
}

.accordion ul li div a {
  display: block;
  height: 250px;
  width: 100%;
  position: relative;
  z-index: 3;
  vertical-align: bottom;
  padding: 15px 20px;
  box-sizing: border-box;
  color: #fff;
  text-decoration: none;
  font-family: Open Sans, sans-serif;
  transition: all 200ms ease;
}

.accordion ul li div a * {
  opacity: 0;
  margin: 0;
  width: 100%;
  text-overflow: ellipsis;
  position: relative;
  z-index: 5;
  white-space: nowrap;
  overflow: hidden;
  -webkit-transform: translateX(-20px);
  transform: translateX(-20px);
  -webkit-transition: all 400ms ease;
  transition: all 400ms ease;
}

.promos {width: 100%;  padding: 5% 0;}
.promos ul{width: 70%; }

.accordion ul li div a h2 {
  font-family: Montserrat, sans-serif;
  text-overflow: clip;
  font-size: 16px;
  text-transform: uppercase;
  margin-bottom: 2px;
  top:  50%;
}

.accordion ul li div a p {
  top: 160px;
  font-size: 13.5px;
}

.formas_datos{
  width: 410px; float: none; margin: auto; font-size: 16px;
}
.accordion ul:hover li { width: 8%; }

.accordion ul:hover li:hover { width: 60%; }

.accordion ul:hover li:hover a { background: rgba(0, 0, 0, 0.4); }

.accordion ul:hover li:hover a * {
  opacity: 1;
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

.img_cont_blog{
  margin:40px 70px 0 0; float:right; width:calc(100% - 770px); width:-moz-calc(100% - 770px);
}

.videocafe{
    width:1200px; height:650px; position:absolute; left:-25px; top:-5px;
}

.fondo_video{
        margin:20px 25px 0 25px; width:calc(100% - 50px); width:-moz-calc(100% - 50px); height:640px; background-size:cover; z-index:888;
}

.bot_tipos_cafe{
    position: absolute;
    width: 1100px;
    bottom: -230px;
    left: calc(50% - 550px);
    left: -moz-calc(50% - 550px);
}

.nutri_cont {
    position: absolute;
    height: 140%;
    width: 100%;
    background: rgba(0, 0, 0, .5);
    left: 0;
    top: 130px;
    z-index: 1;
    display: block;
}

.nutri_cont img {
  padding-top: 5%;
    max-width: 25%;
    margin: 0 auto;
    display: inherit;
    max-height: 50%;
}

.datos_fact { width: 410px; float: none; margin: auto; color: #301A0C; }

.txt_conocenos{
    width:940px; float:none; margin:auto; color:#fff; font-size:24px; line-height:36px; font-weight:300;
}

.txt_distri{width:1100px; margin: auto; float:none; background: url(../img/granosbg.png) no-repeat center center; background-size:cover; padding:60px 0; color:#fff; font-size:40px; font-weight:300;
}

.txt_distri font{font-size:48px; font-weight:500;}

.cnt_contain{width:940px; float:none; margin:auto; color:#fff; font-size:24px; line-height:36px; font-weight:300;}

.cnt_form_contain{ width: 670px; float: none;  margin: auto; }

.cnt_banner{ width:1100px; height:350px;  background-size:cover; float:none; margin:25px auto; }

.cnt_tipos{ width:800px; margin:auto; float:none;}

.cnt_productos{ width:840px; margin:auto; float:none; }

.cnt_producto{ width:260px; height:390px; border:5px solid #fff; margin: 0 5px 10px 5px; background:#fff; }

.cnt_blog{font-size:18px; font-weight:300; color:#fff; width:580px; text-align:left;}

.reg_movil { display: none;}

.blog_ban{font-size:60px; color:#fff; font-weight:700; padding:40px 0 45px 0;}

.cnt_registro{ font-size:18px; color:#fff; font-weight: 100; }

.cnt_carrito { width: 960px; background: #fff; padding: 40px 70px; float: none; display: inline-block; font-size: 24px; color: #301A0C; text-align: left; margin: 0 auto 100px auto;  }

.tabla_carrito {width: 1040px; background: #fff; padding: 5px 30px 20px 30px; float: none; margin: auto; display: inline-block; }

.cnt_total { width: 300px; float: right; padding: 20px 0 0 0; text-align: left; color: #301A0C; font-size: 14px;  }

.cnt_zoom { position:absolute; left:0; top:0; height:330px; width:270px; display:inline-block; }

.cnt_zoom_grande { position:absolute; left:0; top:0; height:100%; width:100%; }

.cnt_des_nombre{ position:absolute; left:0; bottom:5px; width:100%; color:#3b7cca; font-size:18px; font-weight:700; text-align:center; }

.cnt_des_images { width:100%; position:absolute; top:380px; left:0; }

.des_agregar { position:absolute; left:5px; top:-5px; }

.cnt_des_small { position:absolute; right:30px; bottom:0; }

.text_des { color:#fff; font-size:18px; font-weight:300px; width:calc(100% - 700px); width:-moz-calc(100% - 700px); height:600px;  }

.cnt_zoom_big { width:270px; height:330px;  margin:0 85px 0 0; }

.des_image_small { display:inline-block; width:80px; height:80px; margin:0 10px 10px 0; float:left; }

.cnt_des_comprar {     float: right; width: 270px; padding: 180px 0 0 0; font-size: 24px; font-weight: 300; color: #fff; }

.home_cont {
  padding:240px 0 30px 0; background: #301A0C;
}

@media screen and (max-width: 600px) {

.accordion { height: auto; }


.accordion ul li,
.accordion ul li:hover,
.accordion ul:hover li,
.accordion ul:hover li:hover {
  position: relative;
  display: table;
  table-layout: fixed;
  width: 100%;
  -webkit-transition: none;
  transition: none;
}

}



@media (max-width:1050px){
.centroblog { width:1000px; }
.blogG { height:500px; }
.blogS { height:250px; }
.blogH { height:250px; }
.blogV { width:250px; }
	
.octavo { width: 200px; }
.bot_tipos_cafe{ width: 900px; left: calc(50% - 450px); left: -moz-calc(50% - 450px); }
}


/*Tabs Politicas*/
.politicas_cont {
  color: white;
  text-align: center;
  padding: 3% 0;
  width: 100%;
}

.politicas_cont .wrap {
  padding: 5%;
}

.politicas_cont section{
  text-align: left;
  padding: 3% 10%;
}

.politicas_cont h4 {
  font-size: 1.3em;
}

.politicas_cont input {
  display: none;
}

.politicas_cont section {
  display: none;
  border-top: 1px solid #fff;
}

.detalle_prod{
  float:right; padding:20px 0;
}
.politicas_cont label {
  display: inline-block;
  margin: 0 0 -1px;
  padding: 15px 25px;
  font-weight: 600;
  text-align: center;
  color: #fff;
  border: 1px solid transparent;
}

.politicas_cont label:before {
  font-weight: normal;
  margin-right: 10px;
}


.politicas_cont label:hover {
  color: #888;
  cursor: pointer;
}

.politicas_cont input:checked + label {
  border: 1px solid #ddd;
  border-top: 2px solid #0f6cb5;
  border-bottom: 1px solid #fff;
  background: white;
  color: #0f6cb5;
}

.politicas_cont #tab1:checked ~ #content1,
.politicas_cont #tab2:checked ~ #content2,
.politicas_cont #tab3:checked ~ #content3,
.politicas_cont #tab4:checked ~ #content4 {
  display: block;
}

.blog_atras{
  padding: 3% 0;
}

.buscador {
  width:170px; height:16px; border: none; border-bottom:1px solid #fff; background:url(../img/buscar.png) no-repeat right center; font-size:12px; color:#fff;
}

.buscador::-webkit-input-placeholder {
    /* WebKit, Blink, Edge */
    color: #ffff;
}
.buscador:-moz-placeholder {
    /* Mozilla Firefox 4 to 18 */
    color: #ffff;
    opacity: 1;
}
.buscador::-moz-placeholder {
    /* Mozilla Firefox 19+ */
    color: #ffff;
    opacity: 1;
}
.buscador:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #ffff;
}
.buscador::-webkit-input-placeholder {
    color: #ffff;
}

.comunicate_txt {
  padding-top: 10%; font-size: 20px; width: 100%;
}

.btnImg { width: auto;
height: auto;
max-height: 100%;
max-width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto; }

@media screen and (max-width: 650px) {
  .politicas_cont label {
    font-size: 0;
  }
  .politicas_cont label:before {
    margin: 0;
    font-size: 18px;
  }
}

@media screen and (max-width: 400px) {
  .politicas_cont label {
    padding: 15px;
  }
}


@media (max-width:1000px){
  .blog_atras{ z-index: 99999; } 
	.movil { display:inline-block; }
	.escritorio { display:none; }
    .contenedor_menu{display:none; }
    .menu_text{ display:none; }
  .menubtnmovil { display:inline-block; float:right; position:fixed; right:0px; top:40px; z-index:22222; width: 30%;}
	.menubtnmovil img{ max-width: 12px;}
    .videocafe{ display: none; }
    .fondo_video{ width: 100%; margin: 0; background-size: contain; height: 420px;}
    .bot_tipos_cafe{position: relative;width: 100%;bottom: -235px;left: 0;}
    .octavo { width: calc(25% - 20px); width: -moz-calc(25% - 20px); margin: 100px 10px 0 10px;   height: 200px; background-position: top center !important; }
	.text_octavo { padding: 10px 0 0 0; font-size: 16px; }
	
    .txt_conocenos{  width: 80%; font-size: 15px;}
    .txt_distri{ width: 100%; font-size: 15px;}
    .accordion ul li { background-size: cover; }
    .cnt_contain { width: 100%; }
    .cnt_form_contain { padding: 3%; width: 90%; }
    .cnt_contain img { width: 100%; }
    .txt_conocenos img { width: 100%; }
    .txt_distri font { font-size: 18px; }
    .piemenu { display: none; }
    .cnt_banner{ width: 100%;  height: 260px;  background-size: cover }
    .cnt_tipos { width: 100%;   }
    .btncat_on, .btncat{ width: 19%; padding: 0; margin: 2%;}
    .btncat_on img, .btncat img{ width: 50%; padding: 25%; }
    .btncatxt { font-size: 10px; }
    .cnt_productos{ width: 100%; }
    .cnt_producto{ width: 95% }
    .blog_ban{ padding: 120px 0 35px 0; font-size: 30px; } 
    .centroblog {    width: 90%; }
    .text_img{ overflow-x: hidden; font-size: 10px;   text-align: center;  padding: 0px 5%;}
    .cnt_blog { width: 100%;     margin: 0; }
    .reg_movil {  padding: 5%; display: block;}
    .formularios { width: 95%;     margin: 100px auto 100px auto;}
    .inputxt{ width: 90%; }
    .cnt_registro { padding-top: 100px; }
    .cnt_carrito { width: 95%; padding: 2%;} 
    .zoomContainer { pointer-events: none; }
    .centro_tI { padding-top: 100px; }
    .tabla_carrito { width: 100%; padding: 0; }
    .cnt_total { width: 90%; float: center; padding: 5%; }
    .margen { height: 85px; } 
    .infonut {     position: relative; bottom: auto; margin: 3% 15%; height: auto; width: 55%; text-align: center; left: auto;   z-index: 99999; }
    .cnt_zoom  { position: relative; bottom: auto; padding: 3% 10%; width: 80%;}
    .cnt_zoom_grande  { position: relative; bottom: auto; }
    .cnt_des_nombre  { position: relative; bottom: auto;}
    /*.cnt_des_images  { position: relative; bottom: auto;}*/
	
	.cnt_des_images { text-align:center; top:480px; }
    .des_agregar  { position: relative; bottom: auto;}
    .cnt_des_small  { position: relative; bottom: auto; }
    .text_des {     width: 90%; height: auto; padding: 5%; }
    .cnt_zoom_big { width:100%; height:550px;  margin:0; }
    .des_image_small { float:none; margin:0 10px; }
    .cnt_des_comprar {       padding: 0;  float: none; width: 90%;  margin: 5% }
    img.logo {   width: 75px;}
    .octavo:hover { margin: 5%; }
    .zoomWindow { display: none !important; }
    .cafe100 { font-size: 11px; }
    .cnt_total { font-size: 11px; }
    .datos_checkout { width: 100%; }
    .datos_fact { width: 100%; }
    .formas_datos { width: 100%; }
    .img_cont_blog {  margin: 0; float: none;  width: 100%; }
    .home_cont {  padding:150px 0 30px 0; background: #301A0C; }
    .btncatm_on, .btncatm { width: 30%; }
    .zoomContainer, .zoomWindowContainer, .zoomWindowContainer div{ width: 100% !important; left: 0 !important; float: none !important;}
    .detalle_prod { float: none; }
    .blogS { width: 100%; }
    .blogG { height: 750px; }
    .comunicate_txt { font-size: 15px; }
    .comunicate_txt font{ font-size: 25px !important; }
    .politicas_cont label { width: 13%; font-size: 8px; }
    .nutri_cont { top: 90px; }
    .nutri_cont img { max-width: 60%; padding-top: 50%; }
    .promos ul{width: 100%; padding-bottom: 0;}
}

@media (max-width:700px){
	.cnt_banner { height: 130px; }
	.btncat_on, .btncat { width: 18%; height: 115px; }
	
    .octavo { width: calc(50% - 40px); width: -moz-calc(50% - 40px); margin: 0 20px 20px 20px;   height: 160px; background-position: top center !important; }
	.text_octavo { padding: 5px 0 0 0; font-size: 14px; }
}