@charset "utf-8";
/* fuentes */
@font-face{ font-family:ermxb; src:url(css_even/font/ermxb.ttf)} /* fuente para el nombre de la empresa donde aparezca*/
@font-face{ font-family:daniel; src:url(css_even/font/daniel.ttf)} /* fuente para los textos del slogan y fraces */
@font-face{ font-family:erm; src:url(css_even/font/erm.ttf)}/* fuente textos generales llamado en <P></P>*/


@font-face{ font-family:ergblke; src:url(css_even/font/ergblke.ttf)} /* fuente para el titulo y el logo de la empresa donde aparezca*/
@font-face{ font-family:ermblk; src:url(css_even/font/ermblk.ttf)} /* fuente para el titulo de la empresa donde aparezca*/

@font-face{ font-family:ermxbi; src:url(css_even/font/ermxbi.ttf)}



/*Fuentes aplicadas*/
.nomlogo{font-family:ermxb;}/* fuente para el nombre de la empresa donde aparezca*/
.nomslogan{font-family:daniel;}/* fuente para los textos del slogan y fraces */

.nomtitulo{font-family:ergblke;}/* fuente para el titulo y el logo de la empresa donde aparezca*/
.nomtitulo2{font-family:ermxb;}/* fuente para el titulo donde aparezca el logo de la empresa donde aparezca*/
.nomsubtitulo{font-family:ermblk;}/* fuente para el subtitulo de la empresa donde aparezca*/
.nomsubtitulo2{font-family:ermxbi;}/* fuente para el titulo donde aparezca el logo de la empresa donde aparezca*/
/* Realzar Fuentes */



/* CSS Document */
p{ font-size: 0.8em; font-family:erm}
a{ text-decoration:none;}

