html {
  min-height: 100%;

}


header {
  margin: 40px 0;
  font-size: 40px;
  text-align: center;
}

nav {
  margin: 0;
  text-align: center;
  background-color: rgb(61, 59, 165);
  box-sizing: content-box;
  display: flow-root;
  height: 4em;
  font-size: 20px;
}

nav>ul {
  margin: 0 20%;/**/
  /*padding: 1em;/**/
  list-style-type: none;
}


nav>ul>li {
  float:left;
  position: relative;/**/
}

nav>ul>li>a {
  display: block;
  margin: 0 30px;
  padding: 20px 20px;
  box-sizing: border-box;
  height: 4em;
  text-decoration: none;
  color: white;
}

/* Submenu */
nav>ul>li>ul {
  position:absolute;
  display: none;
}

nav>ul>li:has(a:hover)>a {
  background-color: rgb(22, 21, 100);
}

nav>ul>li:has(a:hover)>ul {
  display: block;
}


footer {
  display: flex;
  flex-direction: row;
  margin: 0;
  padding: 60px 100px;
  background-color: blueviolet;
  color: azure;
}

footer div {
  flex: 1;
}