* {
  font-family: Roboto, sans-serif;
}

html {
position: relative;
min-height: 100%;
}

body {
background-color: #eef4f7;
margin-bottom: 40px;
font-size: 80%;
}

.modal {
  font-size: 85%;
}
.headerwp {
max-width: 1140px;
margin: 0 auto;
padding: 10px 0;
min-width: 320px;
display:flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
background: url('../img/bg_header.png') top center no-repeat;
}

.topbarbg {
width: 100%;
display: block;
min-height: 100px;
padding-top: 0px;
/*background: url(../images/topbg.jpg) top center no-repeat;*/
background-color: #fff;
box-shadow: 0 0 20px rgba(0, 0, 0, .3);
}

.desktoplogo {
padding: 0px 0px;
/*margin: 0 auto;*/
/*text-align: center;*/
/*flex-grow: 8;*/
}

/*Swicher CSS*/

.swichermainbx {
max-width: 1140px;
margin: 155px auto 0px auto;
}

.swichermainleft {
width: 50%;
float: left;
margin-bottom: 25px;
}

.swichermainright {
width: 50%;
float: left;
margin-bottom: 25px;
}

.swichertxt {
width: 100%;
}

.swichertxt02 {
font-size: 15px;
margin-bottom: 15px;
}

.wscolorcode:hover {
color: #fff;
text-decoration: none;
}

.wscolorcode {
width: 12.5%;
margin: 0px;
color: #fff;
float: left;
padding: 4px 12px 4px 12px;
margin: 0px;
height: 30px;
line-height: 22px;
background-color: #333;
font-size: 13px;
text-transform: uppercase;
text-align: center;
border-bottom: solid 2px #fff;
}

.wscolorcode.cblack {
width: 16.66%;
}

.wscolorcode.active {
border-bottom: solid 2px #333;
opacity: 1;
}

.wscolorcode.cblack.active {
border-bottom: solid 2px #da4b38;
opacity: 1;
}

.wscolorcode .fa {
font-size: 15px;
color: #fff;
}

.wscolorcode.cblue {
background-color: #1991eb;
}

.wscolorcode.corange {
background-color: #fb872b;
}

.wscolorcode.cred {
background-color: #d7412e;
}

.wscolorcode.cpink {
background-color: #eb65a0;
}

.wscolorcode.cgreen {
background-color: #80c133;
}

.wscolorcode.cpurple {
background-color: #967ADC;
}

.wscolorcode.cgry {
background-color: #ccc;
}

.wscolorcode.cyellow {
background-color: #ffd452;
}

