:root {    
  --module-color: #007bff;
}


:required {
  /**
	border-color: #9FDFA6;
  **/
  /** background-color: #ffffe6 **/
  border-bottom: 1px solid #6666cc;
}


div.form:not(.readonly) .select2-container.required {
  /** border-bottom: 1px solid #6666cc; **/
}

body:not(.popup) .content {
	margin: 20px;
	padding: 0px;
}

.nav-tabs-vertical > ul {
   vertical-align: top;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

/* esconde todos los elementos que no sean label dentro del model row */
/**
.model-row > div > div > *:not(label),
.model-row .subform-delete {
    display: none;
}

.model-row .form-group {
    margin: 0;
}

div:not(.model-row).subform-row .form-group {
    margin-bottom: 5px;
}
**/

/* esconde todos los labels que no sean los del model row */
/**
div:not(.model-row).subform-row > div > div > label {
    display: none;
}
**/

/* esconde model-row */
.model-row {
   display: none;
}

div.subform-row {
  position: relative;
  /** margin-bottom: 25px; **/
  margin-bottom: 2px;
}

/* esconde los labels que no sean del first-row */
.subform-table.onlyfirstlabels div.subform-row:not(.first-row) label {
  display: none;
}

.subform-table.onlyfirstlabels div.subform-row:not(.first-row) input {
  padding-top: 10px;
}

.subform-table.onlyfirstlabels div.subform-row:not(.first-row) .select2-selection {
  /** padding: 15px 8px 15px 0px !important; **/
  padding: 7px 8px 15px 0px !important;
}

.form-readonly.readonly .subform-table.onlyfirstlabels div.subform-row:not(.first-row) .select2 {
  /**
  padding: 0 !important;
  **/
}

.form-readonly.readonly .subform-table.onlyfirstlabels div.subform-row:not(.first-row) input {
  /**
   margin-top: 0 !important;
   **/
}


.form.readonly .btn-save {
  display: none;
}

.form.readonly .stepy-finish {
  display: none;
}


/** salvo en modo celular **/
@media (max-width: 576px) {
  div.subform-row:not(.first-row) label {
    display: block;
  }

  .bootbox.modal .bootbox-close-button {
    right: 0 !important;
    top: -5px !important;
  }

  .bootbox.modal .modal-dialog {
    margin: 0 !important;
    width: 100vw !important;
  } 

  .bootbox.modal .modal-content {
    min-height: 100vh !important;
  }
  #pagecontainer {
    margin-bottom: 50px;
  }

}

/* espacio entre filas */
div.subform-row .form-group {
    margin-bottom: 5px;
}

/* ubica tacho de basura */
.subform-delete {
  /**
  position: absolute;
  right: -20px;
  bottom: 10px;
  **/
  padding: 0px;
  float: left;
  clear: none;
  color: #bbb;
  margin-top: 11px;
  cursor: pointer;
  position: absolute;
    right: 10px;
    top: 2px;
}

.subform-delete:hover {
  color: #000;
}

.subform-delete i {
  font-size: 14px;
}

.subform-table div.row.first-row .subform-delete {
   margin-top: 38px;
}

fieldset.subform-table.title-icon-only div.row.first-row .subform-delete {
    margin-top: 11px; 
}


.subform-table div.row.first-row button {
  margin-top: 26px;
}

.subform-table div.row button {
  float: left;
}

.subform-table div.row div.input-group {
  padding: 0 0 !important;
}

.no-add .subform-add > a {
  display: none !important;
}


@media (max-width: 768px) {
  .subform-table div.row.first-row .subform-delete {
     margin-top: 4px;
  }

  .tabbable > ul:not(.show-all-tabs) > li:not(.active){
      display:none;
  }
  .tabbable > ul {
      margin-bottom: 0;        
  }
  .tabbable > ul:before {
      display:none;    
  }
  /**
  .tabbable > ul.show-all-tabs { 
    position: absolute;
    z-index: 100000;
  }
  **/
  .tabbable > ul > li {
    clear: both;
  }


  .hide-mobile {
    display: none;
  }



}

/** delte modo celular boton formal **/
@media (max-width: 576px) {
  .subform-table .subform-delete {
    width: calc(100% - 10px);
    border: 1px solid rgb(221,221,221);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 7px 12px;
    margin: 1px 5px 10px 15px;
    text-align: center;
    /** background-color: rgb(33,150,243); **/
    background-color: #FF5722;
    color: #fff;
    opacity: 0.5;
    position:  relative; /** @new 10-2022 **/
  }

  .subform-table .subform-delete:after {
    content: "Eliminar";
  }


  .subform-add {
    width: calc(100% );
    border: 1px solid rgb(221,221,221);
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 7px 12px;
    margin: 1px 0px 10px 0px !important ;
    text-align: center;
    
    opacity: 0.7;
  }
  .subform-add a {
    color: #fff !important;

    background-color: rgb(33,150,243);
  }
  fieldset {
      margin-bottom: 20px;
  }
  .subform-row:not(.first-row) {
      border-top: 1px solid #eee;
      margin-top: 10px;
      padding-top: 5px;
  }

}

/** color agregar fila **/
div.row.subform-add a {
    color: #bbb;
    margin-bottom: 10px;
}

div.row.subform-add a:hover {
    color: #333;
}

table.sinlineas td {
    padding: 2px 20px 8px 0px !important;
}

table.sinlineas th {
  border-bottom: none !important;
  padding: 0 20px 8px 0px  !important;
}

table.sinlineas {
    /** margin-top: -20px; **/
    margin: 0 10px;
}

table.sinlineas td {
    border-top: 0px !important;
}

table.sinlineas th:first-child {
    padding-left: 0px;
}

table.sinlineas td:first-child {
    padding-left: 0px;
}



.panel-heading .heading-elements .btn-group button {
	padding: 3px 6px;
}

button {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;   
}

.fbrange {
  margin-bottom: 50px;
}


.only-print {
  display: none;
}


.form .panel-body .row:first-child > fieldset legend {
   border-top: none !important;
}

fieldset legend {
  font-size: medium;
    border-bottom: none;
    /** border-top: 1px solid #eee; **/
    /** border-top: 1px solid #cdcdcd; **/
    font-size: 26px;
    padding-bottom: 2px !important;
    margin-bottom: 10px !important;
    /** padding-top: 15px !important; **/

    margin: 0 -15px 0 -15px;
    width: calc(100% + 30px);
    padding: 9px 15px 2px 15px;    


    font-size: 21px;
    font-weight: 400 !important;
    /* text-decoration: underline; */
    text-underline-position: under;
    /* text-decoration-line: underline; */
    /* text-underline-position: left; */
    opacity: 0.8;


}



/**
fieldset {
  position: relative;
}

fieldset::before {
  content: '';
  position: absolute;
  top: -30px;
  right: -30px;
  bottom: -30px;
  left: -30px;
  border: 5px solid #ccc;

}
**/

@media print {
	
	/* IMPRESION */
fieldset legend {
  font-size: normal;
}

	
	/* no muestra ningun boton */
	.btn {
		display: none;
	}

  button {
    display: none; 
  }

  .tooltip {
   display: none !important; 
  }
	
  .pagecount {
    padding-right: 20px;
  }

	/* no muestra las pestañas de un tab, siempre y cuando en fbuilder se le defina id = tab */
	#tab_tab {
        display: none;
    }
	
	/* no muestra menu de navegacion de la izquierda */
    #navbar-mobile {
        display: none;
    }

    .range {
      display: none;
    }

  .fbrange {
    margin-bottom: 0;
  }

  .hidden-print {
    display: none !important;
  }
  
  iframe[title='chat widget'] {
    display: none;
  }


  .only-print {
    display: block !important;
  }

  /** no muestra cosas del datatable **/
  .dataTables_info { display: none; }
  .dataTables_paginate { display: none; }
  .dataTables_filter { display: none; }
  .dt-buttons { display: none; }
  .dataTables_paginate { display: none; }
  .dataTables_length { display: none; }

  #fbuilderlog { display: none; }
  #fbuilderdesign { display: none; }
  .datatable-colvis-state th:before { content: "" !important; }  
  .datatable-colvis-state th:after { content: "" !important; }
  .panel { border: none; }
  .panel-body { padding: 0 0; }
  .panel-heading { border: none; }
  .panel-title { font-size: 18px !important; }
  body { font-size: 9px; }

  .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
      padding: 5px 20px;
      padding-top: 5px;
      padding-right: 20px;
      padding-bottom: 5px;
      padding-left: 20px;
  }

  .form > .panel-body {
    overflow: hidden !important;
  }

}



/** hace las fonts fa mas grandes **/
i.fa {
    font-size: 1.4em;
    bottom: -0.09em;
    position: relative;
    padding-left: 0.05em;
}

.media-2-column:nth-child(1) {
	margin-top: 20px;
}

.media-3-column:nth-child(1) {
  margin-top: 20px;
}

.media-4-column:nth-child(1) {
  margin-top: 20px;
}


.max-2-lines {
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2; /* number of lines to show */
   line-height: 1.5;        /* fallback */
   max-height: 3;       /* fallback */
}

/** En solapas verticales no dejar espacio entre solapa y pagina **/
@media (min-width: 769px) {
  .nav-tabs-left > .tab-content {
    padding-left: 0;
  }
}

/** botones primary en celular se hagan a todo el ancho y los que esten en header se esconde el texto **/
@media (max-width: 576px) {
  div:not(.heading-elements) button.btn.btn-primary {
    width: 100%;
  }
  .heading-elements button span,
  .pull-right button span,
  button.pull-right button span {
      display: none;
  }
}

@media (max-width: 768px) {
  .heading-elements:not(.not-collapsible) {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    height: 36px;
    margin-top: -18px;
  }
}


/** que no se peguen entre contenido de solapa y solapa abierta **/
.tab-pane {
  clear: both;
}

/** STYLES PARA CALENDARIO **/
#navpriorth, #navnextth {
  background-color: #638cef;
  color: #FFF;
  cursor: pointer;
  width: 15%;
}

.cal {
  border-collapse: collapse;
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 12px;
  border: 1px solid #CCC;
  width: 100%;
}

