* {
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
  }
    
  body, html {


    background-color:#faf5f5; 
    font-family: "Times New Romam" , Times, serif;
    font-size: 13pt;
    text-align: center;
  } 


  div.main_frame {

     height:100%;
     width:100%;

  }

  div.main_content {
     width:100%;
  }

  div.content {
     width:90%;
     margin:auto;
     text-align:center;
     padding:32px;
     
  }

  div.content p {
     text-align:left;
  }



  div.input_section {

     width:80%;
     text-align:center;
     margin:auto;

  }

  div.input_section table {

    border: 1px solid;

  }


  div.input_values table {

    width:100%;

  }

  div.input_section table, fieldset {
     width:100%;
  }

  div.input_section label, input {

     margin-left:16px;
     margin-right:16px;

  }

  div.input_section h1 {

    color:#5f163a;

  }


  legend {

    margin-left:16px;
    margin-bottom:16px;
    color:#5f163a;
    font-weight:bold;
    font-size:24px;

  }


  div.title_subtitle {

     width:100%;
     text-align:center;
     margin-top:32px;

  }


  div.section_header {
    padding-bottom: 2vh;
    width:100%;
    margin:auto;
    font-weight: bold;
    font-size: 24px;
    text-align: center;
    color:#5f163a;
  }

  div.results {

    padding-top: 2vh;
    padding-bottom: 2vh;
    width:100%;

    font-weight: bold;
    font-size: 24px;
    text-align: center;
  }

  div.results button {

    background-color:lightblue;
    border-style:solid;
    border-color:blue;
    border-radius:3px;
  }



  div.site_header {

    width:100%;
    height:7vh;
    position:relative;
    margin: 0px 0px 16px 0px;
    background-color: black;

  }

  .bg-grey {

    background: linear-gradient(to bottom, #1a0000 50%, #77767b 100%);
  }

  tr {
    width:100%;

    background-color:#faeaf3;
  }

  td {
    width:50%;

    text-align:center;
    padding-top:16px;
    padding-bottom:16px;
    padding-left:16px;
    padding-right:16px;

  }

  .launch_program {

     font-size:24px;
     margin-bottom:5vh;
     background-color:#5f163a;
     border-radius:15px;
     color:white;
     font-weight:bold;
     width:20vw;
     height:5vw;

  }

  .launch_program:hover {

     background-color:#DA0000;

  }

  div.row {

    margin-bottom:5vh;


  }


  body hr {

    margin-top:0px;
    margin-bottom:0px;
    margin-left:5%;
    margin-right:5%;
    
    height: 2px;
    background-color: #5f163a;
    border: 0px solid

  }

  body select {

    width:64px;

  }

  .title_container {
    display: grid;
    align-items: center; 
    grid-template-columns: 1fr 6fr 1fr;
    column-gap: 5px;
  }

  .results_containter {
    display: grid;
    align-items: center; 
    grid-template-columns: 1fr 1fr 1fr;
    column-gap: 5px;
  }

  div.container {
    display: grid;
    grid-template-columns: 3fr 3fr;
    column-gap: 5px;
    align-items: top; 

  }


  /* loadingPopup styling */
  #loadingPopup {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    z-index: 10000;
    display: none; /* Initially hidden */
  }

  #status,
  .loadingPopup {
    top: 50%;
    left: 50%;
    position: absolute;
  }

  #status {
    width: 100px;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    margin: -50px 0 0 -50px;
  }

  .loadingPopup {
    height: 40px;
    width: 40px;
    margin-top: -20px;
    margin-left: -20px;
  }

  .loadingPopup:before {
    content: "";
    display: block;
    position: absolute;
    left: -1px;
    top: -1px;
    height: 100%;
    width: 100%;
    -webkit-animation: rotation 1s linear infinite;
    animation: rotation 1s linear infinite;
    border: 2px solid #780D31;
    border-top: 2px solid transparent;
    border-radius: 100%;
  }

  @keyframes rotation {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }