.graph-events {
  position: relative;
  padding: 0 0 0;
  margin-top: -30px;
  background: #ffffff;
  -webkit-transform: translateY(100px);
  transform: translateY(100px);
  -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  transition: opacity 0.5s ease, -webkit-transform 0.5s ease;
  transition: transform 0.5s ease, opacity 0.5s ease;
  transition: transform 0.5s ease, opacity 0.5s ease, -webkit-transform 0.5s ease;
  opacity: 0; }
.graph-events--aero { margin-bottom: 57px; margin-top: 0px; }
.graph-events--sugar { padding: 130px 0; margin-bottom: 60px; background-color: #F6F9FB; }
.graph-events--rescue { padding: 130px 0; margin-bottom: 70px; }

  .graph-events .full-wrapper {
    max-height:255px;
    max-width: 1120px;
  }
    .graph-events .holder {
      -webkit-border-radius: 3px;
      -moz-border-radius: 3px;
      border-radius: 3px;
      -webkit-box-shadow: 0px -2px 5px 0px rgba(128,128,128,0.3);
      -moz-box-shadow: 0px -2px 5px 0px rgba(128,128,128,0.3);
      box-shadow: 0px -2px 5px 0px rgba(128,128,128,0.3);
      padding: 20px; }
    .graph-events--sugar .holder { background-color: #FFF; padding: 40px 20px; }
    .graph-events .holder:after { content: ""; clear: both; display: block; }
  @media only screen and (max-width: 991px) {
    .graph-events {
      padding: 60px 0 0; } }
  @media only screen and (max-width: 767px) {
    .graph-events {
      padding: 40px 0 0; } }
  .graph-events__block-wrap {
    position: relative;
    margin: 19px 0 0 0; }
    @media only screen and (max-width: 767px) {
      .graph-events__block-wrap {
        margin: 32px 0 0 0; } }
  .graph-events__h2 {
    margin: 0; }
.graph-events__h2.readable--modif {
  display: none }
    .graph-events__h2 span {
      display: block;
      text-align: center;
      color: #00afdd;
      font: bold 30px/130% "Stem", sans-serif; }
      @media only screen and (max-width: 991px) {
        .graph-events__h2 span {
          font: bold 24px/130% "Stem", sans-serif; } }
      @media only screen and (max-width: 767px) {
        .graph-events__h2 span {
          font: bold 18px/130% "Stem", sans-serif; } }
  .graph-events__wrapper {
    position: relative; }
  .graph-events.active {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1; }
  .graph-events__title  {
    float: left;
    width: 150px;
    padding-top: 3px;
    text-transform: uppercase; }
    @media only screen and (max-width: 767px) {
      .graph-events__title {
        float: none;
        padding-top: 5px;
        margin-bottom: 5px;
        width: auto; } }      
  .graph-events__list  {
    margin-left: 180px;
    overflow-y: auto;
    font: 300 16px/125% "Stem", sans-serif;
    max-height: 215px; }    
    @media only screen and (max-width: 767px) {
      .graph-events__list {
        max-height: 190px; 
        margin-left: 0; } }    
  .graph-events__event-date  {
    float: left;
    font-size: 75%;
    color: #999;
    padding: 7px 0 3px;}     
  .graph-events__event-name  {
    margin-left: 90px;
    border-bottom: 1px solid #d9d9d9;
    padding: 5px 0;
    margin-right: 20px; }  
    @media only screen and (max-width: 767px) {
      .graph-events__event-name {
        margin-left: 80px; } }    
  .graph-events__event-detail {
    display: none; }
  .graph-events__event.full-text {
  cursor: pointer; }
  .graph-events__event.full-text .graph-events__event-name {
  color: #4bbdcf;
  transition: color 0.3s ease, opacity 0.3s ease;  }
  .graph-events__event.full-text .graph-events__event-name:hover, 
  .graph-events__event.full-text .graph-events__event-name:active, 
  .graph-events__event.full-text .graph-events__event-name:focus {
  color: #007b87;
  text-decoration: none; }     
    
#graph-events_card .modal-dialog {
  padding: 0;
  max-width: 860px !important; }

#graph-events_card .modal-body {
  padding: 0; }

