/*flexbox*/

* {
    padding: 0;
    box-sizing: border-box;
    font-family: "Georgia", Times, serif;
    text-decoration: none;
  }
  
  body {
    margin: 0;
  }
  
  /* Top solid border */
  hr.solid {
    border-top: 10px solid white;
  } 
  
  /*center menu items*/
  header {
  padding: 10px;
  z-index: 1;
  position: fixed;
  width: 100%;
  margin-top: -26px;
  height: 70px;
  text-align: center;
  border-bottom: 1px Solid #D3D3D3;
  border-top: 2px Solid #8A2BE2;
  background-color: white;
  }
  
  /* gets rid of bullet points in list*/
  .nav__links {
    list-style: none;
  }
  
  /*makes list horizontal*/
  .nav__links li {
    display: inline-block;
    padding: 0px 20px;  
  }
  
  /*change link color*/
  .nav__links li a {
    color: black;
  }
  
  /*color when you hover over linksr*/
  .nav__links li a:hover{
    color: #8A2BE2;
  }
  
  /*change color of menu text of current page*/
  .nav__links li{
    color: #8A2BE2;
  }
  
  /*changing shape of photo from rectangle to circle */
  img {
      width: 200px;
      height: 200px;
      border-radius: 50%;
  }
  
  /*side bar formatting*/
  .sidebar {
  margin: 0;
  padding: 60px 0;
  top: 20;
  left: 0;
  width: 500px;
  background-color: white;
  position: fixed;
  height: 100%;
  overflow: auto;
  text-align: center;
  border-right: 1px Solid #D3D3D3;
  }
  
  .sidebar a {
    color: #8A2BE2;
  }
  
  /*main content beside side bar*/
  main {
  margin-left: 150px;
  margin-right: -100px;
  padding: 45px 400px;
  height: 1000px;
  }
  
  main progress {
    height:24px;
    width:300%;
    position: relative; 
  }
  
  main a {
    color: #8A2BE2;
  }
  
  main table {
  border-spacing: 10px;
  }
  
  main i {
    position:relative;
    top:50px;
    color: grey;
  }
  
  @media screen and (max-width: 800px) {
    .sidebar {
      width: 100%;
      height: auto;
      position: relative;
      border-right: 2px Solid White;
    }
    .sidebar a {float: center;}
    main {margin-left: 0;  margin: 0 -350px; flex: 1; align-self: center; border-top: 1px Solid #D3D3D3;}
    main progress { height:24px; width:210%; position: center; }
  }
  
  html, body{
    width:100%;
    overflow-x:hidden;
  }
  
  /*copywrite tag*/
  .footer {
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height: 90px;
    background-color: white;
    text-align: center;
    border-top: 1px Solid #D3D3D3;    
  }