[HELP] Loading screen keep crashing server :(

Hi guys,

So I’ve spent days making a good looking loading screen, it’s not finished at all. The point here, is not when I start the run.bat to turn on the server, but when someone try to join my server.

What I mean is, if I join my server (via localhost, local ip and even public ip (I’ve tested them all)), it works, I get in, the loading screen works fine for me and everything runs normal.

But when someone that isn’t in my computer tries to join the server, it just don’t let them in. They say that the FiveM just crash and I recieve a message in the console saying that the player who is trying to join timed out…

I’ve tried this in diferent computers, and with diferent people, and the server only works when I disable the “keks” (which is the loading screen folder).

I’ll post here all the code in case someone can help me, hope someone can.

(btw, some text is in portuguese)

__resources.lua

files {
    'index.html',
    'keks.css',
	'_music/loading.wav',
	'_screen/loading1.jpg',
	'_screen/loading2.jpg',
	'_screen/loading3.jpg',
	'_screen/logo.png',
	'_fonts/text.ttf',
}

loadscreen 'index.html'

resource_manifest_version '77731fab-63ca-442c-a67b-abc70f28dfa5'

HTML

<html>
    <head>
        <link href="keks.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
		<audio id="loading" autoplay loop >
			<source src="_music/loading.wav" type="audio/wav">
		</audio>
		<script>
			var vid = document.getElementById("loading");
			vid.volume = 0.8
		</script>
		<div id="background-image">
			<img class="bottom" src="_screen/loading1.jpg"/>
			<img class="top" src="_screen/loading2.jpg"/>
			<img class="bottomm" src="_screen/loading3.jpg"/>
		</div>
			<img id="logo" src="_screen/logo.png"/>
			<p id="exp">Eu sei que este logo é horrivel, mas era o que havia no google...</p>
		<div id="text-box">
			<h1 class="t1">Regras</h1>
		</div>
			<p class="line"></p>
			<ol class="t2">
				<li>Respeita os outros.</li>
				<p/>
				<li>Não sejas racista.</li>
				<p/>
				<li>bla bla bla bla.</li>
			</ol>
		<div class="container">
			<div class="loader"></div>
		</div>
</body>
</html>

CSS

@charset "UTF-8";
@font-face {
	font-family: 'Text';
	src: url("_fonts/text.ttf");
}
@keyframes background-image {
	0% {
	opacity:1;
	}
	45% {
	opacity:1;
	}
	55% {
	opacity:0;
	}
	100% {
	opacity:0;
	}
}
body {
	background-color: #000;
}
#background-image img {
	width: 100%;
	height: 100%;
	margin: -10px auto 0px -9px;
	padding: 0px;
	
	-webkit-filter: blur(4px);
	-moz-filter: blur(4px);
	-o-filter: blur(4px);
	-ms-filter: blur(4px);
	filter: blur(4px);
	
	animation-name: background-image;
	animation-timing-function: ease-in-out;
	animation-iteration-count: infinite;
	animation-duration: 10s;
	animation-direction: alternate;
}
#background-image img.top {
	position: fixed;
}
#background-image .bottom {
	position: absolute;
}
#background-image .bottomm {
	position: absolute;
}
#background-image img.bottomm {
	animation-delay: 5s;
}
#background-image img.bottom {
	animation-delay: 10s;
}
#logo {
	height: 110px;
	top: 210px;
	left: 660px;
	position: absolute;
	opacity: .8;
}
#exp {
	color: white;
	position: relative;
	font-family: 'Text';
	font-size: 12px;
	opacity: .6;
	
	margin: 0px 750px 0px 750px;
	text-align: center;
	top: 315px;
}
#text-box h1.t1{
	color: white;
	position: relative;
	font-family: 'Text';
	font-size: 40px;
	
	margin: 0px 750px 0px 750px;
	text-align: center;
	top: 320px;
	box-shadow: 3px 3px 6px rgba(0,0,0,.6);
	padding-top: 20px;
	padding-bottom: 200px;
	background-color: rgba(0,0,0,.2);
}
p.line {
	border-style: solid;
	position: absolute;
	margin: 130px 0px 0px 850px;
	padding-left: 200px;
	opacity: .4;
	height: -1px;
}
.t2{
	color: white;
	position: absolute;
	font-family: 'Text';
	font-size: 22px;
	
	list-style-type: none;
    margin: 0;
    padding: 0;
	left: 800px;
	text-align: left;
	top: 450px;
}
@-webkit-keyframes spin {
	to {
    -webkit-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}

@keyframes spin {
	to {
	-webkit-transform: rotate(360deg);
	transform: rotate(360deg);
  }
}
.container {
  margin: 285px 1118px;
  opacity: .9;
}
.loader {
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
	border: 3px solid #ddd;
	border-top: 3px solid #42a5f5;
	border-radius: 50%;
	height: 20px;
	width: 20px;
}

A pic of the folder