.main-content {
  display: inline-block;
  vertical-align: top;
  padding-left: 25px;
  border-top: 1px solid #ccc;
  width: 76.6%;
  margin-left: -6px;

  .status-container {
    width: 98.4%;
    @include status-container(#f9f9f9);
  }

  .visit-actions {
    text-align: left;
    padding: 10px 0;
    padding-left: 10px;
    padding-bottom: 0;
    border: 1px solid #CCC;
    @include border-radius(2px);

    &.past-visit {
      color: $alert;
      background: white;
    }

    .label {
      text-align: left;
      padding-bottom: 5px;
      font-size: 0.9em;
    }

  }

  .visit-actions, .spaced {
     a {
       margin-right: 6px;
       margin-bottom: 4px;

       &:hover {
        color: white;
        text-decoration: none;
       }
     }
  }

  .ui-tabs {
    padding: 0;
  }

  h3 {
    margin-bottom: 0;
  }

  p.spaced {
    margin-bottom: 15px;
  }
}

#encountersList {
  li {
    margin-bottom: 20px;
  }

  .deleteEncounterId, .editEncounter {
    vertical-align: top;
  }

  .encounter-date, .encounter-details {
    display: block;
  }

  .encounter-date {
    font-size: 0.8em;
    color: #666;
    margin-bottom: 5px;
    strong {
      margin-right: 5px;
    }

    i {
      font-size: 1.1em;
      padding: 0;
      margin: -2px;
    }
  }


  .encounter-details {
    overflow: hidden;
    font-size: 0.8em;
    display: inline-block;
    border: 1px solid #ccc;

    li {
      display: inline-block;
      vertical-align: top;
      height: 28px;

      &>div {
        border-right: 1px solid #ccc;
        padding: 15px 10px;
        max-width: 321px;
      }

      &:first-child {
        &>div {
          padding: 10px;
        }
      }

      &:last-child {
        &>div {
          margin-left: -3px;
          border: none;
          background: #f9f9f9;
        }

        & > .details-action {
          max-width: 144px;
        }
      }
    }

    .encounter-type {
      border-left: 4px solid;

      strong {
        font-size: 1.2em;

        i {
          font-size: 1.6em;
          padding: 0;
        }

        span {
          vertical-align: super;
        }
      }
    }

    .view-details {
      background: #f9f9f9;

      .hide-details {
        display: none;
      }

     &:not(.collapsed) {
        .hide-details {
          display: inline;
        }

        .show-details {
          display: none;
        }

        .icon-caret-right {
          @include rotate(90deg); 
          @include transition-property(all);
          @include transition-duration(0.15s);
          @include transition-timing-function(ease-in-out);
        }
      }

      i {
        font-size: 1.2em;
        padding: 0;
        position: relative;
        top: 1px;
        left: -3px;
      }

      &:hover {
        text-decoration: none;
      }
    }
  }
}