<style>
* {
  box-sizing: border-box;
}

body {
  font-family: Arial, Helvetica, sans-serif;
}

#container {
  overflow: hidden;
      width: 100%;
}
/* Style the header */
header {
  float: right;
  width: 70%;
  background-color: DarkGoldenRod;
  padding: 21px;
  text-align: center;
  font-size: 25px;
  color: white;
  padding-bottom: 100em;
  margin-bottom: -100em;
}

/* Create two columns/boxes that floats next to each other */
nav {
  float: left;
  width: 22%;
  background: SandyBrown;
  padding: 20px;
  padding-bottom: 100em;
  margin-bottom: -100em;
}

div {background-color: SandyBrownH;}
ul {
  display: inline;
  margin: 0;
  padding: 0;
}
ul li {display: inline-block;}
ul li:hover {background: SandyBrown;}
ul li:hover ul {display: block;}
ul li ul {
  position: absolute;
  width: 300px;
  display: none;
}
ul li ul li { 
  background: SandyBrown; 
  display: block; 
}
ul li ul li a {display:block !important;} 
ul li ul li:hover {background: SandyBrown;}

/* Style the list inside the menu */
nav ul {
  list-style-type: none;
  padding: 0;
}

headernav{
  float: right;
  width: 70%;
  background-color: DarkOrange;
  padding: 21px;
  text-align: center;
  font-size: 28px;
  color: black;
  padding-bottom: 100em;
  margin-bottom: -100em;
}
.clearfix::after{
  content: "";
  display: table;
  clear: both;
}
/* Clear float  */
section:after {
  content: "";
  display: table;
  clear: right;
}

article {
  padding: 20px;
  max-width: 100%;
  background-color: #f1f1f1;
}
.clearfix::after{
  content: "";
  display: table;
  clear: both;
}

.bubble {
    position: relative;
    background: AquaMarine;
    border: 1px solid #FFCC00;
    max-width:200px;
    padding:5px;
    font-family:arial;
    margin:0 auto;
    font-size:14px;
    border-radius:25px;
}
.bubble:after,
.bubble:before {
    right: 100%;
    top: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;

}

.bubble:after {
    border-color: rgba(255, 255, 204, 0);
    border-right-color: AquaMarine;
    border-width: 8px;
    margin-top: -20px;

}

.column {
  float: left;
  height: 200px;
  width: 10%;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


/* Style the footer */
footer {
  background-color: #777;
  padding: 10px;
  text-align: center;
  color: white;
}

/* Responsive layout - makes the two columns/boxes stack on top of each other instead of next to each other, on small screens */
@media (max-width: 600px) {
  nav, article {
    width: 50%;
    height: auto;
  }
}

label{
  display:inline-block;
  width:90px;
  margin-right:30px;
  text-align:left;
}

input{
}

fieldset{
  border:none;
  width:500px;
  margin:0px auto;
}

</style>
