html, body {
  height : 100%;
}

body {
  margin : 0;
  padding: 0;
}

.wrapMenu {
  min-height: 100%;
  position  : relative;
}

.parent {
  display       : flex;
  min-height    : 100vh!important;
  flex-direction: column;
}

.wrapper {
  height    : auto;
  margin    : 0 5px 0 5px;
  min-height: 100%;
  padding   : 60px 0 0 0;
  box-sizing: border-box;
}

.wrapOldMenu {
  height    : auto;
  margin    : 0 5px 0 5px;
  min-height: 100%;
  padding   : 15px 0 0 0;
  box-sizing: border-box;
}

.wrapperSideBar {
  height    : auto;
  margin    : 0 5px 0 0;
  min-height: 100%;
  padding   : 0 0 30px 0;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
}

.main.container {
  margin-top   : 70px;
  margin-bottom: 20px;
}

.loaderNew {
  border       :  12px solid #f3f3f3;
  border-radius:  50%;
  border-top   :  12px solid #3498db;
  width        : 140px;
  height       : 140px;
  -webkit-animation: spin 2s linear infinite; 
  animation    : spin 2s linear infinite;
  margin       : 0 auto;
  margin-top   : -77px;
}

.WrapLoader {
  width     :  80px;
  height    :  22px;
  margin    : 0 auto;
  margin-top: 100px;
  z-index   :   9;
}

.SpinBlueCircle {
  border           :  12px solid #F3F3F3;
  border-radius    :  50%;
  border-top       :  12px solid #3498DB;
  width            : 110px;
  height           : 110px;
  margin           : 0 auto;
  margin-top       : -60px;
  z-index          :   9;
  -webkit-animation: spin 2s linear infinite;
  -o-animation     : spin 2s linear infinite;
  animation        : spin 2s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg);   }
  100% { transform: rotate(360deg); }
}

.ui.table.dataTable thead th {
  cursor          : pointer;
  border-left     : 1px solid rgba(34, 36, 38, 0.15);
  background-color: #076CA6!important;
  color           : white!important;
  text-align      : center;
}

.table tbody tr.selected td, td.blue {
  background-color: #D8D8D8!important; 
  font-weight     : bold;
}

table.dataTable tr.group-end td {
  font-weight     : bold;
  background-color: #ddd!important;
}

table.dataTable tr.group-start td, td.orange {
  font-weight     : bold;
  background-color: #FF9933!important;
}

table.delTbl {
  padding: 10px;
  width  : 50%;
}

table.delTbl thead th {
  text-align : center;
  color      : blue!important;
  font-size  : 1em!important;
  font-weight: bold!important;
}

table.delTbl tbody td {
  text-align : center;
  color      :  red!important;
  font-size  :  1em!important;
  font-weight: bold!important;
}

textarea {
  resize: none;
}

.colorBkg {
  background: #F7F6EE!important;
}

.PointBkg {
  background: #ECF0F5!important;
}

.red.label.tabber .warning.icon {
  margin-right: 0!important;
}

.encabezado {
  background-color: #000;
}

.filtroEncabezado {
  width        : 100%;
  margin       : 0 auto;
  padding-top  : 10px;
  padding-left : 10px;
  padding-right: 10px;
}

@media (min-height: 320px) {
  .ui.footer.form-page {
    position: fixed;
    bottom  : 0;
    width   : 100%;
    margin  : 0 0 0 0;
    padding : 0 0 0 0;
  }
}

@media only screen and (max-width: 768px) {
  .fields > .field {
    margin-bottom: 10px!important;
  }
}

.dataTables_paginate .ui.pagination.menu a:hover {
  color       : #0088ce!important;
  font-weight : bolder!important;
  border-color: #FFF!important;
  background  : #DBDBDB!important;
}

#table_listContent tbody tr {
  cursor: pointer;
}

.ui.toggle.checkbox label:before {
  background  : #e4e7ea!important;
  border      : 1px solid;
  border-color: #E9E9EA!important;
}

.ui.toggle.checkbox .box:hover::before,
.ui.toggle.checkbox label:hover::before {
  background: #bdc3c7!important;
  transition: background 1s, opacity 1s;
}

