/******* general ******/
.floatright{
  float: right;
}

.textred{
  color: red;
}
.textgreen{
  color: green;
}
.textgrey{
  color: grey;
}

.btn{
  border-radius: 3px !important;
}

.btn-danger{
  background-color: #ff3a30;
  border-color:  #ff3a30;
}

.btn-add{
  width: 200px;
  text-align: center;
  position: relative;
}

.btn-add span{
  position: absolute;
  left: 20px;
  top: 11px;
}

#mail{
  width: 200px;
  position: relative;
  margin: 15px 0px 10px 0px;
}
html{
  height: 100%;
}
body{
  min-height: 100%;
}
body{
  position: relative;
}

label{
  margin-left: 15px;
}

main{
  padding-bottom: 60px;
}

.clickable, select, a, button, .btn, .nice-checkbox{
  cursor: pointer;
}

.clickable{
  color: #13A89E;
}
.clickable:hover{
  text-decoration: underline;
}
/****** tables *******/
table{
  margin: 8px 0;
  border: 1px solid #E0E4E8;
  border-collapse: separate;
  border-radius: 3px;
}

thead{
  color: #fff;
}

.table>thead>tr>th {
  font-weight: 300;
  line-height: 40px;
}

thead th{
  border-color: #187c7a !important;
  border-bottom: none !important;
  background: #13a89e;
}

thead th:first-child{
  border-top-left-radius: 3px;
  -moz-border-radius-topleft: 3px;
  -webkit-border-top-left-radius: 3px;
}
thead th:last-child{
  border-top-right-radius: 3px;
  -moz-border-radius-topleft: 3px;
}



tbody{
  background: #fff;
}
.table button{
  display: block;
  margin: 0 auto;
}

th, td{
  padding: 8px 20px !important;
  position: relative;
  min-width: 110px;
}

td:after {
  content : "";
  position: absolute;
  left    : 0;
  bottom  : 15%;
  height  : 70%;/* or 100px */
  border-right: 1px solid #c8c8c8;
  opacity: 0.8;
}


th:after {
  content : "";
  position: absolute;
  left    : 0;
  bottom  : 15%;
  height  : 70%;/* or 100px */
  border-right:1px solid #187c7a;
  opacity: 0.8;
}

td:first-child:after, th:first-child:after{
  border: none;
}


/********* directory table *************/
.table-directory  td:first-child{
  width: 300px;

}


/** table rooms ***/

.mid-header{
  background-color: #4b5668;
  color: #fff;
  font-weight: 600;
}

.room__item{
  min-width: 50px;
  display: inline-block;
  line-height: 2em;
  margin: 10px;
}


/********* header *************/
.header-text{
  float: left;
  height: 60px;
}
.header-text p{
  line-height: 60px;
}
.header-logo{
  position: absolute;
  left: 50%;
  top: 4px;
}
.header-logo a{
  margin: 0 auto;
}
.uam-logo{
  height: 50px;
}
.header-white{
  background: #fff;
  width: 100%;
  height: 70px;
}

.header-white__h{
  display: inline-block;
  margin: 0;
  font-size: 20pt;
  font-weight: 600;
  line-height: 70px;
}

.header-white .input-group {
  width: 300px;
  float: right;
  margin-top: 17px;
}

.header .header-profile > .profile-nav{
  margin-left: 50px;
}

.header .glyphicon{
  color: #5BB75B;
}

.header a:hover{
  color: #5BB75B;
}

.header-white .fa{
    font-size: 1.2em;
  color: #5BB75B;
}
.fa.fa-search{
  font-size: 1.2em;
  color: #5BB75B;
}

.header-white .input-group .btn{
  margin: 3px;
  border-left: 1px solid #E0E4E8 !important;
  padding: 2px 10px 2px 12px;
}


/*********** popup ************/
.modal-header{
  border: none;
}

.modal-body label{
  text-align: right;
}

.modal-title{
  text-align: center;
  font-weight: 600;
}
@media (min-width: 768px) {
  .modal-dialog {
    width: 800px;
  }
  .modal-wide{
    width: 90%;
  }
}

.btn-popup{
  display: block;
  background: #fff;
  width: 120px;
  border: 1px solid #E0E4E8;
  font-size: 1.5em;
  margin-bottom: 15px;
}

@media (max-width: 768px) {
  .btn-popup{
    display: inline-block;
    float: right;
  }
  .btn-popup--save{
    margin-left: 20px;
  }
}

.btn-popup--save{
  color: #5BB75B;
}
.btn-popup--close{
  color: #ccc;
}
.btn-popup--delete {
  color: #ff3a30;
}

.modal-content .nice-checkbox label{
  margin-left: 0;
  vertical-align: top;
}