.cal th {
  height: 20px;
  /** background-color: #CCC; **/
  background-color: #efefef;
  padding:0px;
  border: 0px;
  font-weight:normal;
}
.cal td {
  align: center;
  cursor: pointer;
  border: 1px solid #ccc;
}
.monthly td {
  height: 100px;
  width: 14.3%;
  vertical-align: top;
  padding: 4px;
}
.weekly td {
  height: 40px;
  width: 11.4%;
  vertical-align: middle;
}
.hour {
  width: 20% !important;
  text-align:center;
}
.today {
  background-color: #ffcccc;
}
.unable {
  background-color: #dedede;
  cursor: default !important;
}
.event {
  font-size: 10px;
  text-align: center;

  text-align: center;
  padding: 2px 1px;
  margin: 0px 0px;
}

.cal.monthly .event  {
  text-align: left;
}

.event p {
  display: inline;
  padding: 2px 6px;
}

.callist {
  clear: both;
  padding: 5px;
  font-size: 13px;
}
.calday {
  float: left;
  clear: both;
  font-size: 12 px;
  font-weight: bold;
}
.callist .event {
  float: left;
  font-size: 12px;
}
.callist .event {
  clear: both;
}
.callist .event p {
  float: left;
  clear: none;
}


.cal .saldo-disp {
  color: #ccc;
  font-size: 10px;
}

.cal .saldo-disp.algo-res {
  color: #666;
}

.cal .saldo-disp b {
  font-size: 14px;
}


/*** FIN STYLES PARA CALENDARIO **/



/*** HOVER EN FILAS CLIQUEABLES **/
tr.clickable-row:hover {
    background-color: #dedede;
}

.panel-footer {
	padding: 15px 20px;
}

#closepopup {
  position: absolute;
  top: -7px;
  right: -10px;
  cursor: pointer;
  color: #fff;
  font-size: 18px;  
  background-color: #333;
}
  
/** gallery hover en archivos **/
ul.mail-attachments > li:hover {
  background: #ddd;
  cursor: pointer;
}


/** bootbox popups by rmc **/
div.popup div.modal-body {
  padding: 0px;
}

body.popup div.content {
  padding: 0;
  margin: 0;
}

.popup .page-container {
    padding: 0px;
}

.hide-th th {
  display: none !important;
}

.icons-light i {
  color: #888;
  font-size: 12px;
  margin: 0px 2px;
}



/** subforms table **/
/*
.subform-table div.row:nth-child(n+3) label {
   display: none;
}

.subform-table div.row:nth-child(3) .form-group {
   margin-top: -17px;
}

.subform-table div.row:nth-child(n+3) .form-group {
   margin-bottom: 3px;
}

.subform-table div.row:last-child .form-group {
   margin-bottom: 3px;
}
*/

/** deshabilitado 2/1/2021
.form-group > div {
    padding: 27px 12px 0 0;
}
**/

.form-group {
    overflow: hidden;
}

.form-group > div.radio {
    padding: 2px 12px 0 0;
}

.form-group > div.checkbox {
    padding: 2px 12px 0 0;
}


.subform-table .form-group > div {
    padding: 25px 12px 0 0;
}


.subform-add {
  padding-left: 10px;
  margin-bottom: 20px;
  margin-top: 3px;
}



/** agregado 22/3/21 comentado 06/3/22 **/
div.form-group > div {
    /**
    padding-top: 28px;
    padding-left: 12px;
    **/

} 
/** **/

.note-popover .popover-content > .note-btn-group, .note-toolbar > .note-btn-group {
    margin-top: 10px;
    margin-right: 10px;
}

.note-editor .note-toolbar {
        padding: 0px 10px 10px 10px;
}



.radiobuttons a.active,
.radiobuttons a.active:hover
 {
	background-color: #2196F3 !important;
	color: #fff !important;

}



legend > span {
  margin-top: -13px;
}


/**
fieldset {
  margin-top: 10px;
}

fieldset:nth-child(1) {
  margin-top: 0px !important;
}
**/

/** Fieldsets con fondo gris **/
.grey-legends .panel-body.withfieldsets {
    padding: 0px;
}

.grey-legends .panel-body.withfieldsets fieldset legend {
  background-color: #e9e9e9;
  padding: 15px 20px;
  padding-top: 15px;
  margin-bottom: 0px;
}

.grey-legends .panel-body.withfieldsets fieldset > div {
    padding: 20px;
}


/** GALLLERY Attachments **/
.mail-attachments-preview > img {
  height: 38px;
}

.mail-attachments .mail-attachments-content {
  float: left;
  margin-left: 14px;
}

.form-group.mail-attachments {
    margin-bottom: 20px;
}


td.editable {
  /** border: 2px dotted #888 !important; **/
  /** background-color: #ebebea;**/
}

.pagebreak { page-break-after: always; } /* page-break-after works, as well */

.page-break::after {
   content: "- salto de página -";   
   background-color: yellow;
   text-align: center;
}
.page-break {
  text-align: center;
  width: 100%;
  margin: 30px 10px;
}


@media print {
    tr.pagebreak  { display: block; page-break-before: always; }

    .page-break::after {
       content: "";   
       background-color: transparent;
       text-align: left;
    }
    .page-break {
      text-align: center;
      width: auto;
      margin: auto;
    }

}   


.top-right {
  position: absolute;
  top: 10px;
  right: 10px;
}

.attchanged {
    color: red;
}

/** panel en popups **/
body.popup .panel {
  margin-bottom: 0px;
}
/**
body.popup .panel-body {
  padding-bottom: 0;
}
**/
body.popup .panel-footer {
  padding-top: 0;
  border-top: 0;
}




/* Required fields */
/**
input:required, textarea:required, .required {  
  border-color: yellow !important;
}
**/


body.popup {
  overflow-x: hidden;;  
}

.radio, .checkbox {
  margin-top: 0px;
  /**
  margin-top: 7px;
  margin-left: 5px;
  **/

  margin-bottom: 15px;

}

div.radio.checked label  {
    background-color: #dedede;
}

.checkbox label {
    margin-left: 5px;
}

.modal-full > .modal-dialog {
    width:95% !important;
}

.modal-full > .modal-dialog > .modal-content {
      min-height: calc(100vh - 76px);
}



.panel-heading .choice span {
  border: 2px solid #fff;
}

.radio label, .checkbox label {
  /** padding-left: 18px; **/
  margin-left: 15px; 
  padding-left: 6px;
  padding-right: 6px;
  margin-top: -2px;
}

.panel-default > .panel-heading {
  margin: 0px;
}


/** panel as section **/
.as-section.panel {
  border: none; 
}

.as-section .panel-heading {
  padding: 5px;
}

.as-section .panel-body {
  padding: 5px;
}

.newline {
  clear: both;
}

.select2-dropdown {
    min-width: 130px !important;
}


.select2-results__option.select2-results__message {
  display: none;
}


.select2.select2-container--focus {
  border-bottom: 1px solid red;
}

fieldset.subform-table legend {
  position: relative;
}

fieldset:not(.subform-table) {
    margin-bottom: 15px;
}

.messageonnorows {
    text-align: center;
    color: #999;
    margin-top: -5px;
}

.subform-add.add-at-top {
    position: absolute;
    bottom: -2px;
    right: 5px;
}

.relative {
  position: relative;
}


.form-table tfoot td {
  font-weight: bold;
}

.form-readonly:not(.readonly) .btn-edit-form {
  display: none;
}

.btn-edit-form {
  /** position: absolute; 
    top: 72px;
    right: 19px;
    **/
  z-index: 100;
    background-color: #c0c0dd;
    min-height: 36px;    
}
/** readonly mode form **/

.form-readonly.readonly input {
  background-color: transparent !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;
  cursor: not-allowed;
  pointer-events:none;
  padding-top: 38px;
  /**
  padding: 0 0 14px 0;
  padding: 8px 12px;
  color: #444;

  background-color: transparent !important;
  padding: 8px 1px;
  **/ 

  border: none;  
  font-weight: bold;
}

.form-readonly.readonly textarea {
  background-color: #f2f2f2 !important;
  border: none;

  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;
  color: #444;
  /**
  padding: 0px 0px;
  **/

  background-color: transparent !important;
  
  border: none;  
}

/** border: 1px solid #eeeeee; **/
  /** cursor: not-allowed; **/
  /** pointer-events:none; **/
  /** overflow: hidden; **/
  /**
  font-weight: 450;
  **/


.form-readonly.readonly .select2-selection__arrow {
  display: none !important;
}

.form-readonly.readonly .select2-selection__rendered {
  /** padding: 0 0; **/
}

.form-readonly.readonly .select2-selection {
    padding-top: 30px !important;
  /**
   padding: 0px 1px 14px 1px;
   **/
}

.form-readonly.readonly .form-group > div {
  /**
    padding: 18px 12px 0 0;
    **/
}


.form-readonly.readonly .subform-table .form-group > div {
  /**
  padding: 18px 1px 8px 1px;
  **/
}

.form-readonly.readonly input[data-href] {
  cursor: pointer;
}

.form-readonly.readonly .select2-selection {
  
  background-color: #f2f2f2 !important;
  border: none;
  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;

  /**
  padding: 8px 12px;
  **/

  background-color: transparent !important;
  /**
  padding: 8px 1px;
  **/
  border: none;  
  font-weight: 450;
}

.form-readonly.readonly .select2 {
  cursor: not-allowed;
  pointer-events:none;
  /**
  padding: 1px 0;
  **/

}


.combo.read-only .select2-selection__arrow {
  display: none !important;
}

.combo.read-only .select2-selection__rendered {
  padding: 0 0;
}

.combo.read-only .select2-selection {
   padding: 0px 1px 14px 1px;
}

.combo.read-only .form-group > div {
    padding: 18px 12px 0 0;
}


.combo.read-only .select2-selection {
  
  background-color: #f2f2f2 !important;
  border: none;
  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;

  padding: 8px 12px;

  background-color: transparent !important;
  padding: 8px 1px;
  border: none;  
  font-weight: 450;
}

.combo.read-only .select2 {
  cursor: not-allowed;
  pointer-events:none;
  padding: 10px 0; 

}


.combo.readonly .select2-selection__arrow {
  display: none !important;
}

.combo.readonly .select2-selection__rendered {
  /**
  padding: 0 0;
  **/
}