.gridPrinTable {
  background-color: white!important;
}

.itmImg {
  background-color: white!important;
  padding-bottom  : 0px!important;
  padding-top     : 0px!important;
  padding-left    : 0px!important;
  padding-right   : 0px!important;
}

.itmImgPoint {
  background-color: white!important;
  padding         : 17px 65px 0px 65px!important;
}

/* Estilo para el menu superior */
.menuStyle {
  background-color   : #003366!important;
  font-family        : Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  border-color       : #003366!important;
  border-width       : 2px!important;
  border-right-style : none!important;
  border-bottom-style: none!important;
  border-left-style  : none!important;
}

/* Estilo para el extraMenu */
.menuSub {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#d6f9ff+0,9ee8fa+100;Blue+3D */
  background-color   : #C9E7F4!important;
  border-top-style   : none !important;
  border-right-style : none!important;
  border-bottom-style: none!important;
  border-left-style  : none!important;
}

.ui.center.aligned.label {
  margin-right : 0px!important;
  margin-bottom: 0px!important;
}

/* Estilo para los popup */
.ui.popup.bottom {
  background-color: #F7F2E1!important;
  border-color    : #0088ce!important;
  border-width    : 1px!important;
}

.ui.bottom.popup:before {
  background  : #F7F2E1!important;
  border-top  : solid!important;
  border-left : solid!important;
  border-color: #0088ce!important;
  border-width: thin!important;
}

/* Estilo para el título principal */
.letra {
  font-family: "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;
  font-size  : 14pt!important;
  color      : #f0ab00!important;
}

.ui.horizontal.divider:after,
.ui.horizontal.divider:before {
  background-image: url(/assets/images/modules/linea.png);
}

.ui.horizontal.divider.normal:after,
.ui.horizontal.divider.normal:before {
  background-image: url(/assets/images/modules/linea2.png);
}

.iconoP {
  color    : #4d4f53!important;
  font-size: 14pt!important;
}

/* Estilo para las tablas */
table.tblhead thead th {
  background-color: #FAECBF!important;
}

/* Tamano de un icono */
.sizeIcon {
  height: 38px!important;
  width : 30px!important;
}

/* Estilos para los botones del filto */
#submitFilter {
  background-color: #f0ab00!important;
  color: #000!important;
}

#removeFilter {
  background-color: #4d4f53!important;
}

.right.floated {
  float     : right;
  text-align: right;
}

.fondoFiltro {
  background-color: #fff!important;
}

.titulo.title:hover {
  color: #0088ce!important;
}

.titulo.title.active {
  color: #0088ce!important;
}

div.ui.dividing.header.MyCenter.subTitulo {
  color: #4d4f53;
  font-size: 12px;
  font-style: normal;
}

/* Botones */
div.ui.deny.button {
  background-color: #4d4f53!important;
  color: white!important;
}

div.ui.positive.button {
  background-color: #f0ab00!important;
  color: #000!important;
}

div.ui.positive.button.btnGuardar {
  background-color: #0088ce!important;
  color: white!important;
}

.btnPrinc {
  background-color: #f0ab00!important;
  color: #000!important;
}

.btnSec {
  background-color: #4d4f53!important;
  color: white!important;
}

/* Toggle checkbox */
.ui.toggle.checkbox input~.box:after,
.ui.toggle.checkbox input~label:after {
  border: 1px solid!important;
  border-color: #CDCED0!important;
}

.ui.toggle.checkbox .box:hover::before,
.ui.toggle.checkbox label:hover::before {
  background-color: rgba(0, 0, 0, .15);
  border: 1px solid!important;
  border-color: #CDCED0!important;
}

/* Flechas del encabezado de la tabla */
table.dataTable.table thead th.sorting:after,
table.dataTable.table thead td.sorting:after {
  color: rgba(0, 0, 0, .8)!important;
}

/* Boton de ok de los alertify */
button.ajs-button.ui.positive.button {
  border: 1px solid;
  border-color: lightgray;
}

