/* *****************************************************************************
   ************************ BarISTa - CSS Stylesheet ***************************
   *****************************************************************************
   *********** Grupo 7 *********************************************************
   *********** 65870 - Andreia Calado ******************************************
   *********** 66392 - David Silva *********************************************
   *********** 68202 - Vania Mendonca ******************************************
   ************************************************************************** */


/* ****************************** Autores *********************************** */


#Credit {

	/* Dimensoes e posicao */
	width: 1300px;
	margin-top: 20px;
	top: 100%;
	position: absolute;

	/* Fonte */
	text-align: center;
	font-family: Arial;
	font-size: 8pt;
	color: #000000;
	font-weight: bold;

}

/* ******************************** Mesa ************************************ */

#Mesa {

	/* Dimensoes e posicao */
	width: 1300px;
	height: 1300px;
	position: absolute;
	

	/* Fundo */
	background-image: url('images/mesa.png'); /* Imagem TEMPORARIA */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;

	/* TEMPORARIO */	
	font-family: Arial;
	color: #555555;

}

#Trash {
	width: 1300px;
	height: 1300px;
	position: absolute;
}

/* ***************************** Ajuda ************************************** */

#Ajuda {
	width: 440px;
	height: 270px;
	position: absolute;
	opacity: 0;
	top: 38.5%;
	left: 30%;
	display: none;
	background-color: #FFFFFF;
	border: solid 5px #000000;
}

.videoAjuda {
	position: absolute;
	top: 20%;
	left: 1.7%;
}

#Video1 {
	display: none;
}

#Video2 {
	display: none;
}

#Video3 {
	display: none;
}

/* *************************** Agenda Fechada ******************************* */

#AgendaFechada {

	/* Dimensoes e posicao */
	width: 300px;
	height: 400px;
	top: 60%;
	left: 37%;
	position: absolute;

	/* Fundo */
	background-image: url('images/agendaFechada.png'); /* Imagem TEMPORARIA */
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	text-align: center;
}

/* *************************** Agenda Aberta ******************************** */

#AgendaAberta {
	width: 600px;
	height: 400px;
	top: 60%;
	left: 32%;
	position: absolute;
	opacity: 0;
	/* Fundo */
	background-image: url('images/agendaAberta.png'); /* Imagem TEMPORARIA */
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;

	display: none;
}

#Novembro {
	position: absolute;
	display: none;
}

#Dezembro {
	position: absolute;
	display: none;
}


.tituloMes {
	position: absolute;
	margin-top: 5px;
	margin-left: 10px;
	margin-bottom: 50px;
	font-weight: bold;
}

.diasSemana {
	font-weight: bold;
	color: #000000;
	width:30px;
	height:30px;
}

.diasMes {
	width:30px;
	height:30px;
}

.destaques {
	font-weight: bold;
	margin-bottom: 10px;
}

.eventoDH {
	font-size: 9pt;
	border-right: dotted 1px #777777;
	text-align: right;
	padding: 5px;
}


.eventoTitulo {
	font-size: 9pt;
	text-align: left;
	padding-left: 5px;
}

.eventoHead {
	font-size: 10pt;
	border-bottom: dotted 1px #555555;
	padding: 5px;
}





.DiasNovembro {
	position: absolute;
	margin-top: 30px;
	margin-left: -5px;
}

.DiasDezembro {
	position: absolute;
	margin-top: 30px;
	margin-left: -5px;
}


.ReservaMesa {
	padding-right: 10%;
}

.ReservaMesa2 {
	padding-left: 5%;
}

.HoraReserva {
	position: absolute;
	margin-top: 50px;
	margin-left: 10px;
	font-weight: bold;
	font-size: 11pt;
}

.Evento {
	position: absolute;
	margin-top: 95px;
	margin-left: 10px;
	font-size: 10pt;
	font-weight: bold;
}

.Evento1 {
	position: absolute;
	margin-top: 120px;
	margin-left: 20px;
	font-size: 10pt;
}

.Evento2 {
	position: absolute;
	margin-top: 145px;
	margin-left: 20px;
	font-size: 10pt;
}

.Evento3 {
	position: absolute;
	margin-top: 170px;
	margin-left: 20px;
	font-size: 10pt;
}

.PrecoA {
	position: absolute;
	margin-top: 210px;
	margin-left: 10px;
}

.tituloReserva {
	font-size: 12pt;
	font-weight: bold;
	text-align: center;
	padding-bottom: 20px;
}

.DataReserva {
	border-bottom: dotted 1px #000000;
	margin-bottom: 20px;
	font-weight: bold;
	font-size: 12pt;
}

.dadosReserva {
	font-size: 10pt;
	padding-bottom: 10px;
}

.dadosEvento {
	font-size: 10pt;
	padding-bottom: 10px;

}

/* *************************** Agenda Reserva ******************************* */
#Reserva {
	position: absolute;
	display: none;
}

/* *************************** Agenda ReservaFinal ************************ */
#ReservaFinal {
	position: absolute;
	display: none;
}

.data {
	position: absolute;
	margin-top: 80px;
	margin-left: 10px;
	
}

