html {
  background: #e2e2e2;  
}
body {
    font-family: 'Lato', sans-serif;
    margin: 0px;
    padding: 0px;
}
.embedContainer {
    overflow: hidden;
}
ul {
  padding-bottom: 20px;
}
.bioSection {
    margin: 15px;
    background-color: #ffffff;
    border-radius: 20px;
    outline: 1px solid #cccccc;
    box-sizing: border-box;
  font-size: 15px;
}
.bioSectionHeader {
    font-weight: 900;
    text-transform: uppercase;
    border-bottom: 1px solid #cccccc;
    padding: 15px;
    padding-left: 25px;
    font-size: 20px;
}

.headshotAndBasicInfo {
    display: flex;
    flex-direction: column;
    align-items: normal;
    padding: 0px;
    overflow: hidden;
}

.headshot {
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}

.headshot img{
    display:block;
    height: auto;
    width: 100%;
}

.basicInfo {
    padding: 25px;
}

.athleteName {
}

.athleteFirstName {
    font-size: 25px;
    line-height: 15px;
}

.athleteLastName {
    font-size: 40px;
    font-weight: 900;
    text-transform: uppercase;
}
.athleteSubtext {
    color: #999999;
}
.clubName {
    font-weight: 700;
    padding: 5px;
    font-weight: 17px;
}
.programName {
    padding: 5px;
    display: none;
}
.coaches {
    padding: 5px;
}
.quickFacts {
}
.quickFact {
    padding: 5px;
}

.introWords {
    font-weight: 700;
}
.bioResultEventName {
  font-weight: 700;
  font-size: 15px;
}
.bioResult {
  color: #999999;
  font-size: 14px;
}
li {
  padding: 5px;
  line-height: 25px;
}
.socialLinks {
  background-color: transparent;
  outline: none;
}
.socialLinks .bioSectionContent {
  text-align: center;
}
.athleteSocialIcon {
  width: 55px;
  height: 55px;
  display: inline-block;
}
.athleteSocialIcon img {
  display: block;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
/* 800px and higher _________________________________________________________________________________________________________________________________________________________________________*/
@media (min-width:800px){
.headshotAndBasicInfo {
    height: 300px;
    flex-direction: row;
    align-items: center;
}
.headshot {
    height: 100%;
    box-shadow: 6px 0 14px rgba(0, 0, 0, 0.12);
}
.headshot img{
    height: 100%;
    width: auto;
}

}