:root {
    font-family: "Nanum Gothic Coding", monospace;
    font-weight: 500;
    font-style: normal;
    /*darks*/
    --dark0: #3c1238;
    --dark1: #552150;
    /*lights*/
    --light-1: #c0cbd9;
    --light0: #d7dde6;
    --light1: #ebeef3;
    
    /*Accent*/
    --lightblue: #88c0d0;
    --lightgrayblue: #81a1c1;
    --lightdarkblue: #5e81ac;
    --uofu: #bf616a;

  }
  
  body {
    background-color: var(--nord5);
  }
  
  * {
    color: black;
    text-decoration: none;
    list-style: none;
    margin: 0;
    padding: 0;
  }

  
  .about__container {
    display: flex;
    justify-content: space-between;
    background-color: var(--light1);
    margin: auto;
    margin-top: 40px;
    border-radius: 8px;
    padding: 1rem;
    width: 95%;
  }
  
  .personal_container {

    margin: auto;
  }
  #name_header {
    font-size: 4rem;
    font-family: "IBM Plex Mono", monospace;
    font-weight: 500;
    font-style: normal;
    text-align: center;
  }
  .name_header_subtext {
    color: gray
  }
  .interests {
    padding-left: 2rem;
  }
  
  .interests li {
    list-style: disc;
  }
  
  #picture {
    width: 700px;
    border: solid 4px var(--lightblue);
    border-radius: 50%;
    margin: 2rem;
  }
  
  .text_blurb {
    margin: auto;
    font-size: 1.5rem;
    max-width: 800px;
    padding: 1rem;
  }
  
  .utah {
    font-weight: bold;
    text-decoration: underline;
    color: var(--uofu);
  }
  
  
  .media_links {
    display: flex;
    margin: auto;
    font-size: 1rem;
    justify-content: center;
    padding-bottom: 2rem;
  }
  
  .media-image{
    width: 60px;
  }
  
  .media-image:hover{
    filter: brightness(150%);
  }
  
  .media_links li {
    padding-right: 1rem;
  }
  
  /*medium screen*/
  @media screen and (max-width: 1200px) {
    .about__container {
      flex-direction: column;
    }
  }
  
  /*small screen*/
  @media screen and (max-width: 800px) {
    #picture {
      width: 80vw;
    }
  }
  
  /* Skills */
  #skills {
    margin: auto;
    margin-top: 20px;
    border-radius: 8px;
    background-color: var(--light1);
    width: 95%;
    padding: 1rem;
  }
  
  .skill-box {
    text-align: center;
    padding: 1rem;
  }
  
  #skill__container {
    justify-content: center;
    align-items: center;
    display: flex;
    padding: 1rem;
  }
  
  .skill-list li {
    font-weight: 700;
    font-size: 25px;
    margin-bottom: 2rem;
    list-style: disc;
  }
  
  .switch__container {
    display: flex;
    justify-content: center;
  }
  
  .switch__container a {
    margin: 1rem;
    margin-top: 0;
    width: 160px;
    height: 60px;
    background-color: var(--light0);
    display: flex;
    align-items: center;
    justify-content: center;
    border: solid 4px var(--lightblue);
    border-radius: 80px;
  }
  .switch__container a:hover {
    cursor: pointer;
    background-color: var(--light1);
  }
  
  .btn-text {
    color: var(--dark0);
    font-weight: 700;
    font-size: 24px;
  }

  .skill-list {
    
    width: 95%;
    margin: auto;
    margin-top: 1rem;
    padding: 1rem;
    background-color: var(--light1);
    border-radius: 8px;
  }
  .mid-header {
    font-size: 2rem;
    text-align: center;
  }
  .job {
    width: 95%;
    margin: auto;
    margin-top: 1rem;
    padding: 1rem;
    background-color: var(--light-1);
    border-radius: 8px;
  }
  
  .employer {
    font-size: 24px;
    /* text-decoration: underline; */
  }
  .job-desc {
    padding-left: 2rem;
    
  }
  .position {
    font-style: italic;
  }
  .job-desc li {
    list-style: disc;
    font-weight: normal;
    font-size: 20px;
    margin: 0;
    padding: 0;
  }
  .project {
    width: 95%;
    margin: auto;
    margin-top: 1rem;
    padding: 1rem;
    background-color: var(--light-1);
    border-radius: 8px;
  }
  
  .project-name {
    font-size: 24px;
    /* text-decoration: underline; */
  }
  .project-desc {
    padding-left: 2rem;
    
  }
  .project-subheading {
    font-style: italic;
  }
  .project-desc li {
    list-style: disc;
    font-weight: normal;
    font-size: 20px;
    margin: 0;
    padding: 0;
  }





  
  a {
    text-decoration: underline;
  }
  /* .qualifications {
    max-width: 90%;
  } */
  p.extra-details {
    text-align: center;
    font-style: italic;
    color: gray;
  }
  .library-language {
    color: var(--lightdarkblue);
    text-decoration: underline
  }
  .libraries {
    padding-left: 2rem;
    margin: 0.2rem;
    
  }
  .libraries li {
    padding: 0;
    margin: 0.3rem;
  }
  .languages {
    padding-left: 2rem
  }

  .programming-language {
    /* font-style: italic; */
    color: var(--lightdarkblue);
  }
  .programming-library {
    /* font-style: italic; */
    color: var(--lightblue);
  }

  .mathquals {
    padding-left: 2rem
  }