html, body { height:100%; margin:0; padding:0 }

.EVERYTHING { width:1880px; height:800px;}
/* SEMPRE PRESENTES */
#UTILIZADOR { 
	border:solid black;
	background:#98AFC7;
	clear:left;
	position:fixed; 
	width:6%; 
	height:14%; 
	text-align:center;
	z-index:8;
	font-family: Sans-Serif;
}

#UTILIZADOR:hover { background:#C7B097; }

#utilizadores{
	float:center;
	padding-top:5%;
	width:55%;
}

#time1 {
	float:right;
	padding-right:2%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}
#time2 {
	float:right;
	padding-right:2%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}
#time3 {	
	float:right;
	padding-right:1%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}
#time4 {	
	float:right;
	padding-right:1%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}

#time5 {
	float:right;
	padding-right:1%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}

#time6 {
	float:right;
	padding-right:1%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}
#time7 {
	float:right;
	padding-right:1%;
	color:#FFFFFF;
	font-size:16pt;
	font-family: Sans-Serif;
	font-weight:bold;
	/*position: fixed;*/
	z-index: 10;
}


#voltar{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}

#voltar2{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}

#voltar3{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}
#voltar4{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}
#voltar5{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}
#voltar6{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}
#voltar7{
		position:fixed;
		left:46.85%;
		height:45pt;
		width:90pt;
		border-radius: 90px 90px 0 0;
		-moz-border-radius: 0 0 90px 90px;
		-webkit-border-radius: 0 0 90px 90px;
		background:#FFFFFF;
}


#voltarimagem{
		padding-left:24%; 
		width:50%;
}

#ajuda{ 
 position:fixed;
 width:3.5%;
 height:7.5%;
 float:left;
 left:2%;
 top:91%;
 border-radius:100%;
 background:#000000;
 z-index: 10;
}
  
#ajuda:hover{
 background:#0BDACF;
}

#ajudaImagem{ 
 float:center;
 width:92%;
 padding-left:2%;
}


#ImpossibleActionPopUp{ display:none;line-height: 200%; }
#IndispFunctionalityPopUp{ display:none; }
#PedidoConcluidoPopUp{ display:none;line-height: 200%; }
#PlaylistPopUp{ display:none;line-height: 200%; }
#YourTurnToPlayS{ display:none;line-height: 200%; z-index:8;}
#YourTurnToPlayD{ display:none;line-height: 200%; z-index:8;}
#MusicaReprodPopUp{ display:none;line-height: 200%; }
#HelpPopUpMenuPrincipal{ display:none; }
#HelpPopUpJogos{ display:none;line-height: 200%; }
#HelpPopUpReservarS{ display:none; line-height:200%;}
#HelpPopUpReservarD{ display:none; line-height:200%;}
#HelpPopUpMusica{ display:none; }
#HelpPopUpMenu{ display:none;line-height: 200%; }
#HelpPopUpConta{ display:none; line-height: 200%;}
#EmpregadoPopUp{ display:none; line-height: 200%;}
#AreYouSurePopUpS{ display:none; line-height: 180%;}
#AreYouSurePopUpD{ display:none; line-height: 300%; }
#AreYouSurePopUpMusic{ display:none; line-height: 300%; }
#AreYouSurePopUpGender{ display:none; line-height: 300%; }
#AreYouSurePopUpConsum{ display:none; line-height: 500%;}
#AreYouSurePopUpCancelPedido{ display:none; line-height: 500%;}
#AreYouSurePopUpCancelSnooker{ display:none; line-height: 500%;}
#AreYouSurePopUpCancelDardos{ display:none; line-height: 500%; }
#AreYouSurePopUpPayMB{ display:none; line-height: 500%;}
#AreYouSurePopUpPayCash{ display:none; line-height: 500%;}
#Goodbye{ display:none; line-height: 500%;}

.PopUp{
	top: 0;
	left: 0;
	position: absolute; 
	width: 100%; 
	height: 100%;
	z-index:10;
}

.popupBoxWrapper { text-align: center;}

.popupBoxContent{
	position: absolute;
	top: 35%; 
	left: 25%;
	width: 50%; 
	height: 30%;
	background-color: white; 
	padding: 1%; 
	border-radius: 20pt;
	font-size: 210%;
	font-family: Sans-Serif;
	border: solid black;
}

