.thepage{
   display: grid;
   grid-template-columns: 1fr;
   align-content: stretch;
   justify-content: start;
   align-items: start;
   justify-items: start;
    
}

.grid-page{
   font-size:1.1em;
}
.grid-page h2{
font-size:1.8em;
margin: 0;
margin-top:40px;
    padding: 0;
    color: #ff671e;
    border-bottom: thin solid orange;
    margin-bottom: 8px;
    padding-bottom: 10px;
}
.grid-page h4{
   font-size: 1.3em;
   margin: 0;
    padding: 0;
    margin-bottom: 12px;
}
.grid-page h5{
   font-size: 1.2em;
   margin: 0;
    padding: 0;
    margin-bottom: 6px;
}
.grid-page li{
padding:6px;
}
#top{
   position: -webkit-sticky; /* Safari */
   position: sticky;
   z-index: 999999;
   top: 0;
}
 .form input{
   padding:8px;
 }
 
 .form  textarea{
   padding:8px;
   min-height: 100px;
 }
.sticky {
   position: -webkit-sticky; /* Safari */
   position: sticky;
   z-index: 999;
    top:0;
    
 }
.page-header{
   background:white;
    
 }

 .page-header > div{
   /*grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); 
   grid-template-columns:  0.75fr  1fr;
   */
   justify-content: right;
   justify-items: end;
 }
.page-menu{
   min-height:60px;
   line-height:60px;
}
 .page-left{
    min-height:100vh;
    min-height:100dvh;
 }
 .leftcol{
    display: inline-grid;
    min-height:100vh;
    min-height:100dvh;
 }
 .main-page{
    align-items: start;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 }

.header{
   color:#00255b;
}

.button{
   background: #ff671e;
   border-color: #FF3C00;
   color: white;
   display: inline-block;
   width: auto;
   padding: 10px;
   padding-left: 20px;
   padding-right: 20px;
}

 .sidenav{
background:white;
list-style: none;
padding:0;
margin:0;

 }
 .sidenav li{
    border: thin outset silver;
 }

 .sidenav li > a{
    border: thin inset silver;
 }



 .docnav{
   background:white;
   list-style: none;
   padding:2px;
   margin:0;
       }
    .docnav li{
      padding: 2px;
      background: #dbe0e4; 
    }
   
    .docnav li > a{
      border: thin inset silver;
      width: 100%;
      display: block;
      padding: 4px;
      cursor: pointer;
    }
    .docnav li > button{
      
      width: 100%;
       
      padding: 4px;
      cursor: pointer;
    }    


    .clicked{
      background: #407ac0;
    
    }
 /*
 
@media only screen and (max-width: 768px) {


   .page-header > div{
      grid-template-columns: 1fr;
      justify-items: start;
    }

}
*/
 /* --- color changes --- */
 /*
blockquote {
   border-left: 5px solid #2881D6!important;
}
*/
.button {
   background: #023464!important;
   border-color: #034483!important;
   color: white;
   display: inline-block;
   width: auto;
   padding: 10px;
   padding-left: 20px;
   padding-right: 20px;
}
 

.topnav a.active {
   background-color: #00255b;;
   color: white;
 }
 
 .topnav a:hover{
   background: #00255b;;
   border-color:#0874DC;
   color:white;
 }

 
 .footer-about-social-icon ul li:hover a{
   background: #00255b;;
   border-color:#0874DC;
   color:white;
 }

 .grid-page h2 {
   font-size: 1.8em;
   margin: 0;
   margin-top: 40px;
   padding: 0;
   color: #034483;
   border-bottom: thin solid #023464;
;
   margin-bottom: 8px;
   padding-bottom: 10px;
}
.button:hover{
   background: #2881D6!important;
   border-color:#0874DC!important;
   color:white!important;
}


.wave {
   display: block;
   position: relative;
   
   width: 100%;
   background: #29537E;
   transform: scale(1, 1);
 }
 
 .wave:before {
   content: "";
   display: block;
   position: absolute;
   border-radius: 100%;
   width: 400%;
   height: 400%;
   background-color: white;
   right: -55%;
   top: 20px;
   opacity: 0.03;
 }
 
 .wave:after {
   
 }