@font-face not working with github pages

I'm currently trying to fix an issue with my portfolio website. I use a custom font to keep the page looking good, but for some reason @font-face refuses to work.

Here's my CSS:

@font-face{
font-family: 'Quicktype';
src: url('Fonts/quicktype_condensed-webfont.woff2') format('woff2'),
     url('Fonts/quicktype_condensed-webfont.woff') format('woff'),
     url('Fonts/QuickType Condensed.ttf') format('truetype'),
     url('Fonts/QuickType Condensed.eot'),
     url('Fonts/QuickType Condensed.eot?#iefix') format('embedded-opentype'),
     url('Fonts/QuickTypeCondensed.svg#QuickTypeCondensed') format('svg');
font-weight: normal;
font-style: normal;
}

Here's a link to my website:

http://alfabitsgamedev.com/

And here's a link to my github file hierarchy.

https://github.com/Alfabits/alfabits-game-dev-3

I've tried using as many font file types as I can, but it's not working on any of the browsers I use. I've tried different font directory paths, but that doesn't seem to work either. I've also looked around and none of the solutions I've found have solved my problem.

The website always returns with either a 404 Error for the .ttf, .woff, and .woff2 fonts (never the other fonts, for some reason), or a weird GET error.

I know I can't use .htaccess files, since github pages hosts only static stuff and can't do server side logic. So I'm kind of lost as to why this is happening and how I can fix it. Thanks in advance, if you can manage to help.

Solution

I found the solution! I was using Absolute Links instead of Relative Links. Relative Links make the intended path start from where the currently-used file is located, and needs to start with a '/'. Absolute Links will start the intended path starting from the system's root folder, not the file's.

Find more here: coffeecup.com/help/articles/absolute-vs-relative-pathslinks‌

Also, credit to Frits for the solution!