/* COLORES CALENDARIO */
.calendar_color {
  width: 10px !important;
  height: 10px !important;
  border-radius: 0px !important; }

.profesores-grupo .calendar_color_clase > .fc-event-inner > .fc-event-time {
  display: none; }

.profesores-grupo .calendar_color_notas {
  color: #fff !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 0px !important; }

.profesores-grupo .calendar_color_notas > .fc-event-inner > .fc-event-time {
  display: none; }

.profesores-grupo .calendar_color_examen > .fc-event-inner > .fc-event-time {
  display: none; }

.profesores-grupo .calendar_color_notas {
  color: #fff !important;
  width: 15px !important;
  height: 15px !important;
  border-radius: 0px !important; }

.profesores-grupo .calendar_color_notas > .fc-event-inner > .fc-event-time {
  display: none; }
/* END COLORES CALENDARIO */
input:disabled, textarea:disabled, button:disabled {
  background: #f4f4f4;
  border: #dfe3e5; }

textarea {
  width: 100%;
  font-family: tahoma;
  font-size: 12px;
  color: #838484;
  resize: none; }

input:focus, textarea:focus, input:focus + i {
  border: 1px solid #636363; }

form.form-validation input[type="text"].validation-input, form.form-validation input[type="email"].validation-input, form.form-validation input[type="password"].validation-input {
  /*&:invalid{
   background: url(http://crs2.kmutt.ac.th/ceem_static/img/error.svg);
   background-size: 14px;
   background-repeat: no-repeat;
   background-position: right;
   border: 1px solid red;
   }*/ }
  form.form-validation input[type="text"].validation-input:valid, form.form-validation input[type="email"].validation-input:valid, form.form-validation input[type="password"].validation-input:valid {
    background: url(https://upload.wikimedia.org/wikipedia/commons/0/0d/Google_Material_Design_check.svg) white;
    background-size: 14px;
    background-repeat: no-repeat;
    background-position: right;
    border: 1px solid #ccc; }

.bloque {
  display: flex;
  flex-direction: column;
  width: 100%; }

.bloque .item-check {
  height: 14px; }

.bloque .fila {
  display: flex;
  height: 22px; }

.bloque .fila input {
  height: 20px !important;
  font-family: tahoma;
  font-size: 10px;
  padding-left: 3px; }

.bloque .fila input::placeholder {
  color: #c7c7c7;
  font-family: tahoma;
  font-size: 10px; }

.bloque .fila button {
  height: 20px !important; }

.bloque .check-left {
  margin-left: 0px; }

.bloque .fila .width-auto {
  width: auto !important; }

.bloque .fila .select-left {
  margin-left: 0px; }

.bloque .fila .select-right {
  margin-right: 0px; }

.bloque .item-field {
  display: flex;
  width: 100% !important;
  margin: 0px 1px; }

.bloque .item-field > * {
  width: 100% !important; }

.bloque .item-label-20 {
  display: flex;
  min-width: 20px !important;
  max-width: 20px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-40 {
  display: flex;
  min-width: 40px !important;
  max-width: 40px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-50 {
  display: flex;
  min-width: 50px !important;
  max-width: 50px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-60 {
  display: flex;
  min-width: 60px !important;
  max-width: 60px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label {
  display: flex;
  min-width: 70px !important;
  max-width: 70px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-80 {
  display: flex;
  min-width: 80px !important;
  max-width: 80px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-90 {
  display: flex;
  min-width: 90px !important;
  max-width: 90px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-110 {
  display: flex;
  min-width: 110px !important;
  max-width: 110px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-130 {
  display: flex;
  min-width: 130px !important;
  max-width: 130px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-140 {
  display: flex;
  min-width: 140px !important;
  max-width: 140px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-160 {
  display: flex;
  min-width: 160px !important;
  max-width: 160px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-170 {
  display: flex;
  min-width: 170px !important;
  max-width: 170px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-200 {
  display: flex;
  min-width: 200px !important;
  max-width: 200px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .item-label-300 {
  display: flex;
  min-width: 300px !important;
  max-width: 300px !important;
  padding-left: 5px !important;
  overflow: hidden; }

.bloque .fila .fecha-modal-auto .uib-datepicker-popup button {
  height: unset !important; }

.ui-select-erp {
  width: 100%; }

.auto-height {
  height: fit-content ! important;
  display: flex !important;
  flex: 1 !important; }

.item-1_12 {
  width: calc((1 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-2_12 {
  width: calc((2 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-3_12 {
  width: calc((3 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-4_12 {
  width: calc((4 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-5_12 {
  width: calc((5 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-6_12 {
  width: calc((6 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-7_12 {
  width: calc((7 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-8_12 {
  width: calc((8 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-9_12 {
  width: calc((9 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-10_12 {
  width: calc((10 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-11_12 {
  width: calc((11 * 100%) / 12);
  display: flex;
  height: 20px; }

.item-12_12 {
  width: calc((12 * 100%) / 12);
  display: flex;
  height: 20px; }

.bloque-column {
  display: flex;
  margin-bottom: 5px; }

.bloque-column > * {
  position: relative; }

.bloque-column > * > *:not(menu-derecho):not(menu-derecho-grid):not(loading-template) {
  width: 100% !important;
  position: relative; }

.item-column-1_15 {
  width: calc((1 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-2_15 {
  width: calc((2 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-3_15 {
  width: calc((3 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-4_15 {
  width: calc((4 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-5_15 {
  width: calc((5 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-6_15 {
  width: calc((6 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-7_15 {
  width: calc((7 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-8_15 {
  width: calc((8 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-9_15 {
  width: calc((9 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-10_15 {
  width: calc((10 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-11_15 {
  width: calc((11 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-12_15 {
  width: calc((12 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-13_15 {
  width: calc((13 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-14_15 {
  width: calc((14 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.item-column-15_15 {
  width: calc((15 * 100%) / 15);
  display: flex;
  margin: 0px 5px; }

.tab-erp-blue, .tab-erp, md-tabs {
  border-radius: 0px !important; }
  .tab-erp-blue md-tabs-wrapper, .tab-erp md-tabs-wrapper, md-tabs md-tabs-wrapper {
    height: 22px !important;
    background: #2d4c6d !important;
    color: white !important;
    border-left: 5px solid #ff9f28 !important;
    border-bottom: 1px !important; }
    .tab-erp-blue md-tabs-wrapper md-tabs-canvas, .tab-erp md-tabs-wrapper md-tabs-canvas, md-tabs md-tabs-wrapper md-tabs-canvas {
      height: 22px !important; }
      .tab-erp-blue md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item, .tab-erp md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item, md-tabs md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item {
        color: white !important;
        font-size: 13px !important;
        text-transform: none !important;
        padding: 0px 15px 0px 15px !important;
        font-weight: normal !important;
        font-weight: 700 !important;
        font-family: inherit !important; }
        .tab-erp-blue md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item md-ripple-container *, .tab-erp md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item md-ripple-container *, md-tabs md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-tab-item md-ripple-container * {
          background: yellow !important; }
        .tab-erp-blue md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-ink-bar, .tab-erp md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-ink-bar, md-tabs md-tabs-wrapper md-tabs-canvas md-pagination-wrapper md-ink-bar {
          top: 21px !important;
          background: #ff9f28 !important; }
  .tab-erp-blue md-tabs-content-wrapper md-tab-content, .tab-erp md-tabs-content-wrapper md-tab-content, md-tabs md-tabs-content-wrapper md-tab-content {
    border-bottom: 1px solid #e4ecf1 !important;
    border-left: 1px solid #e4ecf1 !important;
    border-right: 1px solid #e4ecf1 !important;
    border-top: 0px !important; }
    .tab-erp-blue md-tabs-content-wrapper md-tab-content md-tabs-template md-content, .tab-erp md-tabs-content-wrapper md-tab-content md-tabs-template md-content, md-tabs md-tabs-content-wrapper md-tab-content md-tabs-template md-content {
      padding: 5px !important; }

.ui-grid {
  border-color: 1px solid #e4ecf1 !important; }
  .ui-grid .ui-grid-contents-wrapper div .ui-grid-header .ui-grid-top-panel .ui-grid-header-viewport .ui-grid-header-canvas .ui-grid-header-cell-wrapper {
    background: #145d89 !important;
    color: white !important;
    padding: 1px !important; }
    .ui-grid .ui-grid-contents-wrapper div .ui-grid-header .ui-grid-top-panel .ui-grid-header-viewport .ui-grid-header-canvas .ui-grid-header-cell-wrapper .ui-grid-header-cell-row .ui-grid-header-cell {
      background: #145d89 !important;
      color: white !important;
      padding: 1px !important; }
    .ui-grid .ui-grid-contents-wrapper div ui-grid-footer .ui-grid-footer-aggregates-row {
      background: #145d89 !important;
      color: white !important; }

.card-container .card .front {
  height: 100%;
  position: relative;
  width: 100%;
  padding: 28px;
  top: 0;
  left: 0;
  z-index: 11;
  -webkit-transform: rotateX(0deg) rotateY(0deg);
  -moz-transform: rotateX(0deg) rotateY(0deg);
  -ms-transform: rotateX(0deg) rotateY(0deg);
  -o-transform: rotateX(0deg) rotateY(0deg);
  transform: rotateX(0deg) rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /* -- transition is the magic sauce for animation -- */
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  background: #145d89 !important; }
  .card-container .card .front p {
    font-family: tahoma;
    font-weight: normal;
    font-size: 20px !important;
    width: 170px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden; }
  .card-container .card .front span {
    font-family: tahoma;
    font-weight: normal;
    font-size: 13px !important; }
  .card-container .card .front i {
    color: #145d89; }
  .card-container .card .back {
    position: absolute;
    top: 0;
    border: 0;
    height: 100%;
    width: 100%;
    left: 0;
    z-index: 10;
    -webkit-transform: rotateY(-180deg);
    -moz-transform: rotateY(-179deg);
    /* setting to 180 causes an unnatural-looking half-flip */
    transform: rotateY(-179deg);
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    /* -- transition is the magic sauce for animation -- */
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    background: #145d89 !important; }
  .card-container .card .back:hover {
    color: #145d89 !important; }

.calendar .fc-header {
  background: #2d4c6d !important; }

.modal-dialog .modal-content .modal-header {
  padding: 5px;
  border-bottom: 0px;
  background: #2d4c6d;
  color: white;
  text-align: center;
  display: flex; }
  .modal-dialog .modal-content .modal-grid-default .modal-header {
    padding: 5px;
    border-bottom: 0px;
    background: #2d4c6d;
    color: white;
    text-align: center;
    display: flex; }
  .modal-dialog .modal-content .modal-grid-default .modal-footer {
    background: #2d4c6d; }

#sidebar {
  background-color: #2d4c6d !important; }

ul#navigation {
  background-color: #2d4c6d !important; }
  ul#navigation li a {
    color: white !important; }
  ul#navigation li ul {
    background-color: #145d89 !important; }
  ul#navigation li ul a {
    color: white !important; }
  ul#navigation li ul button {
    color: white !important; }
  ul#navigation li ul li div {
    background-color: white !important; }

.menuleft-style-basic, li.menuleft-style, li.menuleft-style.active {
  min-height: 28px;
  margin: 5px 0px;
  overflow: hidden;
  position: relative;
  height: 30px; }

li.menuleft-style {
  background-color: #145d89 !important; }
  li.menuleft-style:hover {
    background-color: #2d4c6d !important; }
  li.menuleft-style span.signal {
    background-color: #ff9f28 !important;
    margin-left: 28px; }

li.menuleft-style.active {
  background: none !important;
  background-color: #2d4c6d !important;
  border-radius: 0px !important;
  position: relative;
  padding: 0.75em 0 0.75em 0.5em; }
  li.menuleft-style.active:before {
    content: "";
    display: inline-block;
    border-bottom-width: 2px;
    border-left-width: 2px;
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    transform: rotate(-135deg);
    -webkit-transform-origin: 0% 100%;
    -moz-transform-origin: 0% 100%;
    -ms-transform-origin: 0% 100%;
    -o-transform-origin: 0% 100%;
    transform-origin: 0% 100%;
    position: absolute;
    top: -50%;
    bottom: 50%;
    left: 0.95em;
    right: 0;
    background: #145d89 !important; }
  li.menuleft-style.active:after {
    /*content: "";
     display:inline-block;
     border-bottom-width:2px;
     border-right-width:2px;
     -webkit-transform: rotate(135deg);
     -moz-transform: rotate(135deg);
     -ms-transform: rotate(135deg);
     -o-transform: rotate(135deg);
     transform: rotate(135deg);
     -webkit-transform-origin: 100% 100%;
     -moz-transform-origin: 100% 100%;
     -ms-transform-origin: 100% 100%;
     -o-transform-origin: 100% 100%;
     transform-origin: 100% 100%;
     position:absolute;
     top:-50%;
     bottom:50%;
     left:0;
     right:1.1em;*/ }

.panel .panel-heading .panel-title .accordion-toggle span {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
  color: #ffd1ae; }

#header {
  background-color: #2d4c6d !important; }
  #header .branding {
    background-color: #2d4c6d !important; }
  #header .nav-right li {
    background-color: #2d4c6d !important; }
  #header .dropdown-menu li div {
    background: white; }
  #header .nav-profile ul li {
    background: white !important; }

/* COLORES CALENDARIO */
.profesores-grupos .calendar_color_clase {
  background: #7fabe8 !important;
  color: #fff !important;
  width: 20px !important;
  height: 5px !important;
  margin: 0px -2px 1px -2px !important;
  border-radius: 0px 15px 15px 0px !important; }

.profesores-grupos .calendar_color_clase > .fc-event-inner > .fc-event-time {
  display: none; }
/*.profesores-grupos .calendar_color_notas{
 background: $background_notas !important;
 color: $color_notas !important;
 width: 20px !important;
 height: 5px !important;
 margin: 0px -2px 1px -2px !important;
 border-radius: 0px 15px 15px 0px !important;
 }
 .profesores-grupos .calendar_color_notas > .fc-event-inner{
 }
 .profesores-grupos .calendar_color_notas > .fc-event-inner > .fc-event-time{
 display: none;
 }*/
.profesores-grupos .calendar_color_examen {
  background: #9e472e !important;
  color: #fff !important;
  width: 20px !important;
  height: 5px !important;
  margin: 0px -2px 1px -2px !important;
  border-radius: 0px 15px 15px 0px !important; }

.profesores-grupos .calendar_color_examen > .fc-event-inner > .fc-event-time {
  display: none; }

.profesores-grupos .calendar_color_notas {
  background: transparent !important;
  color: #608c5f !important;
  width: 60px !important;
  font-size: 11px !important;
  height: 18px !important;
  text-align: center;
  padding: 1px !important;
  border: 1px dashed #75ab74 !important;
  margin: 0px -2px 2px 0px !important; }

.profesores-grupos .calendar_color_notas > .fc-event-inner > .fc-event-time {
  display: none; }
/* END COLORES CALENDARIO */
.buscador-pagina {
  margin-bottom: 10px !important; }

.buscador-pagina .cabecera-buscador {
  border-bottom: 1px solid #2d4c6d;
  border-left: 2px solid #ff9f28;
  margin-bottom: 5px;
  padding-left: 5px;
  color: #2d4c6d; }