/* -------------------------------------
 * For horizontal version, set the
 * $vertical variable to false
 * ------------------------------------- */
/* -------------------------------------
 * General Style
 * ------------------------------------- */
@import url(http://fonts.googleapis.com/css?family=Noto+Sans);
/* line 24, ../compass/timeline.sass */
body {
  /*max-width: 1200px */
  margin: 0 auto;
  padding: 0 0;
  font-size: 100%;
  font-family: "Noto Sans", sans-serif;
  color: #eee9dc;
}

/* line 37, ../compass/timeline.sass */
.container-orange {
  background: #563f46;
  /* -------------------------------------
   * timeline
   * ------------------------------------- */
  /* -------------------------------------
   * mobile phones (vertical version only)
   * ------------------------------------- */
}
/* line 53, ../compass/timeline.sass */
.container-orange a {
  color: #d3f8f8;
}
/* line 55, ../compass/timeline.sass */
.container-orange h2 {
  margin: 3em 0 0 0;
  font-size: 1.5em;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-bottom: 4px solid #f8e5d3;
  padding-bottom: 8px;
}
/* line 62, ../compass/timeline.sass */
.container-orange h3 {
  margin: 2em 0 1em 0;
  font-size: 1.3em;
  letter-spacing: 2px;
  border-left: 4px solid #e87878;
  padding-left: 8px;
}
/* line 73, ../compass/timeline.sass */
.container-orange #timeline {
  list-style: none;
  margin: 50px 0 30px 120px;
  padding-left: 30px;
  border-left: 8px solid #eee9dc;
}
/* line 85, ../compass/timeline.sass */
.container-orange #timeline li {
  margin: 40px 0;
  position: relative;
}
/* line 94, ../compass/timeline.sass */
.container-orange #timeline p, .container-orange #timeline table {
  margin: 0 0 15px;
}
/* line 97, ../compass/timeline.sass */
.container-orange .date {
  margin-top: -10px;
  top: 50%;
  left: -158px;
  font-size: 0.95em;
  line-height: 20px;
  position: absolute;
}
/* line 110, ../compass/timeline.sass */
.container-orange .circle {
  margin-top: -10px;
  top: 50%;
  left: -44px;
  width: 10px;
  height: 10px;
  background: #563f46;
  border: 5px solid #eee9dc;
  border-radius: 50%;
  display: block;
  position: absolute;
}
/* line 128, ../compass/timeline.sass */
.container-orange .content {
  max-height: 20px;
  padding: 50px 20px 0;
  border-color: transparent;
  border-width: 2px;
  border-style: solid;
  border-radius: 0.5em;
  position: relative;
}
/* line 144, ../compass/timeline.sass */
.container-orange .content p, .container-orange .content table {
  max-height: 0;
  color: transparent;
  text-align: justify;
  word-break: break-word;
  hyphens: auto;
  overflow: hidden;
}
/* line 152, ../compass/timeline.sass */
.container-orange label {
  font-size: 1.3em;
  position: absolute;
  z-index: 100;
  cursor: pointer;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
  width: 85%;
  top: 20px;
  transition: transform 0.2s linear;
}
/* line 174, ../compass/timeline.sass */
.container-orange .radio {
  display: none;
}
/* line 177, ../compass/timeline.sass */
.container-orange .radio:checked + .image-box {
  width: 90%;
}
/* line 180, ../compass/timeline.sass */
.container-orange .radio:checked + .relative label {
  cursor: auto;
  transform: translateX(42px);
}
/* line 187, ../compass/timeline.sass */
.container-orange .radio:checked + .relative .circle {
  background: #f98262;
}
/* line 189, ../compass/timeline.sass */
.container-orange .radio:checked ~ .content {
  max-height: 440px;
  border-color: #eee9dc;
  margin-right: 20px;
  transform: translateX(20px);
  transition: max-height 0.4s linear, border-color 0.5s linear, transform 0.2s linear;
}
/* line 198, ../compass/timeline.sass */
.container-orange .radio:checked ~ .content:before, .container-orange .radio:checked ~ .content:after {
  content: "";
  width: 0;
  height: 0;
  border: solid transparent;
  position: absolute;
  pointer-events: none;
  right: 100%;
}
/* line 209, ../compass/timeline.sass */
.container-orange .radio:checked ~ .content:before {
  border-right-color: inherit;
  border-width: 20px;
  top: 50%;
  margin-top: -20px;
}
/* line 220, ../compass/timeline.sass */
.container-orange .radio:checked ~ .content:after {
  border-right-color: #563f46;
  border-width: 17px;
  top: 50%;
  margin-top: -17px;
}
/* line 231, ../compass/timeline.sass */
.container-orange .radio:checked ~ .content p, .container-orange .radio:checked ~ .content table {
  max-height: 200px;
  color: #eee9dc;
  transition: color 0.3s linear 0.3s;
}
@media screen and (max-width: 767px) {
  /* line 241, ../compass/timeline.sass */
  .container-orange .container {
    padding: 0 4px 0 13px;
  }
  /* line 243, ../compass/timeline.sass */
  .container-orange .timeline {
    padding: 48px 0;
  }
  /* line 245, ../compass/timeline.sass */
  .container-orange label {
    width: 85%;
    font-size: 1.1em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    transform: translateX(18px);
  }
  /* line 253, ../compass/timeline.sass */
  .container-orange .content {
    padding: 50px 10px 0;
  }
  /* line 255, ../compass/timeline.sass */
  .container-orange #timeline {
    margin: 50px 0 5px 40px;
    padding-left: 10px;
  }
  /* line 258, ../compass/timeline.sass */
  .container-orange #timeline li {
    margin: 40px 0;
  }
  /* line 260, ../compass/timeline.sass */
  .container-orange .circle {
    left: -24px;
  }
  /* line 262, ../compass/timeline.sass */
  .container-orange .date {
    left: -65px;
  }
  /* line 264, ../compass/timeline.sass */
  .container-orange .row {
    margin-right: -4px;
    margin-left: -13px;
  }
}