.combo.readonly .select2-selection__rendered[title='- Seleccionar -'] {
  display: none;
}

.combo.readonly .select2-selection {
  /**
   padding: 0px 1px 14px 1px;
   **/
}

.combo.readonly .form-group > div {
    /**
    padding: 18px 12px 0 0;
    **/
}


.combo.readonly .select2-selection {
  
  background-color: #f2f2f2 !important;
  border: none;
  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;

  /**
  padding: 8px 12px;
  **/

  background-color: transparent !important;
  /**
  padding: 8px 1px;
  **/
  border: none;  
  font-weight: 450;
}

.combo.readonly .select2 {
  cursor: not-allowed;
  pointer-events:none;
  /**
  padding: 4px 0;
  **/

}

.subform-table.onlyfirstlabels div.subform-row:not(.first-row) .combo.readonly .select2-selection {
    /**
    padding: 3px 8px 3px 0px !important;
    **/
}

.subform-table.onlyfirstlabels div.subform-row:not(.first-row) .combo.readonly .select2-selection--single {
  /**
    height: 16px !important;
    **/
}



button.focusable:focus {
  border: 2px solid red;
}

.input.readonly input {
  /** background-color: transparent !important; **/
  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;
  cursor: not-allowed;
  pointer-events:none;
  /** padding: 0 0 14px 0; **/
  /** padding: 15px 0px 15px 11px; **/

  color: #444;

  background-color: transparent !important;
  /**  padding: 8px 1px; **/
  border: none;  
  /** font-weight: bold; **/
}

.input.readonly textarea {
  /** background-color: transparent !important; **/
  background-color: #f2f2f2 !important;
  border: none;

  background-color: #f2f2f2 !important;
  border: none;
  border: 1px solid #e0e0e0;
  border: 1px solid #e9e9e9;

  /** border: 1px solid #eeeeee; **/
  /** cursor: not-allowed; **/
  /** pointer-events:none; **/
  color: #444;
  /** overflow: hidden; **/

  /**
  padding: 8px 12px;
  **/

  background-color: transparent !important;
  /**
  padding: 8px 1px;
  **/
  border: none;  
  /**
  font-weight: 450;
  **/
}



.form-readonly.readonly .subform-delete {
  display: none;
}

.form-readonly.readonly .subform-add a {
  display: none;
}

.form-readonly.readonly .panel-footer {
  display: none;
}

.form-readonly.readonly .form-group {
    /**text-align: right; **/
}

.form-readonly:not(.readonly) .onlyreadonly {
  display: none;
}

.form-readonly.readonly .notreadonly {
  display: none;
}

.form-readonly.readonly .text-right-onreadonly {
  text-align: right;
}

.form-readonly .text-right-onreadonly > div {
    /** padding: 8px 0; **/
    /**
    padding: 25px 10px 0 0;
    **/
    text-align: right;
}

.input-readonly-text {
    /** padding: 8px 0; **/
    /**
        padding: 26px 10px 0 12px;
        **/
}


.form-readonly.readonly input::-webkit-input-placeholder { /* WebKit browsers */
  color: #dddddd;
}
.form-readonly.readonly input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: #dddddd; /** transparent; **/
}
.form-readonly.readonly input::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #dddddd; /** transparent; **/
}
.form-readonly.readonly input:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: #dddddd; /** transparent; **/
}

.form-readonly.readonly textarea::-webkit-input-placeholder { /* WebKit browsers */
  color: #dddddd; /** transparent; **/
}
.form-readonly.readonly textarea:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
  color: #dddddd; /** transparent; **/
}
.form-readonly.readonly textarea::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: #dddddd; /** transparent; **/
}
.form-readonly.readonly textarea:-ms-input-placeholder { /* Internet Explorer 10+ */
  color: #dddddd; /** transparent; **/
}

.form-readonly.readonly .dz-clickable {
  display: none;  
}

.form-readonly.readonly .dz-remove {
  display: none !important; 
}

.form-readonly.readonly .dz-size {
  display: none !important; 
}

.form-readonly.readonly .dz-preview {
  border: none !important;
}


.form-readonly.readonly .select2-selection__placeholder {
  display: none;
}

.form-readonly.readonly .select2-selection__clear {
  display: none;
}

.form-readonly.readonly .select2-selection__rendered {
    font-weight: 400;
}

.form-readonly.readonly .select2-selection.validate-has-error {
    border: 1px dotted red;
}

.form-readonly.readonly input {
    font-weight: 400;
}

.form-readonly.readonly label {
    color: #999;
}

.form-readonly.readonly .input-group-addon {
    border: none;
}

.form-readonly.readonly .subform-table .subform-row:nth-child(2) {  
  /** border-top: 1px dashed #ddd; **/
}

.form-readonly.readonly .subform-table .subform-row.first-row {
  overflow: hidden;
}

.form-readonly.readonly .subform-table .subform-row.first-row::before {  
  content: "__________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________________";
  color: #bbb;
  top: 11px;
  position: absolute;
}

.form-readonly.readonly .subform-table .subform-row:not(:last-child):not(:nth-last-child(2)) {
      border-bottom: 1px solid #eee;	
}

.form-readonly.readonly .subform-row.first-row {
	/** border-top: 1px solid #bbb;		 **/
}

.form-readonly.readonly .subform-table .subform-row:nth-last-of-type(2) {
      /** border-bottom: none; **/
}

.form-readonly.readonly .note-toolbar.panel-heading {
  display: none;
}

.form-readonly.readonly .note-editor .note-editable[contenteditable="false"] {
  background-color: #ffffff;
}

.form-readonly.readonly .note-editor.note-frame {
  border: none;
}


.datatable-header {
    padding-top: 0;
}

.dataTables_length, .dataTables_filter, .dt-buttons {
    margin-bottom: 10px;
}

.dataTables_filter {
    margin-left: 5px;
    /**
    width: calc(100% - 440px);
    **/
}

.template {
    display: none;
}

.file-preview  {
  overflow: hidden;
}

.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
    color: #000; 
    font-size: 14px;
}

@-webkit-keyframes spin2 {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}

@keyframes spin {
    from { transform: scale(1) rotate(0deg);}
    to { transform: scale(1) rotate(360deg);}
}

.dropzone {
   width: 100%; 
   border: 1px solid grey; 
   max-height: 120px; 
   overflow: auto;

}

.dropzone .dz-preview .dz-details {
   width: 100%;
}

.dropzone .dz-filename input {
  width: 100px;
  border: 1px solid #ddd;
}

td.container3d {
  vertical-align: middle !important;
  /**width: 140%; **/
}

/** 3d flip **/
.container3d {
  position: relative;
  cursor: pointer;

}

.wrapper3d {
  margin-top: -10px;
  margin-left: -20px;
  width: 100%; /** calc(100% - 40px); **/
  height: calc(100% - 24px);
  position: absolute;
 -webkit-perspective: 800px;
         -moz-perspective: 800px;
           -o-perspective: 800px;
              perspective: 800px;
}

.wrapper3d figure {
  /**
  margin: 0;
  display: block;
  height: 100%;
  width: 100%;
  text-align: center;
  font-weight: bold;
  position: absolute;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  backface-visibility: hidden;  
  **/
  display: block;
  /** position: absolute; **/
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition-duration: 400ms;
  transition-duration: 400ms;
    z-index:10;
}

.wrapper3d .front3d {
  /** background: red; **/
  text-align: center;
  opacity: 1;
  /** font-size: 8px; **/
  padding-left: 26px;
  /** margin-top: -6px !important; **/

  /** padding-top: 15px; **/
}

.wrapper3d .back3d {
  text-align: left;
  z-index:0;
  padding-left: 10% !important;
  /** margin-top: -5px !important;   **/
  
}

tbody .wrapper3d .back3d {
  /** margin-top: -48px !important; **/  
}
tbody .wrapper3d .front3d {
  display: none;
}
thead .wrapper3d .back3d {
  /** margin-top: -37px !important; **/
  margin-top: 3px;
}
thead .wrapper3d .front3d {
  display: none;
}


.wrapper3d .back3d.rotateleft {
    /** background: blue; **/
  -webkit-transform: rotateY( 180deg );
         -moz-transform: rotateY( 180deg );
           -o-transform: rotateY( 180deg );
              transform: rotateY( 180deg );
}

.wrapper3d .back3d.rotateright {
    /** background: blue; **/
  -webkit-transform: rotateY( -180deg );
         -moz-transform: rotateY( -180deg );
           -o-transform: rotateY( -180deg );
              transform: rotateY( -180deg );
}


.wrapper3d .back3d.rotateup {
  /** background: blue; **/
  -webkit-transform: rotateX( -180deg );
         -moz-transform: rotateX( -180deg );
           -o-transform: rotateX( -180deg );
              transform: rotateX( -180deg );
}

.wrapper3d .back3d.rotatedown {
  /** background: blue; **/
  -webkit-transform: rotateX( 180deg );
         -moz-transform: rotateX( 180deg );
           -o-transform: rotateX( 180deg );
              transform: rotateX( 180deg );
}


/**
.wrapper3d.flipped {
  -webkit-transform: rotateY( 180deg ); 
  -moz-transform: rotateY( 180deg );
  -o-transform: rotateY( 180deg );
  transform: rotateY( 180deg );
}
**/

.wrapper3d.flipped .front3d.rotateleft {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  z-index:0;
}

.wrapper3d.flipped .front3d.rotateright {
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  z-index:0;
}


.wrapper3d.flipped .front3d.rotateup {
  -webkit-transform: rotateX(-180deg);
  transform: rotateX(-180deg);
  z-index:0;
}

.wrapper3d.flipped .front3d.rotatedown {
  -webkit-transform: rotateX(180deg);
  transform: rotateX(180deg);
  z-index:0;
}


.wrapper3d.flipped .back3d.rotateleft {
  -webkit-transform: rotateY(360deg);
  transform: rotateY(360deg);
  z-index:10;
}

.wrapper3d.flipped .back3d.rotateright {
  -webkit-transform: rotateY(-360deg);
  transform: rotateY(-360deg);
  z-index:10;
}

.wrapper3d.flipped .back3d.rotateup {
  -webkit-transform: rotateX(-360deg);
  transform: rotateX(-360deg);
  z-index:10;
}

