Good people, I would like to put a clock on a site that I am doing but nothing appears :( Could you give me a hand?
Thank you in advance.
HTML:
<!doctype html>
<html>
<head>
<link href="https://fonts.googleapis.com/css?family=Yantramanav:100,300,400,500,700,900" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="Style-index.css">
<title>Marucos</title>
<script type="text/javascript">
function relogio(){
var data = new date();
var horas = data.gethours();
var minutos = data.getminutes();
var segundos = data.getseconds();
if(horas < 10){
horas="0"+horas;
if(minutos < 10){
minutos="0"+minutos;
if(segundos < 10){
segundos="0"+segundos;
}
document.getElementById("relogio").innerHTML=horas+":"+minutos+":"+segundos;
}
window.setInterval("relogio()",1000);
</script>
<style type="text/css"></style>
</head>
<body background='Imagens/background-index01.jpg' onload="relogio();">
<audio src="Músicas/Laura Branigan - Self Control.mp3" autoplay loop></audio>
<div id="relógio"></div>
<a href="page01.html"><div style=""><video class="center" width="500" height="300" autoplay loop>
<source src="Videos/Produce.mp4" type="video/mp4">
</video></div></a>
<a href="https://www.skype.com/pt"><div style=""><img class="padding bottom left" src="Imagens/skype.png" width="30" height="30"></div></a>
<a href="https://www.whatsapp.com"><div style=""><img class="padding bottom left" src="Imagens/whatsapp-messenger.png" width="30" height="30"></div></a>
</body>
</html>
CSS:
#menu ul{
width:300px;
height: auto;
background-color:#2f4f4f;
display:block;
margin:0;
padding:0;
width:306px;
cursor:pointer;
}
#menu li{
list-style:none;
display: block;
width:100%;
height:auto;
border-bottom:2px solid #fff;
color:#fffafa;
font-family: helvetica;
font-size: 20px;
padding: 20px;
text-align: center;
}
#menu li:hover{
background: #ff4500;
width: 266px;
}
#menu li{
-webkit-transition:all .9s ease;
-moz-transition:all .9s ease;
-ms-transition:all .9s ease;
transition:all .9s ease;
}
h1{
font-family:helvetica;
color: #8fbc8f;
}
.center{
padding-top:15%;
padding-left:35%;
}
body{
background-image: Imagens/background-index01.jpg;
background-repeat: no-repeat;
background-size: cover;
margin: center;
padding: 50px 60px;
}
#relogio{
color:#f90;
font:bold 48px Arial;
padding:50px;
}