:root {
  --color-light:    #8d99ae;
  --color-dark:    #667182;
  --color-bg:         #2b2d42;
  --color-text:      #ffffff;


  --radius:           5vh;
  --shadow:           0 3px 8px rgba(0, 0, 0, 0.1);
}



@font-face {
    font-family: 'Londrina Solid';
    src: url('fonts/LondrinaSolid-Thin.ttf') format('truetype');
    font-weight: 100;
    font-style: normal;
  }
  @font-face {
    font-family: 'Londrina Solid';
    src: url('fonts/LondrinaSolid-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
  }
  @font-face {
    font-family: 'Londrina Solid';
    src: url('fonts/LondrinaSolid-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
  }
  @font-face {
    font-family: 'Londrina Solid';
    src: url('fonts/LondrinaSolid-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
  }

* {
    -webkit-tap-highlight-color: transparent;
}

.ease-out-back {
  transition-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1);
}


html, body {
    height: 100%;
    margin: 20px;
    background-color: var(--color-bg);
    
    font-family: "Londrina Solid", sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.05em;
    color:  var(--color-text);
    text-decoration: none;
    
    overscroll-behavior: none;
}


#backBtn{
    opacity: 1;
    pointer-events: auto;
    height: 9vh;
    justify-content: center;
    align-items: center;
    display: flex;   
    background-color: var(--color-light);
    border-radius: var(--radius);
    margin: 30px;
    color: inherit;
    text-decoration: none;
}