.wrapper3d.flipped .back3d.rotatedown {
  -webkit-transform: rotateX(360deg);
  transform: rotateX(360deg);
  z-index:10;
}


.column-filter {
    width: 95%;
    border: 1px solid #ddd;
    border-radius: 3px;
    background-color: #fff;
    color: #333;
    outline: 0;
    line-height: 1.5384616;
    padding: 7px 12px;    
}

.wrapper-filter {
    padding: 0 8px 12px 8px !important;
}

.wrapper-filter.with-clear-icon {
    padding-right: 36px;

}


/** row check cells **/
td.checkcell, th.checkcell {
  position: relative;
    padding-left: 45px !important;
}

td.checkcell > i, th.checkcell > i {
  float: left;
    position: absolute;
    left: 15px;
    top: calc(50% - 9px);
}

/** -- */




.advancedsearch {
  float: left;
  padding: 8px 10px;
}

.dataTables_info {
  float: right;
}

.nopadding {
  padding: 0;
}

.nopadding .panel-body {
  padding: 0;
}


.read-more-top { 
      position: absolute; 
      top: 0; left: 0; bottom: auto;
      width: 100%; 
      text-align: center; 
      margin: 0; 
      padding: 30px 0 20px 0; 
      
      /* "transparent" only works here because == rgba(0,0,0,0) */ 
      background-image: -moz-linear-gradient(top, transparent, white);
        background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, transparent),color-stop(1, white));
}

.read-more { 
      position: absolute; 
      bottom: 0; left: 0;
      width: 100%; 
      text-align: center; 
      margin: 0; 
      padding: 30px 0 20px 0; 
      
      /* "transparent" only works here because == rgba(0,0,0,0) */ 
      background-image: -moz-linear-gradient(top, transparent, white);
        background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, transparent),color-stop(1, white));
}

.editable-gallery {
    padding: 20px;
    box-sizing: border-box;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 3px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.dropzone {
    border: none;
    min-height: 40px;
    display: table !important;
    padding-top: 0;
}

.dropzone .dz-default.dz-message {
   height: auto;
}


.dropzone .dz-default.dz-message:before {
    content: '';
}

.dropzone .dz-image img {
    height: 100px;
    cursor: pointer;
}

.dropzone .dz-default.dz-message {
  margin-top: 0;
}

.dropzone .dz-filename {
  height: 19px;
  width:  100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; 
}

.dropzone a.dz-remove {

    position: absolute;
    top: -30px;
    right:  5px;

}

.select2-new {
    text-align: center;
    padding: 8px 5px;
    cursor: pointer;
    opacity: 0.5;
}

.select2-new i {
  cursor: pointer;
  opacity: 0.4;
}


.select2-config {
    text-align: center;
    padding: 8px 5px;
    cursor: pointer;
    opacity: 0.5;
}

.select2-config i {
  cursor: pointer;
  opacity: 0.4;
}



.note-toolbar .dropdown-menu li a i {
  display: block;
}

.note-toolbar button {
  
  height: 30px;
}


.dropdown-menu {
   z-index: 10000;
}

.textarea-insertar-button {
    width: 45px; 
    padding: 6px 3px;
    /** width: 100px; 
    text-align: left; **/
}

.textarea-insertar-dropdown {
    width: 200px;
}

.note-btn-group.btn-group.note-insertsm {
  display: none;
}

@media (max-width: 1024px) {
  .note-btn-group.btn-group.note-insertsm {
    display: inline-block;
  }

  .note-btn-group.btn-group.note-insert {
    display: none;
  }


  .circuit-connect {
    display: none !important;
  }

}



.form-group.note-group-select-from-files {
    float: left;
    text-align: center;
    padding: 12px 12px 12px 12px;
    width: 48%;
    height: 180px;
    border: 1px solid #ccc;
    margin: 5px 5px !important;
    
    

}

.form-group.note-group-select-from-files i {
  font-size: 70px;
  color: #2d7ff9;
}

.form-group.note-group-select-from-files label {
  cursor: pointer;
} 

.form-group.note-group-select-from-files input {
  cursor: pointer;
}

.form-group.note-group-image-url {
    float: right;
    padding: 12px 12px 0 12px;
    width: 48%;
    text-align: center;
    height: 180px;
    border: 1px solid #ccc;
    margin: 5px 5px !important;
}

.form-group.note-group-image-url i {
  font-size: 70px;
  color: #2d7ff9;
}


.media[data-href]:hover {
  background-color: #dde;
}

.delete {
  position: absolute;
  right: 10px;
  top: 60px;
}

.confirm .modal-header {
  background-color: #E99889;
  padding-bottom: 15px;
}

.confirm .modal-header .close {
  top: 37%;
}

.pointer {
   cursor: pointer;
}



@keyframes rotation {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}

@-webkit-keyframes rotation {
  0% {
    -webkit-transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@-moz-keyframes rotation {
  0% {
    -moz-transform: rotate(0);
  }
  100% {
    -moz-transform: rotate(360deg);
  }
}

.fa-spinner{
  font-size: 5em;
  margin-right: 1em;


  animation: rotation 2s infinite linear;
  -webkit-animation: rotation 2s infinite linear;
  -moz-animation: rotation 2s infinite linear;
}    

table tr.selected td {
    background-color: NavajoWhite !important  ;
}

.tooltip {
  z-index: 1900898 !important;
}

div[data-type="button"] span.select2 {
    display: none;
}

.noscrollbars {
  overflow: hidden !important;  
}



#viewfile-left {
  position: absolute;
  top: 100px;
  bottom: 100px;
  left: 10px;
  width: 50px;
  /** background-color: #ccc; **/
  z-index: 93848;
  cursor: pointer;
}

#viewfile-left i {
  margin: 40vh 0 0 10px;
  font-size: 24px;
  color: #fff;
  opacity: 0.8;
}

#viewfile-right {
  position: absolute;
  top: 100px;
  bottom: 100px;
  right: 10px;
  width: 50px;
  /** background-color: #ccc; **/
  z-index: 93848;
  cursor: pointer;
}

#viewfile-right i {
  margin: 40vh 0 0 10px;
  font-size: 24px;
  color: #fff;
  opacity: 0.8;
}

#viewer-title {
  font-weight: bold;
}

.viewer-popup > .modal-dialog {
   margin: 20px 15px 5px 15px !important;
}



div.dz-message {
  display: none !important;
}

@media print {
  a[href]:after {
    content: none !important;
  }
}

/** SELECT styles  **/

.hugedrop {
    width: 60vw !important;
}

.bigdrop {
    width: 600px !important;
}

.mediumdrop {
    width: 300px !important;
}

.bigdrop .select2-results__options {
    /** min-height: 70vh; **/
}

.list-inline.tabledrop {
  /** width: 600px !important;  **/
}


.select2-dropdown.tabledrop {
  /** width: 600px !important;  **/
}


.combo.transparent .select2-selection {
  background-color: transparent !important;
}

.combo.color-white .select2-selection {
  color: white !important;
}

.combo.no-borders .select2-selection {
  border: none !important;
  margin-top: 2px !important;
}


.tabledrop .select2-results {
  max-height: 250px;
  overflow-y: scroll;
  overflow-x: hidden;
}

.tabledrop .select2-results > ul {
  display: table;
  width: 100%;
  padding: 0 0 0 15px;  
}

.tabledrop .select2-results > ul > li {
  display: table-row;
}

.tabledrop .select2-results ul.list-inline > li:before {
    content: '';
    position: absolute;
    right: 8px;
    color: #ccc;
    top: 1px;
}

.tabledrop .select2-results > ul > li > ul {
  display: contents;
}

.tabledrop .select2-results > ul > li > ul > li {
  display: table-cell;
}

.tabledrop .select2-header {
  display: table;
  width: 100%;
  padding: 0 15px 0 15px;
}

.tabledrop .select2-header > ul {
  display: table-row;
}

.tabledrop .select2-header ul.list-inline > li:before {
    content: '';
    position: absolute;
    right: 8px;
    color: #ccc;
    top: 1px;
}

ul.tabledrop > li:before {
    content: '';
}

ul.tabledrop {
  padding: 0 0 0 15px;   
}

.tabledrop .select2-header > ul > li {
  display: table-cell;
}


.box {
    position: absolute;
    border: 1px solid #20a3bf;
    border-radius: 5px;
    padding: 8px 10px;
    text-align: center;
    background: red; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(red, yellow, green); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(red, yellow, green); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(red, yellow, green); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #dddddd, white, #dddddd); /* Standard syntax */    
}

.icontext {
    position: absolute;    
    text-align: center;
}

.icontext a {
    text-align: center;
    color: #000 !important;
}


.icontext i {
    font-size: 26px; 
    /**
    position: relative; 
    top: -22px; 
    left: 55px    
    **/

}


.arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid #20a3bf;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;    
}

.businesslayout {
    position: absolute !important;
    background-color: #eeeeee; 
    left: 180px; top: 0; 
    width: 700px; 
    height: 490px; 
    border: 1px solid #cdcdcd;
    padding-top: 30px;
    color: #000; 
}

.businesslayout a {
    color: #000 !important;
}

.grupobotones button {
	padding: 7px 12px !important;
}

table[data-detail] tbody tr {
  cursor: pointer;
}




/* ------------------------------------------------------------------------------
*
*  # Stepy wizard
*     agregados para que funcione con stepy-header active
* ---------------------------------------------------------------------------- */
.stepy-header li.active:after,
.stepy-header li.active ~ li:before,
.stepy-header li.active ~ li:after {
  background-color: #f5f5f5;
}


.stepy-header li.active ~ li div {
  border-color: #eeeeee;
  background-color: #fff;
  color: #ccc;
  font-size: 14px;
}
.stepy-header li.active ~ li div:after {
  content: none;
}
.stepy-header li.active div {
  cursor: auto;
  border-color: NavajoWhite;
  background-color: #fff;
  color: NavajoWhite;
}
.stepy-header li.active div:after {
  content: '\e913';
}
.stepy-header li.active span {
  color: #333333;
}
@media (max-width: 769px) {
  .stepy-header li.active:last-child:after {
    background-color: NavajoWhite;
  }
}
@media (max-width: 480px) {
  .stepy-header li.active:after {
    background-color: NavajoWhite;
  }
}


