/*background image, font color and size*/
body {
  background-image: url("bgimage.png");
  background-size: 100% auto;
  background-repeat: no-repeat;
  background-color: white;
  {
    opacity: 0.5.;
    filter: alpha(opacity=0); /* For IE8 and earlier */
  }
}
p {
  color: black;
}
h1 {
  font-weight: bold;
  font-size: 54;
}

/*Navigation bar*/
.navbar {
  overflow: hidden;
  background-color: #333;
  top: 0; /* Position the navbar at the top of the page */
  width: 100%; /* Full width */
}

/* Links inside the navbar */
.navbar a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 26px;
  text-decoration: none;
}

/* Change background on mouse-over */
.navbar a:hover {
  background: #ddd;
  color: black;
}

/* Main content */
.main {
  margin-top: 3px; /* Add a top margin to avoid content overlay */
}

/*Test design*/
#frame {
  background-color: whitesmoke;
  border: 4px solid black;
  width: 400px;
  height: 400px;
  border-radius: 10px;
  padding: 10px;
  margin-left: auto;
  margin-right: auto;
}


.buttons001 {
  background-color: limegreen;
  color: white;
  padding: 6px;
  margin: 10px;
  border-radius: 10px;
  width: 200px;
}

.buttons002 {
  background-color: lightblue;
  color: black;
  padding: 5px;
  margin: 10px;
  border-radius: 10px;
  width: 80px;
}

#text001 {
  text-align: center;
}

#text002 {
  text-align: left;
}

#green001 {
  color: green;
}

#red001 {
  color: red;
}

/*grammar portion*/
body {
  font-family: 'Lato', sans-serif;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {

  text-align: center;
  padding: 0px;
}

#quiz {
  margin-left: 10px;
  background: #FFF;
  padding: 10px 20px 10px 20px;
  width: 500px;
  height: 1500px;
  border-radius: 20px;
  float: center;
  border: solid black;

}

input {
  margin-bottom: 20px;
  display: block;
}

#textbox {
  height: 25px;
  font-size: 16px;
  border-radius: 5px;
  border: solid black;
  padding-left: 5px;
}

#button {
  background: green;
  border: none;
  border-radius: 5px;
  padding: 10px;
  color: white;
  font-size: 16px;
  transition-duration: .5s;
  margin-top: 15px;
}

#button:hover {
  background: white;
  border: 1px solid green;
  color: black;
  cursor: pointer;

}

#after_submit {
  visibility: hidden;
  background: #FFF;
  padding: 10px 20px 10px 20px;
  width: 400px;
  border-radius: 20px;
  float: left;
  margin-left: 20px;
  font-size: 20px;
}