:root {
  --bg:#FFFFFF;
  --bg1:#EEECF5;
  --title:#000000;
  --primary:#000000;
  --bgprimary:#000000;
  --bgsecondary:#31383C;
  --secondary:#00b0ff;

  --bgrgba:rgba(255,255,255,0.75);
  --rgbablack1:rgba(25,27,42, 0.08);
  --rgbablack2:rgba(25,27,42, 0.18);
  --rgbablack3:rgba(25,27,42, 0.18);
  --rgbablack4:rgba(0,0,0, 0.9);

  --rojo:#de474e;
  --rojo2:#c24148;
  --blanco:#ffffff;
  --azul:#00b0ff;
  --verde:#04c088;
  --lime:#d2ff09;
  --naranja:#f99614;
  --negro2: #0C0C0E;
  --gris1:#CCCCCC;
  --gris2:#646464;
  --gris3:#999999;  
  
  --path-fill-1: #838383 ;
	--path-fill-2: #575757 ;
	--path-fill-3: #2c2c2c ;
	--path-fill-4: #000000 ;
}


html{ height: 100%; width:100%; margin:0; padding:0; 
  font-family:'Helvetica', 'Arial', sans-serif; font-size:13px; color:#191f37; background:#fff;
      color:#14285a;  -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;
      background:  #ffffff; 
}

body{ height: 100%; width:100%; margin:0; padding:0;   }