.top-right-absolute {
    position: absolute;
    top: 5px;
    right: 15px;
}

#menuproyecto > li.active a {
  background-color: #ddd;
}


/* Any element that is not writable */
:read-only { }

/* ... so you might want to scope it */
input:read-only, 
textarea:read-only,
[contenteditable]:read-only {
  /** cursor: not-allowed; **/ 
}

/* Any enabled text input 
   or enabled textarea 
   or element with the contenteditable attribute */
:read-write {
  /** background: white; **/
  cursor: text;
}


.activo {
  background-color: #ddd !important;

}

.inactivo {
  background-color: #fff !important;
}

.form .panel-heading .heading-elements .btn {  /** luego de .form : .panel-primary  **/
   /** background-color: transparent; **/
   /** color: #eee; **/
   border: none;
   /** margin-top: 4px; **/
}

.form .panel-heading .heading-elements .btn:hover {
   background-color: rgba(0,0,0,0.1);
}

.form .panel-heading .heading-elements .btn-group .btn {
    padding: 7px 10px;
}

.form.editmode:not(.readonly) .only-readonly {
   display: none;
} 



.form.readonly .only-editmode {
  display: none;
} 


.form-readonly:not(.readonly) .panel-subtitle {
  display: none;
}

.form.list .panel-subtitle {
      top: 164px;
}

.panel-subtitle {
      position: absolute;
    top: 89px;
    right: 0;
    left: 20%;
    z-index: 100;
}

.form-filter label {
    display: none;
}

.form-filter {
    z-index: 500;
}


#status-list {
  margin: -20px 0 10px 0 ;  
}

#status-list li a {
  background-color: #f8f8f8;
  color: #999;
}
#status-list li a:after {
    border-left-color: #f8f8f8;
}

#status-list.nav-wizard > li > a .badge {
    margin-left: 3px;
    color: #eeeeee;
    background-color: #86bffe;
}

#status-list.nav-wizard > li.active > a .badge {
    margin-left: 3px;
    color: #eeeeee;
    background-color: #999;
}


#status-list li.active a {
  background-color: #ccc;
  color: #000;
}
#status-list li.active a:after {
    border-left-color: #ccc;
}

#status-viewer {
    /** margin: 20px 15px; **/
    margin: 15px 15px 21px 15px;
    background-color: rgb(250, 250, 250);
}

#status-viewer li.active a {  
  background-color: #85bae7 !important;
}
#status-viewer li.active.active2 a {  
  background-color: #428bca !important;
  font-weight: bold;
}
#status-viewer li.active a::after {
  border-left-color: #85bae7;
}
#status-viewer li.active.active2 a::after {
  border-left-color: #428bca;
}

.status-description {
    margin: -15px 10px 0 20px;
    color: #428bca;
    
}

#deleteformbutton {
    margin-left: 5px;
    min-height: 36px;
}

.panel-subtitle .btn-group {
    margin:  0 5px 0 5px;
}

#divactividades .media-left {
    padding: 3px 10px 0 0;
}

#grupobotones_documentos {
    margin-left: 10px;
    /** margin-top: 5px; **/
}

#grupobotones_documentos > button {
    min-height: 37px;
}

.dataTables_wrapper #button_actividades {
  margin-top: 2px;
}

.dataTables_wrapper #grupobotones_documentos {
    margin: 2px 0 5px 10px;
}

.heading-elements #button_actividades {
   /* margin-top: 5px; */
   min-height: 36px;
   margin: 0 0 0 3px;
}

.panel-left {
  width: calc(70% - 10px);
  float: left;
  clear: none;
}

.panel-right {
  width: calc(30% - 10px);
  float: right;
  clear: none;
}

.form .panel-body {
  padding-top: 15px;
}

.form .panel-body > .row:not(:first-child) {
    padding-top: 10px;
    
}



.form .panel-body > .row {
  position: relative;
}


.form .panel-body > .row.with-fieldset:not(:first-child)::before {
  content: '';
  width: calc(100% + 60px);
  position: absolute;
  top: 0px;
  right: -30px;
  bottom: -30px;
  left: -30px;
 /**  border-top: 2px dotted #aaa; **/
  border-top: 1px dotted #aaa;
}






.form.form-readonly.readonly .panel-body {
  /** padding-top: 50px; **/
}

table.hidefirstcolumn tr td:first-child {
    display: none !important;
}

table.hidefirstcolumn tr th:first-child {
    display: none !important;
}

.more-button {
    margin-top: 0; /** 5px; **/
}

.more-button > button {
  min-height: 36px;
}

#barraderechaproyecto li#documentos {
  display: none !important;
}

li.seeback {
  text-align: center;
  cursor: pointer;
}

.select2-selection__clear {
  color: #777;
  
}

.select2-selection__clear:after {
  font-size: 6px;
}

.form:not(.readonly) .select2-selection.required {
      /** background-color: #ffffe6; **/
      border-bottom: 1px solid #6666cc !important;
}


.row fieldset:not(:last-child) {
   padding-right: 20px;
}

.row fieldset legend {
    /** padding-top: 0; **/
}

.sinlabel {
  margin-top: 27px;
}

.ef {
   font-size: inherit !important;
}


#fbuilderdesign {
  position: fixed;
  z-index: 100008;
  left: 5px;
  top: 10px; 
  background-color: rgba(255,255,255,0.8);
  padding: 5px 5px;
}

#fbuilderlog {
  position: fixed;
  z-index: 100008;
  left: 31px;
  top: 10px; 
  background-color: rgba(255,255,255,0.8);
  padding: 5px 5px;
}

.tab {
  margin: 0 10px;  
}

.tabtitle {
    position: absolute; top: 27px; right: 25px; font-size: 17px;
}

.form > .panel-body {
    overflow: auto;
}


.form-control.validate-has-error, .select2-selection.validate-has-error {
  border-color: #cc3f44 !important;
  color: #cc3f44;
}

.form-control.validate-has-error, .select2-selection.validate-has-error, span.validate-has-error {
    display: block;
    /** padding-top: 5px; **/
    font-size: 12px;
    color: #cc3f44;
}

.row.subform-add {
  position: relative;
  min-height: 12px;
}

.row.subform-add .total {
  position: absolute;
  top: 0;
  font-weight: 600;
  text-align: right; 
  padding: 2px 12px;
}

.small {
  font-size: 7px;
}

.btn-xxs {
  font-size: 8px;
  padding: 5px 3px;

}


.gly-spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
.gly-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.gly-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.gly-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}
.gly-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}
.gly-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}   


.seemore a {
    color: #888 !important;
}

#menu_ayuda i { 
  margin-top: 5px;
}

.gallery.mini {
  margin: 0;
}

.gallery.mini button span {
  padding: 7px 7px;
}
.gallery.mini button span {
  display: none;
}

.gallery.mini .dropzone .dz-image img {
    height: 20px !important;
}

.gallery.mini .dropzone .dz-details {
  display: none;
}

td.dt-body-right {
  text-align: right;
}

tfoot th.dt-body-right {
  text-align: right;
}

.columngroup {
   text-align: center;
}

.columngroup {
    border-left: 2px solid grey !important;
    border-top: 2px solid grey !important;
    border-bottom: 2px solid grey !important;
    background-color: rgb(204, 204, 153);

}

.leftgroupcol {
    border-left: 2px solid grey !important;
}



.carousel-inner > .item {
    display: none !important;
    position: relative;
    -webkit-transition: 0.6s ease-in-out left;
    -o-transition: 0.6s ease-in-out left;
    transition: 0.6s ease-in-out left;
}

.carousel-inner > .active, .carousel-inner > .next, .carousel-inner > .prev {
    display: block !important;
}

table.dataTable.responsive tbody tr.child td.child ul li {
    float: left;
    width: 25%;
}

table.dataTable.responsive tbody tr.child td.child {
  border-top: none;
}

table.dataTable.responsive tbody tr:not(.child) {
    /** background-color: #efefef; **/
}

table tr.norepeat td {
  border-top: none;
}


input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}



.btn-borderless {
  border: none !important;
}

.btn-borderless {
  background-color: #f8f8f8;
}

.btn-borderless.active {
  background-color: #ccc !important;
}

.btn-borderless {
  color: #ccc;
}

input[type="radio"].btn-borderless  {
    visibility:hidden;
    /** display: none; **/

    width: 1px;
    height: 1px;

}

label.btn-borderless {
  
  padding: 10px;
  color: #ccc;
  margin-bottom: 0;
  margin-top: 5px !important;
}

label.btn-borderless.active {
  color: #000;
}


.imagenicon {
   max-width: 50px;
}



.note-editor blockquote {
    margin: 0;
    font-size: 13px;
    border-left: none;
    
}

.note-editor blockquote img {
    height: auto;
    float: none;
    margin: 0;
}

.changestatus span {
  font-size: 25px;
}

.changestatus i {
  font-size: 35px;
}


@page {
     @bottom-left {
          content: counter(page) "/" counter(pages);
      }
}



input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  /** display: inline !important; **/
}

.daterangepicker-inputs {
  display: none !important;
}

.calendars .ranges li[data-range-key='Custom'] {
  display: none;
}

.calendars .range_inputs {
  display: none;
}

.calendars {
      /** margin-left: -214px; **/
}


.alwayslabel label {
    display: inline-block !important;
}



@media (min-width: 1025px) {
    .timeline-left .timeline-container:after, .timeline-left:before, .timeline-left:after, .timeline-left .timeline-date:before, .timeline-left .timeline-date:after, .timeline-row:before {
        left: 24px;
    }
    .timeline-container:after {
        content: "";
        position: absolute;
        top: 0;
        left: 25px;
        margin-left: -1px;
        background-color: transparent;
        height: 100%;
        width: 0;
        z-index: -1;
    }
    .timeline-row:before {
        content: "";
        position: absolute;
        top: 0;
        left: 25px;
        margin-left: -1px;
        background-color: #ccc;
        height: 150%;
        width: 2px;
        z-index: -1;
    }
    .timeline-lastrow:before {
        content: "";
        position: absolute;
        top: 0;
        left: 25px;
        margin-left: -1px;
        background-color: #ccc;
        height: 28px;
        width: 2px;
        z-index: -1;
    }
}


