:root {
    --dk-color:#e8c088;
    --mid-color:#E4E6C3;
    --lt-color:#F7F7F2;
    --dkest-color:#261C15;
    --accent:#4b7ed7;
    --hover-color: #ffeab9; 
 }


.home_bar{
   width: 100%;
   margin: auto;
   height:30px;
   background-color: none;
}

.back_to_home{
	position: block;
   display: inline-block;
   margin: 1% 0%;
	padding: 3px;
	border-radius: 4px;
	border: 2px solid var(--dk-color);
   background-color: var(--dk-color);
}

.back_to_home:hover{
	background: var(--hover-color);
}

.main-content{
   width: 95%;
   padding: 10px;
   border-radius: 15px;
   height: auto;
}

h1{
    padding: 10px;
    padding-left: 0px;
    line-height: .50;
}

.byline{
   margin-top: -15px;
   width: fit-content;
   padding: 5px;
   border-radius: 5px;
   background-color: var(--lt-color);
}

header{
   padding: 0px;
   height: auto;
   width: 100%;
}

/*colored bars under dates-- 8 in all*/

.h01:after{
   content:""; 
   float:left; 
   background: var(--pink); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h02:after{
   content:""; 
   float:left; 
   background: var(--orange); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h03:after{
   content:""; 
   float:left; 
   background: var(--yellow); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h04:after{
   content:""; 
   float:left; 
   background: var(--lime); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h05:after{
   content:""; 
   float:left; 
   background: var(--blue); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h06:after{
   content:""; 
   float:left; 
   background: var(--teal); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h07:after{
   content:""; 
   float:left; 
   background: var(--purple); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}
.h08:after{
   content:""; 
   float:left; 
   background: var(--tan); 
   width: 100%; 
   height: 6px; 
   border-radius: 3px;
}


.captioned_image{
   width: fit-content;
   max-width: 80%;
   max-height: 300px;
   border: 1px solid var(--dkest-color);
   display: block;
   margin-left: auto;
   margin-right: auto;
   margin-bottom: 30px;
}

.inline{
   max-height: 300px;
   max-width: 100%;
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.caption{
   display: block;
   padding: 5px;
   text-align: center;
   font-size: small;
   font-style: italic;

}

@media only screen and (max-width: 720px) {

}