/*estilos de fuentes de  duncan*/
@font-face {
    font-family: 'segoeui';
    src: url('../fonts/segoeui.eot');
    src: url('../fonts/segoeui.eot?#iefix') format('embedded-opentype'),
         url('../fonts/segoeui.woff') format('woff'),
         url('../fonts/segoeui.ttf') format('truetype'),
         url('../fonts/segoeui.svg#segoe_uiregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'geo703b';
    src: url('../fonts/geo703b.eot');
    src: url('../fonts/geo703b.eot?#iefix') format('embedded-opentype'),
         url('../fonts/geo703b.woff') format('woff'),
         url('../fonts/geo703b.ttf') format('truetype'),
         url('../fonts/geo703b.svg#segoe_uiregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'calibri';
    src: url('../fonts/calibri.eot');
    src: url('../fonts/calibri.eot?#iefix') format('embedded-opentype'),
         url('../fonts/calibri.woff') format('woff'),
         url('../fonts/calibri.ttf') format('truetype'),
         url('../fonts/calibri.svg#segoe_uiregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
body{
	background-color: #D7DBDC;

}
.row{
	max-width: 840px;
	margin: 0 auto;

}

.button {
	width: 8.37rem;
	height: 76px;
	background-image: url(../img/bg-menu.png);
	background-repeat: repeat-x;
}
ul.button-group li{
	height: 76px;
	margin-bottom: 6px;
}

ul li a p{
	font-family: 'segoeui';
	font-size: 12px;
	color: #605D5C;
	line-height: 14px;
}
a.button:hover {

	background-image: url(../img/bg-menu-on.png);
	background-repeat: repeat-x;
}
.large-1 {
	text-align: center;
	font-family: arial;
	font-size: 8px;

}

.large-4{
	margin:0px;
	padding: 0px;
}
.large-6{
	max-width: 405px;
}
.large-9{
	height: 110px;
	width: 600px;
	background-color:#D7DBDC; 
	margin:0px;
	padding: 0px;
}
.large-10 p{
	margin-top: 30px;
	font-family: arial;
	font-size: 10px;
}
.button-group > * > button, .button-group > * .button {

      border-right: 0px solid;
      border-color: rgba(255, 255, 255, 0.5); }

li.divider{
	width: 1px;
	height: 83px;
	background-image: url(../img/separador.jpg);
      }

/*estilos de productos*/
.titulo{
	font-family: 'geo703b';
	font-size: 18px;
	font-weight: bold;
	color: #000;
	margin: 150px 10px 0px 50px;
}
.texto p{
	font-family: 'calibri';
	font-size: 14px;
	line-height: 18px;
	color: #000;
	margin: 10px 10px 0px 50px;

}
.envases p{
	font-family: 'calibri';
	font-size: 16px;
	font-weight: bold;
	color: #000;
	margin: 10px 10px 0px 270px;

}
.calidad p{
	font-family: 'calibri';
	font-size: 12px;
	line-height: 18px;
	color: #000;
	margin: 130px 10px 0px 410px;
	padding-right: 56px;

}
.consejos p{
	font-family: 'calibri';
	font-size: 14px;
	line-height: 18px;
	color: #000;
	margin: 40px 110px 20px 120px;

}
/*para el botón dropbox*/
.dropdown.button:before {

    border-width: 0.375rem;
    right: 0.75rem;
    margin-top: -1rem;
}
.dropdown.button:before {
    border-color: #000 transparent transparent;
}
.f-dropdown{
	max-width: 8.5rem;
	background-color: transparent;

}
ul .f-dropdown li{
	height: 3.6rem;
	
}

.f-dropdown li a p{   
    padding-top: 1rem;
    text-align: center;
}
.distribuidores{
	margin-top: 1.5rem;
	margin-left: 1rem; 
	margin-right: 1rem; 
	font-family: 'calibri';  
	font-size: 0.9rem;
	line-height: 1.2rem
}
/*media query para texto productos*/
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) { 

.button {
	width: 16rem;
	
}
ul.button-group li.divider{
	height: 0px;
}
.titulo{
	margin-left: 10px;
}
.texto p {
	margin-left: 10px;
}

.envases p{
	margin-left: 10px;
}
.calidad p{
	background-color:#FECB00;
	margin-left: 10px;
	line-height: 16px;
	margin-top: 30px;
}
.consejos p{	
	margin-left: 10px;
	margin-right: 10px;	
}

}
/*media query para texto productos*/
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 800px) { 


.calidad p{
	background:rgba(254, 203, 0, 0.75); /*el último valor es para que sea semitransparente*/
	margin: 150px 15px 30px 15px;
	font-size: 16px;
	line-height: 20px;
	padding: 10px;

	
}
.large-2{
	text-align: center;
}
.large-9 {
	height: 0px;
}


}

/*media query para texto productos*/
/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 1024px) { 

.large-2{
	text-align: center;
}
.large-9 {
	height: 0px;
}


}


