/*configuracion global*/ *{ color: #262629;/*color de letras*/ font-family: Tahoma, Verdana, Segoe, sans-serif;/*cambia el tipo de letra a uno mas amigable*/ } code{ color: #103c75;/*color de letras*/ font-family: "Currier";/*cambia el tipo de letra a uno mas amigable*/ } .contenido-f{ background-color: #ffffff; } body{ background-color: #e9e9e9; } /*configuracion global*/ /*descripccion*/ .descripccion-ele{ border: 1px solid #a09e9e!important;/* crea un borde*/ border-left: 7px solid #a09e9e!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*descripccion*/ /*botones*/ /*defecto 1*/ .boton.defec-1{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #103c75;/*color de texto*/ border: #103c75 1px solid;/*color de texto*/ } .boton.defec-1:hover{ color: #ffffff;/*color de texto*/ background: #103c75;/*color de texto*/ } /*defecto 2*/ .boton.defec-2{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #a09e9e;/*color de texto*/ border: #a09e9e 1px solid;/*color de texto*/ } .boton.defec-2:hover{ color: #ffffff;/*color de texto*/ background: #a09e9e;/*color de texto*/ } /*rojo*/ .boton.rojo{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #cb3e4d;/*color de texto*/ border: #cb3e4d 1px solid;/*color de texto*/ } .boton.rojo:hover{ color: #ffffff;/*color de texto*/ background: #cb3e4d;/*color de texto*/ } /*naranja*/ .boton.naranja{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #c58c37;/*color de texto*/ border: #c58c37 1px solid;/*color de texto*/ } .boton.naranja:hover{ color: #ffffff;/*color de texto*/ background: #c58c37;/*color de texto*/ } /*amarillo*/ .boton.amarillo{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #ddac36;/*color de texto*/ border: #ddac36 1px solid;/*color de texto*/ } .boton.amarillo:hover{ color: #ffffff;/*color de texto*/ background: #ddac36;/*color de texto*/ } /*verde*/ .boton.verde{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #20b978;/*color de texto*/ border: #20b978 1px solid;/*color de texto*/ } .boton.verde:hover{ color: #ffffff;/*color de texto*/ background: #20b978;/*color de texto*/ } /*rosado*/ .boton.rosado{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #c537b9;/*color de texto*/ border: #c537b9 1px solid;/*color de texto*/ } .boton.rosado:hover{ color: #ffffff;/*color de texto*/ background: #c537b9;/*color de texto*/ } /*azul*/ .boton.azul{ padding: 6px 10px;/*espacio interno*/ background-color: rgba(0,0,0,0); font-weight: 600; transition: background 0.25s ease-in-out; transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 5px; text-transform: uppercase;/* tranforma las letras en mayusculas(uppercase) ,minusculas (lowercase) o la primera letra de cada palabra en mayusculas(capitalize) */ color: #3a8fc5;/*color de texto*/ border: #3a8fc5 1px solid;/*color de texto*/ } .boton.azul:hover{ color: #ffffff;/*color de texto*/ background: #3a8fc5;/*color de texto*/ } /*botones*/ /*botones desplegable hover*/ /*defecto 1*/ .btn-hover.defec-1{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.defec-1 > a{ background: #103c75; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.defec-1 > a:hover{ color: #0d2c62; } .btn-hover.defec-1 ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #0d2c62;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #103c75; } .btn-hover.defec-1 > ul > li a{ transition: color 0.25s ease-in-out; color: #a09e9e; padding: 10px; } .btn-hover.defec-1 > ul > li a:hover{ color: #0d2c62; } .btn-hover.defec-1 > ul > .cabecera{ color: #a09e9e; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.defec-1 > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*defecto 2*/ .btn-hover.defec-2{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.defec-2 > a{ background: #a09e9e; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.defec-2 > a:hover{ color: #565353; } .btn-hover.defec-2 ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #565353;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #a09e9e; } .btn-hover.defec-2 > ul > li a{ transition: color 0.25s ease-in-out; color: #103c75; padding: 10px; } .btn-hover.defec-2 > ul > li a:hover{ color: #0d2c62; } .btn-hover.defec-2 > ul > .cabecera{ color: #103c75; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #565353;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.defec-2 > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*rojo*/ .btn-hover.rojo{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.rojo > a{ background: #cb3e4d; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.rojo > a:hover{ color: #9c313c; } .btn-hover.rojo ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #9c313c;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #cb3e4d; } .btn-hover.rojo > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.rojo > ul > li a:hover{ color: #9c313c; } .btn-hover.rojo > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #9c313c;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.rojo > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*naranja*/ .btn-hover.naranja{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.naranja > a{ background: #c58c37; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.naranja > a:hover{ color: #9f712d; } .btn-hover.naranja ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #9f712d;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #c58c37; } .btn-hover.naranja > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.naranja > ul > li a:hover{ color: #9f712d; } .btn-hover.naranja > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #9f712d;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.naranja > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*amarillo*/ .btn-hover.amarillo{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.amarillo > a{ background: #ddac36; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.amarillo > a:hover{ color: #ba9130; } .btn-hover.amarillo ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #ba9130;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #ddac36; } .btn-hover.amarillo > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.amarillo > ul > li a:hover{ color: #ba9130; } .btn-hover.amarillo > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #ba9130;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.amarillo > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*verde*/ .btn-hover.verde{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.verde > a{ background: #20b978; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.verde > a:hover{ color: #198657; } .btn-hover.verde ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #198657;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #20b978; } .btn-hover.verde > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.verde > ul > li a:hover{ color: #198657; } .btn-hover.verde > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #198657;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.verde > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*azul*/ .btn-hover.azul{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.azul > a{ background: #3a8fc5; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.azul > a:hover{ color: #3076a2; } .btn-hover.azul ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #3076a2;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #3a8fc5; } .btn-hover.azul > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.azul > ul > li a:hover{ color: #3076a2; } .btn-hover.azul > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #3076a2;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.azul > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*rosado*/ .btn-hover.rosado{ display: inline-block;/*cambia la caja a bloques en linea*/ } .btn-hover.rosado > a{ background: #c537b9; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .btn-hover.rosado > a:hover{ color: #83267b; } .btn-hover.rosado ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #83267b;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #c537b9; } .btn-hover.rosado > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .btn-hover.rosado > ul > li a:hover{ color: #83267b; } .btn-hover.rosado > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #83267b;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .btn-hover.rosado > ul > li > ul li{ min-width: 140px;/*ancho de 140px*/ } /*botones desplegable click*/ /*defecto 1*/ .cont-btn-click.defec-1{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.defec-1 .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .defec-1 .btn-click{ background: #103c75; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .defec-1 .btn-click:hover{ color: #0d2c62; } .cont-btn-click.defec-1 ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #0d2c62;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #103c75; } .cont-btn-click.defec-1 > ul > li a{ transition: color 0.25s ease-in-out; color: #a09e9e; padding: 10px; } .cont-btn-click.defec-1 > ul > li a:hover{ color: #0d2c62; } .cont-btn-click.defec-1 > ul > .cabecera{ color: #a09e9e; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.defec-1 > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*defecto 2*/ .cont-btn-click.defec-2{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.defec-2 .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .defec-2 .btn-click{ background: #a09e9e; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .defec-2 .btn-click:hover{ color: #565353; } .cont-btn-click.defec-2 ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #565353;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #a09e9e; } .cont-btn-click.defec-2 > ul > li a{ transition: color 0.25s ease-in-out; color: #103c75; padding: 10px; } .cont-btn-click.defec-2 > ul > li a:hover{ color: #0d2c62; } .cont-btn-click.defec-2 > ul > .cabecera{ color: #103c75; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #565353;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.defec-2 > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*rojo*/ .cont-btn-click.rojo{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.rojo .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .rojo .btn-click{ background: #cb3e4d; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .rojo .btn-click:hover{ color: #9c313c; } .cont-btn-click.rojo ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #9c313c;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #cb3e4d; } .cont-btn-click.rojo > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.rojo > ul > li a:hover{ color: #9c313c; } .cont-btn-click.rojo > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #9c313c;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.rojo > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*naranja*/ .cont-btn-click.naranja{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.naranja .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .naranja .btn-click{ background: #c58c37; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .naranja .btn-click:hover{ color: #9f712d; } .cont-btn-click.naranja ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #9f712d;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #c58c37; } .cont-btn-click.naranja > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.naranja > ul > li a:hover{ color: #9f712d; } .cont-btn-click.naranja > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #9f712d;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.naranja > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*amarillo*/ .cont-btn-click.amarillo{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.amarillo .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .amarillo .btn-click{ background: #ddac36; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .amarillo .btn-click:hover{ color: #ba9130; } .cont-btn-click.amarillo ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #ba9130;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #ddac36; } .cont-btn-click.amarillo > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.amarillo > ul > li a:hover{ color: #ba9130; } .cont-btn-click.amarillo > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #ba9130;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.amarillo > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*verde*/ .cont-btn-click.verde{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.verde .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .verde .btn-click{ background: #20b978; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .verde .btn-click:hover{ color: #198657; } .cont-btn-click.verde ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #198657;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #20b978; } .cont-btn-click.verde > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.verde > ul > li a:hover{ color: #198657; } .cont-btn-click.verde > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #198657;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.verde > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*azul*/ .cont-btn-click.azul{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.azul .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .azul .btn-click{ background: #3a8fc5; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .azul .btn-click:hover{ color: #3076a2; } .cont-btn-click.azul ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #3076a2;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #3a8fc5; } .cont-btn-click.azul > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.azul > ul > li a:hover{ color: #3076a2; } .cont-btn-click.azul > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #3076a2;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.azul > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*rosado*/ .cont-btn-click.rosado{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .cont-btn-click.rosado .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .rosado .btn-click{ background: #c537b9; color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; border-radius: 6px; } .rosado .btn-click:hover{ color: #83267b; } .cont-btn-click.rosado ul{ border-width: 1px;/*tamaño del borde inferior */ border-color: #83267b;/*color del borde inferior */ border-style: solid;/*estilo del borde inferior */ border-radius: 6px !important; background: #c537b9; } .cont-btn-click.rosado > ul > li a{ transition: color 0.25s ease-in-out; color: #ffffff; padding: 10px; } .cont-btn-click.rosado > ul > li a:hover{ color: #83267b; } .cont-btn-click.rosado > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #83267b;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .cont-btn-click.rosado > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*botones desplegable click*/ /*Menus*/ /*pantallas medianas*/ @media screen and (min-width: 1000px) { .menu > ul{} } .menu{ padding: 0px; padding-bottom: 4px; } /*Oscuro*/ .menu.oscuro{ background: #262629;/*color de fondo*/ margin-bottom: 24px;/*borde externo*/ } .menu.oscuro > ul > li > a, .menu.oscuro > ul > li > span{ background: #262629;/*color de fondo*/ padding: 25px; transition: background 0.25s ease-in-out; border:none;/*Quita el borde*/ color: #ffffff; } .menu.oscuro > ul > li > a:hover, .menu.oscuro > ul > li > span:hover{/*a con mouse ensima*/ background: #818181; } .menu.oscuro > .titulo{ background: #262629; color: #ffffff; padding: 25px; text-decoration: none;/*quita la decoracion (linea del link)*/ display: inline-block;/*cambia a a bloques en linea*/ font-weight: bold;/*pone el texto en negrita*/ } .menu.oscuro > ul > li[activo="true"] > a{ background: #818181; } .menu.oscuro > .menu-adactable{ background: #262629; transition: background 0.25s ease-in-out; } .menu.oscuro > .menu-adactable:hover{ color: #818181; } /*btn-hover*/ .menu.oscuro .btn-hover{ display: inline-block;/*cambia la caja a bloques en linea*/ } .menu.oscuro .btn-hover ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #262629; } .menu.oscuro .btn-hover > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: normal; color: #ffffff; } .menu.oscuro .btn-hover > ul > li a:hover{ color: #818181; } .menu.oscuro .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.oscuro .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ .menu.oscuro .cont-btn-click{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .menu.oscuro .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu.oscuro .cont-btn-click ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #262629; } .menu.oscuro .cont-btn-click > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; color: #ffffff; font-weight: normal; } .menu.oscuro .cont-btn-click > ul > li a:hover{ color: #818181; } .menu.oscuro .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.oscuro .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*claro*/ .menu.claro{ background: #c9c8c8;/*color de fondo*/ margin-bottom: 24px;/*borde externo*/ } .menu.claro > ul > li > a, .menu.claro > ul > li > span{ background: #c9c8c8;/*color de fondo*/ padding: 25px; transition: background 0.25s ease-in-out; border:none;/*Quita el borde*/ color: #ffffff; } .menu.claro > ul > li > a:hover, .menu.claro > ul > li > span:hover{/*a con mouse ensima*/ background: #818181; } .menu.claro > .titulo{ background: #c9c8c8; color: #ffffff; padding: 25px; text-decoration: none;/*quita la decoracion (linea del link)*/ display: inline-block;/*cambia a a bloques en linea*/ font-weight: bold;/*pone el texto en negrita*/ } .menu.claro > ul > li[activo="true"] > a{ background: #818181; } .menu.claro > .menu-adactable{ background: #c9c8c8; transition: background 0.25s ease-in-out; } .menu.claro > .menu-adactable:hover{ color: #818181; } /*btn-hover*/ .menu.claro .btn-hover{ display: inline-block;/*cambia la caja a bloques en linea*/ } .menu.claro .btn-hover ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #c9c8c8; } .menu.claro .btn-hover > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: normal; color: #ffffff; } .menu.claro .btn-hover > ul > li a:hover{ color: #818181; } .menu.claro .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.claro .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ .menu.claro .cont-btn-click{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .menu.claro .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu.claro .cont-btn-click ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #c9c8c8; } .menu.claro .cont-btn-click > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; color: #ffffff; font-weight: normal; } .menu.claro .cont-btn-click > ul > li a:hover{ color: #818181; } .menu.claro .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.claro .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*normal*/ .menu.normal{ background: #103c75;/*color de fondo*/ margin-bottom: 24px;/*borde externo*/ } .menu.normal > ul > li > a, .menu.normal > ul > li > span{ background: #103c75;/*color de fondo*/ padding: 25px; transition: background 0.25s ease-in-out; border:none;/*Quita el borde*/ color: #ffffff; } .menu.normal > ul > li > a:hover, .menu.normal > ul > li > span:hover{/*a con mouse ensima*/ background: #0d2c62; } .menu.normal > .titulo{float: right; background: #103c75; color: #ffffff; padding: 25px; text-decoration: none;/*quita la decoracion (linea del link)*/ display: inline-block;/*cambia a a bloques en linea*/ font-weight: bold;/*pone el texto en negrita*/ } .menu.normal > ul > li[activo="true"] > a{ background: #0d2c62; } .menu.normal > .menu-adactable{ background: #103c75; transition: background 0.25s ease-in-out; } .menu.normal > .menu-adactable:hover{ color: #0d2c62; } /*btn-hover*/ .menu.normal .btn-hover{ display: inline-block;/*cambia la caja a bloques en linea*/ } .menu.normal .btn-hover ul{ border: 1px solid #0d2c62;/* crea un borde*/ border-radius: 6px; background: #103c75; } .menu.normal .btn-hover > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: normal; color: #ffffff; } .menu.normal .btn-hover > ul > li a:hover{ color: #0d2c62; } .menu.normal .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.normal .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ .menu.normal .cont-btn-click{ display: inline-block;/*cambia la caja a bloques en linea*/ } /*resetea los btn que estan dentro de otros btn clic*/ .menu.normal .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu.normal .cont-btn-click ul{ border: 1px solid #0d2c62;/* crea un borde*/ border-radius: 6px; background: #103c75; } .menu.normal .cont-btn-click > ul > li a{ padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; color: #ffffff; font-weight: normal; } .menu.normal .cont-btn-click > ul > li a:hover{ color: #0d2c62; } .menu.normal .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: background 0.25s ease-in-out; font-size: 16px; font-weight: bold; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu.normal .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*responsi*/ @media screen and (max-width: 1000px) { .menu.normal .btn-hover { display: block; } .menu.normal .cont-btn-click { display: block; } .menu.claro .btn-hover { display: block; } .menu.claro .cont-btn-click { display: block; } .menu.oscuro .btn-hover { display: block; } .menu.oscuro .cont-btn-click { display: block; } } /*Menus*/ /*Insignias*/ /*defecto 1*/ .insignia.defec-1{ color: #ffffff; background: #103c75; } /*defecto 2*/ .insignia.defec-2{ color: #ffffff; background: #a09e9e; } /*rojo*/ .insignia.rojo{ color: #ffffff; background: #cb3e4d; } /*naranja*/ .insignia.naranja{ color: #ffffff; background: #c58c37; } /*amarillo*/ .insignia.amarillo{ color: #ffffff; background: #ddac36; } /*verde*/ .insignia.verde{ color: #ffffff; background: #20b978; } /*rosado*/ .insignia.rosado{ color: #ffffff; background: #c537b9; } /*azul*/ .insignia.azul{ color: #ffffff; background: #3a8fc5; } /*Insignias*/ /*formularios*/ .caja-texto::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: #565353; opacity: 1; /* Firefox */ text-align: left; } .caja-texto:-ms-input-placeholder { /* Internet Explorer 10-11 */ color: #565353; text-align: left; } .caja-texto::-ms-input-placeholder { /* Microsoft Edge */ color: #565353; text-align: left; } .formulario label{ font-weight: normal;/*quita letras en negrita*/ color:#565353;/*color de texto*/ } .caja-texto{/* selecciona los elemento con clase caja-texto */ border: 1px solid #262629;/* crea un borde*/ padding: 15px; border-radius: 6px !important; font-size: 16px; transition: border-color 0.5s ease-in-out; transition: color 0.5s ease-in-out; color: #565353;/*color de texto*/ background: #f1f1f1; } .caja-texto:focus{/* selecciona los elemento con clase caja-texto */ border: 1px solid #818181;/* crea un borde*/ color: #ffffff; } .selecion{/* selecciona los elemento con clase selecion */ border: 1px solid #262629;/* crea un borde*/ padding: 15px; border-radius: 6px !important; font-size: 16px; transition: border-color 0.5s ease-in-out; transition: color 0.5s ease-in-out; color: #565353;/*color de texto*/ background: #f1f1f1; } .selecion:focus{/* selecciona los elemento con clase selecion */ border: 1px solid #818181;/* crea un borde*/ color: #ffffff; } .grupo-input > .control:first-child{ border: 1px solid #262629;/* crea un borde*/ padding: 15px; font-size: 16px; border-radius: 6px 0px 0px 6px !important;/*redondeo de caja*/ border-right: none;/* crea un borde */ background: #f1f1f1; border: 1px solid #262629;/* crea un borde*/ color: #565353; } .grupo-input > input.control{ border: 1px solid #262629;/* crea un borde*/ padding: 17px; font-size: 16px; border-radius: 0px 6px 6px 0px !important;/*redondeo de caja*/ } .grupo-input > input.control:focus{ border: 1px solid #818181;/* crea un borde*/ color: #ffffff; } .grupo-input > select.control{ border: 1px solid #262629;/* crea un borde*/ padding: 15px; font-size: 16px; border-radius: 0px 6px 6px 0px !important;/*redondeo de caja*/ } .grupo-input > select.control:focus{ border: 1px solid #818181;/* crea un borde*/ color: #ffffff; } /*formularios*/

/*tablas*/ .tabla td,.tabla th{background: #f1f1f1; color: black; border: solid 1px #cecece; } .tabla th{/* selelecciona las celdas */ padding: 15px; background: #f1f1f1; } .tabla tr:nth-child(odd){/*esta es para poner colores una fila si y otra no esta es 1*/ /*background: #f1f1f1;*/ } .tabla tr:nth-child(even){/*esta es para poner colores una fila si y otra no esta es 2*/ /*background: #f1f1f1;*/ } .tabla .cabecera th{/*esta es para poner colores una fila si y otra no esta es 2*/ background: #e9e9e9; } .tabla caption{ padding: 15px; border-bottom: none; font-weight: normal;/*quita letras en negrita*/ background: #f1f1f1; } .tabla-opciones tr td, .tabla-opciones tr th{ padding-bottom: 17px !important;/*borde interno*/ } .tabla tr.defec-1 *{ background: #103c75; } .tabla tr.defec-2 *{ background: #a09e9e; } .tabla tr.rojo *{ background: #cb3e4d; } .tabla tr.naranja *{ background: #c58c37; } .tabla tr.amarillo *{ background: #ddac36; } .tabla tr.verde *{ background: #20b978; } .tabla tr.azul *{ background: #3a8fc5; } .tabla tr.rosado *{ background: #c537b9; } /*tablas*/


/*paneles*/ .paneles-contenido{ border: 1px solid #0d2c62; } .paneles-contenido .menu-panel ul{ margin: 0px;/* quita el espacio externo */ } .paneles-contenido .menu-panel{ background: #e9e9e9; padding: 10px; } .paneles-contenido .menu-panel ul li .panel-d-boton{ color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton[estado="activado"]{ color: #0d2c62; } .paneles-contenido .menu-panel ul li .panel-d-boton:hover{ color: #0d2c62; } .paneles-contenido .paneles{ padding: 10px; } /*defecto 1*/ .paneles-contenido .menu-panel ul li .panel-d-boton.defec-1{ color: #103c75; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.defec-1[estado="activado"]{ color: #0d2c62; } .paneles-contenido .menu-panel ul li .panel-d-boton.defec-1:hover{ color: #0d2c62; } /*defecto 2*/ .paneles-contenido .menu-panel ul li .panel-d-boton.defec-2{ color: #a09e9e; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.defec-2[estado="activado"]{ color: #565353; } .paneles-contenido .menu-panel ul li .panel-d-boton.defec-2:hover{ color: #565353; } /*rojo*/ .paneles-contenido .menu-panel ul li .panel-d-boton.rojo{ color: #cb3e4d; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.rojo[estado="activado"]{ color: #9c313c; } .paneles-contenido .menu-panel ul li .panel-d-boton.rojo:hover{ color: #9c313c; } /*naranja*/ .paneles-contenido .menu-panel ul li .panel-d-boton.naranja{ color: #c58c37; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.naranja[estado="activado"]{ color: #9f712d; } .paneles-contenido .menu-panel ul li .panel-d-boton.naranja:hover{ color: #9f712d; } /*amarillo*/ .paneles-contenido .menu-panel ul li .panel-d-boton.amarillo{ color: #ddac36; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.amarillo[estado="activado"]{ color: #ba9130; } .paneles-contenido .menu-panel ul li .panel-d-boton.amarillo:hover{ color: #ba9130; } /*verde*/ .paneles-contenido .menu-panel ul li .panel-d-boton.verde{ color: #20b978; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.verde[estado="activado"]{ color: #198657; } .paneles-contenido .menu-panel ul li .panel-d-boton.verde:hover{ color: #198657; } /*rosado*/ .paneles-contenido .menu-panel ul li .panel-d-boton.rosado{ color: #c537b9; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.rosado[estado="activado"]{ color: #83267b; } .paneles-contenido .menu-panel ul li .panel-d-boton.rosado:hover{ color: #83267b; } /*azul*/ .paneles-contenido .menu-panel ul li .panel-d-boton.azul{ color: #3a8fc5; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; } .paneles-contenido .menu-panel ul li .panel-d-boton.azul[estado="activado"]{ color: #3076a2; } .paneles-contenido .menu-panel ul li .panel-d-boton.azul:hover{ color: #3076a2; } /*paneles*/ /*paneles-vertical*/ .paneles-vertical-contenido{ border: 1px solid #0d2c62; } .menu-panel-vertical ul{ margin: 0px;/* quita el espacio externo */ } .menu-panel-vertical{ background: #e9e9e9 } .menu-panel-vertical ul li{ width: 100%;/*ancho de 100% del padre*/ } .menu-panel-vertical ul{ margin: 0px; padding: 0px; } .menu-panel-vertical ul li .panel-d-boton{ color: #ffffff; padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; margin-bottom: 10px; } .menu-panel-vertical ul li .panel-d-boton[estado="activado"]{ color: #0d2c62; } .menu-panel-vertical ul li .panel-d-boton:hover{ color: #0d2c62; } .paneles-vertical{ padding: 15px; } /*defecto 1*/ .menu-panel-vertical ul li .panel-d-boton.defec-1{ color: #103c75; } .menu-panel-vertical ul li .panel-d-boton.defec-1[estado="activado"]{ color: #0d2c62; } .menu-panel-vertical ul li .panel-d-boton.defec-1:hover{ color: #0d2c62; } /*defecto 2*/ .menu-panel-vertical ul li .panel-d-boton.defec-2{ color: #a09e9e; } .menu-panel-vertical ul li .panel-d-boton.defec-2[estado="activado"]{ color: #565353; } .menu-panel-vertical ul li .panel-d-boton.defec-2:hover{ color: #565353; } /*rojo*/ .menu-panel-vertical ul li .panel-d-boton.rojo{ color: #cb3e4d; } .menu-panel-vertical ul li .panel-d-boton.rojo[estado="activado"]{ color: #9c313c; } .menu-panel-vertical ul li .panel-d-boton.rojo:hover{ color: #9c313c; } /*naranja*/ .menu-panel-vertical ul li .panel-d-boton.naranja{ color: #c58c37; } .menu-panel-vertical ul li .panel-d-boton.naranja[estado="activado"]{ color: #9f712d; } .menu-panel-vertical ul li .panel-d-boton.naranja:hover{ color: #9f712d; } /*amarillo*/ .menu-panel-vertical ul li .panel-d-boton.amarillo{ color: #ddac36; } .menu-panel-vertical ul li .panel-d-boton.amarillo[estado="activado"]{ color: #ba9130; } .menu-panel-vertical ul li .panel-d-boton.amarillo:hover{ color: #ba9130; } /*verde*/ .menu-panel-vertical ul li .panel-d-boton.verde{ color: #20b978; } .menu-panel-vertical ul li .panel-d-boton.verde[estado="activado"]{ color: #198657; } .menu-panel-vertical ul li .panel-d-boton.verde:hover{ color: #198657; } /*rosado*/ .menu-panel-vertical ul li .panel-d-boton.rosado{ color: #c537b9; } .menu-panel-vertical ul li .panel-d-boton.rosado[estado="activado"]{ color: #83267b; } .menu-panel-vertical ul li .panel-d-boton.rosado:hover{ color: #83267b; } /*azul*/ .menu-panel-vertical ul li .panel-d-boton.azul{ color: #3a8fc5; } .menu-panel-vertical ul li .panel-d-boton.azul[estado="activado"]{ color: #3076a2; } .menu-panel-vertical ul li .panel-d-boton.azul:hover{ color: #3076a2; } /*paneles-vertical*/


/*modal*/ .cabecera-modal{ background: #fff; border-bottom: 1px solid #565353!important;/* crea un borde*/ border-top-right-radius: 14px !important;/*redondea una caja en la parte superiol derecha*/ border-top-left-radius: 14px !important;/*redondea una caja en la parte superiol izquierda*/ } .cabecera-modal *{ color: black!important; } .cuerpo-modal{ background: #fff; } .cuerpo-modal *{ color: black; } .pie-modal{ background: #fff; border-top: 1px solid #565353!important;/* crea un borde*/ border-bottom-right-radius: 14px !important;/*redondea una caja en la parte superiol derecha*/ border-bottom-left-radius: 14px !important;/*redondea una caja en la parte superiol izquierda*/ } .pie-modal *{ color: black; } .titulo-modal{ color: black;text-transform: uppercase; } .cerrar-modal{ font-size: 26px;/*tamaño de letras*/ padding: 10px; transition: color 0.25s ease-in-out; color: #c9c8c8; } .cerrar-modal:hover{ color: #818181; } /*modal*/

/*paginacion*/ .boton-pagina{ padding: 4px 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; color: #103c75;/*color de texto*/ } .boton-pagina:hover{ color: #0d2c62;/*color de texto*/ } .boton-pagina[estado="activado"]{ color: #0d2c62;/*color de texto*/ } /*paginacion*/ /*menu vertical*/ /*oscuro*/ .menu-vertical.oscuro{ background: #262629; margin-bottom: 24px;/*borde externo*/ } .menu-vertical.oscuro > ul > li > a, .menu-vertical.oscuro > ul > li > span{ color: #ffffff; padding: 10px; border:none;/*Quita el borde*/ } .menu-vertical.oscuro > ul > li > a:hover, .menu-vertical.oscuro > ul > li > span:hover{/*a con mouse ensima*/ color: #818181; } .menu-vertical.oscuro > .titulo{ text-decoration: none;/*quita la decoracion (linea del link)*/ display:inline-block;/*cambia a a bloques en linea*/ font-weight:bold;/*pone el texto en negrita*/ color: #ffffff; padding: 15px; } .menu-vertical.oscuro > ul > li[activo="true"] > a{ color: #818181; } .menu-vertical.oscuro > .menu-vertical-adactable{ color: #ffffff; } .menu-vertical.oscuro > .menu-vertical-adactable:hover{ color: #818181; } /*btn-hover*/ .menu-vertical.oscuro .btn-hover > a:hover{ color: #818181; } .menu-vertical.oscuro .btn-hover ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #262629; } .menu-vertical.oscuro .btn-hover > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.oscuro .btn-hover > ul > li a:hover{ color: #818181; } .menu-vertical.oscuro .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.oscuro .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ /*resetea los btn que estan dentro de otros btn clic*/ .menu-vertical.oscuro .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu-vertical.oscuro .btn-click{ color: #ffffff; } .menu-vertical.oscuro .btn-click:hover{ color: #818181; } .menu-vertical.oscuro .cont-btn-click ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #262629; } .menu-vertical.oscuro .cont-btn-click > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.oscuro .cont-btn-click > ul > li a:hover{ color: #818181; } .menu-vertical.oscuro .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.oscuro .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*normal*/ .menu-vertical.normal{ background: #103c75; margin-bottom: 24px;/*borde externo*/ } .menu-vertical.normal > ul > li > a, .menu-vertical.normal > ul > li > span{ color: #ffffff; padding: 10px; border:none;/*Quita el borde*/ } .menu-vertical.normal > ul > li > a:hover, .menu-vertical.normal > ul > li > span:hover{/*a con mouse ensima*/ color: #0d2c62; } .menu-vertical.normal > .titulo{ text-decoration: none;/*quita la decoracion (linea del link)*/ display:inline-block;/*cambia a a bloques en linea*/ font-weight:bold;/*pone el texto en negrita*/ color: #ffffff; padding: 15px; } .menu-vertical.normal > ul > li[activo="true"] > a{ color: #0d2c62; } .menu-vertical.normal > .menu-vertical-adactable{ color: #ffffff; } .menu-vertical.normal > .menu-vertical-adactable:hover{ color: #0d2c62; } /*btn-hover*/ .menu-vertical.normal .btn-hover > a:hover{ color: #0d2c62; } .menu-vertical.normal .btn-hover ul{ border: 1px solid #0d2c62;/* crea un borde*/ border-radius: 6px; background: #103c75; } .menu-vertical.normal .btn-hover > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.normal .btn-hover > ul > li a:hover{ color: #0d2c62; } .menu-vertical.normal .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.normal .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ /*resetea los btn que estan dentro de otros btn clic*/ .menu-vertical.normal .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu-vertical.normal .btn-click{ color: #ffffff; } .menu-vertical.normal .btn-click:hover{ color: #0d2c62; } .menu-vertical.normal .cont-btn-click ul{ border: 1px solid #0d2c62;/* crea un borde*/ border-radius: 6px; background: #103c75; } .menu-vertical.normal .cont-btn-click > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.normal .cont-btn-click > ul > li a:hover{ color: #0d2c62; } .menu-vertical.normal .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #0d2c62;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.normal .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*claro*/ .menu-vertical.claro{ background: #c9c8c8; margin-bottom: 24px;/*borde externo*/ } .menu-vertical.claro > ul > li > a, .menu-vertical.claro > ul > li > span{ color: #ffffff; padding: 10px; border:none;/*Quita el borde*/ } .menu-vertical.claro > ul > li > a:hover, .menu-vertical.claro > ul > li > span:hover{/*a con mouse ensima*/ color: #818181; } .menu-vertical.claro > .titulo{ text-decoration: none;/*quita la decoracion (linea del link)*/ display:inline-block;/*cambia a a bloques en linea*/ font-weight:bold;/*pone el texto en negrita*/ color: #ffffff; padding: 15px; } .menu-vertical.claro > ul > li[activo="true"] > a{ color: #818181; } .menu-vertical.claro > .menu-vertical-adactable{ color: #ffffff; } .menu-vertical.claro > .menu-vertical-adactable:hover{ color: #818181; } /*btn-hover*/ .menu-vertical.claro .btn-hover > a:hover{ color: #818181; } .menu-vertical.claro .btn-hover ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #c9c8c8; } .menu-vertical.claro .btn-hover > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.claro .btn-hover > ul > li a:hover{ color: #818181; } .menu-vertical.claro .btn-hover > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.claro .btn-hover > ul > li > ul li{ width: 140px;/*ancho de 140px*/ } /*btn-click*/ /*resetea los btn que estan dentro de otros btn clic*/ .menu-vertical.claro .cont-btn-click .cont-btn-click .btn-click{ border: none;/* crea un borde*/ border-radius: 0px;/*redondeo de caja*/ } .menu-vertical.claro .btn-click{ color: #ffffff; } .menu-vertical.claro .btn-click:hover{ color: #818181; } .menu-vertical.claro .cont-btn-click ul{ border: 1px solid #818181;/* crea un borde*/ border-radius: 6px; background: #c9c8c8; } .menu-vertical.claro .cont-btn-click > ul > li a{ color: #ffffff; padding: 10px;/*espacio interno*/ transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); } .menu-vertical.claro .cont-btn-click > ul > li a:hover{ color: #818181; } .menu-vertical.claro .cont-btn-click > ul > .cabecera{ color: #ffffff; padding: 10px; border-bottom-width: 1px;/*tamaño del borde inferior */ border-bottom-color: #818181;/*color del borde inferior */ border-bottom-style: solid;/*estilo del borde inferior */ } .menu-vertical.claro .cont-btn-click > ul > li > ul > li{ width: 140px;/*ancho de 140px*/ } /*menu vertical*/ /*ventana desplegable*/ .cabecera-ventana-desplegable{ background: #103c75; } .titulo-ventana-desplegable{ color: #c9c8c8; } .cerrar-ventana-desplegable{ color: #c9c8c8; font-size: 22px;/*tamaño de letras*/ padding: 10px; transition: color 0.25s ease-in-out; } .cerrar-ventana-desplegable:hover{ color: #818181; } .cuerpo-ventana-desplegable{ background: #103c75; } .ventana-desplegable{ background: #103c75; } /*ventana desplegable*/ /*slide*/ .circulos-slide{ border: 1px solid #c9c8c8; } .circulos-slide[activo="true"]{ background: #262629; } .btn-slide-atras,.btn-slide-siguiente{ background: #103c75; padding: 10px 5px!important; vertical-align: middle; transition: color 0.25s ease-in-out; } .btn-slide-atras:hover,.btn-slide-siguiente:hover{ color: #0d2c62; } .btn-slide-atras{ left: 0px !important; border-top-right-radius: 25px !important;/*redondea una caja en la parte superiol derecha*/ border-bottom-right-radius: 25px !important;/*redondea una caja en la parte superiol izquierda*/ } .btn-slide-siguiente{ right: 0px !important; border-top-left-radius: 25px !important;/*redondea una caja en la parte superiol izquierda*/ border-bottom-left-radius: 25px !important;/*redondea una caja en la parte superiol derecha*/ } .contenido-slide{ padding: 0px; } .contenido-slide > img{ min-height: 400px; max-height: 400px; height: 400px; width: 100%; } /*slide*/ /*baner*/ .baner-izq, .baner-der{ background: #262629; padding: 10px; border-radius: 15px;/*redondeo de el elemento*/ top: 10%; } .baner-der > *, .baner-izq > *{ color: #c9c8c8;/*color del texto*/ text-decoration: none;/*quita la decoracion del texto*/ } /*baner*/ /*descriccion*/ .descriccion{ background: #103c75; padding: 15px; border-radius: 8px; border: 1px solid #ffffff!important;/* crea un borde*/ } .descriccion *{ color: #ffffff;/*color del texto*/ } /*descriccion*/ /*notificacion*/ .notificacion{ background: #103c75; border: 1px solid #103c75!important;/* crea un borde*/ margin: 10px 0px;/*margen*/ } .notificacion * { color: #ffffff;/*color del texto*/ } .titulo-notificacion{ color: #ffffff;/*color del texto*/ padding: 10px; margin: 0px;/*margen*/ } .cerrar-notificacion{ font-size: 26px;/*tamaño de letras*/ padding: 10px; color: #c9c8c8; transition: color 0.25s ease-in-out; } .cerrar-notificacion:hover{ color: #818181; } /*notificacion*/ /*Ventanas progreso*/ .ventanas-progreso-indicador[estado="activado"]{ background: #103c75; color: #a09e9e!important; padding: 10px; } .ventanas-progreso{ height: 400px; min-height: 400px; max-height: 400px; } .ventanas-progreso-centenedor{ margin-top: 8px;/*margen*/ } .ventanas-progreso-indicador{ transition: color 0.25s ease-in-out; background: #a09e9e; padding: 10px; color: #103c75!important; } .ventanas-progreso-indicador[estado="realizado"]{ background: #103c75; padding: 10px; color: #565353!important; } .ventanas-progreso-indicador-centenedor, .ventanas-progreso-botones{ padding: 10px; transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; color: #a09e9e; } .boton-ventanas-progreso-sig,.boton-ventanas-progreso-atr,.boton-ventanas-progreso-terminar{ padding: 10px; transition: color 0.25s ease-in-out; font-size: 16px; background: rgba(0, 0, 0, 0); font-weight: bold; color: #a09e9e; } .boton-ventanas-progreso-sig:hover,.boton-ventanas-progreso-atr:hover,.boton-ventanas-progreso-terminar:hover{ color: #565353; } .ventanas-progreso{ padding: 10px; background: #103c75; color: #ffffff; } .ventanas-progreso *{ color: #ffffff; } /*Ventanas progreso*/ /*acordeon*/ .acordeon{ border: 1px solid#262629; border-radius: 6px;/*redondeo de caja*/ } .cabecera-acordeon{ padding: 10px; border: none;/*quita el borde*/ color: #ffffff; border-bottom: 1px solid#262629;/* crea un borde*/ } .cabecera-acordeon *{ color: #ffffff; } .cuerpo-acordeon{ background: #103c75; border: #103c75 1px solid; padding: 10px; border: none;/*quita el borde*/ border-bottom: 1px solid#262629;/* crea un borde*/ } .pie-acordeon{ padding: 6px;/*espacio interno*/ border-bottom: none;/*quita el borde*/ color: #ffffff; } .pie-acordeon *{ color: #ffffff; } /*acordeon*/ /*tooltips*/ .info-herr > .informacion{ border: 1px solid #262629; background: #103c75; padding: 10px; border-radius: 6px; } .info-caja-texto > .informacion-caja-texto{ border: 1px solid #262629; background: #103c75; padding: 10px; border-radius: 6px; } /*tooltips*/ /*borde deb carga*/ .ani-borde::before{/*pseudo-elemento se puede utilizar para insertar un cierto contenido antes de que el contenido de un elemento.*/ background: #c9c8c8; } .ani-borde::after {/*pseudo-elemento se puede utilizar para insertar algún contenido después de que el contenido de un elemento.*/ background: #262629; } /*borde deb carga*/ /*borde deb movimiento*/ .ani-borde-mov::after {/*pseudo-elemento se puede utilizar para insertar algún contenido después de que el contenido de un elemento.*/ background: #262629; } /*borde deb movimiento*/ /*alertas*/ .btn-eli-alert{ font-size: 20px;/*tamaño de letras*/ padding: 10px; color: #c9c8c8; transition: color 0.25s ease-in-out; background-color: rgba(155, 155, 155, 0);/*color de fondo*/ border: none;/* crea un borde*/ } .btn-eli-alert:hover{ color: #818181; } /*defecto 1*/ .cont-alert.defec-1{ border: 1px solid #103c75!important;/* crea un borde*/ border-left: 7px solid #103c75!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*defecto 2*/ .cont-alert.defec-2{ border: 1px solid #a09e9e!important;/* crea un borde*/ border-left: 7px solid #a09e9e!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*rojo*/ .cont-alert.rojo{ border: 1px solid #cb3e4d!important;/* crea un borde*/ border-left: 7px solid #cb3e4d!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*naranja*/ .cont-alert.naranja{ border: 1px solid #c58c37!important;/* crea un borde*/ border-left: 7px solid #c58c37!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*amarillo*/ .cont-alert.amarillo{ border: 1px solid #ddac36!important;/* crea un borde*/ border-left: 7px solid #ddac36!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*verde*/ .cont-alert.verde{ border: 1px solid #20b978!important;/* crea un borde*/ border-left: 7px solid #20b978!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*rosado*/ .cont-alert.rosado{ border: 1px solid #c537b9!important;/* crea un borde*/ border-left: 7px solid #c537b9!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*azul*/ .cont-alert.azul{ border: 1px solid #3a8fc5!important;/* crea un borde*/ border-left: 7px solid #3a8fc5!important;/* crea un borde*/ padding: 10px; margin-bottom: 20px;/*margen externo debajo*/ border-radius: 6px; } /*alertas*/ /*enlace*/ a{ color: #a09e9e;/*color de letras*/ } /*enlace*/ /*tarjetas*/ .tarjeta{ border-radius: 6px; } .cabecera-tarjeta{ border-radius: 6px 6px 0px 0px; } .cuerpo-tarjeta{ border-radius: 6px; } .pie-tarjeta{ border-radius: 0px 0px 6px 6px; } /*defec-1*/ .defec-1 .cabecera-tarjeta{ padding: 10px; background-color: #103c75;/*color de fondo*/ color: #ffffff;/*color de letras*/ } .defec-1 .pie-tarjeta{ padding: 10px; background-color: #103c75;/*color de fondo*/ color: #ffffff;/*color de letras*/ } .defec-1 .cabecera-tarjeta *{ color: #ffffff;/*color de letras*/ } .defec-1 .pie-tarjeta *{ color: #ffffff;/*color de letras*/ } /*defec-2*/ .defec-2 .cabecera-tarjeta{ padding: 10px; background-color: #a09e9e;/*color de fondo*/ } .defec-2 .pie-tarjeta{ padding: 10px; background-color: #a09e9e;/*color de fondo*/ } .defec-2 .cabecera-tarjeta *{ color: #103c75;/*color de letras*/ } .defec-2 .pie-tarjeta *{ color: #103c75;/*color de letras*/ } /*tarjetas*/ /*cuerpo*/ body{ background: white; } /*colores*/ /*defecto 1*/ .bg-defec-1{ background: #103c75; transition: color 0.25s ease-in-out; color: #a09e9e; } .bg-defec-1-h:hover{ color: #0d2c62; } /*defecto 2*/ .bg-defec-2{ background: #a09e9e; transition: color 0.25s ease-in-out; color: #103c75; } .bg-defec-2-h:hover{ color: #565353; } /*rojo*/ .bg-rojo{ background: #cb3e4d; transition: color 0.25s ease-in-out; } .bg-rojo-h:hover{ color: #9c313c; } /*naranja*/ .bg-naranja{ background: #c58c37; transition: color 0.25s ease-in-out; } .bg-naranja-h:hover{ color: #9f712d; } /*amarillo*/ .bg-amarillo{ background: #ddac36; transition: color 0.25s ease-in-out; } .bg-amarillo-h:hover{ color: #ba9130; } /*verde*/ .bg-verde{ background: #20b978; transition: color 0.25s ease-in-out; } .bg-verde-h:hover{ color: #198657; } /*rosado*/ .bg-rosado{ background: #c537b9; transition: color 0.25s ease-in-out; } .bg-rosado-h:hover{ color: #83267b; } /*azul*/ .bg-azul{ background: #3a8fc5; transition: color 0.25s ease-in-out; } .bg-azul-h:hover{ color: #3076a2; } /*oscuro*/ .bg-oscuro{ background: #262629; transition: color 0.25s ease-in-out; } .bg-oscuro-h:hover{ color: #818181; } /*claro*/ .bg-claro{ background: #c9c8c8; transition: color 0.25s ease-in-out; } .bg-claro-h:hover{ color: #818181; } /*colores*/ .boton-inscr{color: #959494 !important;background: #103c75 !important;} .boton-inscr:hover{color: #fff !important;background: #103c75 !important;}

*{
	font-size: 22px; color: #262629; font-family: Nexa Bold Font, Nexa Light;}

h1{
	font-size: 26px;
}

h2{
	font-size: 20px;
}

.menu > ul > li{
	padding: 2px;
}

a{
	color: #236DB0;
}

.titulo img{
	height: 60px!important;
}

.menu.normal {
    background: #E9DE30;
    margin-bottom: 24px;
}

.menu.normal > ul > li > a, .menu.normal > ul > li > span {
    background: #E9DE30;
}

.menu.normal > ul > li > a:hover, .menu.normal > ul > li > span:hover {
    color: gray;
    background: #E9DE30;
}

.menu.normal > .titulo {
    background: #E9DE30;
}


.menu.normal > ul > li > a, .menu.normal > ul > li > span {
    color: black;
}

.menu > ul > li > a{
	position: relative;
}
.menu > ul > li > a small{
	position: absolute;
	display: block !important;
	font-size: 15px;
	bottom: 8px;
	left: 0;
	text-align: center;
	width: 100%;
}

@media(max-width: 1000px){
	.menu > ul > li > a small{
		position: relative;
		text-align: left;
		margin-top: 10px;
		bottom: unset;
	}
}

.boton.rojo{
	background-color: #cb3e4d;
	color: white;
}

.boton.verde{
	background-color: #20b978;
	color: white;
}

.boton.amarillo{
	background-color: #ddac36;
	color: white;
}


.grupo-input > .icon-f, .grupo-input > .control:first-child {
	color: white!important;
}

.caja-texto, .caja-texto:focus, .selecion:focus, .selecion{
    background: white!important;
    color: black!important;
}

.grupo-input > .control:first-child {
    background: #0f4579;
}

td > select {
    color: black!important;
}


.menu.normal > .menu-adactable {
    background: rgb(233, 222, 48);
}
.menu > .menu-adactable {
    float: none;
    padding: 27px 10px;
}