.buttons3{
	width: 140pt;
	height: 30pt;
	border: solid;
	border-radius: 10px;
	font-size:20px;
	color:white;
	background-color:#000000;
	border-color: black;
	font-weight:bold;
}

/*------------------------------------------------------------------------------*/
/*-----------------------------------MENU-DE-ENTRADA----------------------------*/ 
/*------------------------------------------------------------------------------*/

#MenuDeEntrada {
	display: block;
	height:100%;
	margin:0;
	padding:0;
}

/* CAIXAS */
.caixas { 
	position:fixed; 
	width:50%; 
	height:50%;
}

.caixas:hover{
	opacity:0.90;
	text-shadow:0 0 2px #666;
	text-decoration:none;
	box-shadow:0 0 4px #222 inset;
}

#CONTA { 
	top:0;  
	left:0;   
	background:#009933; 
}
#contas {
	float:center; 
	padding-left:20%;
	height:90%;

}

#MUSICA {
	top:0;   
	left:50%; 
	background:#b30059;
}
#musicas {
	float:center; 
	padding-left:35%;
	padding-top:05%;
	height:90%;

}

#CHAMAR {
	top:50%; 
	left:0;  
	background:#cc7a00; 
}
#chamarr {
	float:center; 
	padding-left:20%;
	height:90%;

}

#JOGOS { 
	top:50%; 
	left:50%;
	background:#3366CC;   
}
#jogoss{
	height:90%;
	float:center; 
	padding-left:30%; 
	padding-top:05%;

}


/* BOLA */
#circulo{ 
	position:fixed;
	width:30%;
	height:60%;
	top:20%;
	left:35%;
	border-radius:100%;
	font-size:20px;
	color:#fff;
	line-height:600px;
	text-shadow:0 1px 0 #666;
	text-align:center;
	text-decoration:none;
	box-shadow:1px 1px 2px #000;
	background:#DBDACF;
}
  
#circulo:hover{
	background:#C0C0C0 ;
	text-shadow:0 0 1px #666;
	text-decoration:none;
	box-shadow:0 0 4px #222 inset;
}

#menu{
	float:center;
	padding-top:10%;
	height:70%;

}

/*------------------------------------------------------------------------------*/
/*-----------------------------------MENU-DE-JOGOS------------------------------*/ 
/*------------------------------------------------------------------------------*/

#MenuDeJogos {
	display: none;
	height:100%;
	margin:0;
	padding:0;
}

.caixasjogos { 	
		position:fixed; 
		width:50%; 
		height:100%;
}
		
.caixasjogos:hover{
	opacity:0.95;
	text-shadow:0 0 2px #666;
	box-shadow:0 0 4px #222 inset;
}

.letrajogos {
	color:black;
	text-align:center; 
	font-size:300%; 
	font-style: italic;
	font-family: Sans-Serif;
	font-weight: bold;
}

#dardos{
	background:radial-gradient(circle,#ffad33 ,#cc7a00 ,#804d00);
}

#snooker{
	background: radial-gradient(circle, #40bf40, #2d862d, #194d19); 
	left:50%;
}

#imagemdardos{
	float:center; 
	padding-left:28%; 
	padding-top:11%;
	width:51%;
}

#imagemsnooker{

	padding-left:20%; 
	padding-top:13%;
	width:70%;
}


/*------------------------------------------------------------------------------*/
/*---------------------------------RESERVA-SNOOKER------------------------------*/ 
/*------------------------------------------------------------------------------*/
#ReservaSnooker {
	display:none;
	position: fixed;
	height:100%;
	width:100%;
	padding:0;
	Marge:0; 
	background:#4A7023;
	font-family: Sans-Serif;
}
		
.caixaslaterais { position:fixed; height:100% }
	
#Esquerda {
	padding-left:6%;
	width:65%;
	clear: left;
}
		
#Direita {
	left:70%;
	width:30%;
	padding:2%;
	padding-top:7%;
}

#title {
	font-size:300%;
	font-family: Sans-Serif;
	color:white;
}

#horario {
	width:90%;
	overflow-y: auto;
	height: 75%;
	background:#458B00;
	border: black solid;
}

#tabela_horario{
	border-collapse: collapse;
	width:100%;
}
		
#tabela_horario th, #tabela_horario td {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

