.clear-top { margin-top: 0px; }
.container { width: 970px; }

.md-scroll {
  max-height:655px; 
  overflow:auto;
}

@media(max-width: 768px){
  .container { width: auto; }
  .md-scroll { max-height: 100%; }
}

@media(min-width: 768px){

  .thumbnail {
    position: relative; 
    cursor: pointer;
  }
  .thumbnail.selected:before{
    content: "";
    border-right: 1px solid #0096D6;
    border-bottom: 1px solid #0096D6;
    position: absolute;
    bottom: -2px;
    right: -2px;
    width: 101%;
    height: 101%;
    z-index: -1;
    animation: border-drawing 0.5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
  }
  .thumbnail.selected:after{
    content: "";
    border-left: 1px solid #0096D6;
    border-top: 1px solid #0096D6;
    position: absolute;
    left: -2px;
    top: -2px;
    width: 101%;
    height: 101%;
    z-index: -1;
    animation: border-drawing 0.5s;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
  }
  @keyframes border-drawing{
    0% { width: 0%; height: 0%;}
    100% { width: 100%; height: 100%;}
  }
}

.timetable-collapse-trigger {
  color: inherit;
}
.timetable-collapse-trigger.ng_Collapsed:after {
  content: "\25b6";
}
.timetable-collapse-trigger:after{
  content: "\25bc";
  font-size: 10px;
  position: relative;
  top: -1px;
}
.timetable td { 
  padding: 3px 6px;
}

.animate-collapse{
  transition: all linear 0.5s;
  -moz-transition: max-height 0.5s;
  -ms-transition: max-height 0.5s;
  -o-transition: max-height 0.5s;
  -webkit-transition: max-height 0.5s;
  transition: max-height 0.5s;
  max-height: 400px;
}
.animate-collapse.ng-hide {
  max-height: 0;
}