table { border-collapse: collapse;  border-spacing: 0; }
hr {  border: 0; height: 1px; background: #ddd; margin-bottom:20px; }

.portada
{   width:100%; height:100%; border-spacing:0; border-collapse:collapse;

 background-repeat: no-repeat;  background-size: 100% 100%;
}

.negrita{ font-weight: bold; }

.diagrama{  }
.diagrama td { border:solid 1px #ccc; }

.justificar{ text-align: justify; }

.intro { color: #0c2e8a; margin-bottom: 30px; font-size: 64px; font-weight: 700; }
.intro span { color: #50d8af; text-decoration: underline; }

.section-header {font-size: 32px; color: #0c2e8a; 
  text-transform: uppercase; font-weight: 700;
  position: relative; padding-bottom: 20px; }

.section-header::before { content: ''; position: absolute; display: block;
width: 50px; height: 3px; background: #50d8af; bottom: 0; left: 0; }


.section-header2 {font-size: 32px; color: #ffffff; 
  text-transform: uppercase; font-weight: 700;
  position: relative; padding-bottom: 20px; }

.section-header2::before { content: ''; position: absolute; display: block;
width: 50px; height: 3px; background: #ffffff; bottom: 0; left: 0; }


#pie_pag{ height:50px; vertical-align:top; text-align:center; font-size:0.7em; width:100%;  }
.margen0 {   margin:0; }

.barra{ background: #ffffff;  }

.fixed{ position: fixed; width: 100%;  }

.barra_menu {  border-bottom:solid 1px #ccc; height: 25px; width:100%;
            color:#14285a; left: 0px; top: 0px; z-index: 99; margin:0; padding:0;
            border-collapse: separate;
            -moz-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
            -webkit-box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2); 
            box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2); }

.centrar { text-align:center; margin:auto; }

.pagina
{ width:100%; min-height:100%; border-spacing:0; border-collapse:collapse; }

.pie_pag{ height:35px; vertical-align:top;   text-align:center; font-size:0.7em;   }


.etiqueta_roja { color:#c60303;}


.padding_abajo { padding-bottom:7px; }
.padding_arriba { padding-top:7px; }
.padding { padding:7px; }

.overlay{ position:fixed; width:100%; height:100%; margin:0; top:0; left:0;
          background:#ffffff; background:rgba(255,255,255,0.95);
          z-index:9999; color:#14285a; display:table; overflow-y:auto; 
}
/************************************/
/*           GENERALES              */
/************************************/

.td-arriba { vertical-align: top; }
.td-abajo  { vertical-align: bottom; }
.td-medio  { vertical-align: middle; }
.td-derecha{ vertical-align: right; }
.td-izquierda { vertical-align: left; }
.txt-arriba { text-align: top; }
.txt-abajo  { text-align: bottom; }
.txt-centro { text-align: center; }
.txt-derecha   { text-align: right; }
.txt-izquierda { text-align: left; }
.negro{ color:var(--negro2); }
.blanco{ color:var(--blanco) !important; }
.gris{ color:var(--gris1) !important; }
.rojo   { color:var(--rojo) !important; }
.verde  { color:var(--verde) !important; }
.azul   { color:#1D51A7 !important; }
.naranja{ color:var(--naranja) !important; }
.negrita{ font-weight: bold !important; }
.normal{ font-weight: normal; font-family: TommyLight,sans-serif, Arial ;}
.hide { display: none !important; }
.ft{ font-size: 0.80em !important;}
.bggris   { background-color:var(--gris1) !important; }
.bgrojo   { background-color:var(--rojo) !important; }
.bgverde  { background-color:var(--verde) !important; }
.bgazul   { background-color:#1D51A7 !important; }
.bgnaranja{ background-color:var(--naranja) !important; }
.bgnegro{ background-color:var(--negro2) !important; }
.bgblanco{ background-color:var(--bg0) !important; }
.bordegris   { border:solid 1px var(--gris1) !important; }
.borderojo   { border:solid 1px var(--rojo) !important; }
.bordeverde  { border:solid 1px var(--verde) !important; }
.bordeazul   { border:solid 1px #1D51A7 !important; }
.bordeindigo { border:solid 1px #14285a !important; }
.bordenegro { border:solid 1px var(--bg) !important; }
.bordenaranja{ border:solid 1px var(--naranja); }
.borde-izq{ border-left:solid 1px var(--rgbablack1) !important;}
.borde-der{ border-right:solid 1px var(--rgbablack1) !important;}
.borde-arriba{ border-top:solid 1px var(--rgbablack1) !important;}
.borde-abajo{ border-bottom:solid 1px var(--rgbablack1) !important;}
.borde-r5{ border-radius: 5px;}

.flex{ display: flex; align-items: center;}
.flex-center{ display: flex; align-items: center; justify-content: center;}
.flex-column{ display: flex; align-items: center; justify-content: center; flex-direction: column;}
/******************************************/

h1,h2,h3,h4,h5,h6{ margin:0; padding:0; font-weight:normal; }


/*----------------------------------------------------------------------------*/
/*                                 CARGANDO                                   */
/*----------------------------------------------------------------------------*/
.spinner { z-index:0; margin: auto; left:0; right:0; top:0px; bottom:0px; position:absolute;
            width: 50px; height: 70px; 
		   text-align: center; font-size: 10px; }
.spinner > div { background-color: #14285a; height: 100%; width: 6px; display: inline-block;
			     -webkit-animation: stretchdelay 1.2s infinite ease-in-out; animation: stretchdelay 1.2s infinite ease-in-out; }
.spinner .rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; }
.spinner .rect3 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; }
.spinner .rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; }
.spinner .rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; }

@-webkit-keyframes stretchdelay { 0%, 40%, 100% { -webkit-transform: scaleY(0.4) }   20% { -webkit-transform: scaleY(1.0) } }

@keyframes stretchdelay { 0%, 40%, 100%{transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 
						  20% {  transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } }

.loader { font-size: 10px; float:right; display:none; border-top: 3px solid rgba(255, 255, 255, 0.2); 
		  border-right: 3px solid rgba(255, 255, 255, 0.2); border-bottom: 3px solid rgba(255, 255, 255, 0.2);
		  border-left: 3px solid #ffffff;-webkit-animation: load8 0.9s infinite linear; animation: load8 0.9s infinite linear; }
.loader,.loader:after { border-radius: 50%; width: 20px; height: 20px; }
@-webkit-keyframes load8 {
  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
@keyframes load8 {
  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
}
