/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
html{
  font-size:18px;
}
* {
  box-sizing:border-box;
}
body {
  background-color: #CCC5A3;
  color: #424242;
  font-family: Verdana;
  /*width:50vw;*/
  /*margin:5rem auto 10% auto;*/
  /*padding:5% 0.8rem 0rem 0.8rem;*/
  /*text-align:center;*/
  border:1px solid;
}

@media only screen and (max-width: 620px) {
  /* For mobile phones: */
  .content, .homeheader, .pageheader .homecontent .sitenav .homenav {
    width: 100%;
  }
}

a{
 color:#56634a;
}

/*----------------------------------PAGEHEADER------*/
.pageheader{
  margin:0 0 2rem 0;
  border-bottom:1px solid;
  text-align:center;
}
.pageheader p {
 font-size:0.8rem; 
 border:1px dotted;
}
/*----------------------------------HOMEHEADER-----*/
.homeheader{
 border-bottom:1px solid; 
}

/*----------------------------------CONTENT------*/
.content{
  display:flex;
  flex-direction:column;
  border:2px solid;
  text-align:center;
  padding:0 0.5rem 1rem 1rem;
  margin:0 20vw 0 20vw;
}
.content h2{
  text-align:left;
  padding:0rem 0 0 0rem;
  font-size:1.3rem;
  border:1px dotted;
  width:20%
}

.content .contentdescription{
  text-align:right;
  font-size:0.8rem;
  border:1px dotted;
}


/*----------------------------------HOMECONTENT------*/

.homecontent{
  text-align:center;
  margin:6rem 0 0 0;
  border:0px solid;  
}
.homecontent p{
  margin:0 0 3rem 0;
  text-decoration:underline;
  text-decoration-style:dotted;
}

/*----------------------------------SITENAV------*/

.sitenav{
  border:0px dotted;
  background:inherit;
  position:sticky;
  top:0;
}
.sitenav li a{
  float:left;
  padding:1rem;
  text-decoration:none;

}
.sitenav ul{
  list-style-type:none;
  overflow:hidden;
  border:0px dotted;
  text-align:center;
  display: flex;
  justify-content: center;
  align-items: center;

}

/*----------------------------------HOMENAV------*/
.homenav p{
font-size:0.9rem;
margin:0.2rem 0 1.5rem 0;
}
.homenav li a{
  
  text-decoration:none;
  float:left;
  font-size: 1.3rem;
  font-weight:bold;

}
.homenav ul{
  padding:1rem 0 1rem 0;
  font-size:0.8rem;
  list-style-type:decimal-leading-zero;
  overflow:hidden;
  border:0px dotted;
  text-align:center;
  display: flex;
  justify-content: space-around;
  align-items: normal;
  margin:0 auto 0.2rem auto;
}
/*----------------------------------HOMEFOOTER------*/
 
.homefooter{
  margin:2rem auto 1rem auto;
  position:fixed;
  bottom:0;
  border:0px solid;
  width: 50rem;
  }

/*----------------------------------YT-EMBED------*/
.yt-embed iframe{
  width: 75%;
  aspect-ratio: 16 / 9;
}