html {
  scroll-behavior: smooth;
}
body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  background-color: white;
  width:100%;
  margin:0;
}
.container {
  margin-left:10%;
  margin-right:10%;
}
table.menu {
  width: 100%;
  margin: 0pt;
  padding-top: 20pt;
  padding-left: 0pt;
  padding-bottom: 0pt;
  border-width: 0pt;
  border-spacing: 0pt;
}
td.menu {
  text-align: right;
  vertical-align: top;
  color: white;
}
a.menu {
  color: white;
  font-size: 15pt;
}
div.hero {
  width: 100%;
  height:100%;
  background-image: url(../img/hero.jpg);
  background-size: cover;
}
h1.hero {
  color:white;
  font-size:400%;
  text-align:left;
  margin-top:120px;
}
h2.hero {
  color:white;
  text-align:left;
  margin-left:50px;
  margin-bottom:40px;
}
p.hero {
  color:white;
  margin-top:40px;
}
div.hero-bar {
  margin-top: 50px;
  margin-bottom: 50px;
  height: 150px;
  background-image: url(../img/hero.jpg);
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 100%;
  perspective: 1px;
  transform: translateZ(-2px);
}
@media only screen and (max-device-width: 1366px) {
  div.hero-bar {
    background-attachment: scroll;
  }
} 
a {
  text-decoration: none;
}
h1,h2,h3 {
  text-align: center;
}
h1 {
  font-size:400%;
}
.button {
  border-radius:10px;
  border: 2px solid red;
  color:white;
  padding:10px;
}
.button-filled {
  border-radius:10px;
  border: 2px solid red;
  background-color:red;
  color:white;
  padding:10px;
}
.footer {
  color: white;
  width: 100%;
  margin-top: 40pt;
  padding-top: 20pt;
  padding-bottom: 20pt;
  font-size: 14pt;
  text-align: center;
  background-color: #121528;
}