/* Import a Google Font */
@import url('https://fonts.googleapis.com/css?family=Nunito:400,700');
@import url('https://fonts.googleapis.com/css2?family=Philosopher:ital,wght@0,400;0,700;1,400;1,700');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

body {
  /* font-family: 'Open Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif; */
  font-family: 'Poppins', 'Open Sans', 'Montserrat', sans-serif;
}

.montserrat {
  font-family: "Montserrat";
}
.open-sans {
  font-family: "Open Sans";
}
.offset-left {
  position: relative;
  margin-left: -200px;
}
.border-grey {
  /* background-color: #FAF8F8 !important; */
  border: 1px solid rgb(224, 224, 224) !important;
  box-shadow: none !important;
}
body.site {
  background-color: white;
}
body.site .section {
  background-color: rgb(255, 255, 255);
  /* background-color: rgb(255, 0, 0); */
}
body {
  background-color: #FAF8F8;
  min-height: 100vh;
}
.section {
  background-color: #FAF8F8;
  margin-top: 0;
  padding-top: 0;
}
.section {
  padding: 1.5rem 0.5rem;
}
@media screen and (min-width: 1024px) {
  .section {
    padding: 1.5rem 1.2rem;
  }
}
.menu {
  /* // Use "is-2" in the column and fix the width here */
  width: 210px !important;
}
.menu-list a.active {
  font-weight: bold;
  color: var(--blue);
}
.main-content {
  background-color: #fafafa;
}
.navbar {
  /* background-color: #fafafa; */
  border-bottom: 1px solid #a0a0a0;
}
/*
.navbar-menu {
  a:hover {
    background-color: var(--blue);
    color: #fff;
  }
} */
.has-text-pink {
  color: var(--pink);
}
.has-text-blue {
  color: var(--blue);
}
h1 {
  /* font-family: "Ubuntu"; */
  color: #333;
}

.tab-content {
  padding: 1rem;
  display: none;
}

.tab-content.is-active {
  display: block;
}

@media screen and (min-width: 769px) {
  .modal-content,
  .modal-card {
    margin: 0 auto;
    max-height: calc(100vh - 40px);
    width: 740px;
  }
}

.label.inline {
  display: inline !important;
}

/* Form Error Messages */
div.is-danger input,
div.is-danger select,
div.is-danger textarea {
  border-color: hsl(348deg, 86%, 61%);
}

/******* TIMELINE *******/
.timeline {
  /* // width:100%;
  // max-width:800px; */
  background:#fff;
  padding: 50px 23px;
  position: relative;
  &:before {
    content: '';
    position: absolute;
    top: 0px;
    left:calc(22% + 19px);
    bottom: 0px;
    width: 4px;
    background: #ddd;
  }
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

.entry {
  clear: both;
  text-align: left;
  position: relative;
  .title {
    margin-bottom: .5em;
    float: left;
    width: 22%;
    padding-right: 30px;
    text-align: right;
    position: relative;
    &:before {
      content: '';
      position: absolute;
      width: 16px;
      height: 16px;
      border: 4px solid #ad1457;
      background-color:#fff;
      border-radius:100%;
      top: 15%;
      right: -16px;
      z-index: 99;
    }
    h4 {
      margin: 0;
    }
    p {
      margin: 0;
      font-size: 100%;
    }
  }
  .body {
    margin: 0 0 3em;
    float: left;
    width: 78%;
    padding-left: 30px;
    p {
      line-height: 1.4em;
      &:first-child {
        margin-top: 0;
        font-weight: 400;
      }
    }
    ul {
      color:#444;
      padding-left: 0;
      list-style-type: none;
      li:before {
        content: "–";
        margin-right: .5em;
      }
    }
  }
}