/*************************************************** hoja de estilo principal */
@font-face{
	font-family: Roboto-Regular;
	src: url(Roboto-Regular.ttf);
}
@font-face{
	font-family: Roboto-Light;
	src: url(Roboto-Light.ttf);
}
@font-face{
	font-family: Roboto-Thin;
	src: url(Roboto-Thin.ttf);
}
@keyframes boton{
  from { opacity: 1; }
  to { opacity: 0.25; }
}

* { box-sizing: border-box; }

.row::after {
  content: "";
  clear: both;
  display: table;
}

[class*="col-"] { float: left; }
[class*="cold-"] { float: right; }

html, body{ margin: 0; padding: 0; font-family: Roboto-Light,arial,helvetica,verdana; font-size: 18px; background: #3F7FAB;
	-webkit-user-select: none; -moz-user-select: none; -khtml-user-select: none; -ms-user-select:none;
	scroll-behavior: smooth;
}

h1{ font-family: Roboto-Light,arial; font-weight: 100; font-size: 32px; margin: 0; padding: 0 }
h2,p.medio{ font-family: Roboto-Light,arial; font-weight: 100; font-size: 32px; margin: 0; padding: 0 }
h3{ font-family: Roboto-Light,arial; font-weight: 100; font-size: 26px; margin: 0; padding: 0;}

p{ font-size: 18px;}
p.grande{ font-size: 36px;}
p.form{ margin: 0; padding: 0;}
p.titulo{ font-size: 32px; margin: 0; padding: 0 0 3vw 0; }