.hora{
	position: absolute;
	top: 20%;
	left: 60%;
}


.qts {
	position: absolute;
	margin-top: 95px;
	margin-left: 10px;
}

.NPess {
	margin-bottom: 5%;
	font-size: 10pt;
	padding-left: 8%;
}

#das {
	font-size: 10pt;
}

.nome {
	position: absolute;
	margin-top: 120px;
	margin-left: 10px;
}

.tlm {
	position: absolute;
	margin-top: 145px;
	margin-left: 10px;
}

#BotoesReservaFinal {
	position: absolute;
	top: 205px;
	left: 365px;
}


#SucessoReservaFinal {
	top: 78%;
	left: 70%;
	padding-top: 50px;
	opacity: 0;
	display: none;
}

#MaxPessoas {
	display: none;
}

#ReservaSaida {
	top: -2%;
	left: 95%;
	opacity: 0;
}

#ReservaSaida1 {
	top: 75%;
	left: 85%;
	opacity: 0;
}


#TextoReserva {
	text-align: center;
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 11pt;
	border: dotted 1px #000000;
	padding-top: 5px;
}


/* *************************** Ementa Fechada ******************************* */

#EmentaFechada {

	/* Dimensoes e posicao */
	width: 300px;
	height: 400px;
	top: 9%;
	left: 37%;
	position: absolute;

	/* Fundo */
	background-image: url('images/ementa.png'); /* Imagem TEMPORARIA */
	background-repeat: no-repeat;
	background-position: left center;
	background-size: cover;
	text-align: center;

	
	

}

/* *************************** Ementa Aberta ******************************* */

#EmentaComSeparadores {
	opacity: 0;
	width: 675px;
	height: 400px;
	position: absolute;
	top: 9%;
	left: 32%;
	display: none;
	

}


#Pag1{
	display: block;
}

#Pag2{
	display: none;
}

#Pag3{
	display: none;
}


#EmentaAberta {
	/* Dimensoes e posicao */
	width: 600px;
	height: 400px;
	position: absolute;
	top: 0px;
	left: 0px;	

	/* Fundo */
	background-image: url('images/ementa_aberta.jpg');
	background-position: center center;


}

.separadorActivo {
	width: 80px;
	height: 25px;
	position: absolute;
	left: 600px;
	padding: 5px;

	background-color: #fffefa;

	text-align: center;
	font-family: Arial;
	font-size: 14pt;
	color: #4c2c15;
	font-weight: bold;


}

.separadorInactivo {
	width: 80px;
	height: 25px;
	position: absolute;
	left: 600px;
	padding: 5px;

	background-color: #4c2c15;

	text-align: center;
	font-family: Arial;
	font-size: 14pt;
	color: #fffefa;
	font-weight: bold;

}

/* ****************************** Barra de Titulo *************************** */

.barraTituloEsq {

	/* Dimensoes e posicao */

	width: 45%;
	height: 8%;
	top: 1%;
	position: absolute;
	margin-top: 0%;
	margin-left: 1%; 
	padding-left: 1%;
	padding-top: 1%;

	/* Fonte */
	font-family: Arial;
	font-size: 20pt;
	color: #000000;
	font-variant: small-caps;
	letter-spacing: 1px;

	background-color: transparent;
	border-bottom: solid 1px #000000;
}

.barraTituloEsqA {

	/* Dimensoes e posicao */

	width: 45%;
	height: 12%;
	top: 1%;
	position: absolute;
	margin-top: 0%;
	margin-left: 1%; 
	padding-left: 1%;
	padding-top: 1%;

	/* Fonte */
	font-family: Arial;
	font-size: 20pt;
	color: #000000;
	font-variant: small-caps;
	letter-spacing: 1px;

	background-color: transparent;
	border-bottom: solid 1px #000000;
}

.barraTituloDir {

	/* Dimensoes e posicao */

	width: 45%;
	height: 8%;
	top: 1%;
	position: absolute;
	left: 52%;
	margin-top: 0%;
	margin-right: 1%;
	padding-left: 1%;
	padding-top: 1%;

	/* Fonte */
	font-family: Arial;
	font-size: 16pt;
	color: #000000;

	background-color: transparent;
	border-bottom: solid 1px #000000;
}

.barraTituloDirA {

	/* Dimensoes e posicao */

	width: 45%;
	height: 12%;
	top: 1%;
	position: absolute;
	left: 52%;
	margin-top: 0%;
	margin-right: 1%;
	padding-left: 1%;
	padding-top: 1%;

	/* Fonte */
	font-family: Arial;
	font-size: 16pt;
	color: #000000;

	background-color: transparent;
	border-bottom: solid 1px #000000;
}


