html, body { width: 100%; overflow-x: hidden;}
body{
  background: #f0efe4;
  font-family: "Times New Roman", Times, serif, serif;   
  font-size: 90%;
  margin: 0;
  padding:0;
}
#web{
  width: 729px;
  margin: 0 auto;
  background: white;
  clear:both;
  padding: 50px 70px 50px 70px;
}
#header-logo { width: 372px; float: left; }
h1{
  margin-top: 0;
}
a{
  color: #67852c;
}
a.gray{
  color: black;
  text-decoration: none;
}
p span {
  display: inline-block;
}
#babuoc{
  background: #00323c;
  margin: 0;
  float: left;
  width: 100%;
}
#babuo{
  width: 869px;
  margin: 0 auto;
}
#main{
  width: 585px;
  padding: 70px;
  border-right: 1px solid #e6e6e6;
}
#sidebar{
  width: 220px;
  padding: 19px;
}
ul.multi{
  float: left;
  width: 138px;
}
ul.rango{
  margin-left: 0;
  padding-left: 0;
  width: 182px;
}
ul.rango li{
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}
hr {
    height: 1px;
    background: #e6e6e6;
    color: #e6e6e6;
    width: 100%;
    font-size: 1px; /* IE 6 */
    overflow: hidden; 
    margin: 25px 0;
    border: 0;
}
.clear{
  clear: both;
}
.larger{
  font-family: 'Donegal One', serif;
  font-size: 72px;
  text-align: center;
}
::-webkit-input-placeholder { text-transform: none }
:-moz-placeholder { text-transform: none }
::-moz-placeholder { text-transform: none }
:-ms-input-placeholder { text-transform: none }

@media only screen and (max-width: 900px) {
  #web { 
    width: 85%;
    padding: 3%;
  }
}
@media only screen and (max-width: 500px) {
  #babuo { width: 100% }
  #header-logo { max-width: 95%; float: none; margin: 0 auto; }
  #footer a { 
    display: block;
  }
  ul.regular-list li { font-size: 14px; line-height: 20px; }
  input {
    display: block;
    height: 50px;
    width: 80%;
    padding: 0 5%;
    margin: 10px auto;
  }
  input[type="submit"] {
    width: 90%;
    -webkit-appearance: none;
  }
  .equal {
    display: block;
  }
  li {
    font-size: 18px;
    line-height: 34px;
  }
  ul.rango {
    width: 50%;
  }
}