#tabela_horario tr:hover{background-color:#004F00}

#horarioa {
	width:90%;
	overflow-y: auto;
	height: 75%;
	background:#458B00;
	border: black solid;
	display:none;
}

#tabela_horarioa{
	border-collapse: collapse;
	width:100%;
}
		
#tabela_horarioa th, #tabela_horarioa td {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

#tabela_horarioa tr:hover{background-color:#004F00}

#tabela_horas{
	font-size:50pt;
	border-collapse: collapse;
	width:80%;
	text-align:center;
	margin-top:25%;
	font-family: Sans-Serif;
	color:white;
}

.Reservarbutton {
    width: 140pt;
    height: 30pt;
    border: solid;
    border-radius: 10px;
	font-size:18pt;
	color:white;
	background-color:green;
	border-color: black;
	font-weight: bold;
}
.Cancelarbutton {
    width: 140pt;
    height: 30pt;
    border: solid;
    border-radius: 10px;
	font-size:18pt;
	color:white;
	background-color:green;
	border-color: black;
	font-weight:bold;
}
		
.buttons {
	width: 160pt;
    height: 30pt;
    font-size: 20px;
	color:white;
	background-color:green;
	border-color: black;
	border-top-left-radius: 15px;
    border-top-right-radius: 15px;

}

#sa { opacity:0.5; }

/*------------------------------------------------------------------------------*/
/*---------------------------------RESERVA-DARDOS-------------------------------*/ 
/*------------------------------------------------------------------------------*/

#ReservaDardos {
	display:none;
	position: fixed;
	height:100%;
	width:100%;
	padding:0;
	Marge:0; 
	background:#cc7a00;
	font-family: Sans-Serif;
}

#horario2 {
	width:90%;
	overflow-y: auto;
	height: 75%;
	background:#e6ac00;
	border: black solid;
}

#tabela_horario2{
	border-collapse: collapse;
	width:100%;
}
		
#tabela_horario2 th, #tabela_horario2 td {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

#tabela_horario2 tr:hover{background-color:#ff8c1a}

#horario2a {
	display: none;
	width:90%;
	overflow-y: auto;
	height: 75%;
	background:#e6ac00;
	border: black solid;
}

#tabela_horario2a{
	border-collapse: collapse;
	width:100%;
}
		
#tabela_horario2a th, #tabela_horario2a td {
	padding: 8px;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

#tabela_horario2a tr:hover{background-color:#ff8c1a}



#tabela_horas2{
	font-size:50pt;
	border-collapse: collapse;
	width:80%;
	text-align: center;
	margin-top:25%;
	color:#FFFFFF;
}
.Reservarbutton2 {
    width: 140pt;
    height: 30pt;
    border: solid;
    border-radius: 10pt;
	font-size:18pt;
	color:white;
	background-color:black;
	border-color: black;
	font-weight: bold;
}
.Cancelarbutton2 {
    width: 140pt;
    height: 30pt;
    border: solid;
    border-radius: 10pt;
	font-size:18pt;
	color:white;
	background-color:#000000;
	border-color: black;
	font-weight:bold;
}

		
.buttons2 {
	width: 160pt;
    height: 30pt;
    font-size: 20px;
	color:white;
	background-color:#000000;
	border-color: black;
	border-top-left-radius: 15px;
    border-top-right-radius: 15px;

}

#da { opacity:0.5; }


/*------------------------------------------------------------------------------*/
/*-----------------------------------MENU-MUSICAS-------------------------------*/ 
/*------------------------------------------------------------------------------*/

#MusicSection{
	display: none;
	position:fixed;
	width:100%;
	height:100%;
	background-color:#A90154;
}

#title2 {
	font-size:270%;
	padding-left: 7.6%;
	padding-top: 2%;
	font-family: Sans-Serif;
	color: white;
}

.MenuDeMusicas {
		position:absolute;
		top:24%;
		left:11%;
		width:80%; 
		height:70%;
		background-color:#ECD6E1;
		border-radius:15px;
		border-top-left-radius:0px;
		border-top-right-radius:0px;
		border:solid;
		border-collapse: collapse;
		border-color:#006666;
		text-align:center;

}