#graph-events_card .modal-content {
  position: relative;
  max-width: 100% !important; }
  @media only screen and (max-width: 767px) {
    #graph-events_card .modal-content {
      background: white !important; } }

#graph-events_card .modal-close {
  position: absolute;
  -webkit-transition: opacity 0.3s ease;
  transition: opacity 0.3s ease; }
  @media only screen and (min-width: 991px) {
    #graph-events_card .modal-close {
      top: -35px;
      right: -45px;
      width: 35px;
      height: 35px; } }
  @media only screen and (max-width: 991px) {
    #graph-events_card .modal-close {
      top: 0;
      right: 0;
      width: 45px;
      height: 45px; } }
  #graph-events_card .modal-close:before, #graph-events_card .modal-close:after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -1.5px 0 0 -10px;
    width: 20px;
    height: 3px;
    background: #ed1c24;
    border-radius: 2px; }
  #graph-events_card .modal-close:before {
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg); }
  #graph-events_card .modal-close:after {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg); }
  #graph-events_card .modal-close:hover, #graph-events_card .modal-close:active {
    opacity: 0.85; }

.graph-events-card {
  background: white; }
  @media only screen and (min-width: 767px) {
    .graph-events-card {
      display: table;
      width: 100%; } }
  @media only screen and (min-width: 991px) {
    .graph-events-card {
      padding: 45px; } }
  @media only screen and (max-width: 991px) and (min-width: 767px) {
    .graph-events-card {
      padding: 25px; } }
  @media only screen and (max-width: 767px) {
    .graph-events-card {
      padding: 20px; } }
  @media only screen and (min-width: 767px) {
    .graph-events-card__cell {
      display: table-cell;
      vertical-align: top; } }
  @media only screen and (min-width: 767px) {
    .graph-events-card__cell:first-child {
      padding: 0 20px; } }
  @media only screen and (min-width: 991px) {
    .graph-events-card__cell:first-child {
      width: 270px; } }
  @media only screen and (max-width: 991px) and (min-width: 767px) {
    .graph-events-card__cell:first-child {
      width: 200px; } }
  @media only screen and (min-width: 767px) {
    .graph-events-card__cell:last-child {
      padding: 0 20px 0 0; } }
  .graph-events-card__image {
    display: block;
    max-width: 100%; }
    @media only screen and (min-width: 767px) {
      .graph-events-card__image {
        margin: 0 auto; } }
    @media only screen and (max-width: 767px) {
      .graph-events-card__image {
        margin: 0 0 20px; } }
  .graph-events-card__heading {
    color: #222528; }
    @media only screen and (min-width: 767px) {
      .graph-events-card__heading {
        position: relative;
        margin: 0 0 30px;
        font: 500 24px/100% "Stem", sans-serif; }
        .graph-events-card__heading:before, .graph-events-card__heading:after {
          content: '';
          position: absolute;
          left: 0;
          bottom: -16px;
          height: 2px; }
        .graph-events-card__heading:before {
          width: 124px;
          background: #bcbdbe; }
        .graph-events-card__heading:after {
          width: 40px;
          background: #222528; } }
    @media only screen and (max-width: 767px) {
      .graph-events-card__heading {
        margin: 0 0 15px;
        font: 500 20px/120% "Stem", sans-serif; } }
  .graph-events-card__desc {
    margin: 0 0 20px; }
    @media only screen and (min-width: 991px) {
      .graph-events-card__desc {
        font: 300 18px/130% "Stem", sans-serif; } }
    @media only screen and (max-width: 991px) {
      .graph-events-card__desc {
        font: 300 16px/130% "Stem", sans-serif; } }
  .graph-events-card__link {
    font: 300 18px/100% "Stem", sans-serif;
    -webkit-transition: color 0.3s ease;
    transition: color 0.3s ease; }