input { display: none; }
input + label { display: inline-block }

input ~ .tab { display: none }
#tab1:checked ~ .tab.content1,
#tab2:checked ~ .tab.content2,
#tab3:checked ~ .tab.content3,
#tab4:checked ~ .tab.content4,
#tab5:checked ~ .tab.content5 { display: block; }

input + label {
  border: 1px solid #999;
  background: #EEE;
  padding: 4px 12px;
  border-radius: 4px 4px 0 0;
  position: relative;
  top: 1px;
}
input:checked + label {
  background: #FFF;
  border-bottom: 1px solid transparent;
}
input ~ .tab {
  border-top: 1px solid #999;
  padding: 12px;
}

.adage {
  display: block;
  font-size: .83em;
  margin-top: .8em;
  margin-bottom: 1.4em;
  margin-left: 0;
  margin-right: 0;
  font-weight: normal;
  font-style: italic;
  text-align: center;
}

h1 {
 font-size: 1em;
 color: green;
 font-family: Helvetica;
 font-weight: bold; 
 margin-top: 0px;
 margin-bottom: 0px;
 /*text-shadow: 2px 2px 4px black;*/
}

h2 {
color: #999999;
font-family: arial, sans-serif;
font-weight: bold;
margin-top: 0px;
margin-bottom: 1px;
margin-right:  5px;
color: black;
font-size: 18px;
line-height: 1.6;
}

h3 {
display: block;
font-size: 1.17em;
margin-top: 0em;
margin-bottom: 4px;
margin-left: 0;
margin-right: 0;
font-weight: bold;
}

h4 {
display: block;
font-size: 1em;
margin-top: 0em;
margin-bottom: .2em;
margin-left: 0;
margin-right: 0;
}
/*
---------------------------------------------
Body Formatting: Begin
---------------------------------------------
*/

.glossary_index {
  background: #C0C0C0;
  line-height: 1.5;
  text-align: center;
  color: black;
}

.logotext { 
 color: #FFD700;
 /*color: green;*/
 font-family: Helvetica;
 font-weight: bold; 
 /*text-shadow: 2px 2px 4px black;*/
 }
 
 
 nav  #logo { /*font-size: large;*/
              font-size: 30px;
 	      display: block;
              padding: 0;
              width: 100%;
              text-align: center;
              float: none;
              color: green;
              text-shadow: 2px 2px 2px grey;
	}
 
 

  .MyTitleText {      
        border-style: solid;
        border-left:   3px solid green;
        border-top:    3px solid green;
        border-right:  3px solid green;
        border-bottom: 3px solid green;
    }

  .MyAboutText {
        background-color: #EEEEEE;
        border-style: solid;
        border-left:   0px solid green;
        border-top:    3px solid green;
        border-right:  0px solid green;
        border-bottom: 3px solid green;
    }

dgr1 { 
 font-family: "Times New Roman", Times, serif;
 font-weight: normal;
 }

hr {
width: 100%;
height: 3px;
margin-left: auto;
margin-right: auto;
background-color:green;
/*background-color:black;*/
border: 0 none;
margin-top: 0px;
margin-bottom: 0px;
}

/*
bb {
 background-color:black;
)
*/

trcmain {
  color: black;
  font-size: 60px;
  font-weight: bold;
}

trcsection {
  color: black;
  font-size: 40px;
}

trcglossword {
  color: black;
  font-size: 20px;
  font-weight: bold;
  /*font-family: Arial, Helvetica, sans-serif;*/
}

.logotext { 
 color: #FFD700;
 /*color: green;*/
 font-family: Helvetica;
 font-weight: bold; 
 /*text-shadow: 2px 2px 4px black;*/
 }


a.trcglossword:hover,  a.trcglossword:visited,  {
  text-decoration:none;
}

p.bodyline {
   line-height: 1.8;
  }

p.bodylinelarge {
   line-height: 2.1;
  }

body {
  margin-top:0px;
  margin-left:10px;
  margin-right:10px;
  font-family: Arial, Helvetica, sans-serif;
  
  animation: fadeInAnimation ease 1.5s; 
  animation-iteration-count: 1; 
  <!-- animation-fill-mode: forwards;  -->
  animation-fill-mode: both;
  }

        @keyframes fadeInAnimation { 
            0% { 
                opacity: 0; 
            } 
            100% { 
                opacity: 1; 
            } 
        } 

photocredit { font-family: Arial, Helvetica, sans-serif; font-size: small; }

.hfcolor {
   background-color: #F8F8F8;
}

/*
---------------------------------------------
Body Formatting: End
---------------------------------------------
*/


.glossbuttonbackground {
  line-height: 2.5;
  /* padding-top: 6px; */
  margin-top:    0px;
  margin-bottom: 10px;
  margin-right:  10px;
  margin-left:   15px;
}

.glossbackground {
  /*background: #f0ead6;*/
  /* background: #20B2AA; */#90ee90
  
  background: #E6DEDC;
  
  line-height: 1.5;
  padding-top: 6px;
}

.glossbackground:hover {
  background: #F5F5F5;
  line-height: 1.5;
}

.glossbackground:after {
 
    display: block;
 
    line-height: 40%;
    white-space: pre;
    content: "\A";
    
    /*border-bottom: 1px dotted #D3D3D3;*/
    border-bottom: 1px dotted 	#BEBEBE;
  }

.glossary_index {
  background: #C0C0C0;
  line-height: 1.5;
  text-align: center;
  color: black;
}

.glossary_index:after {
 
    display: block;
 
    line-height: 40%;
    /*white-space: pre;*/
    content: "\A";
    
    /*border-bottom: 1px dotted #D3D3D3;*/
    border-bottom: 1px dotted 	#BEBEBE;
  }
  
.button {
  text-align: center;
  background-color: platinum; ; 
  border-radius: 10px;
}

.button1 {
  width: 47%;
  border-radius: 10px;
}

.button1:hover {
  font-weight: bold;
  border-radius: 10px;
}

/*
.disabled {
  background-color: green; 
  border: 2px solid #4CAF50;
  opacity: 0.6;
  cursor: not-allowed;
  border-radius: 10px;
}
*/
.disabled_full_width_button {
  cursor: not-allowed;
  width: 96%;
}

.full_width_button {
  width: 99%;
    border-radius: 10px;
}

.full_width_button:hover {
  font-weight: bold;
   border-radius: 10px;
}
  
.max_width_button {
  width: 100%;
  border-radius: 10px;
}

.max_width_button:hover {
  font-weight: bold;
  border-radius: 10px;
}

.advance2letter {
  width: 100px;
  border-radius: 12px;
}

.advance2letter:hover {
  font-weight: bold;
  text-decoration: underline;
  background-color: gold;
}