section {
  margin-bottom: 100px;
}
.right,
.left {
  width: 50%;
  display: inline-block;
  height: 100%;
}
.right {
  margin: 15vh 0;
}
.section-content a:link {
  color: #6123b4;
}

/* About section */
section.intro {
  white-space: nowrap;
}
section.intro * {
  vertical-align: middle;
}
h2.name-tag.purple {
  margin: 0 0 120px 0;
  font-family: "NeoDisplay--bold";
  font-size: 25px;
}
.contact-block * {
  font-family: "MaisonNeue--light";
  font-weight: 400;
}
h1.bio {
  font-size: 3.5vw;
  white-space: normal;
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 80px;
  max-width: 685px;
  padding-right: 20px;
  margin: 0 0 120px 0;
}
img.intro-image {
  max-height: 100vh;
  width: 100%;
  float: right;
  margin-right: -1px;
}

.intro .left {
  background: url("./assets/matthew-photo2.png");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top right;
  max-height: 800px;
  width: 40%;
  position: absolute;
  right: 0px;
}

.learn-more {
  max-width: 100px;
  text-align: center;
}

.learn-more p {
  margin-bottom: 8px;
}
.learn-more a {
  color: black;
  font-weight: bold;
}
.learn-more-button {
  padding: 12px;
  display: inline-block;
  border: 1px solid;
  border-radius: 50%;
}

/* About section */
.about-block {
  position: relative;
  width: 40%;
  display: inline-block;
  font-size: 16px;
  margin: 2% 4%;
  line-height: 25px;
}

/* Study groups section */
section.study-groups .section-content p {
  margin: 25px 0px;
  line-height: 25px;
}

section.study-groups .section-content p:first-of-type {
  margin-top: 0px;
}

section.about .section-content .about-block:nth-of-type(-n + 2),
section.about .section-content .about-block p:nth-of-type(-n + 2) {
  margin-top: 0px;
}

section.about .section-content .about-block:nth-of-type(n + 3):before {
  content: "";
  position: absolute;
  width: 12px;
  height: 1px;
  background: black;
  top: -8px;
}

.contact-block div {
  width: 40%;
  margin: 4%;
  display: inline-block;
}
.contact-block div {
  width: 30%;
  padding: 0px 10% 0px 0;
  margin: 4%;
  font-size: 19px;
  display: inline-block;
}

/* News */
.news-piece {
  padding: 30px 0px;
}
.news-piece .date {
  font-style: italic;
  color: #9a9a9a;
  font-size: 14px;
}
.news-piece:first-of-type {
  padding-top: 0px;
}
.news-piece p {
  display: inline-block;
  width: calc(100% - 170px);
  margin: 0px;
}
.news-piece p.date {
  width: 150px;
}

/* Recent History */
.filters ul {
  list-style-type: none;
  display: inline-block;
  margin: 0px;
}
.filters ul li {
  display: inline-block;
  margin: 0px 20px;
}
.history-content {
  margin-top: 60px;
}

section.recent-history > input {
    display: none;
}

.filters > ul > label > li {
    color: #6123b4;
    text-decoration: none;
    cursor: pointer;
} 

input[name='historySelector'][id='historyAll']:checked ~ .section-content > .filters > ul >  label.historySelectAll > li{
    text-decoration: underline;
}
input[name='historySelector'][id='historyPolicy']:checked ~ .section-content > .filters > ul > label.historySelectPolicy  > li{
    text-decoration: underline;
} 
input[name='historySelector'][id='historyData']:checked ~ .section-content > .filters > ul > label.historySelectData > li {
    text-decoration: underline;
} 
input[name='historySelector'][id='historyMath']:checked ~ .section-content > .filters > ul > label.historySelectMath  > li{
    text-decoration: underline;
} 
input[name='historySelector'][id='historyBiz']:checked ~ .section-content > .filters > ul > label.historySelectBiz > li {
    text-decoration: underline;
} 
input[name='historySelector'][id='historyProg']:checked ~ .section-content > .filters > ul > label.historySelectProg > li{
    text-decoration: underline;
}  