.vis-time-axis .vis-grid.vis-saturday,
.vis-time-axis .vis-grid.vis-sunday {
    background: #F0F0F0;  
}
    
.vis-time-axis .vis-grid.vis-today {
    background: #FFFFCC;  
}

.form-left label,.form-left span.select2,.form-left input {
  float: left;
}


.int {
  text-align: right;
}

.real {
  text-align: right;
}

span.select2-container {
  width: 100% !important;
}

.form.readonly .input-group-addon {
  background-color: transparent;
}

.panel-heading.notitle {
  padding: 15px 10px !important;
}

.panel-heading.notitle .heading-elements {
  position: static !important;
}

.navbar-btn.navbar-right .btn {
  padding: 6px 8px !important;
}

input[type=search]::-webkit-search-cancel-button {
    /** -webkit-appearance: searchfield-cancel-button; **/
}

.footer {
  position: fixed; 
  bottom: 0;
  text-align: center;
  width: 100%;
  font-size: 11px;
  /** float: footnote; **/

}

.footer-space {
  height: 40px;
}

.panel-title .subtitle {
  clear: none;
  /** float: left; **/
}


.table > tbody > tr > td {
    vertical-align: top;
}

.margin-10 {
   margin: 10px;
}

.margin-20 {
   margin: 20px;
}

.padding-10 {
  padding: 10px;
}

.padding-20 {
  padding: 20px;
}

 .table > thead > tr > th {
     font-weight: bold;
 }


#ayudaycontacto-container {
    border: 0 none;
    padding: 0;
    cursor: pointer;
    z-index: 999999;
    background-color: rgb(193, 197, 195);
    color: #fcf5f5;
    border-bottom: 0;
}

#ayudaycontacto-middle {
  border: 0 none;
    margin: 0 auto;
    font-size: 15px;
    vertical-align: middle;
}

#ayudaycontacto-text-container {
  display: inline-block;
    vertical-align: top;
}

#ayudaycontacto-message {
  border: 0 none;
    margin: 0 26px 0 0;
    padding: 8px 20px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;
    font-size: 15px;
}


.bootbox.modal.inserted { 
  position: initial !important; 
  margin: 0px -21px !important;
  padding: 0 !important;
}
.bootbox.modal.inserted .bootbox-close-button {
  display: none !important ;
}


.bootbox.modal.inserted .modal-dialog { 
    width: 100% !important; 
}

.bootbox.modal.inserted .modal-body { 
  padding: 0 !important;
}

.form.inserted .panel-heading {
  background-color: white !important;
  border-color: grey !important;
  color: black !important;
}


.form.inserted .panel-heading a[data-action='close'] {
  display: none;
}

.form .panel-body {   
    overflow-x: hidden;
}


.form.inserted .panel-footer { 
  display: none;
}

body.popup {
  min-height: initial !important;
}


body:not(.popup) {
  min-height: 100vh;
}


body.inscroll {
  overflow: hidden;
}

body.inscroll .tab-content .tab-pane {
  overflow-y: scroll;
  height: calc(100vh - 150px);
  overflow-x: hidden;
}




/**
html {
  height: initial !important;
}
**/

.dtr-title {
  width: 100px;
}

.datatable-colvis-state td.child {
  border-top: none !important;
  padding-top: 0 !important;
}



.sticky {

}


.now-sticky {
  position: fixed !important;
  top: 0 !important;
  width: 100% !important;
  z-index: 10000;
}


.dataTable tr.child td.child > ul {
	display: inline !important;
}

.dataTable tr.child td.child > ul > li {
        display: inline !important;
	width: 25%;
	float: left;
	padding: 5px 5px;
}

.form .table.dataTable img {
    /** height: 100px; **/
}

.bootbox.modal {
    overflow: hidden;
}

a.config {
  position: absolute;  
  right: 8px;
  top: 3px;
  color: grey;
  opacity: 0.5;
  display: none;
  cursor: pointer;
}

a.config i {
   font-size: 14px;
}

.combo:hover a.config {
  display: block;
}


.last-no-tab {
  margin-bottom: 0 !important;
}

tr.table-edit td {
/**	border: none !important; **/

}

tr.table-edit td input {
	border: none;
	/** border-bottom: 1px solid #ddd; **/
	border-radius:  0;
  padding: 0;
}

tr.table-edit .select2-selection {
  border: none;
  /** border-bottom: 1px solid #ddd; **/
  border-radius:  0;
  padding: 10px 0;
}

tr.table-edit .form-group {
  margin-bottom: 0;
}

button.table-edit-delete {
  position: absolute;
  right: 10px;
  top: 30px;
}

button.table-edit-edit {
  position: absolute;
  top: 30px;
  right: 40px;
}

button.table-edit-edit span, button.table-edit-delete span  {
  display: none;
}


.table {
  position: relative;
}


/** editable tables **/

td.editable {
  cursor: text;  
}

/**
td.editable:after {
   content: '\f14b';
   opacity: 0.3;
   cursor: text;
   font-family: FontAwesome;
   font-weight: normal;
   font-style: normal;
   float: right;
   margin:0px 0px 0px 10px;
   text-decoration:none;

}
**/
table.editable tr td:last-child .icon-pen6 {
  font-size: 12px;
  top: 0px;
  color: #ccc;
  right: -55px;
  padding: 5px;
}

table.deletable tr td:last-child .icon-trash {
  font-size: 12px;
  top: calc(50% - 10px);
  color: #ccc;
  right: 0px;
  padding: 5px;
  position: absolute;
  cursor: pointer; 
}

table.editable tr td:last-child .icon-check {
  font-size: 20px;
  top: calc(50% - 15px);
  color: green;
  right: 0px;
  padding: 5px;
  position: absolute;
  cursor: pointer; 
}



/** table.editable tr:not(.table-add-row):not(.table-edit) td:not(.text-right).editable:not(.editing):hover::after { **/
table.editable tr:not(.table-add-row):not(.table-edit) td:not(.text-right).editable:not(.editing)::after {
  content: '\f14b';
   font-family: FontAwesome;
   font-weight: normal;
   font-style: normal;
   margin:0px 0px 0px 10px;
   text-decoration:none;  
   font-size: 12px;
   color: #ccc;
  /** font-family: 'FontAwesome'; **/
  /**
  font-family: 'Font Awesome 5 Solid';
  content: '\f304'; 
  position: relative;
  font-weight: 900;
  **/
}

table.editable tr.table-edit td div.accept-edit {
  width: 100%;
}

table.editable tr.table-edit td > span {
  width: 100%;
  position: relative;
}

table.editable tr.table-edit td button.accept-edit {
    position: absolute;
    top: 5px;
    right: -24px;
    padding: 1px 2px 5px 2px;
}

table.editable tr.table-edit td button.accept-edit i {
  font-size: 16px;
}
table.editable tr:not(.table-add-row) td.text-right.editable:not(.editing):hover::before {
  content: '\f14b';
   font-family: FontAwesome;
   font-weight: normal;
   font-style: normal;
   margin:0px 10px 0px 0px;
   text-decoration:none;  
   font-size: 12px;
   color: #ccc;
}

table.deletable tr td:last-child {
  padding-right: 25px !important  ;
}

table.editable tr td.editable {
  position: relative;
  cursor: text;
}

table.editable tbody tr td.editable > span {
  border-bottom: 2px dotted #aaa;
}

table.editable tr.table-edit td:last-child .icon-check {
  font-size: 16px;
  top: 0px;
  color: green;
  right: -55px;
  padding: 5px;
}

table.deletable tr.table-edit td:last-child .icon-trash {
  font-size: 12px;
  top: 0px;
  color: red;
  right: 10px;
  padding: 5px;
}

table.editable > a.table-edit-add {
  padding: 3px 5px;
  color: #aaa;
}

table.editable > a.table-edit-add i {
  padding: 6px 2px 3px 2px;
  font-size: 12px;
}

table.editable > a.table-edit-add span {
  font-size: 12px;
}

table.editable input.table-edit-input {
  width: calc(100% - 50px);
  border: 0;
  float: left

}

table.editable button.table-edit-button {
  float: left;
  border: 0;
    height: 20px;
    width: 30px;
}

table.editable button.table-edit-button i {
    font-size: 14px;
}


table.editable input.table-edit-input::placeholder {
  color: #ddd;
}

table.editable tr.table-edit td:last-child .icon-check:hover {
  color: #000;
  background-color: #ddd;
}

table.editable tr td:last-child .icon-pen6:hover {
  color: #000;
  background-color: #ddd;
}

table.editable tr td:last-child .icon-check:hover {
  color: #000;
  background-color: #ddd;
}

table.deletable tr td:last-child .icon-trash:hover {
  color: #000;
  background-color: #ddd;
}

table.editable > a.table-edit-add:hover {
  color: #000;
  background-color: #ddd;
}

.video-popup img {
  width: 100%;
}

.video-popup {
  position: relative;
  max-width: 700px;
  width: 100%;
  margin-bottom: 10px;
}
.video-popup img {
  max-width: 700px;
  width: 100%;
  
}
.video-popup .play-btn {
  position: absolute;
  max-width: 700px;
  width: 100px;
  height: 100px;
  left: 50%;
  top: 60%;
  transform: translate(-50%, -50%);
  line-height: 1; /* needed if using Bootstrap */
  text-align: center;
  color: #eaeaea;
  background-color: rgba(255,255,255,.4);
  border-radius: 50px;
  transition: all .2s ease;
}
.video-popup .play-btn:hover,
.video-popup .play-btn:focus {
  color: #000;
  background-color: rgba(255,255,255,.8);
  cursor: pointer;
}
.video-popup .play-btn {
   font-size: 60px;
}

div.checkbox-switchery {
  text-align: left !important;
}

div.checkbox-switchery span.position-right { 
  padding: 0 0 0 40px;
  display: block;
}

div.checkbox-switchery span.position-left { 
  padding: 0 40px 0 0;
  display: block;
}


div.checkbox-switchery label {
  padding: 2px 0 0 40px;
}


.checkbox > span:not(.switchery) {
  padding-left: 20px;
}

/**
.play-btn::after {
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 60px;
  content: "\f04b";
  padding-top: 20px;
  padding-left: 10px;
}
**/

