@font-face {
  font-family: franklin;
  src: url('fonts/FRABK.TTF');
}

*{box-sizing: border-box;}

body{
    background-image: url('img/background.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    width: auto;
    text-align: center;
    overflow-x: hidden; /*  To hide the horisontal scrollbar  */
    overflow-y: hidden;
    scroll-behavior: smooth;
}


.content{
  height: 100vh;
  width: auto;
  margin: -.5rem 0 1rem 0;
  pointer-events: none;

}

.contact{
  position: absolute;
  right: 0;
  padding-right: 7rem;
  text-align: right;
  font-size: 2vh;
  color: #d9d6d6;
}

.contact2{
  opacity: 0;
  position: absolute;
  pointer-events: none;
}

.mobile_top{
  opacity: 0;
  position: absolute;
  pointer-events: none;
  width:  5vw;
}

.mobile_bottom{
  opacity: 0;
  position: absolute;
  pointer-events: none;
  width: 5vw;
}

h1{
  font-family: 'franklin';
  font-weight: 100;
  color: #d9d6d6;
  text-shadow: 0em 0em .2em black;
  pointer-events: none;
}

p{
  font-family: 'franklin';
  font-weight: 50;
  color: #d9d6d6;
  margin: 0 ;
  padding: .2em 0;
}

a{
  text-decoration: none;
  font-family: 'franklin';
  color: #d9d6d6;
  margin: 0;
  padding: 0;
}

a:hover,
a:focus{color: #d1793a;}

li{ list-style: none; padding: 0; margin: 0;}
nav ul{margin: 0; padding: 0; text-align: center;}

.f_bar{
  background-color: black;
  background-size: cover;
  padding-left:  0;
  text-align: center;
  margin-left: -.5rem;
  padding-bottom: .5rem;
  width:105vw;
  position: fixed;
  bottom: 0px;
}

@media (max-width: 73rem) {
  body{background-image: url('img/background_m.png'); position: relative; height: auto; width: 100%; overflow-y: scroll;}
  .content{opacity: 0; position:absolute; height: 1px; width: 1px; margin: 0;}
  .mobile_top{opacity: 1; display: inline-block; height: auto; width: 100%; position: relative; padding: 0; margin: 0;}
  .mobile_bottom{opacity: 1;display: inline-block; height: auto; width: 100%; position: relative;}
  .contact{opacity: 0; pointer-events: none; font-size: 1px;}
  .contact2{opacity: 1; pointer-events: auto; padding-bottom: 4rem; position: relative; text-align: center;}
  .contact2 h1{pointer-events: none; color: #d9d6d6;}
  li{margin-left: -2rem;}
