/*---------------- reset  ------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,fieldset, legend,caption,.filters ul li p, figure{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent; line-height:normal; font-weight:normal;}
html{height:100%;}
.p10{padding:10px!important;}
.pt10{padding-top:10px;}
.black{color:#000!important}
button{border:none; background:none; cursor:pointer}
.center{text-align:center!important;}
tr{font-weight:bold}
.boton{background: #ea8d3e; color: #fff; border: 1px solid #ea8d3e; border-radius: 2px;}
.boton:hover, #tipoAsunto:hover{background:#d47f38}
.clear{clear: both}
body{-webkit-font-smoothing:antialiased!important; line-height:1.54; color:#333;  height:100%; font-size:11px; font-family: Helvetica,Arial,sans-serif; font-weight:400; }
img{color:#f4f4f2;}
ol,ul,li{list-style:none; font-weight:lighter;}
clear, br{clear:both}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0;}
ins{text-decoration:none;}
del{text-decoration:line-through;}
table{border-collapse:collapse;border-spacing:0;}
.mont{font-family: 'Montserrat', sans-serif!important;}
.openSans{font-family: 'Open Sans', sans-serif;}
a {text-decoration: none!important; color: #777; font-weight: 600; cursor: pointer; }
:focus {outline: 0; }
.fright {float: right;}
.fleft{float:left;}
* {-webkit-box-sizing: border-box;  -moz-box-sizing: border-box; box-sizing: border-box;}
button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit;}
input[type="submit"] {cursor: pointer;}
.wrapClose { margin-left: 190px;}
.tleft{text-align:left}
.tcenter{text-align:center}
.tright{text-align: right}
#mainContainer{padding-left:70px;}


/*---------------- Contacto  ------------------*/
#contacto{background: url(../images/bck.png) left top no-repeat #81a6d0;}
#contacto section {display: flex; height:100%; width:100%;}
#contacto .promo{display: flex; align-items: center; justify-content: center; height: 100vh; width:60%; flex:1; box-sizing: border-box;}
.centradoVertical{display: flex; flex-direction: column; width:80%;}
.promo h1{width: 100%; color: #ff9350; font-size: 3.5em;}
.promo h2{width: 100%; color: #fff; font-size: 1rem; line-height: 26px;}
.promo em{color: #fff; margin-bottom: 40px; font-size: 1.5em; font-style: normal;}
.promo p{width:100%; font-size: 1.6em; color: #fff; font-family: 'Raleway', sans-serif; margin-top: 20px;}
.centradoVerticalDos{display: flex; flex-direction: column; width:78%; }
.contacto {width:40%;; background: #f5f5f5; display: flex; align-items: center; justify-content: center; flex:1;}
#contacto .promo a{font-family: 'Raleway', sans-serif; width: 200px; background: #da33b2; color: #fff;  text-align: center; padding: 13px 0; margin: 40px 0; font-size: 15px; border-radius: 4px; }
#logoContacto{width:120px; margin-bottom:20px;}
#lupa{width:75px; margin-bottom:20px;}
#contactoForm h1{font-size:22px; margin-bottom: 20px;}
#contactoForm{ font-family: 'Raleway', sans-serif; }
#contactoForm p { float: left; position: relative; width: 100%;}
#contactoForm label {float: left; color: #61749c;  text-align: left; padding: 14px 0 7px 0; width: 100%; font-size: 15px;}
#contactoForm .inpLog {height: 38px; font-size: 13px; border: 1px solid #dad9d9; padding: 0 5%;  width: 100%; border-radius:4px; -webkit-border-radius:4px; -moz-border-radius:4px; float: left; background:#fff}
#contactoForm textarea{float: left; width: 100%; border: 1px solid #dad9d9; border-radius: 4px; height: 120px; padding:5%; background:#fff}
#contactoForm .descrip{font-size:14px}
#contactoForm .msgBlack{margin-top:20px;}
#contactoForm .inpLog:focus, #contactoForm textarea:focus, #loginForm .inpLog:focus{background: #f4f9ff!important; border: 1px solid #b5b8d1;}

/*---------------- Login  ------------------*/
.bckIndex{color:#404040; font-family: 'Oswald', sans-serif!important; background:#33305f; }
.conLog { display: flex; justify-content: center; align-items: center; height: 100vh; text-align: center; -moz-border-radius: 10px; -webkit-border-radius: 10px;}
.login { width:400px; border-radius: 15px; box-shadow:4px 6px 1062px #2e0f0f;; -webkit-box-shadow:4px 6px 1062px #2e0f0f; -moz-box-shadow:4px 6px 1062px #2e0f0f;; padding:30px; background:#000000; border:2px solid #80651a;}
.recuperar { width:400px; border-radius: 15px; box-shadow:4px 6px 1062px #2e0f0f;; -webkit-box-shadow:4px 6px 1062px #2e0f0f; -moz-box-shadow:4px 6px 1062px #2e0f0f;; padding:30px; background:#000000; border:2px solid #e25959;}
.login span { padding: 10px 0px; float: left; text-transform: uppercase; width: 100%; display: block;}
.login span img{margin: 20px 0 10px; width:130px;}
.msgBlack { float: left; width: 100%; padding-bottom: 10px; color: #f9c04a; font-size:18px; }
#loginForm h1{color:#000!important; font-family: "Onest", sans-serif; font-weight:900; text-transform: uppercase}
#loginForm p { float: left; position: relative; width: 100%;}
#loginForm label { float: left; color: #ccc; text-align: left; padding: 14px 0 7px 0; width: 100%; font-size:18px;}
.inpLog { height: 38px; font-size: 13px; border: 1px solid #bb0673; background: #fcf4ff; padding: 0 5%; width: 100%; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; float: left;}
.inpLog:focus, textarea:focus{background: #f4f9ff; border: 1px solid #b5b8d1;}
#ojo { position: absolute; z-index: 9999; bottom: 13px; right: 9px; width: 22px; height: 29px;}
.ojo-cerrado { background: url(../graphics/ojo-cerrado.png) 0 18px no-repeat;}
.ojo-abierto{background:url(../graphics/ojo-abierto.png) 1px 14px no-repeat ;}
.submit input { cursor: pointer; background: #c42b9f; border: 0px solid #c42b9f; color: #fff; font-size: 14px; font-weight: 700; text-transform: uppercase; padding: 12px 0; width: 100%; border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; margin: 20px auto 0 auto; transition: background-color 0.3s ease, color 0.3s ease;}
.submit input:hover{background:#f7be20; color:#000}
#mesLog { float: left; width: 100%; margin: 20px 0; font-size: 14px; font-weight: 300; color: #fff;}
#mesLog a { color: #ff88e2; font-weight: 600;}

/*---------------- LAYOUT  ------------------*/
header nav a{float:left; width:100%}
.wrapOpen {float: left; width: 100%; padding-left: 70px; padding-bottom: 80px; }
h1, h2, h3, h4 {font-family: 'Raleway', sans-serif; font-weight: 500; color: #454545; font-size: 24px; }
header {position: fixed; width: 100%; height: 65px!important; text-transform: uppercase; z-index: 99999999; border-bottom: 1px solid #384969; background: #3d568e; }
.se-pre-con {position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 99999999999; background: #fff; }∂
header nav {float: right; height: 65px!important; }
#preferences {float: right; padding:4px 10px 0 36px; height: 28px!important; background: #364778; border-radius: 51px; margin: 18px; border:1px solid  #6173a1; }
#preferences:hover{ border:1px solid #7989b2;}
.prel {position: relative; }
.cheers span {position: absolute; top: -1px; left: -32px;}
#triangle {background: url(../graphics/rArrows.png) 108px -42px no-repeat; height: 14px; float: left; max-width: 129px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; font-style: normal; color: #ece7e7; padding:3px 26px 3px 0px; }
.arrowRight {border: none;  text-indent: -99999px; z-index: 99999999999; width: 100%; height: 100px !important; padding: 14px; position: absolute; left: 0px; top: 0px;}
.prel {position: relative; }
#popupPref {position: absolute; top: 22px; right: -2px;  z-index: 9; background-color: #364778; width: 156px; display: none; padding: 4px 0; box-shadow: 0px 6px 15px #333;  border: 1px solid #6173a1; border-top: none;}
#popupPref li {float: left; width: 100%; border-bottom: none; }
#popupPref li a {font-weight: 600; padding:4px 10px; float: left; width: 100%;  color: #fff;  text-transform: capitalize; font-weight: 400; font-size: 13px;}
#popupPref li a:hover, #popupQuick li a:hover{background:#596c99}
#settings, #obPref {float: right; position: relative; padding: 11px 6px 0 6px; height: 64px!important; cursor: pointer; border-left: 1px solid #546d9b; }
#obPref{border-right: 1px solid #546d9b;}
#sets {width: 80px; text-align: center; padding: 1px; }
#notifBar span, #sets span {float: left; width: 100%; margin-top: 5px; font-weight: 600; color: #e2e2e2; }
#notifBar {width: 80px; text-align: center; padding: 1px; }
#notifBar img, #sets img, #add img {width: 16px; margin-bottom: 1px; height: 19px; }
#solicitud {background-color: #d7106f; color: #fff; border-radius: 50%; padding: 2px 5px; font-weight: 700; font-style: normal; position: absolute; top: 6px; right: 28px; }
#wrapPlus {float: right; }
#add {float: left; border: none; background: transparent; padding: 10px 10px; height: 64px !important; border: none; border-left: 1px solid #5871a6; }
#add span {float: left; width: 100%; margin-top:6px; font-weight: 600; color: #e2e2e2; text-transform: uppercase; }
#popupQuick {position: absolute; top: 63px; background: #3d568e; padding:10px 20px; width: 262px; color: #fff; font-size: .8em; box-shadow: 3px 3px 9px #3d568e;}
#popupQuick li a {color: #fff; float: left; width: 100%; padding: 3px 2px; font-weight: 400; text-transform: capitalize; font-size:13px; line-height:22px}
#popupQuick strong {display: block; margin-bottom: 10px; }
strong, #forAjaTwo strong {font-weight: 700; }
.dnone, #formPre, .submenu, .barIn h1, .barIn strong, .barIn em, .barOut .heading, #popupQuick, #rigWinClose, #busPros, #propuesta, #butEva, #butEvaCol, .barIn #logoSmall {display: none; }
#add:hover, #settings:hover, #obPref:hover { background:#364a7a; box-shadow: 1px -5px 13px #5c76b1;}
#preferences:hover{background:#2b3a66}
.submenu li a { float: left; width: 100%; color: #fff; font-size: 1.2em; padding: 10px 5px 10px 23px;}

/*---------------- LEFT NAV  ------------------*/
.barOut {width: 260px; overflow-x: hidden; }
.barOut img {float: left; }
.barOut #navMenu li {float: left; width: 100%; padding:2px 0px; cursor: pointer; }
.barIn #navMenu li img {width:22px;}
.barOut #navMenu li img {margin: 13px 10px 0 16px; width:18px;}
.barIn.main:hover, .bckMark {background: #35466e; border-left: 4px solid #e9e9e9!important; }
.barOut.main:hover, .bckMark {background: #35466e; }
.main:hover{background:#404a60}
.proImg img {width: 20px; height: 20px; border: 2px solid #cb9360; border-radius: 50%; padding: 1px; }
#barlogo{width:140px; float: left; margin: 8px 100px;}
#bar {position: fixed; top: 0px; background-color: #3d568e; height: 100vh; left: 0; z-index: 99999999; box-shadow: 0px 23px 18px #000;     scrollbar-width: none;}
#bar::-webkit-scrollbar{display: none}
.barIn {width: 70px; }
.barIn #padMenu {float: left; height: 65px !important; }
.barIn .main {float: left; width:100%; padding: 14px 5px; cursor: pointer; position: relative; text-align: center; border-left: 4px solid #c39e7c; }
.barIn .submenu {position: absolute; font-size: 14px; font-weight: 300; top:0px; left: 65px; z-index: 9999999; width: 270px; background:#323255; padding-bottom: 10px; }
.submenu li:hover{background:#23365a}
.submenu li {float: left; width:100%; }
.barIn .submenu li {padding-left: 10%; float: left; width:100%;  font-size:.9em; }
.barIn .submenu li a{padding:6px 0; line-height:20px;}
.barIn .submenu a{float: left; width: 90%; color: #fff; text-align: left; font-weight:500; line-height:28px;}
.barIn #butImg {height: 65px; }
#butImg {height: 100px; background: #23365a; }
.arrowLeft {border: none; text-indent: -99999px; position: fixed; background: url(../images/menuSprite.png) 20px 21px no-repeat; width: 69px; height: 65px !important; padding: 14px; border-bottom: 1px solid #7e3156; z-index: 99999999999; }
#logoSmall {width: 175px; position: absolute; left: 15%; top: 16px; z-index: 99999999;}
#navMenu h1 {float: left; width: 100%; padding: 14px 0px; background: #404a60; font-size: 12px; overflow: hidden; color:#f4e7db; font-weight: 600; text-align: center; }
.svgIcon {margin: 6px auto 6px; }
#navMenu li em {line-height: 28px; padding: 9px 0 7px 4px; text-transform: uppercase; float: left; font-size: 12px; font-weight: 600; cursor: pointer; font-style: normal; width: 200px; color: #fff; }
.heading {position: relative; background: #23365a; padding: 13px 0; }
.heading h3 {font-size: 20px; font-weight: 400; text-align: left; color: #fff; }
#navMenu li strong {line-height: 28px; padding: 9px 0 7px 4px; text-transform: uppercase; float: left; font-size: 12px; font-weight: 600; cursor: pointer; font-style: normal; width: 195px; color: #fff!important; }
.arrowLeft {
    border: none;
    text-indent: -99999px;
    position: fixed;
    background: url(../images/menuSprite.png) 20px 21px no-repeat;
    width: 69px;
    height: 65px !important;
    padding: 14px;
    z-index: 99999999999;
}
.arrowRight {
    border: none;
    text-indent: 99999px;
    /* background: url(../images/menuSprite.png) 221px -62px no-repeat; */
    z-index: 99999999999;
    width: 260px;
    height: 100px !important;
    padding: 14px;
    position: absolute;
    top: 0px;
}
.barOut .submenu {
    float: left;
    background: #363e50;
    width: 100%;
}
#cat{padding:20px; float:left; width:100%}
#cat h2{color:#cb9360; display:block; padding:10px 0 20px}
#cat strong{color:#fff; font-size:1.3em; padding:10px 0; display:block}
#cat p{color:#b6aca3; padding:5px 0; font-size:1.2em; display:block}
#cat li{float:left; width:32.3%; margin-right:1%; height:310px; position:relative;}
#cat li img{width:100%; border:1px solid #515151}
#cat li:hover img{border:1px solid #6b6561}

/*---------------- FILTROS CALENDARIO  ------------------*/
.herramientas {float: left; width: 100%; background: #788bb6; margin-top: 48px; padding: 0px 0px 0px 20px; font-size: 1.1em; color: #e2e2e2; margin-bottom: 20px; text-align: right;}
.herramientas form {border-left: 1px solid #ffffff2e; padding-left: 20px; background: #516289;}

.herramientas fieldset {padding: 12px 0px 14px 0px; height: 46px;}
.sec fieldset {float: left; border-radius: 6px; margin-right: 6px; font-size: 1.2em; margin-top: 1px;}
.sec select {float: left; background: none; border: none; text-align: right; padding-right: 10px;}
.herramientas fieldset select {color: #fff;}
#calendar {float: left; margin: 0 0 0 10px;}
#calendar img {width: 19px; margin: 14px 0 0 0px;}
#datepicker {height: 47px; font-size: 1.1em;}
.sec .inp, .inpDate {float: left; background: none; border: none;}
.de, .a {width: 175px; font-weight: 400; text-align: center;}
.filtroBuscar {background: #2a3d69; border: none; padding: 0px 30px 0px; text-transform: uppercase; font-size: .9em; color: #fff; font-weight: 600; transition: background-color 0.3s ease, color 0.3s ease; height: 47px;}
.filtroBuscar:hover {background: #e9c829; color: #333;}
.filtroBuscar {background: #2a3d69; border: none; padding: 0px 30px 0px; text-transform: uppercase; font-size: .9em; color: #fff; font-weight: 600; transition: background-color 0.3s ease, color 0.3s ease; height: 47px;}
.filtroBuscar:hover {background: #e9c829; color: #333;}
#datepicker::placeholder{color: #fff}

/*---------------- Titulos  ------------------*/
.desPrincipal {padding:0px 0px 20px 20px; margin:5px 0 0px; width: 97%; float:left}
h1, h2, h3, h4 {font-family: 'Raleway', sans-serif; font-weight: 500; color: #364778; font-size: 24px;}
.desPrincipal p {font-family: 'Lato', sans-serif; color: #3d568e; display: block; font-size: 14px; font-weight: 300; text-transform: uppercase; margin-top: 2px; border-bottom: 2px solid #e5007c; padding-bottom:20px; margin-bottom: 0px;}
.desPrincipalTwo {padding:0px 0px 20px 20px; margin:78px 0 0px; width: 97%; float:left}
h1, h2, h3, h4 {font-family: 'Raleway', sans-serif; font-weight: 500; color: #f9b706; font-size: 24px; margin-bottom:10px}
.desPrincipalTwo p {font-family: 'Lato', sans-serif; color: #3d568e; display: block; font-size: 14px; font-weight: 300; text-transform: uppercase; margin-top: 2px; border-bottom: 2px solid #e5007c; padding-bottom:20px; margin-bottom: 0px;}
 .cincuenta h1, .treinta h1, .cien h1, .setenta h1, .veinticinco h1, .veinte h1{ display: block; font-size:.9em; border-bottom: 1px solid #dbdbdb; padding: 6px 0 12px 0; margin-bottom: 6px; color: #6b6b6b; font-weight: 800; font-family: sans-serif; text-transform:uppercase; line-height:16px;}


/*---------------- Boxes  ------------------*/
.white{background:#fff}
.section{float: left; width: 96%;  margin-left: 1.5%;}
.cincuenta{float:left; width:49%; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow: 1px 1px 8px #b8bdc8; position: relative}
.veinticinco{float: left; width: 24%; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow:1px 1px 8px #b8bdc8; position: relative}
.setenta{float:left; width:71%; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow: 1px 1px 8px #b8bdc8; position: relative}
.email{float:left; width:542px; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow: 1px 1px 8px #b8bdc8; position: relative}
.treinta{float:left; width:26%; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow: 1px 1px 8px #b8bdc8; position: relative}
.cien{float:left; width:100%; padding: 1%; margin: 1% .7%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow: 1px 1px 8px #b8bdc8; position: relative}
.veinte{float: left; width:19%; padding: 1%; margin: 1% .5%; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; box-shadow:1px 1px 8px #b8bdc8; position: relative}
.veinticinco h1 img, .cincuenta h1 img, .setenta h1 img, .treinta h1 img, .cien h1 img, .veinte h1 img{margin-right:6px; float:left;}
.veinticinco .vermas, .cincuenta .vermas, .setenta .vermas, .email .vermas, .treinta .vermas, .cien .vermas, .veinte .vermas{position: absolute; top: 12px; right: 10px; padding: 5px 9px 3px 10px; background: #ffff; text-align: center; border-radius: 4px; border: 1px solid #fff;}
.veinticinco .vermas:hover, .cincuenta .vermas:hover, .setenta .vermas:hover, .treinta .vermas:hover, .cien .vermas:hover, .veinte .vermas:hover{background: #f5f4f4;  4px; border: 1px solid #eee;}
.boxShadowNone{box-shadow: none!important}

/*---------------- Graficas  ------------------*/
#barMiniChart{display: block; box-sizing: border-box; height: 182px; width: 280px;}
#barMiniChartUsuarios{display: block; box-sizing: border-box; height:96px; width: 100%}
#myChart{display: block; box-sizing: border-box; height: 287px; width: 736px;}
.chart {background: #fff; float: left; padding:10px 10px 63px!important; height: 370px; border-radius: 4px;}


/*---------------- Graficas  ------------------*/
.tableUno{float:left; width:100%; border: 2px solid #ececed; border-radius:3px;  border-collapse: separate; border-spacing: 0; overflow: hidden; margin-top:6px}
.tableUno button, .botonTable{color: blue; width: 100%; text-align: center; border: 1px solid blue; background: aliceblue; border-radius: 3px; padding: 8px 0px; width: 91px; float: left; margin-right: 10px;}
.tableUno p, .tableUno strong{padding:4px 0; float:left; width:100%; line-height:19px}
.tableUno button:hover, .botonTable:hover{background:#c30; color:#fff!important; border:1px solid #c30;}
.tableUno tr:hover td{background:#f8f8f8!important}
.tableUno tr:hover td a{color:#556a98}
.tableUno a{font-weight:400}
.tableUno th{color: #3d568e;   font-weight: 800; padding:6px; background:#ececed}
.tableUno thead tr{border-bottom: 1px solid #ccc;}
.tableUno td{vertical-align: top; border-bottom: 1px dashed #e4e4e4; padding:6px; color: #696969;  font-weight: 400;}
.tableUno td strong{font-weight:800}
.markYellow{background:#fffcf3}
/* Colorear filas impares (odd) */
.tableUno tr:nth-child(odd) {
    background-color: #fff; /* Cambia este color a tu preferencia */
}
.tableUno tr:last-child td {
    border-bottom: none;
}
/* Colorear filas pares (even) */
.tableUno tr:nth-child(even) {
    background-color: #f8fbff; /* Cambia este color a tu preferencia */
}

#usuariosConfig li, #solicitudes li{float:left; width:100%;}
#usuariosConfig strong, #solicitudes strong{float:left; margin-right:5px; width:7%; line-height:18px;}
#usuariosConfig p, #solicitudes p{float:left; width:88%}

#editarUsuarios{float:left; width:100%}
#editarUsuarios table{float:left; width:100%}
#editarUsuarios label{float:left; width:100%; padding:16px 10px 10px; font-weight:600; font-size:.85em; color:#3d568e; text-transform: uppercase }
#editarUsuarios .inp{float: left; width: 93%;  height: 32px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding:0 10px; margin-left:6px}
#editarUsuarios .inpCincuenta{float: left; width: 30%;  height: 32px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding:0 10px; margin-left:6px}
#editarUsuarios h4{float: left; width: 100%; padding: 20px 0 10px 0px; font-size: 14px; border-bottom: 1px solid #dbdbdb; margin-left: 10px;  color: #3d568e;}

#editarUsuarios fieldset .inp:focus {background-color: #f7fdff; border:1px solid #9eceff; }
#labelStatus{float:left; width:100px!important;}
#seleStatus{float: left; width: 140px; height: 25px; padding: 0 10px; margin: 6px 0!important; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; background:#f7fdff }
#code{width: 104px!important; padding: 0 10px; height: 32px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; margin-left:6px; }
#telefono{width: 76%!important; padding: 0 10px; height: 32px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; }
#comentario{float: left; width: 97%; padding: 10px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; height:100px }
#enviar{float: left; width: 97%; background: #d70f6f; color: #fff; text-transform: uppercase; padding: 10px 0;  font-size: 1em; border: none; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; margin-top:10px}
#enviar:hover{background:#c00f64}
.statusExp{font-size: .74em; font-weight: 800!important; text-transform: uppercase; background: #3d568e; color: #fff; padding: 4px 7px; border-radius: 6px;}
.statusExp:hover{color:#fff!important}
#botonImagen{float: left; width: 100%; margin:10px 0; background: #e42b7c; color: #fff; font-size:1.1em; text-transform: uppercase; font-weight: 800; border: none; padding:13px 0; border-radius: 4px;}
#botonImagen:hover{background:#d3196b}
.fullwidth{width:100%; float:left; margin-bottom:4px;}
.textInputImage{float: left; width: 100%; border: 1px solid #ccc; border-radius: 4px; margin: 3px 0; padding: 6px;}

/*---------------- CSS EFFECTS  ------------------*/
@-webkit-keyframes fadeIn {
  from {opacity: 0;
  }
  to {opacity: 1;
  }
}

@-moz-keyframes fadeIn {
  from {opacity: 0;
  }
  to {opacity: 1;
  }
}

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

.fade-in {
  opacity: 0;
  /* make things invisible upon start */
  -webkit-animation: fadeIn ease-in 1;
  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation: fadeIn ease-in 1;
  animation: fadeIn ease-in 1;
  -webkit-animation-fill-mode: forwards;
  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
  -webkit-animation-duration: .5s;
  -moz-animation-duration: .5s;
  animation-duration: .5s;}

.fade-in.one {
  -webkit-animation-delay: 0.1s;
  -moz-animation-delay: 0.1s;
  animation-delay: 0.1s;}
  
  .botonAcciones{float: right; margin: 1px 0 0 0; padding: 4px 10px; border-radius: 4px; background: linear-gradient(to bottom, #ffffff 5%, #e5ecf6 100%); background-color: #f9f9f9; cursor: pointer; border: 1px solid #c3cddb; color: #556a98; font-weight: 600; font-size: 1em;}
  .botonAcciones img{width: 11px; margin: 1px 6px 0 0; float: left;}
  .botonAcciones:hover{    background: linear-gradient(to bottom, #ffffff 1%,#ffffff 56%,#dfe9f7 99%,#ffb224 99%,#ff9800 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#a1dbff',GradientType=0 ); color: #222; box-shadow: 1px 0px 3px 0px #2b2b23; -moz-box-shadow: 1px 0px 3px 0px #2b2b23; -webkit-box-shadow: 1px 1px 6px 0px #c3cbd6;}
 .firstMargin{margin-right:32px!important;}
.conDataTables{margin-top:2px; font-size:12px}
.dataTables_wrapper{position:relative;}
.dataTables_length{padding:4px 0; line-height:25px}
.dataTables_length select{ margin-left:10px; padding: 4px 0; line-height: 25px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:1px solid #dcd7d7}
.dataTables_info{float: left; padding: 8px 0 0;}
.dataTables_paginate{padding:8px; float:right}
.dataTables_paginate a{padding:0 4px; color:#3d568e}
.dataTables_paginate a:hover{color:#e5007c}

#editarStatus table, #editarStatus tbody, #editarStatus tr, #editarStatus td{width:100%; display:block}
.divide{display: block; border-bottom: 1px solid #ccc; padding: 10px 0; margin-bottom: 10px; font-weight:400}
.divide strong{display: block; color: #3d568e; padding: 0 0 9px 0; font-weight: 800; font-size: 1.1em;}
.divide a{display: block; width: 100%; text-align: center; margin: 10px 0; background: #eee; padding: 9px 0; border-radius: 3px; color:#3d568e; text-transform: uppercase; font-size: .95em; border: 1px solid #d8ddeb;}
.divide a:hover{background:#f7fdff}
.divide span{display:block; width:100%}
.divide p{display:block; width:100%;  word-wrap: break-word; word-break: break-all; }
#urlpagina{position: absolute; right: 17px; top: 15px; background: #f7fdff; padding: 2px 10px; border-radius: 4px; font-style: normal; color: #3d568e; font-size: .95em;  font-weight: 400; border: 1px solid #ccc; cursor: pointer}
.notification{display: block; padding: 6px 0 6px; text-transform: uppercase; color: #44a44a; text-align: center; font-size:.95em; font-weight:600}
#seleStatusExperiencia, #seleStatusCategoria{float: left; width: 100%; height: 25px; padding: 0 10px; margin: 6px 0!important; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; background:#f7fdff }
#comentarioExperiencia, #incluyeEdita{float: left; width: 97%; padding:20px 10px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; height:200px }
#requisitosEdita{float: left; width: 97%; padding:20px 10px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; height:100px }
#descripcionCorta{float: left; width: 97%; padding:20px 10px; border: 1px solid #eae7e7; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; height:60px }
#thumbnail img{width:100%}
#wisywig{padding: 10px 24px 0 1px;}
#enviaNewsletter{float:left; width:100%; padding:10px; text-align:center; font-size:1.6em; background:#ad8663; color:#fff; margin-top:10px; border: none}
#newsletter{float:left; width:100%; margin:20px 0; background:#fafafa; padding:20px; border:1px solid #ccc; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; }
#newsletter select{float:left; width:100%; height:32px; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; font-size:1.2em; padding:0 10px}
#newsletter label{text-transform: uppercase; float:left; width:100%; padding:4px 0 10px 4px}

/*---------------- CSS Acceso  ------------------*/
.bckIndex {
    color: #404040;
    font-family: 'Oswald', sans-serif!important;
    background: url(../graphics/bck-energia-left.png) center center no-repeat #333;
    background-size: cover;
}
#acceso section {
    display: flex;
}
.promo {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    width: 60%;
    flex: 1;
    box-sizing: border-box;
}
.promo em {
    color: #fff;
    margin-bottom: 40px;
    font-size: 1.9em;
    font-style: normal;
}
.promo h1 {
    width: 100%;
    color: #f9b703;
    font-size: 1.8em;
}
.promo h2 {
    width: 100%;
    color: #fff;
    font-size: 1rem;
    line-height: 26px;
}
.centradoVertical {
    display: flex;
    flex-direction: column;
    width: 80%;
}
.promo p {
    width: 100%;
    color: #fff;
    font-family: 'Raleway', sans-serif;
    margin-top: 20px;
    line-height: 1.5em;
}
#registroContacto {
    font-family: 'Raleway', sans-serif;
    width: 200px;
    background: #e25959;
    color: #fff;
    text-align: center;
    padding: 13px 0;
    margin: 40px 0;
    font-size: 15px;
    border-radius: 4px;
}
#registroContacto:hover{background:#dca204; color:#000}
.contacto {
    width: 40%;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}
.fade-in.one {
    -webkit-animation-delay: 0.1s;
    -moz-animation-delay: 0.1s;
    animation-delay: 0.1s;
}
.fade-in {
    opacity: 0;
    -webkit-animation: fadeIn ease-in 1;
    -moz-animation: fadeIn ease-in 1;
    animation: fadeIn ease-in 1;
    -webkit-animation-fill-mode: forwards;
    -moz-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    animation-duration: .5s;
}
.centradoVerticalDos {
    display: flex;
    flex-direction: column;
    width: 72%;
}
.centradoVerticalDos {
    display: flex;
    flex-direction: column;
    width: 72%;
}
#loginForm h1 {
    padding:0px;
    font-size: 1.8em;
}
#loginForm p {
    float: left;
    position: relative;
    width: 100%;
}
#loginForm label {
    float: left;
    text-align: left;
    padding: 20px 0 7px 0;
    width: 100%;
    font-size: 15px;
}
.contacto p {
    float: left;
    position: relative;
    width: 100%;
    font-size: 1.5em;
    font-family: 'Raleway', sans-serif;
}
.contacto .inpLogIn {
    height: 46px;
    font-size: 13px;
    border: 1px solid #dad9d9;
    padding: 0 5%;
    width: 100%;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    float: left;
    background: #fff;
}
.msgBlack {
    float: left;
    width: 100%;
    padding: 10px 0;
    color: #fff;
    font-size: 18px;
}
#passwordField {
    margin: 0 0 20px;
    float: left;
    width: 100%;
}

element.style {
}
#ojo {
    position: absolute;
    z-index: 9999;
    bottom: 31px;
    right: 9px;
    width: 22px;
    height: 29px;
}
.ojo-cerrado {
    background: url(../graphics/ojo-cerrado.png) 0 18px no-repeat;
}
#mesLog {
    float: left;
    width: 100%;
    margin: 20px 0;
    font-size: 17px;
    font-weight: 300;
    color: #333;
}
#mesLog a {
    color: #c6ad20;
    font-weight: 600;
}
.submit input {
    cursor: pointer;
    background: #e25959;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 12px 0;
    width: 100%;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin: 20px auto 0 auto;
    transition: background-color 0.3s ease, color 0.3s ease;
}

#logoVideos{float:left; margin:20px 20px 20px 100px}
#logoVideos img{width:150px;}
#newsletter .inp{float: left; width: 100%; height: 32px; border-radius: 4px; border: 1px solid #eee; margin-bottom: 10px; padding:0 10px}
#newsletter .select{float: left; width: 100%; height: 32px; border-radius: 4px; border: 1px solid #eee; margin-bottom: 10px;}

@media only screen and (max-width: 1024px){
	 #acceso section{display:block!important; height:inherit!important}
	 #acceso .promo{display: block; width:100%}
	 .contacto{ width:100%; float:left; display:block; padding:20px 20px 40px 20px; }
	 .centradoVertical{display:block; width:100%; text-align:center; padding:0 20px;}
	 #logoContacto { width: 190px; margin: 20px auto; display: block;}
	 #acceso .promo a{width:200px!important; margin:20px auto;}
	 #registroContacto{display: none}
	 .promo h1{margin-top:20px; font-size:3em}
	 #acceso .promo{float:left; width:100%; box-sizing:inherit; height:auto; padding-bottom:20px;}
	 .centradoVerticalDos{width:100%; padding:10px 0px; text-align: center; display:block; flex-direction:inherit}
	 #loginFormUsuarios label{text-align:center}
	 .promo h2{font-size:1.4em}
	 .promo p{width: 100%; font-size: 1.3em; color: #fff; font-family: 'Raleway', sans-serif; margin-top: 10px; line-height: 1.5em; padding: 0 20px;}
	 #loginFormUsuarios .descrip{display: none}
	 #loginFormUsuarios .inpLogIn{height:54px}
	 #loginFormUsuarios h1{padding:0px;}
	 .submit input{margin-top:0px;}
	 .recuperar .inpLog{margin-bottom:10px}
	 html{height:auto}
	 #acceso section{padding:0px!important;}
}
#paginaCaida{    float: left;
    width: 100%;
    border: 1px solid #ccc;
    padding: 10px;
    margin-bottom: 15px;
    border-radius: 4px;}

#acceso .msgBlack{color: #e25959!important}

.blink { animation: blink-animation 1s steps(5, start) infinite; -webkit-animation: blink-animation 1s steps(5, start) infinite; }
@keyframes blink-animation { to { visibility: hidden; } }
@-webkit-keyframes blink-animation { to { visibility: hidden;}