.btn-group .btn.more {
  border-top: none;
    border-bottom: none;
    border-right: none;
    background-color: transparent;
    /** font-size: 15px; **/
    font-weight: 800;
    padding-right: 0;
    padding-left: 7px;
    padding-top: 10px;
    padding: 12px 0 2px 7px;
    color: grey;
}


/** estilo campos con labels dentro **/


.form-group {
  position: relative !important;
}

.form-group.text-right-onreadonly > label {
    position: absolute;
    right: 10px;
    top: 5px;


    left: 9px;
    top: 5px;

    opacity: 0.7;

    color: #737373;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    z-index: 5;
    text-align: right;
    
}

.form-group:not(.text-right-onreadonly) > label {
    z-index: 5;
    position: absolute;
    left: 12px;
    top: 5px;

    left: 9px;
    top: 5px;
    opacity: 0.7;


    color: #737373;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.form.form-readonly.readonly .form-group > label {
    /**
    position: static;
    margin-bottom: -10px;
    **/

}

.form.form-readonly.readonly .gallery > label {
    margin-bottom: 3px;
}

.form.form-readonly.readonly .gallery .help-block  {
  display: none;
}

.form-group > input {
  padding: 32px 11px 15px 8px;
  font-size: 13px;
}

.form-group > .input-group > input {
  padding: 32px 11px 15px 8px;
  font-size: 13px;
}


.form-group.without-label > input {
  padding: 15px 11px 15px 8px;
}

.form-group.without-label > .input-group > input {
  padding: 15px 11px 15px 11px;
}



.combo > .without-label.form-group > div {
    padding: 0px 12px 0 0 !important;
}

.combo > .without-label.form-group > .input-group .select2-selection {
    padding-top: 8px !important;
}




.form-group.textarea {
  overflow: auto;
  padding: 10px 0 0 10px;
  border: 1px solid rgb(221, 221, 221);
  /** margin: 0 5px; **/
}
.form.form-readonly.readonly .form-group.textarea {
  border: none;
  margin: 0; 
}

.form-group > textarea {
  /**
  padding: 35px 11px 15px 11px;
  **/
  font-size: 13px;
  padding: 0 2px;
  margin-top: 15px;
  /**  width: 95%; **/
  width: calc(100% - 6px);

  border: none;
  outline: none;

  /**
  margin-top: 0px;
  border: 1px solid #ddd;
  **/

}



.form-group .select2-selection {
  /**
  padding: 25px 8px 25px 0px !important;
  font-size: 13px;
  **/  
  padding: 24px 8px 23px 0px !important;
  font-size: 13px;
}

.form-group.without-label .select2-selection {
  padding: 7px 8px 0px 0px !important;
  font-size: 13px;
}


.form-readonly.readonly .form-group .select2-selection {
 /**
  padding: 10px 8px 25px 0px !important;
  font-size: 13px;
  **/
}

.form-readonly.readonly .form-group input {
  /** margin-top: 0px; **/
 }

.form-group .select2-selection__rendered {
  padding-right: 8px !important;
  line-height: 1.338462;
}


.bond-with-prev {
   padding-left: 0 !important;
}

.bond-with-prev input {
    padding-left: 0 !important;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.bond-with-prev .select2-selection {
    padding-left: 0 !important;
    border-left: none;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}


.bonded-by-next {
   padding-right: 0 !important;
}

.bonded-by-next input {
    padding-right: 0 !important;
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.bonded-by-next .select2-selection {
    padding-right: 0 !important;
    border-right: none;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.bonded-by-next .select2-selection--single .select2-selection__arrow:after {
  right: 4px;
}


/** fin estilo campos con labels dentro **/

.btn-caret-right {
    height: 34px;
    margin-right: 3px;
    padding-left: 0
}


.form-readonly.readonly .select2-search--dropdown:after {
  display: none;
}

input:focus:not(.select2-search__field), textarea:focus {
  border-bottom: 1px solid red !important;
}

.showflex {
  display: flex;
}

.showblock {
  display: block;
}

.editmode .listmode-only {
  display: none;
}

.listmode .editmode-only {
  display: none;
}


.alert.lesson {
  padding-bottom: 35px;
}

.alert.lesson .entendido {
  display: block;
    float: right;
    padding: 6px;
    
    /* padding-bottom: 10px; */
    font-size: 12px;
    font-weight: 700;
        position: absolute;
    right: 10px;
}

.content-wrapper > .alert {
  margin: 20px 20px 0 20px;
}

.server-log {
  position: fixed;
  right: 0;
  width: 195px;
  top: 0;
  height: 100vh;
}





@media print {
   .col30-sm-1, .col30-sm-2, .col30-sm-3, .col30-sm-4, .col30-sm-5, .col30-sm-6, .col30-sm-7, .col30-sm-8, .col30-sm-9, .col30-sm-10, .col30-sm-11, .col30-sm-12 {
        float: left;
   }
    iframe[title="chat widget"]{
        display:none !important;
   }   
   .subform-delete,.subform-add{
       display:none !important;
   }
   .col30-sm-30 {
        width: 100%;
   }
   .col30-sm-29 {
        width: 96.66666666666667%;
   }
   .col30-sm-28 {
        width: 93.33333333333333%;
   }
   .col30-sm-27 {
        width: 90%;
   }
   .col30-sm-26 {
        width: 86.66666666666667%;
   }
   .col30-sm-25 {
        width: 83.33333333333333%;
   }
   .col30-sm-24 {
        width: 80%;
   }
   .col30-sm-23 {
        width: 76.66666666666667%;
   }
   .col30-sm-22 {
        width: 73.33333333333333%;
   }
   .col30-sm-21 {
        width: 70%;
   }
   .col30-sm-20 {
        width: 66.66666666666667%;
   }
   .col30-sm-19 {
        width: 63.33333333333333%;
   }
   .col30-sm-18 {
        width: 60%;
   }
   .col30-sm-17 {
        width: 56.66666666666667%;
   }
   .col30-sm-16 {
        width: 53.33333333333333%;
   }
   .col30-sm-15 {
        width: 50%;
   }
   .col30-sm-14 {
        width: 46.66666666666667%;
   }
   .col30-sm-13 {
        width: 43.33333333333333%;
   }
   .col30-sm-12 {
        width: 40%;
   }
   .col30-sm-11 {
        width: 36.66666666666667%;
   }
   .col30-sm-10 {
        width: 33.33333333333333%;
   }
      .col30-sm-9 {
        width: 30%;
   }
    .col30-sm-8 {
        width: 26.66666666666667%;
   }
    .col30-sm-7 {
        width: 23.33333333333333%;
   }
    .col30-sm-6 {
        width: 20%;
   }
   .col30-sm-5 {
        width: 16.66666666666667%;
   }
   .col30-sm-4 {
        width: 13.33333333333333%;
   }
   .col30-sm-3 {
        width: 10%;
    }
    .col30-sm-2 {
        width: 6.66666666666667%;
   }
   .col30-sm-1 {
        width: 3.33333333333333%;
   }

   .alert.lesson {
    display: none;
   }

}


.infohelp {
  position: absolute;
    right: 30px;
    top: 20px;
    opacity: 0.5;
}


#sidebar_ul > li > ul > li.active {
  background-color: #78909C;
    border-color: #78909C;
    color: #fff;
}


#barraiconosderecha li.active {
  background-color: #78909C;
    border-color: #78909C;
    color: #fff;
}

ul > legend {
    margin-bottom: 0 !important;
}


fieldset.title-icon-only {
  padding-left:  30px;
  position:  relative;

}

fieldset.title-icon-only > i {
  position: absolute;
   top: 5px;
  font-size: 18px;
  left:  5px;
}

.margin-bottom-0 {
  margin-bottom: 0;
}


.A {
  background: #FF0;
}
.B {
  background-color:#F0F;
}
.C {
  background-color:#6F0;
}
.D {
  background-color:#FF0000;
}
.E {
  background-color: #390;
}
.F {
  background-color:#0033CC;
  color: #fff;
}
.G {
  background-color:#C36;
}
.H {
  background-color:#006;
}
.I {
  background-color:#9999ff ;
}
.J {
  background-color:#999933;
}
.K {
  background-color:#00FFFF;
}
.L {
  background-color:#999999;
}
.M {
  background-color:#00aa00;
}
.N {
  background-color:#CC3300;
}
.O {
  background-color:#C3C;
}
.P {
  background-color:#003399;
}
.Q {
  background-color:#6633CC;
}
.R {
  background-color:#EE6666;
}
.S {
  background-color:#000;
}
.T {
  background-color: #96F;
}
.U {
  background-color:#CC6699;
}
.V {
  background-color:#CC9999;
}
.W {
  background-color:#666699;
}
.X {
  background-color:#996699;
}
.Y {
  background-color:#CCCC99;
}
.Z {
  background-color:#CCCCCC;
}

.gallery-camera label {
   font-size: 14px !important;
   top: -12px !important;
   left: 15px !important;
}

.gallery-camera .dz-filename {
  display: none !important;
}

.gallery-camera .dz-details {
  display: none !important;
}

.gallery-camera .dz-image img {
  width: 100% !important;
  height: auto;
}

.button-icon-img {
  max-width: 20px;
}



.hoverzoomx10 {
  /** padding: 50px; 
  background-color: green;
  **/
  transition: transform .2s; /* Animation */
  /**
  width: 200px;
  height: 200px;
  margin: 0 auto;
  **/
}

.hoverzoomx10:hover {
  transform: scale(10); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}


.hoverzoomx5 {
  /** padding: 50px; 
  background-color: green;
  **/
  transition: transform .2s; /* Animation */
  /**
  width: 200px;
  height: 200px;
  margin: 0 auto;
  **/
}

.hoverzoomx5:hover {
  transform: scale(5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.font-8 {
  font-size: 8px;
}







.video-wrap {
      position: relative;
      max-width: 700px;
      width: 100%;
      margin-bottom: 10px;
    }
    /* video poster frame or placeholder image */
    .video-wrap .placeholder {
      max-width: 700px;
      width: 100%;
    }
    /* SVG play button container */
    .video-wrap .play-btn {
      position: absolute;
      max-width: 700px;
      width: 100px;
      height: 100px;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
    }
    .video-wrap .play-btn svg {
      transition: all .2s ease;
      fill: #fff;
    }
    .video-wrap .play-btn:hover svg,
    .video-wrap .play-btn:focus svg {
      cursor: pointer;
      /** fill: #17e617; **/
      fill: #ccc;
    }
    /* adjust your icon size, add different breakpoints as needed */
    @media screen and (max-width: 600px) {
      .video-wrap .play-btn {
        width: 70px;
        height: 70px;
      }
    }



.dt-button-collection {
  z-index: 10000;
}



/** INACCESSIBLE FIELDS AND FIELDSETS **/
fieldset.inaccessible input {
    pointer-events: none !important;
    background-color: #EEEBEB !important;
}

fieldset.inaccessible span.select2-selection--single {
    pointer-events: none !important;
    background-color: #EEEBEB !important;
}


fieldset.inaccessible > div.row.subform-add > a, fieldset.inaccessible div.subform-delete > i, fieldset.inaccessible .select2-selection--single .select2-selection__arrow:after {
       display:none;
}

fieldset.inaccessible .select2-selection__rendered[title="- Seleccionar -"] {
  display: none;
}


.vpad0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


.fixed-top {
  position:  fixed !important;  
  top: 0 !important;
}

table.form-table {
  background-color:  white;
}

.nicescroll-rails.nicescroll-rails-hr {
  background-color: white;
}

table.form-table td {
    overflow: hidden;
    text-overflow: ellipsis;
}


.dataTables_scrollBody {
  scrollbar-color: #d4aa70 #e4e4e4;
  scrollbar-width: thin;
  margin-top:  -5px;
}

.dataTables_scrollBody::-webkit-scrollbar {
  width: 20px;
}

.dataTables_scrollBody::-webkit-scrollbar-track {
  background-color: transparent; /** #e4e4e4; **/
  border-radius: 100px;
}

.dataTables_scrollBody::-webkit-scrollbar-thumb {
  border-radius: 100px;
  border: 5px solid transparent;
  background-clip: content-box;
  background-color: #dddddd;
}



.dataTables_scrollHead {
  /** scrollbar-color: #d4aa70 #e4e4e4; **/
  scrollbar-width: thin;
}

.dataTables_scrollHead::-webkit-scrollbar {
  width: 5px;
}

.dataTables_scrollHead::-webkit-scrollbar-track {
  background-color: transparent; /** #e4e4e4; **/
  border-radius: 100px;
}

.dataTables_scrollHead::-webkit-scrollbar-thumb {
  border-radius: 100px;
  border: 5px solid transparent;
  background-clip: content-box;
  background-color: #dddddd;
}




.bootbox.modal .bootbox-close-button {
  /**
    margin-top: -10px;
    position: absolute;
    right: -26px;
    font-size: 36px;
    color: white;
    font-weight: 700;
    top: -7px;
**/

    margin-top: -10px;
    position: fixed;
    right: -45px;
    font-size: 38px;
    color: white;
    font-weight: 700;
    top: -19px;
    width: 56px;
    height: 60px;
}







/** barra titulo formularios y paneles **/
.panel-primary > .panel-heading {
    color: #fff;
    background-color:  var(--module-color); /**#999966;**/
    border-color: var(--module-color);
}


/** barra vertical menú **/
/** #menuprincipal li[data-module='obras'] > a { **/
#menuprincipal li.active > a {
    background-color: var(--module-color) !important;
}

#navbarheader {
    border-right: 4px solid var(--module-color) !important;
}

#sidebarmain {
    border-right: 4px solid var(--module-color) !important;
}