.botaoAjuda {
	width: 25px;
	height: 25px;
	position: absolute;
	top: 20%;
	right: 40px;

	background-image: url('images/ajuda.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.botaoFechar {

	
	width: 30px;
	height: 30px;
	position: absolute;
	top: 15%;
	right: 5px;

	background-image: url('images/fechar.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

.botaoProcura {

	width: 120px;
	height: 30px;
	position: absolute;
	top: 18%;
	left: 55%;

	background-image: url('images/procura.jpg');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 0.7;


}

.botaoSeguinte {

	width: 20px;
	height: 340px;

	background-image: url('images/seguinte.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;


}

.botaoAnterior {
	width: 20px;
	height: 340px;

	background-image: url('images/anterior.png');
	background-position: center center;
	background-repeat: no-repeat;
	background-size: contain;
}

/* ************************** Items da Ementa ******************************* */

li.tipoProduto {
	font-weight: bold;
}

ul.produtos {
	margin: 10px;
	margin-left: -50px;
	list-style-type: none;
}

li.itemM {
	font-weight: normal;
}


/* ******************************* Bandeja ********************************** */

#Bandeja {

	width: 400px;
	height: 400px;
	position: absolute;
	top: 33%;
	left: 63%;
	opacity: 0;
	background-image: url('images/bandeja.png');
	background-repeat: no-repeat;
	background-size: contain;
	display: none;
}


table#BotoesBandeja {
	position: absolute;
	top: 70%;
	left: 25%;
}

#TextoBandeja {
	width: 250px;
	height: 50px;
	position: absolute;
	top: 40%;
	left: 20%;

	text-align: center;
	font-family: Arial;
	font-size: 12pt;
	font-weight: bold;
	color: #000000;
}

#TextoTalao {
	width: 90%;
	height: 50%;
	position: absolute;
	top: 40%;
	left: 5%;

	text-align: center;
	font-family: Arial;
	font-size: 12pt;
	font-weight: bold;
	color: #000000;
}

#ObjectosBandeja {
	width: 310px;
	height: 168px;
	position: absolute;
	top: 25%;
	left: 12%;
	overflow: auto;
	background-color: transparent;
}

.Quantidade {
	
	font-family: Arial;
	font-size: 16pt;
	color: #000000;
	font-weight: bold;
	margin-left: 5px;
	margin-bottom: 20px;
}


table.BotoesConfirmar {
	position: absolute;
	top: 15%;
	left: 8%;
}

.Confirmar {
	width: 250px;
	height: 160px;
	padding-top: 5%;
	padding-left: 5%;
	position: absolute;
	text-align: center;
	font-family: Arial;
	font-size: 12pt;
	font-weight: bold;
	color: #000000;
	background-image: url('images/balao.png');
	background-repeat: no-repeat;
	background-size: contain;
}

#PedirConfirmacao {
	top: 74%;
	left: 42%;
	opacity: 0;
	display: none;
}

#ConfirmarCancelarPedido {
	top: 73%;
	left: 60%;
	opacity: 0;
	display: none;
}

#Sucesso {
	top: 74%;
	left: 42%;
	padding-top: 50px;
	opacity: 0;
	display: none;
}

#ConfirmacaoTalao {
	top: 72%;
	left: 92%;
	opacity: 0;
	display: none;
}

#SucessoTalao {
	top: 72%;
	left: 92%;
	opacity: 0;
	display: none;
	padding-top: 50px;
}

/* **************************** Talao Fechado ******************************* */

#TalaoFechado {

	/* Dimensoes e posicao */
	width: 269px;
	height: 431px;
	top: 30%;
	left: 10%;
	position: absolute;
	background-image: url('images/talaoFechado.png');
	background-position: center center;
	display: none; 
}

/* **************************** Talao Aberto ******************************** */

#TalaoAberto {
	width: 350px;
	height: 475px;
	top: 30%;
	left: 5%;
	opacity: 0;
	position: absolute;
	display: none;
	background-image: url('images/talaoAberto.jpg');
	background-position: center center;
	background-size: cover;	
}


#ListaProdutos {
	background-color: #c0c0c2;
	width: 100%;
	height: 83%;
	overflow: auto;
}

.total {
	background-color: transparent;
	font-family: Arial;
	font-size: 13pt;

	text-align: center;
}

.preco{
	display: none;
}

.tituloTalao {
	width: 97%;
	height: 6%;
	margin-bottom: 0px;
	background-color: #444444;
	text-align: center;
	padding-left: 5px; 
	padding-top: 6px;
	color: #FFFFFF;
	font-size: 10pt;
	font-weight: bold;
}


.talaoDiv {
	position: absolute;
	background-color: #c0c0c2; /* #234500 */
	width: 45%;
	height: 76%;
	margin: 5px;
	margin-top: 20px;
}

#ProdutosPessoa{
	background-color: transparent; /*#234554 */
	width: 100%;
	height: 73%;
	overflow: auto;
}



/* ****************************** Campainha ********************************* */

#Campainha {

	/* Dimensoes e posicao */
	width: 200px;
	height: 200px;
	top: 65%;
	left: 65%; 
	position: absolute; 

	/* Fundo */
	background-image: url('images/campainha.jpg'); /* Imagem TEMPORARIA */
	background-position: center center;
	background-repeat: no-repeat;
	display: none;

}


/* ********************************* Logo *********************************** */

#Logo {

	width: 150px;
	height: 150px;
	top: 42%;
	left: 42%;
	position: absolute;

	background-image: url('images/logo.png');
	background-repeat: no-repeat;
	background-size: cover;
	display: none;
}