html {
  min-height: 100vh;
}

body{
  height:auto;
  background-color:aliceblue;
  
}
h4 {
  font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font:small;
}
ul
{
  display:grid;
  gap: 5px;
  list-style-type:none;
  padding:0px;
  margin:5px;
    
}



a {
  text-decoration:none;
}
.major{
  text-decoration:none;
  color:rgb(0, 0, 0);
}
.minor{
  text-decoration:none;
  color:rgb(114, 188, 253)

}
a:hover.minor {
  color:aliceblue;
}
a:hover.major{
  color:aliceblue;
}

img{
  width:auto;
}
.shadow{
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.603);
}
.animated{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

#topbar{
  display:flex;
  gap: 20px;
  height: 100%;
  width: 92%;
  padding: 10px;
  background-image: linear-gradient(to bottom, dodgerblue, rgb(0, 93, 231));
  border-radius: 5px;
  border: outset rgb(0, 162, 255);
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.603);
}

#sidebar{
  display: grid;
  height: 100%;
  width: 300px;
  padding: 10px;
  background-image: linear-gradient(to bottom, rgb(9, 132, 255), rgb(42, 74, 255));
  border-radius: 5px;
  border: 5px outset rgb(0, 162, 255);
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.603);
  gap: 10px;
}


#subbar{
  border-radius: 5px;
  border: 2px inset rgb(0, 20, 85);
  background-image: linear-gradient(to bottom, rgb(0, 60, 119), rgb(18, 41, 167));
  padding: 10px;
  font-family:system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  font-size:medium;
}

#primarybutton{
  border-radius:15px;
}
#mainbody{
  display:flex;
}

div.button{
  border-radius:7px;
  box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.603);
  overflow:hidden;
}