div.ui.secondary.top.attached.menu {
  background-color: white!important;
}

/* Espacio inferrior */
.principal {
  padding-bottom: 0;
}

/* Menu lateral */
.accordLateral {
  background-color: #B0BED9!important;
}

.transparente {
  -webkit-box-shadow: none!important;
  background-color  : rgba(0, 0, 0, 0)!important;
  border            : 0px!important;
  padding           : 0px 10px 0px 10px!important; 
  border-bottom     : none!important;
}

.miniTitulo {
  font-family: "Myriad Pro", Myriad, "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif!important;
  font-size  : 16pt!important;
  color      : #0088ce!important;
  text-align : center;
}

.ui.accordion .title:not(.ui):hover {
  color     : #FFFFFF;
  opacity   : 1;
  background: rgba(255, 255, 255, 0.23);
  color     : #FB6D00!important;
}

.ui.accordion .activo.active.title:not(.ui) {
  color     : #FFFFFF;
  opacity   : 1;
  background: rgba(255, 255, 255, 0.23);
  color     : #FB6D00!important;
}

.ui.accordion .title.subtitle:not(.ui):hover {
  color      : #FFFFFF;
  opacity    : 1;
  background : rgba(255, 255, 255, 0.23);
  color      : #0088ce!important;
  font-weight: bold;
}

.ui.accordion .subtitle.active.title:not(.ui) {
  color      : #FFFFFF;
  opacity    : 1;
  background : rgba(255, 255, 255, 0.23);
  color      : #0088ce!important;
  font-weight: bold;
}

.ui.accordion .title:not(.ui) {
  font-family: Lato, 'Helvetica Neue', Arial, Helvetica, sans-serif;
  font-size  : 12pt;
  color      : #4d4f53!important;
}

.ui.link.list .item,
.ui.link.list .item a:not(.ui),
.ui.link.list a.item {
  color: rgba(0, 0, 0, 0.74)!important;
  -webkit-transition: .1s color ease;
  transition: .1s color ease;
}

.ui.link.list .item a:not(.ui):hover,
.ui.link.list a.item:hover {
  color     : #FFFFFF;
  opacity   : 1;
  background: rgba(255, 255, 255, 0.23);
  color     : #1e70bf!important;
}

.ui.sidebar.menu .item {
  border-radius:   0!important;
  margin-top   : -10px;
  margin-left  : -15px!important;
}

:focus {
  outline: none!important;
}

ul, menu, dir {
  display: block;
  list-style-type: disc;
  -webkit-margin-before:  1em;
  -webkit-margin-after :  1em;
  -webkit-margin-start :  0px;
  -webkit-margin-end   :  0px;
  -webkit-padding-start: 22px;
}

.colorBkg {
  background: #F7F6EE!important;
}

input::-webkit-input-placeholder {
  color: #ccc!important;
  font-weight: 400;
}

input:-moz-placeholder {
  color: #ccc!important;
  font-weight: 400;
}

input::-moz-p {
  color: #ccc!important;
  font-weight: 400;
}

input:-ms-input-placeholder {
  color: #ccc!important;
  font-weight: 400;
}

