body{
  background-color: #C2C2C2;
  font-family: Bahnschrift;
}

#header{
  background-color: #EDEDED;
  padding: 0.45rem 0.65rem 0.45rem 0.65rem;
  margin: 0.85rem 0.65rem 0.80rem 0.65rem;
  border-radius: 1rem;
  text-align: center;
}


/****Horizonal nav bar credit: https://www.w3schools.com/css/css_navbar_horizontal.asp***********************/


#top_nav_bar{
  background-color: #EDEDED;
  border: 2px solid #403F45;
  border-radius: 10px;
  margin: 0.85rem 0.65rem 0.80rem 0.65rem;
}

#top_nav_bar ul{
  list-style-type: none;
  margin: 0rem;
  padding: 0rem;
  overflow: hidden;
}

#top_nav_bar ul li{
  float: left;
  border-right: 1px solid #403F45;
}

#top_nav_bar ul li:last-child{
  border-right: none;
}

#top_nav_bar ul li a{
  display: block;
  color: #454545;
  text-align: center;
  padding: 10px 12px;
  text-decoration: none;
  transition: .90s ease-in-out;

}

#top_nav_bar ul li a:hover{
  background-color: #9E9E9E;
}

#top_nav_bar ul li a.active{
  background-color: #9E9E9E;
}


/************************************************************************************************/


#main{
  background-color: #EDEDED;
  border-radius: 1rem;
  padding: 0.25rem 1rem 0.65rem 1rem;
  margin: 0.65rem 0.65rem 0.65rem 0.65rem;
}

.award_title{
  display: inline;
}

#contest_icon{
  display: inline;
  height: 2rem;
  width: 2rem;
}

.web_bio{
  display: inline;
}

/*****Web gallery code credit: https://www.w3schools.com/css/css_image_gallery.asp********/


div.gallery{
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

div.gallery-item{
  margin: 5px;
  border: 1px solid #ccc;
  width: 180px;
}

div.gallery-item:hover{
  border: 1px solid #777;
}

div.gallery-item img{
  width: 100%;
  height: auto;
}

div.gallery-item div.desc{
  padding: 15px;
  text-align: center;
}

/******************For Horizontal Images************************/

div.gallery-item-2{
  margin: 5px;
  border: 1px solid #ccc;
  width: 370px;
}

div.gallery-item-2:hover{
  border: 1px solid #777;
}

div.gallery-item-2 img{
  width: 100%;
  height: 250px;
}

div.gallery-item-2 div.desc{
  padding: 15px;
  text-align: center;
}

/***************************************************************************/


/****************************************************************************************/


#footer{
  background-color: #EDEDED;
  padding-top: 0.06rem;
  padding-bottom: 0.06rem;
  border-radius: 1rem;
  text-align: center;
  margin: 0.85rem 0.65rem 0.80rem 0.65rem;
}

#footer p{
  padding: 0.65rem 0.65rem 0.45rem 0.65rem;
  font-size: 0.80rem;
}

#footer ul{
  list-style-type: none;
}

#footer ul li{
  display: inline-block;
}

#footer ul li a{
  text-decoration: none;
  /*background-color: */
  padding: 0.65rem 3rem 0.65rem 3rem;
  color: #454545;
  transition: 1.5s ease-in-out;
  border-radius: 0.65rem;
  display: inline-block;
  white-space: no-wrap;
  font-size: 0.70rem;
}

#footer ul li a:hover{
  color: #454545;
  background-color: #9E9E9E;
}

#footer ul li a.active{
  background-color: #9E9E9E;
}