#reprodutor{
		position:absolute;
		top: 17.5%;
		left: 63%;
		width:30%; 
		height:6%;
		background-color:#ECD6E1;
		border-top-left-radius:10px;
		border-top-right-radius:10px;
		border:solid;
		border-collapse: collapse;
		border-color:black;
		text-align:center;
}

#playermusica2{
	position:absolute;
	margin-top:2%;
	margin-right:0%;
	font-size:7pt;
	width:99%;
	text-align:right;
	font-family:Sans-Serif;
	color: white;
	z-index: 10;
}

#player{
	width: 3%;
	position:absolute;
	margin-top:2%;
	margin-left:6.5%;

}

.botoesMenuMusica{ 
  position:absolute;
  margin-top:0.4%;
  width: 160pt;
  height: 30pt;
  font-size: 20px;
  color:white;
  background-color:rgb(142, 141, 141);
  border-color: black;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  font-family: Sans-Serif;
}
#botaomusicas{
	margin-left: 7.8%;
}

#botaogeneros{
	 margin-left:19.8%;
	 opacity:0.6;
}

#botaoplaylist{
	 margin-left:51%;
	 background-color:black;
}

.caixasmenuMusicas{
		position:absolute; 
		overflow-y: auto;
		width:30%; 
		height:86%;
		border:solid;
		border-radius:15px;
		border-top-left-radius:0px;
		border-width:4px;
		border-color:black;
		color: #80CAA5;
}

#menuMusica{
		top:24%;
		left: 7.8%;
		width:85%; 
		height:70%;
		background-color:#ECD6E1;
		display: block;
}

#menuGenero{
		display:none;
		top:24%;
		left: 7.8%;
		width:85%; 
		height:70%;
		background-color:#ECD6E1;
}

#Jukebox{
	width: 500px;
	}
	
#artista { 
	font-family:Sans-Serif;
}
	
.jukebutton {
		width: 100px;
	}
	
.MusicName {
		font-size:200%;
		font-weight: bold;
		font-family:Sans-Serif;
	}
	
.MusicBox {
		border-collapse: collapse;
		Marge: 10px;
	}
	
#GenderTable { 
			color: #334d4d;
			font-family:Sans-Serif;
			padding-left:2%;
}
			
#MusicTable{
			color: #334d4d;
			font-family:Sans-Serif;
			padding-left:2%;
}
.gif{
	width:70%;
	padding-left: 150%;
	padding-top: 1%;
	display: none;
	z-index:10;
}



/*------------------------------------------------------------------------------*/
/*-----------------------------------MENU-PEDIDOS-------------------------------*/ 
/*------------------------------------------------------------------------------*/

#fundoPedidos{ 
		display:none;
		position:fixed; 
		width:100%; 
		height:100%;
		background-color:#456778;
}

#favoritos {display:none;}

#caixasdospedidos { 	
		position:absolute; 
		top:10%;
		left:6%;
		width:90%; 
		height:82%;
}

#caixacomopcoesfavoritos{
		display:none;
		overflow-y: auto;
		width:76%; 
		background-color:#cc7a00;
}

#caixacomopcoesbebidas{
		display:block;
		width:76%; 
		background-color:#cc7a00;
}

#caixacomopcoesbebidasalcool{
		display:none;
		width:76%; 
		background-color:#cc7a00;
		overflow-y: auto;
}

#caixacomopcoesaperitivos{
		display:none;
		width:76%; 
		background-color:#cc7a00;
}

#caixacomopcoestostas{
		display:none;
		width:76%; 
		background-color:#cc7a00;
}

	

#caixadoteupedido{
		left:77%;
		width:25%; 
		background-color:green;
}

#caixaconfirmalimpapedido{
		position: absolute;
		top: 85%;
		height: 15%;
		width: 100%;

}
.botaoconfirmalimpa{
		position: absolute;
		height: 50%;
		width: 40%;
		top: 20%;
		border:solid;
		border-radius:10px;
		background:#F3F6CB;
		text-align:center;
		line-height: 300%;
}
#botaoconfirma{
		left:5%;
}
#botaolimpa{
		left:55%;
}
.caixasdepedidos{
		position:absolute; 
		height:100%;
		border:solid;
		border-radius:15px;
		border-top-left-radius: 0%;
}

#caixacomopcoesfavoritos td, #caixacomopcoesbebidas td, #caixacomopcoesbebidasalcool td, #caixacomopcoesaperitivos td, #caixacomopcoestostas td {
	padding-left:50px;
}

