@font-face {
  font-family: speedee;
  src: url(assets/fonts/Speedee_W_Rg.ttf);
}
@font-face {
  font-family: speedee;
  src: url(assets/fonts/Speedee_W_Bd.ttf);
  font-weight: bold;
}
html * {
  font-family: speedee;
}
.banner {
  display: table;
  height: 10vh;
  width: 100%;
  background-image: url(assets/images/burger_logo.png?v=5);
  background-size: contain;
  background-repeat: round;
}
.bannertitle {
  height: inherit;
  width: inherit;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  background-color: transparent;
  color: rgb(245, 187, 71);
  text-shadow: -0.1em 0em 0.5em black, 0.1em 0em 0.5em black,
    0em -0.1em 0.5em black, 0em 0.1em 0.5em black;
}
 

.table{

    display: grid;
    text-align: center;
    grid-template-columns: 50% 50%;
}
#brendantel{
    grid-row: 1;
    grid-column: 1;
    height:50vh;
    margin: 10px;
    font-size: xx-large;
    text-decoration: none;
    display: flex;
}
#brendansms{
    grid-row: 1;
    grid-column: 2;
    height:50vh;
    margin: 10px;
    font-size: xx-large;
    text-decoration: none;
    display: flex;
}

#atosbtn{
    grid-row: 2;
    grid-column: 1 / span 2;
    height: 20vh;
    display: grid;
    position: relative;
    margin: 10px;
}
#atospri{
background-color: inherit;
display: inline-block;
font-size: small;
position: absolute;
justify-self: center;
top: 15%;
}
#atossub{
    font-size: smaller;
    background-color: inherit;
    display: inline-block;
    font-size: xx-large;
    position: absolute;
    justify-self: center;
}
.button:hover,
.button:focus,
.button:active {
  background-color: rgb(201, 42, 32);
  border: solid 3px rgb(201, 42, 32);
  border-radius: 20px;
  color: rgb(245, 187, 71);
  cursor: pointer;
}
.button{
  justify-content: center;
  align-items: center;
  box-sizing: content-box;
  height: 60%;
  background-color: rgb(245, 187, 71);
  border: solid 3px rgb(245, 187, 71);
  color: rgb(201, 42, 32);
  border-radius: 20px;
  font-size: 16px;
}