<!doctype html>
<html>
<head>
<title>nome</title>
<style type="text/css">
.button {
  border: none;
  color: white;
  padding: 10px 25px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  transition-duration: 0.4s;
  cursor: pointer;
}
.button2 {
  background-color: white;
  color: black;
  border: 2px solid #008CBA;
}
.button2:hover {
  background-color: #008CBA;
  color: white;
}
.partita{
position:absolute;
width:500px;
height:80px;
top:20%;
left:50%;
margin-left:-250px;
line-height:80px;
}
.casa{
position:absolute;
height:100%;
width:auto;
left:0%;
}
.ospite{
position:absolute;
height:100%;
width:auto;
right:0%;
}
.risultato{
position:absolute;
width:70%;
height:100%;
left:50%;
margin-left:-35%;
text-align:center;
font-size:30pt;
margin-top:0%;
}
.tim{
position:absolute;
top:-50%;
height:auto;
width:30px;
margin-left:-15px;
left:50%;
}
.quote{
position:absolute;
width:500px;
height:80px;
top:100%;
left:50%;
margin-left:-250px;
line-height:80px;
margin-top:-80px;
}
.qt{
position:absolute;
width:80%;
height:40px;
left:50%;
margin-left:-40%;
}
.q1{
position:absolute;
left:25%;
margin-left:-42.175px;
}
.qx{
position:absolute;
margin-left:-42.175px;
left:50%;
}
.q2{
position:absolute;
left:75%;
margin-left:-42.175px;
}
.b1{
position:absolute;
top:100%;
margin-top:-21.2px;
margin-left:-48.345px;
left:50%;
}
.rel{
position: relative;
width: 100%;
height:300px;
margin: 0 auto;
}
.marcatori{
position:absolute;
width:340px;
height:80px;
top:40%;
left:50%;
margin-left:-170px;
line-height:80px;
}
.timer{
position:absolute;
top:0%;
width:30px;
height:30px;
left:50%;
margin-left:-15px;
margin-top:0;
line-height:30px;
text-align:center;
}
</style>
</head>
<body onload="main()">
<script>	var gol1
	var gol2
	casuale = Math.round(Math.random() * 99);
	casuale2 = Math.round(Math.random() * 99);
	if(casuale<10){
		gol1= 0;
	}
	else{
		if(casuale<25 && casuale>9){
			gol1= 1;
		}
		else{
			if(casuale<55 && casuale>24){
				gol1 = 2;
			}
			else{
				if(casuale<80 && casuale>54){
					gol1= 3;
				}
				else{
					if(casuale<95 && casuale>79){
						gol1= 4;
					}
					else{
						gol1 = 5;
					}
				}
			}
		}
	}
	casuale2 = Math.round(Math.random() * 99);
	if(casuale2<10){
		gol2= 0;
	}
	else{
		if(casuale2<25 && casuale2>9){
			gol2= 1;
		}
		else{
			if(casuale2<55 && casuale2>24){
				gol2=2;
			}
			else{
				if(casuale2<80 && casuale2>54){
					gol2 = 3;
				}
				else{
					if(casuale2<95 && casuale2>79){
						gol2= 4;
					}
					else{
						gol2= 5;
					}
				}
			}
		}
	}
function cas() {
str1=gol1.toString();
str2=gol2.toString();
str="-";
result=str1.concat(str).concat(str2);
document.getElementById("result").innerHTML =result
}
let s = gol1 + gol2;
for (let i = 0; i < s; i++) {
  let n = Math.floor(Math.random() * ((i+1)*(90/s) - i*(90/s +1) + i*(90/s)*1));
  document.getElementById("marcatori").innerHTML =n
  }
var startTime; // to keep track of the start time
var stopwatchInterval; // to keep track of the interval
var elapsedPausedTime = 0; // to keep track of the elapsed time while stopped
function startStopwatch() {
  if (!stopwatchInterval) {
    startTime = new Date().getTime() - elapsedPausedTime; // get the starting time by subtracting the elapsed paused time from the current time
    stopwatchInterval = setInterval(updateStopwatch, 250); // update every second
 }
}

function updateStopwatch() {
  var currentTime = new Date().getTime(); // get current time in milliseconds
  var elapsedTime = currentTime - startTime; // calculate elapsed time in milliseconds
  var seconds = Math.floor(elapsedTime / 250) % 100; // calculate seconds
  var displayTime = seconds; // format display time
  document.getElementById("stopwatch").innerHTML = displayTime; // update the display
	if(seconds==90){
		stopStopwatch()
	}
	if(seconds==casuale){
		document.getElementById("marcatori").innerHTML ="lautaro " + "&nbsp" + seconds + "'"
	}
}

function stopStopwatch() {
  clearInterval(stopwatchInterval); // stop the interval
  elapsedPausedTime = new Date().getTime() - startTime; // calculate elapsed paused time
  stopwatchInterval = null; // reset the interval variable
}
function main() {
  var a, b, d, x, y, z, t;
  a=1
  b=2
  if (a < b) {
      t = a;
      a = b;
      b = t;
      i = 1;
    }

    d = a - b;
    x = Math.sqrt((6.25 * (4 + d)) / 4);
    y = 6.25 / x;
    z = (x + y) * 3 / 5;

    if (i === 1) {
      t = x;
      x = y;
      y = t;
    }
x=x.toFixed(2);
y=y.toFixed(2);
z=z.toFixed(2);
document.getElementById("home").innerHTML =x
document.getElementById("draw").innerHTML =z
document.getElementById("away").innerHTML =y
}
</script>
<div class="rel">
	<div class="partita">
		<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/0/05/FC_Internazionale_Milano_2021.svg/512px-FC_Internazionale_Milano_2021.svg.png" class="casa" >
		<p id="result" class="risultato"> </p>
		<img src="https://www.calcioefinanza.it/wp-content/uploads/2022/06/SerieA_TIM_RGB.jpg" class="tim">
		<img src="https://kassiesa.net/uefa/clubs/images/Juventus.png" class="ospite">
	</div>
	<div class="marcatori" >
		<p id="stopwatch" class="timer"></p>
		<p id="marcatori"> </p>
	</div>
	<div class="quote">
		<div class="qt">
			<button class="button button2 q1" id="home"></button>
			<button class="button button2 qx" id="draw"></button>
			<button class="button button2 q2"id="away"></button>
		</div>
	<input type="button" onclick="cas(),startStopwatch()"  value="Simula partita" class="b1">
	</div>
</div>
</body>
</html>