* {
    margin: 0px;
    padding: 0;
  }
  /*header section template styling*/
  
  #header {
    border-bottom: 8px solid #ff6600;
    font-family: "Raleway", sans-serif;
    
    top: 0;
    min-width: 500px;
    background-color: #fff !important;
  }
  
  #header img {
    padding: 8px 8px 4px 32px;
  }
  
  h2 {
    font-size: large;
  }
  
  #labName {
    float: right;
    font-size: 25px;
    align-items: center;
    margin-top: 30px;
    margin-right: 40px;
    color: #2c99ce;
  }
  
  #exp-name {
    
    text-align: center;
    padding: 10px;
    height: 20px;
    color: #2c99ce;
    font-family: "Raleway", sans-serif;
    border-bottom: 1px solid #333;
  }
  
  #main {
    margin-top: 20px;
    background-color:ivory;
    border: 3px solid black;
    min-width: 500px;
    min-height: 500px;
    height: 100%;
    padding-right: 10px;
    display: inline-block;
  }
  
  #left {
    background-color: #f8f8ff;
  
    height: 700px;
    float: left;
    border-radius: 30px 0 30px 0;
    border: 1px black;
    display: block;
  }
  
  #symbolpalette {
    border-radius: 30px 0 0 0;
    display: block;
  }
  
  #readings {
    
    height: 270px;
    background-color: #b94e48;
    border-radius: 0 0 30px 0;
    border: 1px black;
    float: left;
    display: none;
  }
  
  table,
  th,
  td {
    height: 50px;
    width: 10px;
    text-align: center;
    border: 1px solid black;
    position: relative;
    background-color: #fffacd;
  }
  
  #readings_subdiv {
    height: 200px;
    background-color: #f0e68c;
    margin-top: 30px;
    margin-bottom: 30px;
    margin-left: 30px;
    margin-right: 30px;
    border-radius: 30px 0 30px 0;
  }
  
  #mid {
    background-color: whitesmoke;
    
    height: 700px;
    margin-left: 20px;
    float: left;
    border-radius: 30px 0 30px 0;
    display: block;
    cursor: pointer;
  }
  
  #right {
    background-color: #b94e48;
    
    height: 700px;
    margin-left: 20px;
    border-radius: 30px 0 30px 0;
    float: left;
    display: block;
  }
  
  #diagram {
    border: solid 3px black;
    border-radius: 30px 0 30px 0;
    display: block;
    cursor: default;
  }
  
  #buttons {
    margin-top: 50px;
    margin-left: 50px;
    margin-right: 50px;
    background-color: #f0e68c;
    border-radius: 30px 0 30px 0;
    align-items: center;
    font-family: "Muli";
    height: 600px;
    padding-left: 20px;
    padding-right: 20px;
    display: grid;
      grid-template-rows: 16% 16% 16% 16% 16% 16%;
  
  }
  
  #instructions {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    height: 50px;
    font-weight: bold;
    margin-top: 70px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #clear {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    height: 50px;
    font-weight: bold;
    margin-top: 30px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #check {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    font-weight: bold;
    margin-top: 30px;
    height: 50px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #graph {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    font-weight: bold;
    margin-top: 30px;
    height: 50px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #data {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    font-weight: bold;
    height: 50px;
    margin-top: 30px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #print {
    border: solid 5px #fffacd;
    border-radius: 30px 0 30px 0;
    background: #fffacd;
    font-size: 20px;
    font-weight: bold;
    height: 50px;
    margin-top: 30px;
    width: 300px;
    cursor: pointer;
    box-shadow: 0 0 20px black;
  }
  
  #dialog {
    font-weight: bold;
    font-size: medium;
    cursor: pointer;
  }
  
  #insdialog {
    margin-left: 5px;
    font-size: medium;
    text-align: justify;
    cursor: pointer;
  }
  
  #insdialog:hover {
    background: #fff7e4;
  }
  
  #print:hover,
  #data:hover,
  #graph:hover,
  #check:hover,
  #clear:hover,
  #instructions:hover {
    box-shadow: #f0e68c;
    background: white;
    box-shadow: 0 0 20px #7d6200;
  }
  /*dialog header */
  
  .custom.e-dialog .e-header {
    background: #3895d3;
    border-bottom: 3px solid whitesmoke;
  }
  /*dialog header title*/
  
  .custom.e-dialog .e-title {
    color: whitesmoke;
    font-size: large;
    text-align: center;
  }
  
  .custom.e-graphdialog .e-header {
    background: #3895d3;
    border-bottom: 3px solid whitesmoke;
    text-align: center;
  }
  /*dialog header title*/
  
  .custom.e-graphdialog .e-title {
    color: whitesmoke;
    font-size: 100px;
    text-align: center;
    position: relative;
  }
  
  .e-dialog .e-dialog-icon.e-close:before {
    color: whitesmoke;
  }
  
  .e-dialog .e-dialog-icon.e-maximize:before {
    color: whitesmoke;
  }
  
  .e-dialog .e-dialog-icon.e-minus:before {
    color: whitesmoke;
  }
  /*custom styles for changing color of graphdialog buttons*/
  
  .egraphdialog .e-graphdialog-icon.e-close:before {
    color: whitesmoke;
  }
  
  .e-dialog .e-dialog-icon.e-maximize:before {
    color: whitesmoke;
  }
  
  .e-graphdialog .e-graphdialog-icon.e-minus:before {
    color: whitesmoke;
  }
  
  .custom.e-insdialog .e-title {
    color: whitesmoke;
    font-size: large;
    text-align: center;
    position: relative;
  }
  
  #container1 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container2 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container3 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container4 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container5 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container6 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container7 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container8 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #container9 {
    height: 300px;
    width: 1450px;
    cursor: pointer;
  }
  
  #angles {
    margin-top: 710px;
    height: 35px;
    padding: 20px 0;
    font-size: 20px;
    text-align: center;
    color: #fff;
    background-color: #b94e48;
    border-radius: 30px 0 30px 0;
    border-color: solid 3px red;
  }
  
  #angles_sub {
    height: 20px;
    margin-left: 5px;
    margin-right: 5px;
    background-color: #f0e68c;
    border-radius: 30px 0 30px 0;
    padding: 10px 0;
    margin-bottom: 5px;
  }
  
  #dg1 {
    height: 25px;
    width: 100px;
    background-color: #fffacd;
    border-radius: 10px 0 10px 0;
    font-weight: bold;
    text-align: center;
    font-size: large;
    cursor: pointer;
    float: left;
    margin-left: 600px;
  }
  
  #dg2 {
    height: 25px;
    width: 100px;
    background-color: #fffacd;
    border-radius: 10px 0 10px 0;
    margin-left: 100px;
    font-weight: bold;
    text-align: center;
    font-size: large;
    cursor: pointer;
    float: left;
  }
  
  #dg3 {
    height: 25px;
    width: 100px;
    background-color: #fffacd;
    border-radius: 10px 0 10px 0;
    margin-left: 100px;
    font-weight: bold;
    text-align: center;
    font-size: large;
    cursor: pointer;
    float: left;
    text-align: center;
  }
  
  #dg4 {
    height: 25px;
    width: 100px;
    background-color: #fffacd;
    border-radius: 10px 0 10px 0;
    margin-left: 100px;
    font-weight: bold;
    text-align: center;
    font-size: large;
    cursor: pointer;
    float: left;
  }
  
  #dg1:hover,
  #dg2:hover,
  #dg3:hover,
  #dg4:hover {
    box-shadow: #f0e68c;
    background: white;
    box-shadow: 0 0 20px #7d6200;
  }
  
  #copyright {
    padding: 20px 0;
    font-size: 20px;
    text-align: center;
    color: #fff;
    background-color: #333;
    font-family: "Raleway", sans-serif;
    display: block;
  }