body {
	/*width: 100%;*/
}

table#grid {
	width: 98%;
	margin: 0 auto;
	/*top: 200px;*/
}

.cursor-pointer{cursor:pointer;}

td {
	width: 30px;
	height: 30px;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	position: relative;
}
.tds {
	width: 25px !important;
	height: 15px !important;
	color: #000;
	background-color: #EEE;
	border-radius: 5px;
	font-size: 12px;
	transform: rotate(90deg); 
}
.corredor {
	/*background-color: #FFF;*/
	font-weight: bold;
	cursor: pointer;
	width: 30px !important;
	height: 30px !important;
	padding: 1px !important;
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
	border-left: none !important;
}
.path {
	background-color: #FFF !important;
	font-weight: bold;
	color: red;
	font-size: 18px;
}
.start {
	background-color: #FFF !important;
	font-weight: bold;
	color: red;
	font-size: 18px;
}
.end {
	background-color: #FFF !important;
	font-weight: bold;
	color: red;
	font-size: 18px;
}
.quiosque00 {
	border: none !important;
	text-align: center;
	/*font-size: 11px;*/
	font-weight: bold;
}
.quiosque0 {
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.wc1 {
	border-bottom: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}
.wc2 {
	border-top: none !important;
	border-bottom: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}
.wc3 {
	border-top: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}
.wc4 {
	border-right: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}
.wc5 {
	border-left: none !important;
	border-right: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}
.wc6 {
	border-left: none !important;
	text-align: center;
	font-weight: bold;
	background-color: #FF7F00;
}

.wcbug{border-left: none !important; border-bottom: none !important; }
.paredd{border-left: none !important; border-top: none !important; border-bottom: none !important;}

.quiosque1 {
	border-bottom: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.quiosque2 {
	border-top: none !important;
	border-bottom: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.quiosque3 {
	border-top: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.quiosque4 {
	border-right: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.quiosque5 {
	border-left: none !important;
	border-right: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 10px;
}
.quiosque6 {
	border-left: none !important;
	text-align: center;
	background-color: #FFB973;
	font-size: 11px;
}
.praca {
	font-size: 18px;
	font-weight: bold;
	border: none !important;
}
#loading {
	display: none;
	position: fixed;
	font-weight: bold;
	font-family: "Monospace";
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 128, 0, 0.9);
	color: #FFF;
	font-size: 24px;
	text-align: center;
	line-height: 100vh;
	z-index: 1000;
}
.corA{background-color: #99FF99;}
.corB{background-color: #FF7F00;}
.corC{background-color: #FFFF73;}
.corD{background-color: #73DCFF;}

.modal {
	display: none;
	position: absolute;
	width: 200px;
	height: 100px;
	background-color: white;
	border: 1px solid black;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	text-align: center;
	padding: 15px;
}
/* fundo modal */
.modal-overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0);
	z-index: 999;
}

        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            background-color: #f3f4f6;
            padding: 1rem;
        }
        .form-container {
            width: 100%;
            max-width: 768px; /* Otimizado para tablets */
            background-color: white;
            padding: 0.5rem;
            border-radius: 0.5rem;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        @media (max-width: 640px) {
            .form-container {
                padding: 1rem;
            }
        }