/* line 37, ../compass/timeline.sass */
.container-blue {
  background: #47818C;
  /* -------------------------------------
   * timeline
   * ------------------------------------- */
  /* -------------------------------------
   * mobile phones (vertical version only)
   * ------------------------------------- */
}
/* line 53, ../compass/timeline.sass */
.container-blue a {
  color: #becbf4;
}
/* line 55, ../compass/timeline.sass */
.container-blue h2 {
  margin: 3em 0 0 0;
  font-size: 1.5em;
  letter-spacing: 2px;
  text-transform: uppercase;
  border-bottom: 4px solid #ddebee;
  padding-bottom: 8px;
}
/* line 62, ../compass/timeline.sass */
.container-blue h3 {
  margin: 2em 0 1em 0;
  font-size: 1.3em;
  letter-spacing: 2px;
  border-left: 4px solid #46578b;
  padding-left: 8px;
}
/* line 73, ../compass/timeline.sass */
.container-blue #timeline {
  list-style: none;
  margin: 50px 0 30px 120px;
  padding-left: 30px;
  border-left: 8px solid #eee9dc;
}
/* line 85, ../compass/timeline.sass */
.container-blue #timeline li {
  margin: 40px 0;
  position: relative;
}
/* line 94, ../compass/timeline.sass */
.container-blue #timeline p, .container-blue #timeline table {
  margin: 0 0 15px;
}
/* line 97, ../compass/timeline.sass */
.container-blue .date {
  margin-top: -10px;
  top: 50%;
  left: -158px;
  font-size: 0.95em;
  line-height: 20px;
  position: absolute;
}
/* line 110, ../compass/timeline.sass */
.container-blue .circle {
  margin-top: -10px;
  top: 50%;
  left: -44px;
  width: 10px;
  height: 10px;
  background: #47818C;
  border: 5px solid #eee9dc;
  border-radius: 50%;
  display: block;
  position: absolute;
}
/* line 128, ../compass/timeline.sass */
.container-blue .content {
  max-height: 20px;
  padding: 50px 20px 0;
  border-color: transparent;
  border-width: 2px;
  border-style: solid;
  border-radius: 0.5em;
  position: relative;
}
/* line 144, ../compass/timeline.sass */
.container-blue .content p, .container-blue .content table {
  max-height: 0;
  color: transparent;
  text-align: justify;
  word-break: break-word;
  hyphens: auto;
  overflow: hidden;
}
/* line 152, ../compass/timeline.sass */
.container-blue label {
  font-size: 1.3em;
  position: absolute;
  z-index: 100;
  cursor: pointer;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  display: block;
  width: 85%;
  top: 20px;
  transition: transform 0.2s linear;
}
/* line 174, ../compass/timeline.sass */
.container-blue .radio {
  display: none;
}
/* line 177, ../compass/timeline.sass */
.container-blue .radio:checked + .image-box {
  width: 90%;
}
/* line 180, ../compass/timeline.sass */
.container-blue .radio:checked + .relative label {
  cursor: auto;
  transform: translateX(42px);
}
/* line 187, ../compass/timeline.sass */
.container-blue .radio:checked + .relative .circle {
  background: #f98262;
}
/* line 189, ../compass/timeline.sass */
.container-blue .radio:checked ~ .content {
  max-height: 440px;
  border-color: #eee9dc;
  margin-right: 20px;
  transform: translateX(20px);
  transition: max-height 0.4s linear, border-color 0.5s linear, transform 0.2s linear;
}
/* line 198, ../compass/timeline.sass */
.container-blue .radio:checked ~ .content:before, .container-blue .radio:checked ~ .content:after {
  content: "";
  width: 0;
  height: 0;
  border: solid transparent;
  position: absolute;
  pointer-events: none;
  right: 100%;
}
/* line 209, ../compass/timeline.sass */
.container-blue .radio:checked ~ .content:before {
  border-right-color: inherit;
  border-width: 20px;
  top: 50%;
  margin-top: -20px;
}
/* line 220, ../compass/timeline.sass */
.container-blue .radio:checked ~ .content:after {
  border-right-color: #47818C;
  border-width: 17px;
  top: 50%;
  margin-top: -17px;
}
/* line 231, ../compass/timeline.sass */
.container-blue .radio:checked ~ .content p, .container-blue .radio:checked ~ .content table {
  max-height: 200px;
  color: #eee9dc;
  transition: color 0.3s linear 0.3s;
}
@media screen and (max-width: 767px) {
  /* line 241, ../compass/timeline.sass */
  .container-blue .container {
    padding: 0 4px 0 13px;
  }
  /* line 243, ../compass/timeline.sass */
  .container-blue .timeline {
    padding: 48px 0;
  }
  /* line 245, ../compass/timeline.sass */
  .container-blue label {
    width: 85%;
    font-size: 1.1em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
    transform: translateX(18px);
  }
  /* line 253, ../compass/timeline.sass */
  .container-blue .content {
    padding: 50px 10px 0;
  }
  /* line 255, ../compass/timeline.sass */
  .container-blue #timeline {
    margin: 50px 0 5px 40px;
    padding-left: 10px;
  }
  /* line 258, ../compass/timeline.sass */
  .container-blue #timeline li {
    margin: 40px 0;
  }
  /* line 260, ../compass/timeline.sass */
  .container-blue .circle {
    left: -24px;
  }
  /* line 262, ../compass/timeline.sass */
  .container-blue .date {
    left: -65px;
  }
  /* line 264, ../compass/timeline.sass */
  .container-blue .row {
    margin-right: -4px;
    margin-left: -13px;
  }
}