.Nowrap       { white-space : nowrap;  }
.Bold         { font-weight : bold;    }
.LeftAlign    { text-align  : left;    }
.RighAlign    { text-align  : right;   }
.CntrAlign    { text-align  : center;  }
.txtWhite     {      color  : white;   }
.txtRed       {      color  : red;     }
.txtGreen     {      color  : #008000; }
.BgRed000     { background  : #FF0000; color : white!important;}
.BgBlue000    { background  : #0000FF; }
.BgBlue001    { background  : #4169E1; }
.BgBlue002    { background  : #4AA5FF; }
.BgGray001    { background  : #C0C0C0; }
.BgGray002    { background  : #B1BDCD; }
.BgGray003    { background  : #E7EBF0; }
.BgYellow001  { background  : #FFD700; }
.BgYellow002  { background  : #FFFFB0; }
.BgGreen001   { background  : #008000; }
.BgGreen002   { background  : #09E19B; }
.BgBeige001   { background  : #F1F1D4; }
.BrdrNone     { border-width: 0px; border-style: None;}

.BrdrBttm1pxBS { 
  border-bottom: 1px Black Solid;"
}

.BrdrBttm2pxBS { 
  border-bottom: 2px Black Solid;"
}

.Arial07pt {
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size  : 7pt!important;
}

.Arial08pt {
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size  : 8pt!important;
}

.Arial09pt {
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size  : 9pt!important;
}

.Arial13px {
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size  : 13px!important;
}

.Arial15px {
  font-family: Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size  : 15px!important;
}

.Verdana10px {
  font-family: Verdana!important;
  font-size  : 10px!important;
}

.Verdana12px {
  font-family: Verdana!important;
  font-size  : 12px!important;
}

.Verdana13px {
  font-family: Verdana;
  font-size  : 13px!important;
}

.Verdana14px {
  font-family: Verdana;
  font-size  : 14px!important;
}

.Verdana15px {
  font-family: Verdana;
  font-size  : 15px!important;
}

table.Fixed {
  text-align  : left;
  table-layout: fixed;
  width       : 100%;
}

table.FixedOnly {
  text-align  : left;
  table-layout: fixed;
}

table > td.Nowrap {
  white-space : nowrap;
}

.Container400px {
  overflow: scroll;
  height  : 400px;
  width   : 100%;
}

@media print {
  .impre { display: none }
}

.nav-tabs {
  border-color: #1A3E5E;
  width       : 60%;
}

.nav-tabs > li a {
  background-color: #2F71AB;
  color           : #FFF;
}

.nav-tabs > li.active > a        , .nav-tabs > li.active > a:focus ,
.nav-tabs > li.active > a:active , .nav-tabs > li.active > a:hover {
  background-color    : #D6E6F3 !important;
  color               : #000;
  border-bottom-color : transparent;
}

.nav-tabs > li > a:hover {
  background-color: #D6E6F3 !important;
  border-radius: 5px;
  color: #000;
}

tr.group , tr.group:hover {
  background-color: #ddd !important;
}

#map-canvas {
  margin :   0;
  padding:   0;
  height : 400px;
}

#map-canvas {
  width : 100%;
  height: 400px;
}

#etapa {
  border-radius: 30px;
  border       :  5px solid #73AD21;
  padding      : 10px;
  width        : 20px;
  height       : 20px;
  text-align   : center;
}

#etapacompleta {
  border-radius   : 30px;
  border          : 5px solid #73AD21;
  padding         : 10px;
  width           : 20px;
  height          : 20px;
  text-align      : center;
  background-color: #73AD21;
  color           : white;
}

#etapaactiva {
  border-radius: 30px;
  border       :  5px solid #73AD21;
  padding      : 20px;
  width        : 20px;
  height       : 20px;
  text-align   : center;
}

.select2-container--default .select2-selection--single , 
.select2-selection .select2-selection--single {
  border-radius: 0 5px 5px 0;
  border-color : #1C2833;
  width        : 100%;
}

.select2-container--default .select2-selection--multiple {
  border-radius: 0 5px 5px 0;
  border-color : #1C2833;
}

.input-group .input-group-addon {
  border-radius   : 5px 0 0 5px;
  border-color    : #1C2833;
  background-color: #FFF;
}

.input-group .input-group-addon {
  border-radius   : 5px 0 0 5px;
  border-color    : #003366;
  background-color: #003366;
  color           : white;
}

/*
input[type="input"] {
  border-radius   : 0 5px 5px 0;
  border-color    : #003366;
  background-color: #FFFFFF;
}
*/

.PointBorderBlue {
  border-radius   : 0 5px 5px 0!important;
  border-color    : #003366!important;
  /*background-color: #FFFFFF!important;*/
}

.modal-dialog {
  width : 90%;
  margin: 22px auto;
}

.modal-body {
  height    : 350px;
  overflow-y: auto;
}

#exTab1 .tab-content {
  background-color: #FFFFFF;
  padding         : 5px 15px;
}

.badge {
  position: absolute;
  top     : 1px;
  right   : 1px;
  background-color: red;
}