.tinto{ color:#333333;}
.mostaza{ color:#FC0}
.naraja{ color:#088FFE} 
.salmon{ color:#F33}
.blanko{ color:#FFF;}
.gris{ color:#999}
.oscuro{ color:#333}

.btinto{ background-color:#4d4d4d;}
.bmostaza{ background-color:#FC0}
.bnaraja{ background-color:#088FFE} 
.bblanko{ background-color:#FFF;}
.bgclaro{ background-color:#CCC;}

.transicion{-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
  		-o-transition:all 0.3s ease-out;  /* Opera */
 		-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
  		-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
 		transition:all 0.3s ease-out;  /* W3C */}

.botservicios{opacity:;}
.botservicios:hover{opacity:0.5;}



/*------------------------------- boton word ---------------------------------*/

.bot-ico-word { background:url(../imagenes/icono-word.png); width:22px; height:22px; padding: 0px; float:left;}
.bot-ico-word:hover{opacity:0.6;}

.bot-ico-excel { background:url(../imagenes/icono-excel.png); width:22px; height:22px; padding: 0px; float:left;}
.bot-ico-excel:hover{opacity:0.6;}

.bot-ico-pdf { background:url(../imagenes/icono-pdf.png); width:22px; height:22px; padding: 0px; float:left;}
.bot-ico-pdf:hover{opacity:0.6;}

/*----------------------------------  Visor articulos ------------------------*/
.iframeconarti{ height:100%; width: 60%; background-position:center; position: absolute; padding: 0% 1%; scrolling: yes; border-radius: 7px ;	-moz-border-radius: 7px ; -webkit-border-radius: 7px;}

/*-----------------------------------------------------------------------------*/


/* ----------------------------  deslisante link plataforma ----------------------------------*/
.social-slider-menu {
	width:70px;
	height:85px;
    position: absolute;
	z-index: 99999;
	background-color:#009900;
}
#social-slider-menu img {

	width:70px;
	height:85px;
    padding: 4px 0px;
    text-align: center;
	z-index: 99999;
	}
	
.social-slidercontenedor{
width:160px;
height:140px;
background-image: url(../imagenes/plataforma.gif);
background-repeat:no-repeat;
top:40%;
position: absolute;
z-index: 99999;
margin-left:-130px;
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */
}
.social-slidercontenedor:hover{
width:160px;
height:140px;
background-image: url(../imagenes/plataforma.png);
background-repeat:no-repeat;
position: absolute;
z-index: 99999;
margin-left:-1px;
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */

}
.social-slider-menuf {
	width:70px;
	height:85px;
    position: absolute;
	z-index: 99999;
	background-color:#009900;
}
.social-sliderfcontenedor{
width:130px;
height:130px;
top:150px;
position: absolute;
z-index: 99999;
margin-left:01px;
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */
}
.social-sliderfcontenedor:hover{
width:140px;
height:140px;	
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */
-webkit-box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
-moz-box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
border-radius: 10px ;-moz-border-radius: 10px ; -webkit-border-radius: 10px;
}

.social-sliderfcontenedor2{
width:130px;
height:130px;
top:150px;
margin-right:-50px;
z-index:99999;
position: absolute;
z-index: 99999; 
margin-right:01px;
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */
}
.social-sliderfcontenedor2:hover{
width:140px;
height:140px;
margin-right:-50px;
z-index:99999;
-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
-o-transition:all 0.3s ease-out;  /* Opera */
-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
transition:all 0.3s ease-out;  /* W3C */
-webkit-box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
-moz-box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
box-shadow: 0px 0px 10px 2px rgba(255,255,255,0.45);
border-radius: 10px ;-moz-border-radius: 10px ; -webkit-border-radius: 10px;
}

@media screen and (max-width: 3500px) {
.verdiv{ }
.verdiv1{ display:none; visibility:hidden;}
.spacio{ width:100%; margin-bottom:1%; padding-bottom:5%; float:left;}
.spaciopeke{ width:100%; margin-bottom:1%; padding-bottom:0.5%; float:left;}

.transicion{-webkit-transition:all 0.3s ease-out;  /* Chrome y Safari */
  		-o-transition:all 0.3s ease-out;  /* Opera */
 		-moz-transition:all 0.3s ease-out;  /* Mozilla Firefox */
  		-ms-transition:all 0.3s ease-out;   /* Internet Explorer */
 		transition:all 0.3s ease-out;  /* W3C */}
		
.contvermas{ font:Arial, Helvetica, sans-serif; text-decoration: none; display:inline-block; text-align:center; background-position:right; width:100%;}
.vermas{ background-color:#ccc; color:#333; font:Arial, Helvetica, sans-serif; text-decoration: none; padding: 1% 1.5%; display:inline-block; text-align:center; background-position:right; -webkit-border-radius: 7px; -moz-border-radius: 7px; border: #999 2px solid; font-weight:bold;}
.vermas:hover{ opacity:0.5;}

.articulosver{ width:98%; border-bottom: #4d4d4d 1px double; padding: 1.5% 1%; cursor:pointer; margin-bottom: 2%; text-align:justify;}
.articulosver:hover{ color:#4d4d4d; background-color: rgba(230,184,0,0.3)}
.separador{ margin:0.5%;}

/*==================== texto articulos link ===========================*/
.articulosvertitulo{ padding: 0.5%; cursor:pointer; color:#4d4d4d; font-size:1.2em;}
.articulosvertexto{ padding: 0.2% 0.5%; cursor:pointer; color:#333; font-size:0.9em;}
.articulosverfecha{ padding: 0.2% 0.5%; cursor:pointer; color:#999; font-size:0.9em;}

/*=====================================================================*/

.tituartuculos{ width:84%; background-color:#4d4d4d; padding: 2% 5%; margin:0.5% 3%; float:left;}
.textuartuculos{ display:inline-block; color:#FFF; float:left; font-weight:bold; font-size:1.5em;}
.botregartuculos{ height:20px; width:40px; float: right; margin-bottom:0.5%; background-image: url(../imagenes/regresar.png);}
.botregartuculos:hover{ opacity:0.5;}
/*================== contenedor ==================*/
.contegeneral{width:100%; float: left; position: relative; }


.contenidosyou{ width:80%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:1%; margin-top:38%;}
.contenidosotros{ width:80%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:1%; margin-top:1%;}
.contenidosy{ width:80%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:0%; margin-top:39%;}
.contenidos{ width:80%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:1%; margin-top:38%;}
.contenidosodf{ width:90%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:1%; margin-top:38%;}
.contenidostwits{ width:80%; padding: 0%; float:left; position: relative; margin-left: 10%; margin-right: 10%; margin-bottom:1%; margin-top:38%;}
.submenusinter{ width:20%; padding: 0%; float:left; margin-left: 1%; margin-bottom:1%;}
.subcontenidos{ width:78%; padding: 0%; float:left; margin-bottom:1%;}

.submenusinter2{ width:35%; padding:0%; float:left; margin-left:1%; margin-bottom:1%;}
.subcontenidos2{ width:64%; padding:0%; float:left; margin-bottom:1%;}

.submenusinter3{ width:32%; padding: 0%; float:left; margin-left: 0.5%; margin-right: 0.5%; margin-bottom:1%;}

/*========================================= Head  ==========================================*/
.headlogoban{ width:80%; margin-left:10%; margin-right:10%; float:left;}
.logohead{float:right; width:81%; background-color: rgba(255, 255, 255, 0.3); padding: 2% 2% 1%; -webkit-border-radius: 0px 0px 10px 10px;  -moz-border-radius: 0px 0px 10px 10px; background-position: center;}
.logovertical{ visibility: hidden; display:none;}
.fechahead{float:right; width:14%; background-color: rgba(153, 0, 0, 0.5);; padding: 1% 0.5%; -webkit-border-radius: 0px 0px 10px 10px;  -moz-border-radius: 0px 0px 10px 10px; background-position: center; float:left;}
.headbanner{ width:90%;  margin-left:5%; margin-right:5%; padding-top:3%; float:left;}
.botonera{ width:100%; float: left; z-index: 1/*99995*/; background-color:#C63; margin-top:424px; position:absolute;/*margin-top:34%; position:absolute;*/}
.headbanner2{ width:90%;  margin-left:5%; margin-right:5%; padding-top:3%; float: right;}

.contearticulos{ width:80%; padding: 0%; float:left; margin: 0% 10%; margin-bottom:1%;}
.coarticulos{ width:100%; padding: 0%; float:left; margin-bottom:1%;}
.articulos{ width: 49%; padding-right: 1%; float:left;}
.botoafiliado{ width: 49%; padding-left: 1%; float:left;}
.botoafiliadoiz{ width: 45%; padding: 2% 2%; float:left; background-color:#088FFE; border-radius:100%; margin-right:1%;}
.botoafiliadoiztext{ width:44%; padding: 3% 2%; float:left; background-color:#088FFE; color:#333333; margin: 0 1%; text-align:center; font-weight:bold;}
.botoafiliadodr{ width: 45%; padding: 2% 2%; float:left; background-color: #F33; border-radius:100%; margin-left:1%;}
.botoafiliadodrna{ width: 45%; padding: 2% 2%; float:left; background-color: #088FFE; border-radius:100%; margin-left:1%;}
.botoafiliadodrmo{ width: 45%; padding: 2% 2%; float:left; background-color: #FC0; border-radius:100%; margin-left:1%;}
.botoafiliadodrti{ width: 45%; padding: 2% 2%; float:left; background-color: #4d4d4d; border-radius:100%; margin-left:1%;}
.botoafiliadodrtext{width:44%; padding: 3% 2%; color:#333333; float:left; margin: 7% 0% 0%; text-align:center; font-weight:bold; border-radius:5%;}
.botoafiliadodrnum{ text-align:center; display:inline-block; padding: 3%; color:#FFFFFF; float:left; margin: 1% 5% 0%; text-align:center; font-weight:bold; border-radius:10%; background-color: rgba(153,0,0,0.8); border:#4d4d4d double 2px;}
.botoafiliadoclik:hover{ opacity:0.5; cursor:pointer;}
.marquesina{ width:80%; margin: 0 10%; padding: 1% 0%; background-color: #039; /*background-image: url("../imagenes/bg.png");*/ color:#FFF; float: left;}

.imgperdodrex{float:left; color:#333; margin-left:3%;  background: rgba(55,55,55,0.0);}
.imgperdodr{ width: 31%; padding: 1% 1%; float:left; background-color: #999; border-radius:100%; margin-left:1%;}
.textoimgperdo{ padding:3% 5% 1%; float:left; display:inline-block; }
/*==============================================barras para titulos ==============================================*/
.barrast{background-color:#039; color:#FFF; color:#FFF; font-weight:bold; padding: 1% 5%; margin-bottom:2%;}
.barrastgold{ background-color:#088FFE; color:#FFF; font-weight:bold; padding: 1% 5%; margin-bottom:2%; margin-top:1%;}
.barrasst{ background-color:#4d4d4d; color:#FFF; font-weight:bold; padding: 1% 5%;}

/*============================================= CLases para archivo regis vendedor ==============================*/
.contearticulos1{ width:90%; padding: 0%; float:left; margin: 0% 5%; margin-bottom:1%; margin-top:1%;}
.botoafiliado1d{ width: 30%; padding-left: 1%; padding-right: 5%; float:left;}
.botoafiliado1i{ width: 62%; padding-left: 1%; float:right;}

/*============================================= CLases columnas y divicion de articulos, texto e imagenes ==============================*/
.arquicolum1{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum2{ width:48%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3{ width:31%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3a{ width:64%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4{ width:23%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4a{ width:73%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum5{ width:18%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}


/*================================================================================================================*/
}

@media screen and (max-width: 650px) {
.spacio{ display:none; visibility:hidden;}
.verdiv{ display:none; visibility:hidden;}
.verdiv1{ display:inline; visibility: visible;}
/*head table*/
.botonera{ width:100%; margin-top:0.5%; float: left; z-index: 99999; background-color:#C63; margin-top:0.5%;}

.spaciopeke{ display:none; visibility:hidden;}
.botoafiliadoiz{ width: 95%; padding: 2% 2%; float:left; background-color:#088FFE; border-radius:100%; margin-right:1%;}
.botoafiliadodr{ width: 95%; padding: 2% 2%; float:left; border-radius:100%;}
.contearticulos{ width:94%; padding: 0%; float:left; margin: 0% 3%; margin-bottom:1%;}
.articulos{ width: 98%; padding: 1%; float:left;}
.botoafiliado{ width: 98%; padding: 1%; float:left;}
.botoafiliadoiz{ width: 45%; padding: 2% 2%; float:left; background-color:#088FFE; border-radius:100%; margin-right:1%;}
.botoafiliadodr{ width: 45%; padding: 2% 2%; float:left; background-color: #F33; border-radius:100%;}
.marquesina{ width:98%; margin: 0 1%; padding: 1% 0%; background-color:#039; color:#FFF; float: left;}
.logovertical{float:left; width:98%; padding: 2% 2%; background-position: center; visibility:visible; display:inline; position:static;}

.contegeneral{width:100%; float: left; position: relative; margin-top:1%;}

/*============================================= CLases columnas y divicion de articulos, texto e imagenes ==============================*/
.arquicolum1{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum2{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3a{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4a{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum5{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}

}
@media screen and (max-width: 480px) {
.spacio{ display:none; visibility:hidden;}
.verdiv{ display:none; visibility:hidden;}
.verdiv1{ display: inline; visibility:visible;}
.spaciopeke{ display:none; visibility:hidden;}

/*==============================  Head ====================================*/
.botonera{ width:100%; margin-top:0.5%; float: left; z-index: 99999; background-color:#C63; margin-top:0.5%;}
.logovertical{float:left; width:98%; padding: 2% 2%; background-position: center; visibility:visible; display:inline; position:static;}

.botoafiliadoiz{ width: 95%; padding: 2% 2%; float:left; background-color:#088FFE; border-radius:100%; margin-right:1%;}
.botoafiliadodr{ width: 95%; padding: 2% 2%; float:left; background-color: #F33; border-radius:100%;}
.contearticulos{ width:94%; padding: 0%; float:left; margin: 0% 3%; margin-bottom:1%;}
.articulos{ width: 98%; padding: 1%; float:left;}
.botoafiliado{ width: 98%; padding: 1%; float:left;}
.botoafiliadoiz{ width: 45%; padding: 2% 2%; float:left; background-color:#088FFE; border-radius:100%; margin-right:1%;}
.botoafiliadodr{ width: 45%; padding: 2% 2%; float:left; background-color: #F33; border-radius:100%;}


.submenusinter3{ width:99%; padding: 0%; float:left; margin-left: 0.5%; margin-right: 0.5%; margin-bottom:1%;}
/*Servicios*/
.submenusinter{ width:98%; padding: 0%; float:left; margin-left: 1%; margin-bottom:1%;}
.subcontenidos{ width:98%; padding: 0%; float:left; margin-left: 1%; margin-bottom:1%;}
/* enco */
.submenusinter2{ width:98%; padding: 0%; float:left; margin-left: 1%; margin-bottom:1%;}
.subcontenidos2{ width:98%; padding: 0%; float:left; margin-left: 1%;margin-bottom:1%;}

.contenidos{ width:90%; padding: 0%; float:left; position: relative; margin-left: 5%; margin-right: 5%; margin-bottom:1%; margin-top:1%;}

/*============================================= CLases columnas y divicion de articulos, texto e imagenes ==============================*/
.arquicolum1{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum2{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum3a{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum4a{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
.arquicolum5{ width:98%; padding: 0%; float:left; margin-left:1%; margin-right:1%;}
}