* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: Arial, sans-serif;
    text-align: center;
    background-color: #f4f4f4;
}
header {
    background-color: #0056b3;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}
.logo {
    max-width: 100px;
    margin-right: 20px;
}
.title {
    flex-grow: 1;
    text-align: center;
}
.content {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 20px;
}
.banner {
    max-width: 600px;
    height: auto;
}
.container {
    flex: 1;
    padding: 20px;
    background: white;
    border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.1);
    text-align: left;
}

/* MENU LINKS */
.menu {
    background-color: yellow;
    margin-bottom: 15px;
    margin-left: 0px;
}
.menu ul {
    list-style-type: none;
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    padding-left: 0;
}
.menu a {
    text-decoration: none;
    color: #0056b3;
    font-weight: bold;
}
.menu a:hover {
    text-decoration: underline;
}
.button{
    display: inline-block;
    margin: 5px;
    padding: 5px 5px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 5px;  
}
select {
    display: inline-block;
    margin: 5px;
    padding: 5px 5px;
    background-color: white;
    color:#007bff;
    text-decoration: none;
    border-radius: 5px;  
}
#myInput {
    display: inline-block;
    margin: 5px;
    padding: 5px 5px;
    background-color: white;
    color:#007bff;
    text-decoration: none;
    border-radius: 5px;  
}

a.button {
    display: inline-block;
    margin: 10px;
    padding: 10px 20px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 5px;
}
a.button:hover {
    background-color: #0056b3;
}
li {
    padding: 20px;
    margin-left: 20px;
}
#myLi {
    padding: 5px;
    margin-left: 15px;
}
h3, h4 {
    color: white;
}
#Preto{
    color: #007bff;;
}
#regulartable {
	margin-bottom:15px;
	border:#cccccc 1px solid;
	width:100%;
}
#regulartable th{
	padding-top:8px;
	padding-bottom:8px;
}
#regulartable td{ 
	font-family: 'PT Sans', sans-serif;
	font-size: 10px;
	line-height: 20px;
	text-align: center;
}
#regulartable td{
	padding-top:5px;
	padding-bottom:5px;
}
.regulartable-odd{
	background-color:#f7f7f7;
}
.regulartable-even{
	background-color:#ffffff;
}
.regulartable-highlight-odd{
	color: #222222;
	background-color:#ddd;
	text-shadow:0 0 0 transparent,#ffffff 0px 1px 0px;
}
.regulartable-highlight-even{
	color: #222222;
	background-color:#eee;
	text-shadow:0 0 0 transparent,#ffffff 0px 1px 0px;
}
.regularstandard{
	text-align: center;
	color: #000000;
font-size: 10px;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	text-shadow:0 0 0 transparent,#ffffff 0px 1px 0px;
	border-bottom:#cccccc 1px solid;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f7f7f7'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#f7f7f7)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #ffffff, #f7f7f7); /* for firefox 3.6+ */
	padding: 0px;
}
footer {
    background-color: #0056b3;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.1);
}
@media (max-width: 500px) {
    .content {
        flex-direction: column;
        align-items: center;
    }
    .banner {
        width: 100%;
    }
    .menu ul {
        flex-direction: column;
        gap: 10px;
    }
}

  .table-wrapper {
    width: 100%;
     
    overflow-x: auto;
  }