@font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-ExtraBold.ttf');
    font-weight: normal;
  }
  
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-Regular.ttf');
    font-weight: 400;
  }
  
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-Medium.ttf');
    font-weight: 500;
  }
  
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-SemiBold.ttf');
    font-weight: 600;
  }
  
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-SemiBold.ttf');
    font-weight: 800;
  }
  
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-Bold.ttf');
    font-weight: 800;
  }
  @font-face {
    font-family: 'open sans';
    src: url('../fonts/OpenSans-ExtraBold.ttf');
    font-weight: 900;
  }
  
  body {
    font-family: 'open sans';
    font-weight: 400;
    font-size: 14px;
  }
  
  h1 {
    font-weight: 700;
  }
  
  /* width */
  ::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #f1f1f1;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #888;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #555;
  }
  
  * {
    scrollbar-width: thin;
  }