.wscolorcode.grd-green {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#49c4a4), to(#97b832));
background: -webkit-linear-gradient(left, #49c4a4, #97b832);
background: -moz-linear-gradient(left, #49c4a4, #97b832);
background: -o-linear-gradient(left, #49c4a4, #97b832);
background: -ms-linear-gradient(left, #49c4a4, #97b832);
background: linear-gradient(left, #49c4a4, #97b832);
background-color: #49c4a4;
}

.wscolorcode.grd-blue {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#31c8b1), to(#4ec7ff));
background: -webkit-linear-gradient(left, #31c8b1, #4ec7ff);
background: -moz-linear-gradient(left, #31c8b1, #4ec7ff);
background: -o-linear-gradient(left, #31c8b1, #4ec7ff);
background: -ms-linear-gradient(left, #31c8b1, #4ec7ff);
background: linear-gradient(left, #31c8b1, #4ec7ff);
background-color: #4ec7ff;
}

.wscolorcode.grd-red {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d90647), to(#eb402c));
background: -webkit-linear-gradient(left, #d90647, #eb402c);
background: -moz-linear-gradient(left, #d90647, #eb402c);
background: -o-linear-gradient(left, #d90647, #eb402c);
background: -ms-linear-gradient(left, #d90647, #eb402c);
background: linear-gradient(left, #d90647, #eb402c);
background-color: #d90647;
}

.wscolorcode.grd-light-green {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#29bb92), to(#69cbb0));
background: -webkit-linear-gradient(left, #29bb92, #69cbb0);
background: -moz-linear-gradient(left, #29bb92, #69cbb0);
background: -o-linear-gradient(left, #29bb92, #69cbb0);
background: -ms-linear-gradient(left, #29bb92, #69cbb0);
background: linear-gradient(left, #29bb92, #69cbb0);
background-color: #29bb92;
}

.wscolorcode.grd-pink {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c659a7), to(#fd67a0));
background: -webkit-linear-gradient(left, #c659a7, #fd67a0);
background: -moz-linear-gradient(left, #c659a7, #fd67a0);
background: -o-linear-gradient(left, #c659a7, #fd67a0);
background: -ms-linear-gradient(left, #c659a7, #fd67a0);
background: linear-gradient(left, #c659a7, #fd67a0);
background-color: #cc48d4;
}

.wscolorcode.grd-orange {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ff5183), to(#ff754b));
background: -webkit-linear-gradient(left, #ff5183, #ff754b);
background: -moz-linear-gradient(left, #ff5183, #ff754b);
background: -o-linear-gradient(left, #ff5183, #ff754b);
background: -ms-linear-gradient(left, #ff5183, #ff754b);
background: linear-gradient(left, #ff5183, #ff754b);
background-color: #ff5183;
}

.wscolorcode.grd-black {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#383d41), to(#5d6069));
background: -webkit-linear-gradient(left, #383d41, #5d6069);
background: -moz-linear-gradient(left, #383d41, #5d6069);
background: -o-linear-gradient(left, #383d41, #5d6069);
background: -ms-linear-gradient(left, #383d41, #5d6069);
background: linear-gradient(left, #383d41, #5d6069);
background-color: #5d6069;
}

.wscolorcode.grd-gry {
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#cccccc), to(#e4e4e4));
background: -webkit-linear-gradient(left, #cccccc, #e4e4e4);
background: -moz-linear-gradient(left, #cccccc, #e4e4e4);
background: -o-linear-gradient(left, #cccccc, #e4e4e4);
background: -ms-linear-gradient(left, #cccccc, #e4e4e4);
background: linear-gradient(left, #cccccc, #e4e4e4);
background-color: #cccccc;
}
/*and (min-width: 230px)*/
@media only screen  and (max-width:991px) {
.desktoplogo {
  display: none;
}
.topbarbg {
  /*background: none;*/
  box-shadow: none;
}
.swichermainbx {
  width: 96%;
  margin: 0% 2%;
  display: block;
  background-color: rgba(255, 255, 255, 0.3);
  padding: 15px 25px;
  border-radius: 14px;
}
.swichermainleft {
  width: 98%;
  margin: 1% 1%;
}
.swichermainright {
  width: 98%;
  margin: 1% 1%;
}
.wscolorcode {
  width: 12.5%;
}
.swichertxt {
  display: none;
}
.swichertxt02 span {
  display: none;
}
}

.app-title {
  font-family: "Century Gothic";
  font-weight: bold;
  font-size: 1.2em;
  color:#092358;
}

.app-subtitle {
font-weight: normal;
font-size: 1em;
}

.breadcrumb {
position: relative;
border-radius: 0;
border-bottom: 1px solid #c8ced3;
background-color: #fff;
}

.card-header {
font-size: 1.1em;
}

.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 40px;
  background-color: #33383b;
}

.app-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  padding: 0 1rem;
  color: #23282c;
  background: #f0f3f5;
  border-top: 1px solid #c8ced3;
  transition: margin-left 0.25s, margin-right 0.25s, width 0.25s, flex 0.25s;
  transition: margin-left 0.25s, margin-right 0.25s, width 0.25s, flex 0.25s, -ms-flex 0.25s;
  flex: 0 0 50px;
}

/* Instrumento */
/* Instrumento detalle*/
.title-section-detail {
margin: 1em 0 0.5em 0;
font-weight: normal;
position: relative;
text-shadow: 0 -1px rgba(0,0,0,0.6);
font-size: 16px;
line-height: 30px;
background: #575a63;
border: 1px solid #fff;
padding: 5px 15px;
color: white;
border-radius: 0 10px 0 10px;
box-shadow: inset 0 0 5px rgba(53,86,129, 0.5);
/*font-family: 'Muli', sans-serif;*/
}

.subtitle-section-detail {
/*margin: 1em 0 0.5em 0;*/
font-weight: 600;
/*font-family: 'Titillium Web', sans-serif;*/
position: relative;
/*text-shadow: 0 -1px 1px rgba(0,0,0,0.4);*/
font-size: 12px;
line-height: 24px;
color: #147697;
}

.table.table-striped.table-sm.table-bordered.table-hover.modal{
  margin-top: 0.1rem;
  margin-bottom: 0.1rem;
}

.list-group-item.py-1 {
text-align: justify;
}

.tituloTabla {
font-size:18px;
color: #147697;
font-weight: bold;
text-align: center;
margin-top: 0rem;
margin-bottom: 0rem;
}

.list-group-item {
padding: 0rem 0.3rem;
}

/* Instrumento forms */
.filtro.ui-autocomplete {
max-height: 100px;
overflow-y: auto;
/* prevent horizontal scrollbar */
overflow-x: hidden;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .filtro.ui-autocomplete {
height: 100px;
}

.semaforo {
padding: .25em .2em;
border-radius: .25rem;
text-align: center;
font-weight: 500;
line-height: 1.2;
font-size:95%;
}
.semaforo-rojo {
background-color: #dc3545;
color: #ffffff;
}

.semaforo-naranja {
background-color: #fd7e14;
}

.semaforo-amarillo {
background-color: #ffc107;
}

.semaforo-blanco {
background-color: #ffffff;
border: 1px solid #cccccc;
}

.obligatorio:before {
content: "*";
color: #FF0000;
margin-right: 2px;
}

.invalid-feedback {
font-size: inherit;
}

.label-checkbox {
font-weight: bold;
}

.lead {
font-size: .8rem;
color: #147697;
font-weight: bold;
text-align: center!important;
}

.bg-aqua {
background: #147697;
}

.table-responsive .table > tbody > tr > td.break-all {
word-break: break-all;
}

.table > thead > tr > th > a {
color: #000;
}
.table > thead > tr > th > a:before, .table > thead > tr > th > a:after {
/*position: absolute;
bottom: 0.9em;
display: block;*/
opacity: 0.5;
float: right;
/*width: 25%;*/
top: 5px;
right: 0.85em;
}

.table > thead > tr > th > a.asc:before, .table > thead > tr > th > a.desc:after {
opacity: 1;
}

.table > thead > tr > th > a:before {
right: 1em;
content: "\2191";
}

.table > thead > tr > th > a:after {
right: 0.5em;
content: "\2193";
}

.table > tbody > tr > td > ul {
margin: 0;
padding-left: 15px;
}

button.btn-delete-clone {
padding: 0;
background-color: transparent;
border: 0;
-webkit-appearance: none;
font-size: 1.5rem;
font-weight: 700;
line-height: 1;
color: #dc3545;
text-shadow: 0 1px 0 #fff;
outline:0;
}

button.btn-delete-clone:focus, button.btn-delete-clone:hover {
  color: #a71d2a!important;
  outline:0;
}

.fila-base .form-group {
  margin:0;
}

.etiqueta-readonly {
  padding: .25rem .5rem;
  font-size: .8rem;
  line-height: 1.5;
  border: 1px solid #ced4da;
  border-radius: .2rem;
  background-color: #e9ecef;
  opacity: 1;
  margin: 5px 0 7px 0;
}
#preview .modal-body, #modalSesion .modal-body div {
  font-size: 1.2em;
}