/** barra horizontal  **/
.barra-modulo i {
    color: var(--module-color) !important;
}

.barra-modulo li.active > a {
    border-bottom: 4px solid var(--module-color);
    padding-bottom: 9px;
    top: 2px;
}

.barra-modulo .modulo_title {
    color: var(--module-color) !important;   
}

.subbarra-modulo i {
    color: var(--module-color) !important;
}

.subbarra-modulo li.active a {
    border-bottom: 4px solid var(--module-color);
}

.subbarra-modulo .modulo_title {
    color: var(--module-color) !important;   
}



.subbarra-modulo > li.active > a {    
    /** padding: 9px 15px !important; **/
    border-bottom: 3px solid var(--module-color) !important;

    padding-top: 10px;
    padding-bottom: 10px;
    top: 2px;

}

.subbarra-modulo > li.active > ul > li.active > a {    
    /** padding: 10px 12px 11px 12px !important; **/
    border-bottom: 3px solid var(--module-color) !important;

}

.mobileonlytext > a span, .mobileonlytext > span {
  display: none;
}


.mainselector {
  float:  left;
}
    
@media (max-width: 769px) {
  .barra-modulo > li > ul {
      margin-left:  30px;
  }

  .subbarra-modulo button {
    display: none;
  }
  .mobileonlytext > a span, .mobileonlytext > span {
    display: inline;
  }
  .mainselector .select2-selection__rendered {
    text-align: center;
  }

}


.nav-pills.subbarra-modulo li.active > a, .subbarra-modulo.nav-pills li.active > a:hover, .subbarra-modulo.nav-pills li.active > a:focus {
    color: black !important;
    background-color: transparent !important;
}
   



@media (min-width: 769px) {
  .nav-tabs.nav-tabs-highlight > li.active > a, .nav-tabs.nav-tabs-highlight > li.active > a:hover, .nav-tabs.nav-tabs-highlight > li.active > a:focus {
    border-top-color: var(--module-color);
  }
}





.btn-orange {
  color: #222;
  background-color: NavajoWhite;
  border-color: NavajoWhite;
}
.btn-orange:focus,
.btn-orange.focus {
  color: #222;
  background-color: #EECD9C;
  border-color: #004b55;
}
.btn-orange:hover {
  color: #222;
  background-color: #EECD9C;
  border-color: #008697;
}
.btn-orange:active,
.btn-orange.active,
.open > .dropdown-toggle.btn-orange {
  color: #222;
  background-color: #EECD9C;
  border-color: #008697;
}
.btn-orange:active:hover,
.btn-orange.active:hover,
.open > .dropdown-toggle.btn-orange:hover,
.btn-orange:active:focus,
.btn-orange.active:focus,
.open > .dropdown-toggle.btn-orange:focus,
.btn-orange:active.focus,
.btn-orange.active.focus,
.open > .dropdown-toggle.btn-orange.focus {
  color: #fff;
  background-color: #006f7d;
  border-color: #004b55;
}
.btn-orange:active,
.btn-orange.active,
.open > .dropdown-toggle.btn-orange {
  background-image: none;
}
.btn-orange.disabled:hover,
.btn-orange[disabled]:hover,
fieldset[disabled] .btn-orange:hover,
.btn-orange.disabled:focus,
.btn-orange[disabled]:focus,
fieldset[disabled] .btn-orange:focus,
.btn-orange.disabled.focus,
.btn-orange[disabled].focus,
fieldset[disabled] .btn-orange.focus {
  background-color: NavajoWhite;
  border-color: NavajoWhite;
}
.btn-orange .badge {
  color: NavajoWhite;
  background-color: #fff;
}

input[disabled] {
  background-color: #D9D9D9 !important;
}



.triangle-isosceles {
  position:relative;
  padding:15px;
  margin:1em 0 3em;
  color:#000;
  background:#f3961c; /* default background for browsers without gradient support */
  /* css3 */
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c));
  background:-moz-linear-gradient(#f9d835, #f3961c);
  background:-o-linear-gradient(#f9d835, #f3961c);
  background:linear-gradient(#f9d835, #f3961c);
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
}

/* Variant : for left/right positioned triangle
------------------------------------------ */

.triangle-isosceles.left {
  margin-left:50px;
  background:#f3961c;
    border-radius: 4px !important;
}

/* creates triangle */
.triangle-isosceles:after {
  content:"";
  position:absolute;
  bottom:-15px; /* value = - border-top-width - border-bottom-width */
  left:50px; /* controls horizontal position */
  border-width:15px 15px 0; /* vary these values to change the angle of the vertex */
  border-style:solid;
  border-color:#f3961c transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

/* Variant : left
------------------------------------------ */

.triangle-isosceles.left:after {
    top: 12px;
    left: -15px;
    bottom: auto;
    border-width: 10px 15px 10px 0;
    border-color: transparent #333333;
}


#menuprincipal li > a > span {
    top: -13px;
    right: -280px;
    background-color: #333333;
    border: 1px solid #333333;
}

#contentwrapper{
	width: calc(100vw - 56px);
}

.modal-add-popup {
  position:fixed;
  top:auto; 
  right:auto; 
  left:0; 
  bottom:-100%;
  border-top-left-radius: 25px;
  border-top-right-radius: 25px;
}

.modal-add-popup .modal-dialog {
    margin: 0;
}

.modal-add-popup .modal-header {
  text-align: center;
}

.modal-add-popup .modal-body {
  padding: 0; 
  padding: 0;
  margin-top: 10px;
  border-top: 1px solid #ddd;
}


/** 2024 **/
.form-group {
  margin-bottom: 8px;
}

.select2-selection--single .select2-selection__rendered {
  padding-left: 9px;
}

.form-readonly.readonly .subform-table .subform-row.first-row::before {
  content: none !important;

}
fieldset:first-child legend:first-child {
  padding-top: 8px;
}
.select2-results__option {
  min-height: 30px;
  border-top: 1px solid #ccc;
}
.select2-results__option:empty::after {
  content: '(vacío)';
  color: #ccc;
}


.form .panel-footer.editmode-only button:not(.pull-right) {
  width: 170px;
  height: 39px;
}
.form .panel-footer.editmode-only button:not(.pull-right):first-child {
  margin-left: calc(50% - 180px);
  margin-right: 10px;
}

table.ttht-generated  td {
  border-bottom: 1px solid #ccc;
  padding: 3px 4px;
}

tr.clickable {
  cursor: pointer;
}
tr.clickable:hover {
  background-color: #85bae7;
}

tr.table-headergroup td {
  font-weight: bold;
}

.modal-xl {
  width: 95vw;
}

@media (max-width: 567px){
    
  .bootbox.modal .bootbox-close-button {
          color:#333333 !important;
  }
}

.gallery .carousel-indicators {
  cursor: pointer;
}
.gallery .dz-zoom {
  display: none;
}