/**************** list *******************/
.list__item{
  width: 200px;
  background-color: #fff;
  height: 40px;
  margin: 7px 0;
  border-bottom: 1px solid #ccc;
}
.list__item:hover{
  background-color: #13A89E;
}
.list__item a{
  width: 100%;
  height: 100%;
  display: block;
  font-weight: 600;
  padding: 9px;
}
.list__item:hover a{
  text-decoration: none;
  color: #fff;
}

/*** nets ****/
.net{
  margin: 20px 0;
  background: #fff;
}
.net__day{
  margin: 6px 0;
  padding: 18px 6px 18px 6px;
}

.net-header{
  background: #13a89e;
  color: #fff;
  padding: 10px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;

}
.day-name{
  display: inline-block;
  width: 200px;
  text-align: center;
}

.td__item{
  margin-right: 15px;
}

.td__item-left{
  margin-left: 15px;
}

select {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20fill%3D%22%23555555%22%20%0A%09%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%22-261%20145.2%2024%2024%22%20style%3D%22enable-background%3Anew%20-261%20145.2%2024%2024%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M-245.3%2C156.1l-3.6-6.5l-3.7%2C6.5%20M-252.7%2C159l3.7%2C6.5l3.6-6.5%22%2F%3E%0A%3C%2Fsvg%3E") !important;
  padding-right: 25px;
  background-repeat: no-repeat;
  background-position: right center;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
.label-divider{
  text-align: center;
  margin-top: 9px;
}
.label-divider span{
  color: #5BB75B;
  font-size: 1.1em;
  margin-left: 19%;
}

.text-strike {
  text-decoration: line-through;
}

.text-underline {
  text-decoration: underline;
}

.usos-code{
  margin-right: 15px;
}

.filters{
  max-width: 500px;
}
.commission-span {
  display: inline-block;
  padding-right: 10px;
}

.btn-centered{
  width: 150px;
  display: block;
  margin: 0 auto;
}

.popup-delete__buttons button{
  margin: 1px 10px 10px;
}


/******************* CALENDAR ******************/

.calendar-table{
  /*max-width: 350px;*/
  cursor: pointer;
  margin: 25px auto;
}
.calendar-table .td{
  text-align: center;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  display: inline-block;
  vertical-align: top;
}
.calendar-table .td:first-child{
  border-left: 1px solid #ccc;
}
.calendar-table .tr:first-child{
  border-top: 1px solid #ccc;
}

/*** PLANS CALENDAR ****/
.plans .calendar-table{
  width: 210px;
}


.plans__table, .plans__calendar{
  padding: 15px;
  margin-top: 15px;
  background: #fff;
}
semester-calendar h2{
  color: #13a89e;
}
.plans .calendar-table .td{
  width: 30px;
  height: 30px;
  padding: 3px;
}
.calendar--selected .td{
  background: #5BB75B;
  color: #fff;
  border-color: #13A89E;
}

.calendar--selected {
  background: #5BB75B;
  color: #fff;
  border-color: #13A89E;
}

.filter--selected {
    background: #5BB75B;
  color: #fff;
  border-color: #13A89E;
  padding: 2px 10px;
  margin-left: -10px;
}

.plans .thead{
  background: #A0DCD8;
}
.plans .thead .td{
  color:  #000;
  width: 26px;
  background: none;
  border: none;
}

/**** CYCLE CALENDAR *****/

.cycles .calendar-table{
  max-width: 224px;
}
.cycles .calendar-table .td{
  width: 32px;
  height:  32px;
}

.cycles .thead {
  background: #A0DCD8;
  width: 224px;
}
.cycles .thead span{
  width: 28px;
  display: inline-block;
  text-align: center;
  color: #000;
  padding: 10px;
}

form.row{
  margin: 0!important;
}
/********** tympanus **************/

/* General button style (reset) */
.btn-confirm {
  position: relative;
  -webkit-transition: all0.51s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}

.btn-confirm:hover .fa{
  color: #000;
}
.btn-confirm:after {
  content: '';
  position: absolute;
  z-index: -1;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  transition: all 0.5s;
}

/*!* Button 1 *!*/
.activeDel {
  background: #fff;
  z-index: 10;
  animation: color 4s;
}

/* Button 1c */
.activeDel:after {
  width: 0%;
  height: 100%;
  top: 0;
  left: 0;
  background: #ff3a30;
  animation: move 4s;
  color: #fff;
}


.btn-default:hover{
  background: rgba(91, 183, 91, 0.67);
}
@keyframes move {
  0% {
    width: 100%;
  }

  100% {
    width: 0;
  }
}

@keyframes color {
  0%{
    color: #fff;
  }
  20%{
    color: #fff;
  }
  50%{
    color:  #ff3a30;
  }
  100%{
    color:  #ff3a30;
  }

}

.cycle-label {
  display: block;
  background: lightgrey;
  width: 100px;
  height: 100px;
}

.cycle-checkbox:checked + label {
  background: blue;
  color: white;
}

.active{
  background: #13a89e;
  color: #fff;
}




/***************/

div label input {
  margin-right:100px;
}
body {
  font-family:sans-serif;
}

.ck-button {
  margin:0;
  width: 100%;
  height: 100%;
  float:left;
  cursor: pointer;
}

.ck-button:hover {
  background: rgba(91,183,91,0.32);
  cursor: pointer;
}

.ck-button label {
  float:left;
  margin: 0;
  width: 100%;
  height: 100%;
}

.ck-button label span {
  text-align:center;
  padding: 7px 0px;
  display:block;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.ck-button label input {
  position:absolute;
  top:-20px;
  visibility: hidden;
}

.ck-button input:checked + span {
  background-color:  #5BB75B;
  color:#fff;
}



.m-t{
  margin-top: 15px;
}

.error{
  font-weight: 700;
  color: #d53128;
  text-align: center;

}


/************* pensa ***************/

th.wide{
  min-width: 160px;
}

.pensum-table .table>thead>tr>th{
  line-height: 1;
  vertical-align: middle;
}

.no-border{
  border-top: none !important;
}

/************ table ***************/

.narrow-table{
  font-size: 0.9em;
}

.narrow-table th, .narrow-table td{
    min-width: 10px;
    padding: 6px 4px !important;
}

.inline{
  display: inline-block;
}


.my-search{
  position: absolute;
    top: -53px;
    z-index: 100000;
    max-width: 300px;
    right: 65px;
    z-index: 0;
}

.semester-absolute{
  position: absolute;
  top: -70px;
  color: black;
  left: -810px;
}


.dashboard-h4{
  font-size: 1.5rem;
  text-align: center;
  padding: 8px 0;
  border-bottom: 1px solid #13a89e;
  background: rgba(19,168,158,0.1);
}

.dashboard-plan-day{
  vertical-align: top;
  margin: 1%;
  border-right: 1px dotted #ddd;
  width: 18%;
}

.dashboard-plan-hour{
  margin: 4px 8px;
  color: #13a89e;
}

.dashboard-plan-plan{
  border-left: 1px solid #13a89e;
  color: #000;
  margin-left: 5px;
  padding: 7px;
  border-bottom: 1px solid black;
}

.pensumheader{
  display: none;
}

@media print{
 
  .print {
    padding: 0;
    margin: auto;
    width: 100%;
  }
  
  .pensumheader{
  display: block;
  }

  .printdisplaynone{
    display: none;
  }
  
  .header-profile {
    display: none;
  }
}

.small-text {
  font-size: 12px;
}
.padding-zero-left{
  padding-left: 0px;
  padding-right: 5px;
   
}

.padding-zero{
  padding: 0;
}


.border-select-dashboard{
  border: 2px solid green;
}
.list-decoration-none{
  list-style-type: none;
}

.subscription-span{
  display: none;
}

.margin-top-3 {
  margin-top: 50px;
}

.not-accepted{
    font-weight: 900;
    color: #0f9087;
}
.table_span_padding{
  padding: 5px;
}
.table_width{
  width: 90%;
  height: auto;
}
.item__now{
  color: purple;
}
.item__next{
  color: red;
}
.item__last{
  color: grey;
}
.room__busy{
  color: orangered;
  padding-left: 3px;
}
.room__free{
  color: blue;
  padding-left: 3px;
}
.room__unused{
  color: black;
  padding-left: 3px;
}
.table__header__unused{
  color: black;
  padding-left: 3px;
}
.table__header__busy{
  color: orangered;
  padding-left: 3px;
}
.table__header__free{
  color: blue;
  padding-left: 3px;
}

@media screen and (max-width: 800px){
    .dashboard-plan-day{
        width: 100%;
        border: none;
    }
    .plans__day{
      background: rgba(0,0,0,0.1);
    }

    .events__day{
      background: rgba(0,0,0,0.05);
      font-size: 1.2rem;
      padding: 5px;
      border-radius: 5px;
    }
    .header-text p{
      line-height: initial;
      padding: 15px;
    }
    .header-logo{
      left: 63%;
    }
}

@media screen and (max-width: 540px){
  .header-logo{
      right: 10px;
      top: 5px;
      left: initial;
  }
  .header-profile a{
      color: #000 !important;
  }
}

.subscription__container{
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.subscription__box__asides{
  padding: 20px;
}

.subscription__box__asides strong{
  font-size: 1.5rem;
}

.subscription__email__label{
  text-align: center;
}

.load__free-rooms{
  display: none;
}

.form-send-message{
      padding-top: 20px;
    padding-bottom: 20px;
}

.form-send-message .form-textarea{
float: left;
width: 100%;
    margin-bottom: 15px;
}

.glyphicon-earphone{
  padding-left: 15px;
}

.toggleActive{
  display: block !important;
}
.toggleHide{
  display: none;
}

.clicked-plan-id {
  background-color: yellow;
}