a{ text-decoration: none; color:#3F7FAB; }
a:hover{ color:#BCD4E5; }

.menutop ul, .menutop li, .pie ul,.pie li{ padding: 0; margin: 0; list-style: none;}

.limit{ margin: 0 auto; width: 60vw; max-width: 1336px; }
.limit2{ margin: 0 auto; width: 90vw; max-width: 1336px; }
.mlimit{ margin: 0 auto; width: 40vw;}
/******************************************************************** botones */
.boton{
	position: absolute;
	width: 128px;
	height: 64px;
	left: 50%;
	margin-left: -64px;
	background: url(../img/flecha.png) no-repeat center;
  animation-name: boton;
  animation-duration: 1.5s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
  z-index: 5000;
  bottom: 0px;
}

.flot_der{ float: right;}
.flot_izq{ float: left; }

#bot_subir{
	position: fixed;
	width: 0px;
	height: 40px;
	right: 0px;
	bottom: 96px;
	font-family: Roboto-Regular;
	font-size: 48px;
	background: #fff;
	color: #000;
	border: none;
	z-index:1000;
	border-radius: 16px 0px 0px 16px;
  transition: width 0.25s, border 0.25s;
}

.marcoblanco{padding: 32px; background: #fff; border-radius: 32px;}
/***************************************************************** indice web */
.indice{ padding: 0vw; background: white; border-radius: 32px; border: solid 1px #3F7FAB; width: 40%; margin: 2vh auto;}
.indice ul,.indice li{ list-style-type: none;}
.indice li a{ color: #000;}
.indice li a:hover { color: #3F7FAB;}
.indice h1, .indice h2, .indice h3{ padding: 0; margin: 0; font-size: 18px;}
.indice h1{ font-family: Roboto-Regular; font-size: 24px;}
.indice h2{ font-family: Roboto-Light; font-size: 22px;}
.indice h3{ font-family: Roboto-Thin; font-size: 18px;}
.indice li{ padding: 0.5vh; }

.imini{ width: 25%; }
/***************************************************************** FORMULARIO */
form{ padding-top: 4vh;}
input,textarea{ width: 100%; background: #BCD4E5; border: none; padding: 4px; font-size: 14px; margin-bottom: 16px;}
textarea{	max-width: 100%; min-width: 100%;}
input.check{ width: 16px; }
input.submit{ float: right; width: 10vw; }
input.calcula{ width: 10vw; background: white; border: solid 1px #aaa;}
input.inumber{ margin: 4px; width: 25%; }
.rojo{
	color: #f00;
}
.verde{
	color: #0a0;
}
.feedback{
	width: 100%;
	text-align: center;
	font-family: Roboto-Regular;
	font-weight: 100;
}
.imgsmovil{ display: none;}
.tit{ margin: 0; padding: 4px; padding-right: 0px; }
.econtacto{ margin-right: 1vw;}
/********************************************************* principal: portada */
.principal{ width: 100%;	height: 100vh;}

.campoform2{ padding-right: 8px; text-align: right;}

.cab_tabla{ font-family: Roboto-Regular;  color: #3F7FAB;}
/*************************************************************** Para mÃģviles */
[class*="col-"] { width: 100%; }
[class*="cold-"] { width: 100%; }
@media only screen and (max-width: 829px)  {
  .limit{ width: 100%; }
  .iconoitm{ width: 10%;}
  .botmenu{ width: 70%; float: right;margin-top: -68px;}
	.botmenu li,.botmenu span{ float: right; text-align: right; padding-right: 16px;}
	.telefono{ float: right; text-align: right;}
	.boton{ bottom: 8px; }
	#losetas-itm{ padding-top: 112px; }
	.principal{ width: 100%;	height: 90vh;}
	.boton_dist{	top: 78px; left: 16px; right: auto; }
	.paddcontact{ height: 108px; width: 100%;}
	p.titulo{ font-size: 26px;}
	p.medio{ font-size: 20px; }
	.indice{ width: 80%;}
	.indice li{ padding: 1.5vh; }
	.imini{ width: 90%; }
	.indice h1{ font-family: Roboto-Regular,arial; font-size: 22px;}
	.indice h2{ font-family: Roboto-Light,arial; font-size: 18px;}
	.indice h3{ font-family: Roboto-Thin,arial; font-size: 16px;}
	.indice ul{ padding-left: 16px;}
	.tbtpi{ display: none; }
	.txt_pie{ text-align: center; font-size: 16px;}
	img.logo_top{ height: 50%; max-height: 32px; min-height: 32px;}
	.marcas,.pcontacto,.telefonopie { width: 200px; margin: 0 auto;}
	.entop{ display: none;}
	.tresimgs{ display: none;}
	.imgsmovil{ display: block;}
	.mpadding42{ padding-top: 4vw;padding-bottom: 4vw; padding-left: 2vw; padding-right: 2vw;}
	table.medidas_losetas td{ background: #fff; padding: 0.5vh; font-size: 14px;}
	.tit{ padding-right: 0px;}
	.econtacto{ margin-right: 0;}
	.campoform2{ text-align: left;}
	.cab_tabla{ font-size: 14px;}
	input.inumber{ width: 100%; }
	.padding-movil{ padding-top: 102px;}
}
/****************************** display: none;********************************* Para tablets */
@media only screen and (min-width: 830px) {

  h1 { font-size: 26px;}
  h2,p.medio { font-size: 22px;}
  h3 { font-size: 20px;}
  p,a,span,.tit,.lista_caracteristicas li{ font-size: 12px;}
  p.gigante{ font-size: 28px;}
  p.grande{ font-size: 24px;}
  p.medio{ font-size: 14px;}
	.limit{ width: 100%; }
  .col-s-1 {width: 8.33%;}
  .col-s-2 {width: 16.66%;}
  .col-s-25 {width: 20%;}
  .col-s-3 {width: 25%;}
  .col-s-4 {width: 33.33%;}
  .col-s-5 {width: 41.66%;}
  .col-s-6 {width: 50%;}
  .col-s-7 {width: 58.33%;}
  .col-s-8 {width: 66.66%;}
  .col-s-9 {width: 75%;}
  .col-s-10 {width: 83.33%;}
  .col-s-11 {width: 91.66%;}
  .col-s-12 {width: 100%;}
  .boton{ bottom: 0px; }
	.indice{ width: 50%;}
	.imini{ width: 40%; }
	.indice h1{ font-family: Roboto-Regular; font-size: 20px;}
.indice h2{ font-family: Roboto-Light; font-size: 18px;}
.indice h3{ font-family: Roboto-Thin; font-size: 14px;}
	input.inumber{ width: 50%; }
}
/******************************************************************** Para pc */
@media only screen and (min-width: 1025px) {

  h1 { font-size: 32px;}
  h2,p.medio { font-size: 26px;}
  h3 { font-size: 22px;}
  p,a,span,.tit,.lista_caracteristicas li{ font-size: 14px;}
  p.gigante{ font-size: 38px;}
  p.grande{ font-size: 28px;}
  p.medio{ font-size: 18px;}
	.limit{ width: 80%; }
  .col-1 {width: 8.33%; font-size: 22px;}
  .col-2 {width: 16.66%; font-size: 22px;}
  .col-25 {width: 20%; font-size: 22px;}
  .col-3 {width: 25%; font-size: 22px;}
  .col-4 {width: 33.33%; font-size: 22px;}
  .col-5 {width: 41.66%; font-size: 22px;}
  .col-6 {width: 50%; font-size: 22px;}
  .col-7 {width: 58.33%; font-size: 22px;}
  .col-8 {width: 66.66%; font-size: 22px;}
  .col-9 {width: 75%; font-size: 22px;}
  .col-10 {width: 83.33%; font-size: 22px;}
  .col-11 {width: 91.66%; font-size: 22px;}
  .col-12 {width: 100%; font-size: 22px;}
  .boton{ bottom: 0px; }
	.indice{ width: 50%;}
	.imini{ width: 40%; }
	.indice h1{ font-family: Roboto-Regular; font-size: 22px;}
.indice h2{ font-family: Roboto-Light; font-size: 20px;}
.indice h3{ font-family: Roboto-Thin; font-size: 16px;}
	input.inumber{ width: 50%; }
}
/******************************************************************** Full HD */
@media only screen and (min-width: 1336px) {
  h1 { font-size: 42px;}
  h2,p.medio { font-size: 36px;}
  h3 { font-size: 24px;}
  p,a,span,.tit,.lista_caracteristicas li{ font-size: 18px;}
  p.gigante{ font-size: 48px;}
  p.grande{ font-size: 36px;}
  p.medio{ font-size: 26px;}
	.limit{ width: 80%; }
  .boton{ bottom: 0px; }
		.indice{ width: 45%;}
		.imini{ width: 25%; }
	.indice h1{ font-family: Roboto-Regular; font-size: 24px;}
.indice h2{ font-family: Roboto-Light; font-size: 22px;}
.indice h3{ font-family: Roboto-Thin; font-size: 18px;}
	input.inumber{ width: 25%; }
}

.bg_blanco{ background: #fff; color: #000; }
.bg_blanco h1{ color: #000; }

.bg_grisclaro{ background: #eee; color: #000; }
.bg_gris{ background: #ddd; color: #000; }

.bg_azul{ background: #000; color: #fff; }
.bg_azul h1{ color: #fff; }
.bg_azul a{ color: #fff; text-decoration: none; }
.bg_azul a:hover{ text-shadow: 0px 0px 2px #fff;}

.bg_azul{ background-color: #3F7FAB; color:#fff; }
.bg_azulclaro{ background: #BCD4E5; color:#000; }
.bg_azulclaro a:hover{ text-shadow: 0px 0px 2px #fff;}
.bg_azultrans{ background: rgba(63,127,171,0.7);color: #fff; font-weight: bold; text-shadow: 0 0 3px #3F7FAB; }
.bg_azultrans a{ color: #fff; font-weight: bold; text-shadow: 0 0 3px #3F7FAB; }
.bg_azultrans a:hover{ color: #fff; text-decoration: underline;}
.bg_azulclarisimo{ background: #E0EAF1;}

.txt_gris{ color: #666; }
.txt_blanco{ color: #fff; }

.txt_centrado{ text-align: center; }
.txt_right{ text-align: right; }
.txt_left{ text-align: left; }
.txt_justificado{ text-align: justify;}

.border{ border: solid 1px red; }
.borderleft{ border-left: solid 1px #99A0CE; font-size: 16px; padding-top: 68px;text-align: right;font-weight: bold;}
.borderleft sub{ font-size: 10px;font-weight: 100;}
.borderround{ border: solid 1px #aaa; border-radius: 32px; }

.pag{ position: relative; margin: 0; padding: 0; width: 100%; }

.margin2{ margin: 2vw; }
.marginbot-6{ margin-bottom: -6px; }

.padding1{ padding-top: 2vw;padding-bottom: 1vw;}
.padding2{ padding-top: 2vw;padding-bottom: 2vw;}
.padding3{ padding-top: 3vw;padding-bottom: 3vw;}
.padding4{ padding-top: 4vw;padding-bottom: 4vw;}
.padding42{ padding-top: 4vw;padding-bottom: 4vw; padding-left: 2vw; padding-right: 2vw;}
.padding82{ padding-top: 8vw;padding-bottom: 8vw; padding-left: 2vw; padding-right: 2vw;}
.padding22{ padding: 2vw;}
.padding32{ padding-top: 3vw;padding-bottom: 2vw; padding-left: 2vw; padding-right: 2vw;}
.padding44{ padding: 4vw;}
.padding02{ padding-top: 0;padding-bottom: 0; padding-left: 2vw; padding-right: 2vw;}
.paddingtop2{padding-top: 2vw;}
.paddingtop4{padding-top: 4vw;}
.paddingbottom4{padding-bottom: 4vw;}
.paddingbottom1{padding-bottom: 1vw;}
.paddingtop32{ padding-top: 32px; }
.paddingtop64{ padding-top: 64px; }
.paddingrl64{ padding: 0 64px 0 64px;}
.bottom64{ padding-bottom: 64px; }
.paddingtop0{ padding-top: 0; }
.paddingbottom0{ padding-bottom: 0; }
.paddingleft2{ padding-left: 2vw;}

.img15 img{ width: 15%; }
.img25 img{ width: 25%; }
.img30 img{ width: 30%; }
.img35 img{ width: 35%; }
.img40 img{ width: 40%; }
.img50 img{ width: 50%; }
.img60 img{ width: 60%; }
.img75 img{ width: 75%; }
.img100 img{ width: 100%; }

.h50{ height: 50%; }
.w80{ width: 80%; }
.w50{ width: 50%; }
.w33{ width: 33.3%; }
.w100{ width: 100%; }
.p16{ padding: 16px; }
.p-16{ margin-bottom: -16px; }
.ml-16{ margin-left: -16px; }
.pb0{ padding-bottom: 0px; margin-bottom: -16px;}
.p0{ padding: 0px; margin: 0px;}
.top16{ padding-top: 16px; }
.w256{ width: 272px; margin: 0 auto;}
.h64{ height: 64px; }
.overflow_auto{ overflow: auto; }
.overflow_hidden{ overflow: hidden; }
.overflow_visible{ overflow: visible; }
.bottom{ bottom: 0px; }
.right{ right: 0px; }
.margintop0{ margin-top: 0px;}
.margintop-1{ margin-top: -1px;}
.margin-top-208{ margin-top: -208px;}
.top-154{ top: -130px; }
.top-118{ top: -118px; }
.abstop0{ top: 0px; }
/************************************************************************ pie */
.pie { padding-top: 3vh;}
.logo_pie{ padding-bottom: 3vh; padding-top: 0vh;}
.logo_pie p{ font-size: 14px; font-style: italic; font-weight: bold; margin: 0; padding-right: 7px;}
.logo_pie img{ width: 96px; }
img.isos{ height: 10vh; margin-bottom: 1vh;}
.copy{ width: 100%; text-align: center; font-size: 12px; font-family: Roboto-Thin,arial;}
.txt_pie{ text-align: center;}
.txt_pie ul,.txt_pie li{ text-align: center;}
.logotipo_itm{
	background: url(../img/logoitm-blanco.png) no-repeat right;
	background-size: 96px;
	padding-top: 80px;
	width: 100%;
	max-width: 200px;
	margin: 0 auto;
}
/************************************************************** menu cabecera */

/******************************************************** enlace a documentos */
.enlacepdf{ margin-top: 4vh;}
.enlacepdf a{ font-family: Roboto-Regular,arial; color: #fff; background: #C20D0E; padding: 4px 8px; border-radius: 8px; width: 160px; text-align: center;border: solid 1px #C20D0E;}
.enlacepdf a:hover{ color: #C20D0E; background: #fff;}

.test{ position: relative; border-top: solid 4px red; overflow: hidden;}

.paneles::after{
  clear: both;
  display: table;
}
.dospan{
	float: left;
	width: 50%;
}
.trespan{
	float: left;
	width: 33.3%;
}
table,td,tr{ border: none; padding: 0; margin: 0;}
table{width: 100%;}
table.medidas_losetas{ background: #BCD4E5; margin-top: 4vh; }
table.medidas_losetas td{ background: #fff; padding: 1vh;}



.logo_pie{ width: 200px; margin: auto; margin-bottom: 24px;}
.logo_pie p{ font-size: 14px; font-style: italic; font-weight: bold; margin: 0; padding: 0;}
.logo_pie img{ width: 96px; }
a .logo_pie p{ color: #fff;}
.pie { padding-top: 4vh;}
.pie p{ font-size: 14px; padding-top: 0px;}
.pie h3{ font-size: 18px; font-family: Roboto-Regular; }
.pie a{ font-size: 14px;}

img.isos{ height: 10vh; margin-bottom: 1vh;}
.copy{ width: 100%; text-align: center; font-size: 12px; font-family: Roboto-Thin;}


.botones_web a{ color: #000; font-family: Roboto-Regular;}
.botones_web a:hover{ color:#b60027;}
.botones_web p{ margin-top: 0px; padding-top: 1vw;}

span.rojo{ color: #b60027;}

.flot_der{ float: right; }

.redes_sociales{ float: right; }

.txt_compartir{ color: #666; padding-top: 4px;}
.sprite{ width: 32px; height: 32px; background: url(../img/sprite.png) no-repeat center; background-size: 100%;}
.sp_facebook_n{ background-position: right -288px; }
.sp_tweeter_n{ background-position: right -256px; }
.sp_compartir{ background-position: right -225px; }


.logo_pie{ width: 200px; margin: auto; margin-bottom: 24px;}
.logo_pie p{ font-size: 12px; font-style: italic; font-weight: bold; margin: 0; padding: 0;}
a .logo_pie p{ color: #fff;}


@keyframes slidetop{
  from { opacity: 0; }
  to { opacity: 1; }
}

.slidetop{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	display: none;
  animation-name: slidetop;
  animation-duration: 1s;
  animation-iteration-count: 1;
  animation-direction: alternate;
}
.slt1{ background: url(../img/montaje-losetas-de-plastico.jpg) no-repeat center;	background-size: cover; }
.slt2{ background: url(../img/loseta-exterior-piscina.jpg) no-repeat center;	background-size: cover; }
.slt3{ background: url(../img/loseta-exterior-jardin.jpg) no-repeat center;	background-size: cover; }
.slt4{ background: url(../img/venta-de-losetas.jpg) no-repeat center;	background-size: cover; }

.loseplastop{
	width: 100%;
	height: 12.5vh;
	padding: 3vh;
	padding-top: 4.5vh;
	display: block;
	position: absolute;
	z-index: 100000;
}
.loseplastop img{ height: 70%; width: auto;}

.visible{ display: inline-block !important; }

.entop{ margin: 0; padding: 0; float: right; height: 100%; text-align: right;}
.entop img { height: 70%; margin-top: -1vh;}
.entop p{ font-style: italic; font-size: 1.5vh; padding: 0; margin: 0;}

.tresimgs{
	position: absolute;
	height: 100%;
	width: 50%;
	right: 0;
}
.tresimgs .img1{
	position: absolute;
	width: 100%;
	height: 33.3%;
	background: url(../img/loseta-drenante.jpg) no-repeat center bottom;
	background-size: cover;
}
.tresimgs .img2{
	position: absolute;
	top: 33.3%;
	width: 100%;
	height: 33.3%;
	background: url(../img/loseta-terraza.jpg) no-repeat center bottom;
	background-size: cover;
}
.tresimgs .img3{
	position: absolute;
	top: 66.6%;
	width: 100%;
	height: 33.3%;
	background:  url(../img/loseta-plastica.jpg) no-repeat center bottom;
	background-size: cover;
}



.slide_losetas{
	width: 100%;
	height: 280px;
	overflow: auto;
}

@keyframes carrusel{
	from { background-position: 0 0; }
	to { background-position: -2304px 0; }
}

.carrusel_losetas{
	width: 100%;
	height: 256px;
	background: url(../img/sprite_losetas.jpg) repeat-x center;
	animation: carrusel 20s linear infinite;
}
.pausa{
	animation-play-state: paused;
}
.play{
	animation-play-state: running;
}
.oculto{ display: none; }

/************************************************************* txt_privacidad */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted #aaa;
  font-weight: 100;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 50vw;
  background-color: #888;
  color: #fff;
  font-size: 12px;
  text-align: justify;
  border-radius: 6px;
  padding: 5px 20px;
  position: absolute;
  z-index: 1;
  top: 24px;
  left: -64px;
  background: rgba(63,127,171,0.9);color: #fff; font-weight: bold; text-shadow: 0 0 3px #3F7FAB;

  box-shadow: 0 0 8px #fff;
}

.tooltip .tooltiptext p{
	font-family: Roboto-regular,arial;
	font-size: 12px;
}


.tooltip:hover .tooltiptext {
  visibility: visible;
}

/*.proforma{ display: none;}*/

hr{ color: #BCD4E5; border: none; border-bottom: solid 1px #BCD4E5; margin: 2vw auto;}

.logo_validacion{ text-align: right; width: 200px; margin: auto; padding-bottom: 128px;}
.logo_validacion p{ font-size: 14px; font-style: italic; font-weight: bold; margin: 0; padding: 0;}
.logo_validacion img{ width: 96px; }
a .logo_validacion p{ color: #000; }


.bg_fichatecnica a:hover{ text-decoration: none; text-shadow: 0 0 4px #fff;}

/***************************************************************************************************************************************************************************************** menu cabecera */
.telefono img{ width: 18px; margin-bottom: -3px;}
.sticky { position: fixed; top: 0; width: 100%;}
img.wassup{ width: 100%; min-width: 25px; max-width: 25px; height: auto; padding-left: 4px; padding-right: 4px; margin-bottom: -2px; }

.fondomenumovil{ background: #3F7FAB; position: fixed; top: 0; width: 100%; height: 41px; z-index: 100000;  font-family: Roboto-Regular;}
.menumovil {
  overflow: hidden;
  position: fixed;
  top: 0;
  width: 100%;
  border: solid 1px transparent;
}

.menumovil a {
  float: left;
  display: block;
  text-align: center;
  text-decoration: none;
  color: #fff;
  padding: 8px 12px;
	font-size: 18px;
	border: solid 1px transparent;
	background: #3F7FAB;
}

.menumovil a:hover {
	color: #fff;
	background: #BCD4E5;
}
.menumovil a.nohover:hover{ background:#3F7FAB;}
.menumovil a.active {
	background: #BCD4E5;
	color: #fff;
}
/*
.menumovil a.pedidos {
	background: #FFf;
	color: #43883d;
}
.menumovil a.pedidos:hover {
	background: #abc675;
	color: #fff;
}
*/

.menumovil a.pedidos {
	background: #FFD500;
	color: #000;
}
.menumovil a.pedidos:hover {
	background: #FFD500;
	color: #fff;
}

.menumovil .icono { display: none; }

.separador{
	width: 100%;
	height: 37px;
	margin: 0;
}

.logotipo_menutop{
	height: 37px;
 	width: 154px;
	background: url(../img/loseplast.png) no-repeat;
	background-size: contain;
 	background-position: 1px 6px;
}

.nomovil_fd{
	float: right;
}
.nomoviltel{
	color: #fff;
	margin: 10px 32px 0px 32px;
}
.nomoviltel span{	font-size: 18px;}

.dio{
	display: none;
	width: 90px;
	margin-top: 40px;
	margin-left: 250px;
}
.dio a{
	float: none;
	width: 120px;
	text-align: left;
	font-size: 14px;
	background: #E0EAF1;
	color: #000;
}

.mprod{
	display: none;
	width: 90px;
	margin-top: 40px;
	margin-left: 90px;
}
.mprod a{
	float: none;
	width: 140px;
	text-align: left;
	font-size: 14px;
	background: #ddd;
	color: #000;
}

.botondistribuidores{
	position: fixed;
	top: 41px;
	right: 0px;
	background: #f00;
	color: #fff;
	font-family: Roboto-Regular;
	font-size: 18px;
	padding: 10px;
	z-index: 10000;
	border-left: solid 1px #f00;
	border-bottom: solid 1px #f00;	
	border-bottom-left-radius: 10px;
}
.botondistribuidores:hover{
	background: #fff;
	color: #f00;
	border-left: solid 1px #f00;
	border-bottom: solid 1px #f00;	
}
a.botondistribuidores:hover{ color: #f00;}

.div-colors {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
}

.colors {
	border-radius: 10rem;
	width: 50px;
	height: 50px;
	margin: 10px 5px 0;
  }

  .colors-text {
	display: flex;
	flex-direction: column;
	align-items: center;
  }

  .grey7015{background-color:rgb(79, 83, 88);}
  .grey7040{background-color: rgb(197, 200, 204);}
  .red3000{background-color:rgb(196, 41, 30);}
  .orange2004{background-color:rgb(226, 83, 3);}
  .yellow1012{background-color:rgb(221, 175, 39);}
  .yellow1023{background-color:rgb(247, 181, 0);}
  .green6018{background-color:rgb(97, 153, 59);}
  .green6024{background-color:rgb(0, 131, 81);}
  .blue5017{background-color:rgb(0, 91, 140);}
  .blue5002{background-color:rgb(0, 56, 123);}
  .black9005{background-color:rgb(23, 23, 23);}

@media screen and (max-width: 675px) {
  .menumovil a:not(:first-child) {display: none;}
  .menumovil a.icono {
    float: right;
    display: block;
    padding: 0px;
  }
  .logotipo_menutop{
  	width: 90px;
  	background-position: 0px 8px;
  }
  .nomovil_fd{
  	float: none;
  }
}

@media screen and (max-width: 675px) {
  .menumovil.resp {position: relative;}
  .menumovil.resp .icono {
    position: absolute;
    right: 0;
    top: 0;
  }
  .menumovil.resp a {
    float: none;
    display: block;
    text-align: left;
  }
  .separador.resp {height: 0px;}
  .dio{ margin: 0; width: 100%;}
  .dio a{ background: rgb(63,127,171,0.9); color: #fff; width: 100%;}
  .botondistribuidores{
  	bottom: 0px;
  	top: auto;
  	width: 100%;
  	border-bottom-left-radius: 0px;
  	text-align: center;
  	border: solid 1px #f00;
  }
  .tooltip .tooltiptext {
  	width: 70vw;
  }
}

@media screen and (max-width: 950px) {
	.logotipo_menutop{
		width: 128px;
		background-position: 1px 8px;
	}
	.ocultomovil{
	display: none;
	}
	.boton_productos img{
		width: 90%;
		height: auto;
	}
}

.menumovil a.itm{
	font-weight: bold;
	font-style: italic;
	float: left;
	padding: 0 16px;
}

.icono_sprite{
	width: 32px;
	height: 32px;
	background: url(../img/sprite.png) no-repeat;
}
.icono_sprite.bot_movil{
	width: 38px;
	height: 38px;
	background-size: cover;
	background-position: 0px -381px;
	margin: 0 8px;
}
.icoidi{
	width: 16px;
	height: 16px;
	background: url(../img/sprite.png) no-repeat;
	background-size: cover;
	display: inline-block;
	margin-left: 4px;
	margin-bottom: -2px;
}
.icoidi.es{ background-position: 0px 0px;}
.icoidi.en{ background-position: 0px -16px;}
.icoidi.de{ background-position: 0px -32px;}
.icoidi.fr{ background-position: 0px -48px;}
.bg_blanco h1{ color: #000; }