*index.css
*,html {
 box sizing:border-box;
  margin:0px;
  padding: 0px;
}
body {
  background:#F98FE9; 
  line height:130%;
   .webForm input, select{
    margin:5px 0px;
    color:#a6a6a6;
  }
  .webForm #submit, #clear{
    margin:5px;
    background-color:teal;
    color:white;
    padding:5px 15px;
  }
  #clear{
    background-color:#eb3477;
  }
  #male, #female{
    margin:0 5px;
  }
  #web{
    color:black;
  }
  .gFont{
    font-family:'Alegreya Sans';
  }
  .underline{
    text-decoration:underline;
  }
    .fontWeight{
      font-weight:bold;
    }
  .fontStyle{
    font-style:italic
  }
  .fontVariant{
    font-variant:small-caps;
  }
  .upercase{
    text-transform:uppercase;
  }
  nav a{
    text-decoration:none;
    color:white;
    font-size:1em;
    font-weight:bold;
    font-family:sans-serif;
    margin-right:25px;
  }
   /*Mobile View-----------------------------*/
  @media screen and (max-width:600px)}
#HTML{
display:grid;
  grid template-columns: 1fr 1fr 1fr;
  grid-gap:25px;
  justify-content:center;
  width: 95%;
  margin:25px auto;
  nav a:hover {
    color: black;
  }
/*Tablet View---------------------------*/
@media screen and (max-width: 768px){ 
#HTML{
  grid-template colums: 1fr; 1fr;
}
  #CSS{
    grid-template columns: 1fr; 1fr;
}
.reference{
  grid-column:span 3;
  }
  .webForm{ 
        grid-column: span 2;
    header{
      background-color:lightblue;
      color:red;
    }
      header h1{
        padding: 25px;
        font-size:10vh;
        color:white;
        text-align:center;
      }
      nav {
        background-color:red;
        padding:10px;
        text-align: right;
      }
      h1, h2, h3, h4, h5, h6{
        padding: 10px 0px 0px 0px;
      }
      div {
        border: solid thin dark-black; 
        padding: 10px;
        border-radius:25px;
      }
      
      .lists li{
        margin-left:15px;
      }
      .border{
        border-radius: 0px;
          border: dashed thin dark-orange;
    }
    
        .margin{
           border-radius:0px;
          margin:20px;
        }
        .padding{
          border-radius:0px;
          padding:20px;
    }
            
            .floatEX{
              width:25%;
              height:25%;
              border-radius:0px;
              background-color: light-purple;
              float:right;
              margin-top:25px;
          }
          hr{
            margin:25px 0px;
          }
          .color{
            background-color: pastel yellow;
            color:#99ff33;
          }
          .size{
            width:80%;
            height:80%;
            margin:auto;
            font-size:70em;
            padding:0 10px;
          }
          
      }