html{
  font-family: 'Inter';
  font-size: 0.9rem;
  text-align: center;
  background-color: #f5f5f5;
  color:#333333;
}
body{margin:0}
hr{color:#fefefe4a}
#header{
  margin: 0 5ch 0 5ch;
  position:relative;
  text-align: left;
}
#header h1{
  font-size: 1.35rem;
  font-weight: 900;
}
#main .text{font-size: 1.4rem}
#header ul{
  position: absolute;
  right: 0;
  top: 0;
  margin: 5px 0 0 0;
  color:#555;
}
#header li{
  display:inline;
  margin-left:3ch;
}
#header li:hover{color:#000}
#bar{
  padding:40px 0 40px 0;
  width: 100%;
  background-color:#333333;
  color:#fff;
  text-align:center;
  margin-bottom: 5ex;
}
#bar table{
  display:inline-table;
  table-layout: fixed;
  width:80%;
}
#bar table tr th{
  font-weight:800;
  font-size: 2.8rem;
}
.table-middle{
  display:inline-table;
  table-layout: fixed;
  text-align: center;
  border-spacing:2ch 0;
}
#main .table-middle td {
  padding: 10px;
  background-color: #fff;
  border: 1px solid #ddd;
  vertical-align: top;
  border-radius: 5px;
}
#main .left-bar td{border-left: 4px solid #333333}
#main .hover-border td:hover{border: 1px solid #000}
.table-middle td h1{
  font-size:3rem;
  font-weight:800;
}
#main > h2{
  margin: 6ex 0 2.5ex 0;
  font-size: 2.5rem;
}

.double-box {
  margin: 0 50px 0 50px;
  font-size: 0;
}
.text {
  text-align: left;
  display: inline-block;
  width: 25%;
  vertical-align: middle;
  font-size: 0.9rem;
}
#main .text p{font-size: 0.9rem}
#image {
  display: inline-block;
  width: 75%;
  vertical-align: middle;
  padding: 40px;
  box-sizing: border-box;
  background-image: url('https://external-content.duckduckgo.com/iu/?u=https%3A%2F%2Fsora-watermark-remove.com%2Fsora.png&f=1&nofb=1&ipt=73f8945489ef371588c675cbc7af2026f571244a8c675ef8d82704f653117411&ipo=images');
}
#image img {
  margin:10px;
  width: 100%;
  height: auto;
}
#banner #buttons{
  display: inline-block;
  text-align: right;
  width: 75%;
  vertical-align: middle;
}
#banner{
  margin-top: 8ex;
  padding:30px 0 30px 0;
  border-top: 1px solid #ddd;
  background-color: #fff;
}
#banner h1{
  font-weight: 800
}
#footer{
  background-color:#333333;
  padding:4ex 5ch 1px 5ch;
  color:#ddd;
  font-size:0.8rem;
}
#footer p{color:#aaa}
#footer hr{color:#fefefe20}
#footer table{
  border-spacing:2ch 1ex;
  text-align:left;
  margin-bottom: 10px;
}
#footer table tr th{
  color:#fff;
  font-weight: 900;
}
#footer ul{padding:0}
#footer li{
  display:inline;
  margin-right: 10px;
}
#footer li:hover{font-weight:bold; color:#fff}
button{
  height: 6ex;
  width: 18ex;
  border-radius:5px;
  background-color:#fff;
  color:#333333;
}
.button-dark{
  border:none;
  background-color:#333333;
  color:#fff;
}
button:hover{
  border:none;
  color:#fff;
  background-color:#000;
}
