h2 {
  font-size: 1.2rem;
  width: auto;
  display: table;
  background-image: linear-gradient(rgba(var(--primary_colour_dark), 1), rgba(var(--primary_colour), 1));
  color: rgba(var(--navbar_colour), 1);
  padding: 0.1rem 2.5rem;
  margin-bottom: 20px;
  border-radius: 60px 20px 60px 20px;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.4);
}

.block_1 {
  grid-area: block_1;
  color: rgba(var(--primary_colour), 1);
  margin: 2rem 0 1rem 0;
}

.block_2 {
  grid-area: block_2;
  color: rgba(var(--primary_colour), 1);
  width: 100fr;
  margin: 0 0 1rem 0;
}

.hr_desc {
  width: 100%; /* adjust width as needed */
  margin: 1rem 0 2rem 0;
  border-top: 1px solid rgba(var(--primary_colour), 1); /* adjust color and thickness as needed */
}

#page_title_area{grid-area: page_title_area;}
#description_area {grid-area: description_area;}

#description_show_hide{
  color: rgba(var(--navbar_blue), 1);
  font-style: italic;
  cursor: pointer;
}


input[type=checkbox]
{
  accent-color: darkcyan;
  width: 1rem;
  height: 1rem;
}

.b2_row1{grid-area: b2_row1;}   /* b2 = block_2 */
.b2_row2{grid-area: b2_row2;}
.b2_row3{grid-area: b2_row3;}

/* The MAIN Fieldset border */
fieldset{
  background-color: rgba(var(--primary_colour_mid2), 1);
  border: 1px solid white;
  border-radius: 0.5rem;
  padding: 1rem;
  width: fit-content;
  margin-bottom: 2rem;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.4);
}

.xxx_fieldset{grid-area: xxx_fieldset;}

/* Form */
.xxx_form{grid-area: xxx_form;}

/* Header Details */
.xxx_header_details{
  grid-area: xxx_header_details;
  font-size: 2rem;
  text-align: center;
  color: rgba(var(--navbar_blue), 1);
}

/* Tick Box */
#xxx_tickbox_1_words{
  grid-area: xxx_tickbox_1_words;
  text-align: right;
  margin-right: 1rem;
}
#xxx_tickbox_1_elem{grid-area: xxx_tickbox_1_elem;}

/*#xxx_tickbox_2_words{*/
/*  grid-area: xxx_tickbox_2_words;*/
/*  text-align: right;*/
/*  margin-right: 1rem;*/
/*}*/
/*#xxx_tickbox_2_elem{grid-area: xxx_tickbox_2_elem;}*/

/* Text box*/
.xxx_textbox_1_title{
  grid-area: xxx_textbox_1_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_textbox_1_elem{
  grid-area: xxx_textbox_1_elem;
  max-height: 1.4rem;
  width: 16rem;
  padding: 0.5rem;
  border-radius: 8px;
  /*background-color: yellow;*/
}

.xxx_textbox_2_title{
  grid-area: xxx_textbox_2_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_textbox_2_elem{
  grid-area: xxx_textbox_2_elem;
  max-height: 1.4rem;
  width: 16rem;
  padding: 0.5rem;
  border-radius: 8px;
  /*background-color: pink;*/
}

.xxx_textbox_3_title{
  grid-area: xxx_textbox_3_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_textbox_3_elem{
  grid-area: xxx_textbox_3_elem;
  max-height: 1.4rem;
  width: 16rem;
  padding: 0.5rem;
  border-radius: 8px;
  /*background-color: cyan;*/
}

.xxx_textbox_4_title{
  grid-area: xxx_textbox_4_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_textbox_4_elem{
  grid-area: xxx_textbox_4_elem;
  max-height: 1.4rem;
  width: 9rem;
  padding: 0.5rem;
  border-radius: 8px;
  /*background-color: darkseagreen;*/
}

.xxx_textbox_5_title{
  grid-area: xxx_textbox_5_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_textbox_5_elem{
  grid-area: xxx_textbox_5_elem;
  max-height: 1.4rem;
  width: 16rem;
  padding: 0.5rem;
  border-radius: 8px;
  /*background-color: darkseagreen;*/
}

/* DDL elements */
.xxx_ddl_1_title{
  grid-area: xxx_ddl_1_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_ddl_1_elem{
  grid-area: xxx_ddl_1_elem;
  max-height: 1.4rem;
  border-radius: 8px;
  width: fit-content;
  /*background-color: lawngreen;*/
}

.xxx_ddl_2_title{
  grid-area: xxx_ddl_2_title;
  text-align: right;
  margin-right: 1rem;
}

.xxx_ddl_2_elem{
  grid-area: xxx_ddl_2_elem;
  max-height: 1.4rem;
  border-radius: 8px;
  width: fit-content;
  /*background-color: lawngreen;*/
}

.xxx_margin_1rem{margin-top: 1rem;}

.class_name_label{grid-area: class_name_label;}
.class_name_element{grid-area: class_name_element;}

/* Submit Form Button */
.form_button{
  border-radius: 60px 20px 60px 20px;
  padding: 0.5rem;
  margin: 1rem 0;
  width: 15rem;
  cursor: pointer;
  text-align: center;
  transition: all 0.2s ease 0.2s;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.4);

  border: 1px solid rgba(var(--british_racing_yellow), 1);
  background-color: rgba(var(--darker_grey), 1);
  color: rgba(var(--british_racing_yellow), 1);
}

.form_button:hover{
  border: 1px solid rgba(var(--darker_grey), 1);
  background-color: rgba(var(--british_racing_yellow), 1);
  color: rgba(var(--darker_grey), 1);
}

/*.class_name_label{grid-area: class_name_label;}*/
/*.class_name_element{grid-area: class_name_element;}*/