.section-content > .history-content > .history-piece > .h-content {
    max-height:0;
    overflow:hidden;
    margin-top:0px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyAll']:checked ~ .section-content > .history-content > .history-piece > .h-content {
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyPolicy']:checked ~ .section-content > .history-content > .history-piece > .topic-policy {
    height: auto;
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyData']:checked ~ .section-content > .history-content > .history-piece > .topic-data {
    height: auto;
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyMath']:checked ~ .section-content > .history-content > .history-piece > .topic-math {
    height: auto;
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyBiz']:checked ~ .section-content > .history-content > .history-piece > .topic-biz {
    height: auto;
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

input[name='historySelector'][id='historyProg']:checked ~ .section-content > .history-content > .history-piece > .topic-prog {
    height: auto;
    margin-top:30px;
    max-height:999px;
    transition: max-height 0.45s ease;
}

.h-content p {
  font-size: 16px;
  line-height: 22px;
}
p.h-text {
  margin-top: 0;
}
.h-date {
  font-style: italic;
  margin-bottom: 2px;
}
.h-year {
  position: relative;
  top: -5px;
  font-size: 25px;
  font-weight: bold;
  margin: 0px;
}
.history-piece.history-left:before {
  content: "";
  position: absolute;
  top: 0px;
  right: -5.5px;
  height: 9px;
  width: 9px;
  border-radius: 50%;
  background: black;
}

.history-piece {
  position: relative;
  width: 46%;
  padding-bottom:70px;
}
.history-piece:last-child
{
    padding-bottom:0;
}
.history-piece.history-left {
  border-right: 2px solid black;
  padding-right: 4%;
  text-align: right;
}
.history-piece.history-right {
  border-left: 2px solid black;
  padding-left: 4%;
  margin-left: 50%;
}

.history-piece.history-right:before {
  content: "";
  position: absolute;
  top: 0px;
  left: -5.5px;
  height: 9px;
  width: 9px;
  border-radius: 50%;
  background: black;
}


/* Fixes */
@media (max-width: 1035px) {
  main {
    margin-left: 140px;
    width: calc(100% - 145px);
  }
  .right {
    margin: 20px;
  }
  .right h2.name-tag.purple,
  .right h1,
  .right div {
    margin-bottom: 70px;
  }
  h1.bio {
    line-height: 45px;
  }
}

@media (max-width: 800px) {
  .contact-block div {
    display: block;
    width: 100%;
  }
}

/* Mobile adjustment */

@media (max-width: 640px) {
  main {
    margin: 0;
    width: 100%;
  }
  .learn-more {
    display: none;
  }
  .right {
    display: block;
    margin: 120px 0 50px 0;
    padding: 0px;
    width: 100%;
    text-align: center;
  }
  h1.bio {
    font-size: 34px;
    text-align: justify;
    width: 90%;
    margin: auto;
    padding: 0px;
  }
  .intro .left {
    display: block;
    position: relative;
    width: 100%;
    height: 500px;
    background-position: center;
  }
  section .section-content {
    width: 100%;
  }
  .about-block {
    width: 90%;
    margin: 0px auto;
    display: block;
    margin-bottom: 40px;
  }
  section.about .section-content .about-block:nth-of-type(n + 2):before {
    content: "";
    position: absolute;
    width: 12px;
    height: 1px;
    background: black;
    top: -8px;
  }
  .contact-block div {
    width: 90%;
    margin: auto;
    padding: 0px;
  }
  .news-piece p.date {
    padding-left: 5%;
    box-sizing: border-box;
  }
  .filters {
    margin-left: 5%;
  }
  .filters ul {
    padding-left: 10px;
    margin-top: 1px;
  }
  .filters ul li {
    margin: 0 7px;
  }
  .history-piece.history-left,
  .history-piece.history-right {
    border: none;
    padding: 0;
    text-align: left;
    width: 90%;
    margin: auto;
  }
  .history-piece.history-left:before,
  .history-piece.history-right:before {
    display: none;
  }
  section.study-groups .section-content {
    width: 90%;
    padding: 0px 5%;
  }
}