#titlepedidos{
		font-size:300%;
		font-family: Sans-Serif;
		padding-left: 5%;
		padding-top: 1%;
		color:white;
	
}

.opcoesdemenu{
		height:33.33%;
		text-align:center;
		line-height:100%;
    	font-family: Sans-Serif;
    	font-size: 100%;
    	color: #000000;
		border-bottom:solid;
		border-collapse: collapse;
		}

.coisasdomenu1{
		left:3.333%;
		height:20%;
		text-align:center;
		line-height:100%;
    	font-family: Sans-Serif;

		}

.coisasdomenu1 td {
		padding: 8px;
		width:5%;
		background-color:#FFFFFF;
		text-align: left;
		border: 1px solid #000000;
		border-radius:10px;
		border-collapse: collapse;
}
	

 
#tabelapedido1{
		margin-top:10%;
		height:72%;
		width:99%;
		overflow-y: scroll;
		border:solid;
	}
 
#tabelapedido tr{
		height:13%;
		text-align:center;
		border-bottom:solid;

		}

#tabelapedido td {
		color: #FFFFFF;
		border-collapse: collapse;
}
#tabelanome{
		width:380px;
		color:white;
}

.totalpedido{
		position: absolute;
		height: 5%;
		left:65%;
		width:30%;
		top: 80%;
		text-align:left;
		line-height: 200%;
		color: white;
}

.titulodascaixas{
		position:absolute; 
		top:1%;
		width:100%;
		height:5%;
		text-align:center;
		font-size:100%;
		color:black;
		border-bottom:solid;
}

.nomedascoisas{
		font-size:150%;
		font-weight: bold;
		color:white;
		font-family:Sans-Serif;
}

.imagenscomida {
		height: 32%;
		top:1%;
}
	
.buttonspedidos {
		width:160pt;
		height:30pt;
		font-size:20px;
		color:white;
		background-color:green;
		border-color: black;
		border-top-left-radius: 15px;
		border-top-right-radius: 15px;
}

.simbolosmaismenos {
		height: 27pt;
}
.nomehistorico{
		font-size:15pt;
		font-weight: bold;
		font-family:Sans-Serif;
}
.nomebotoes{
		font-size:14pt;
		font-weight: bold;
		font-family:Sans-Serif;
}



/*------------------------------------------------------------------------------*/
/*------------------------------------MENU-CONTA--------------------------------*/ 
/*------------------------------------------------------------------------------*/


#menudeconta{
		display:none;
		position:fixed;
		width:100%;
		height:100%;
		background:#336699;
}

#titulohistorico{
		margin-left: 6%;
		width: 50%;
		height: 5%;
		font-size: 200%;
		line-height: 130pt;
		color: #FFFFFF;
}

#tabelahistorico1{
		margin-top:60pt;
		margin-left:6%;
		height:80%;
		width:65%;
		overflow-y: scroll;
		border:solid;
		background:#74BBFB;
}

#tabelahistorico{ border-collapse: collapse; }
 
#tabelahistorico tr{
		width: 64%;
		height: 10%;
		text-align: center;
		border-bottom: solid;
		line-height: 400%;
}

#tabelahistorico th {
		width: 400px;
		font-size: 25pt;
		border-bottom: solid;
		font-family: sans-serif;
		
}

#tabelahistorico td {
		width: 400px;
		font-size: 18pt;
		border-bottom: solid;
		font-family: sans-serif;
		
}


#titulototalpagar{
		position: absolute;
		left: 75%;
		top: 40%;
		height: 60%;
		font-family: sans-serif;
		font-size: 30pt;
		color: #FFFFFF;
		text-align: center;
}

#pricetotalconta{text-align:center;}

#tabelanome { text-align:left; padding-left:30px; color:black; }

.botoescontaopcoes{
		position: absolute;
		width:140pt;
		height:30pt;
		top: 45%;
		border:solid;
		border-radius:10px;
		background:#F3F6CB;
		text-align:center;
		line-height: 26pt;
		font-family: sans-serif;
		font-size: 18pt;
}
#botaopagar{}

#botaojuntar{}

.nomehistorico1{
		font-size:200%;
		font-family:Sans-Serif;
		color:black;
}