@font-face {
  font-family: "Atkinson Hyperlegible-Regular"; 
  src: url("/fonts/Atkinson_Hyperlegible/AtkinsonHyperlegible-Regular.ttf") format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap; 
}

body {

  margin: 0;

  /* background-color: #123; */

}

html {

  font-family: "Atkinson Hyperlegible-Regular", Arial, sans-serif;

}

header {

  margin: 0;

  font-family: "Atkinson Hyperlegible-Regular", Arial, sans-serif;

  min-height: 50vh;

  padding: 0px;

}


.main-heading{

  max-width: 800px;

  text-align: center;

  margin: auto;

}


.main-heading h1{

  font-size: 50px;

}


.main-heading p {

  font-size: 18px;

  line-height: 26px;

}


.header {

  overflow: hidden;

  /* background-color: #0b1622; */

  padding: 10px 20px;

}


.header img {

  width: 100px;

}


.header a {

  float: left;

  /* color: rgb(255, 255, 255); */

  text-align: center;

  padding: 12px;

  text-decoration: none;

  font-size: 18px;

  line-height: 25px;

  border-radius: 4px;

}





.header a.logo {

  font-size: 25px;

  font-weight: bold;

  padding: 0 !important;

}




.header-right {

  float: right;

  display: flex;

  align-items: center;

}


@media screen and (max-width: 500px) {

  .header a {

    float: none;

    display: block;

    text-align: left;

  }


  .header-right {

    float: none;

  }

}