/* CSS Document */





/*p
{
  font-family: Arial;
  font-size: 16px;
  font-weight: bold;
  text-align: left;
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 40px;
  margin-right: 40px;
  line-height: 1.2;
  color: black
}*/
 
h1
{
  font-family: Arial;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 20px;
  margin-left: 40px;
  margin-right: 40px;
  color: green;
}
 
 
h2
{
  font-family: Arial;
  font-size: 48px;
  font-weight: normal;
  text-align: center;
  margin-top: 5px;
  margin-bottom: 5px;
  line-height: 1.2;
  color: #00AAFF;
}

h3
{
  font-family: Arial;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
  margin-top: 20px;
  margin-bottom: 20px;
  color: black;
}



* {
  box-sizing: border-box;
}


.bar {
  background-color: blue; rgb(245, 193, 97);
  width: 100%;
  height: 40px;
  display: flex;
  list-style: none;
  padding: 0;
}

.bar li {
  height: 100%;
  width: 310px; 
  border-right: 1px solid rgb(235, 177, 69);
}

.bar li a {
  color: yellow; black;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.bar .has-dropdown ul li a{
padding: 12px 0;
}

.bar li a:hover {
  background-color: #4771B8; 
}

.bar li a.active {
  background-color: blue; rgb(165, 113, 16);
  color: yellow; white;
}

.dropdown {
  background-color: rgb(245, 193, 97);
  padding: 0;
  list-style: none;
  display: none;
}

.bar li.has-dropdown:hover .dropdown {
  display: block;
}
#footer
{
  width: 980px;
  padding: 10px;
  text-align: center;
  font-family: Arial;
  font-size: 12px;
  margin: 10px 0px 20px 0px;
  background-color:#CCFFFF;
}