:root {
  --form-width: 100%;
}

#main_Wrapper {
  grid-template-columns: repeat(12, [col] 1fr);
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  row-gap: 0;
  grid-template-areas: "main-head" "main-form" "main-obit";
}

#main_Heading {
  grid-area: main-head;
  grid-column: col/span 12;
  grid-row: 1;
  text-align: left;
}

#main_Form {
  grid-area: main-form;
  grid-column: col 1/span 7;
  grid-row: 2;
  margin-bottom: 0;
}

#form_Text {
  display: grid;
  grid-template-columns: repeat(12, [col] 1fr);
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  row-gap: 0;
  grid-template-areas: "grid-required" "grid-validated";
}

#grid_Required {
  grid-area: grid-required;
  grid-column: col/span 6;
  grid-row: 1;
}

#grid_Validated {
  grid-area: grid-validated;
  grid-column: col 7/span 6;
  grid-row: 1;
}

#main_Obit {
  grid-area: main-obit;
  grid-column: col 8/span 5;
  grid-row: 2;
}

#form_Menu {
  display: grid;
  grid-template-columns: repeat(12, [col] 1fr);
  -moz-column-gap: 1rem;
       column-gap: 1rem;
  row-gap: 0;
  margin-top: 5px;
  padding-bottom: 10px;
  text-align: left;
  grid-template-areas: "menu-btnhint" "menu-submitter" "menu-btndisplay" "menu-recid" "menu-name" "menu-addedtdelclr";
}

#menu_BtnHint {
  grid-area: menu-btnhint;
  grid-column: col/span 2;
  grid-row: 1;
  text-align: right;
}

#menu_Submitter {
  grid-area: menu-submitter;
  grid-column: col 3/span 3;
  grid-row: 1;
}

#menu_BtnDisplay {
  grid-area: menu-btndisplay;
  grid-column: col 6/span 2;
  grid-row: 1;
  text-align: center;
}

#menu_RecId {
  grid-area: menu-recid;
  grid-column: col 8/span 2;
  grid-row: 1;
}

#menu_Name {
  grid-area: menu-name;
  grid-column: col 10/span 3;
  grid-row: 1;
}

#menu_AddEdtDelClr {
  grid-area: menu-addedtdelclr;
  grid-column: col/span 12;
  grid-row: 2;
  text-align: center;
}

#form_Grid_Tab_1 {
  grid-template-areas: "grid-surname" "grid-cemname" "grid-familypage" "grid-bioid" "grid-prefix" "grid-givenname" "grid-middlename" "grid-suffix" "grid-maidenname" "grid-priorsurname" "grid-nickname" "grid-birthdate" "grid-birthplace" "grid-deathdate" "grid-deathplace" "grid-marriagedate" "grid-marriageplace" "grid-burialdate" "grid-burialplot" "grid-gpstext" "grid-citreptx" "grid-plotlat" "grid-plotlon";
}

#grid_Surname {
  grid-area: grid-surname;
  grid-column: col 3/span 2;
  grid-row: 1;
}

#grid_CemName {
  grid-area: grid-cemname;
  grid-column: col 5/span 5;
  grid-row: 1;
}

#grid_BioId {
  grid-area: grid-bioid;
  grid-column: col 10/span 2;
  grid-row: 1;
}

#grid_Prefix {
  grid-area: grid-prefix;
  grid-column: col 3/span 1;
  grid-row: 2;
}

#grid_GivenName {
  grid-area: grid-givenname;
  grid-column: col 4/span 3;
  grid-row: 2;
}

#grid_MiddleName {
  grid-area: grid-middlename;
  grid-column: col 7/span 3;
  grid-row: 2;
}

#grid_Suffix {
  grid-area: grid-suffix;
  grid-column: col 10/span 1;
  grid-row: 2;
}

#grid_MaidenName {
  grid-area: grid-maidenname;
  grid-column: col 3/span 2;
  grid-row: 3;
}

#grid_PriorSurname {
  grid-area: grid-priorsurname;
  grid-column: col 5/span 4;
  grid-row: 3;
}

#grid_Nickname {
  grid-area: grid-nickname;
  grid-column: col 9/span 2;
  grid-row: 3;
}

#grid_BirthDate {
  grid-area: grid-birthdate;
  grid-column: col/span 2;
  grid-row: 4;
}

#grid_BirthPlace {
  grid-area: grid-birthplace;
  grid-column: col 3/span 4;
  grid-row: 4;
}

#grid_DeathDate {
  grid-area: grid-deathdate;
  grid-column: col 7/span 2;
  grid-row: 4;
}

#grid_DeathPlace {
  grid-area: grid-deathplace;
  grid-column: col 9/span 4;
  grid-row: 4;
}

#grid_MarriageDate {
  grid-area: grid-marriagedate;
  grid-column: col/span 2;
  grid-row: 5;
}

#grid_MarriagePlace {
  grid-area: grid-marriageplace;
  grid-column: col 3/span 4;
  grid-row: 5;
}

#grid_BurialDate {
  grid-area: grid-burialdate;
  grid-column: col 7/span 2;
  grid-row: 5;
}

#grid_BurialPlot {
  grid-area: grid-burialplot;
  grid-column: col 9/span 4;
  grid-row: 5;
}

#grid_GPSText {
  grid-area: grid-gpstext;
  grid-column: col 6/span 3;
  grid-row: 6;
  text-align: right;
}

#grid_CitRepTx {
  grid-area: grid-citreptx;
  grid-column: col 3/span 2;
  grid-row: 6;
}

#grid_PlotLat {
  grid-area: grid-plotlat;
  grid-column: col 9/span 2;
  grid-row: 6;
}

#grid_PlotLon {
  grid-area: grid-plotlon;
  grid-column: col 11/span 2;
  grid-row: 6;
}

#form_Grid_Tab_2 {
  grid-template-areas: "grid-tmbstnimg" "grid-tmbdtlimg" "grid-ftstnimg" "grid-plotimg" "grid-personimg" "grid-milimg" "grid-obitimg" "grid-bioimg" "grid-funcdimg" "grid-credits";
}

#grid_TmbStnImg {
  grid-area: grid-tmbstnimg;
  grid-column: col/span 4;
  grid-row: 1;
}

#grid_TmbDtlImg {
  grid-area: grid-tmbdtlimg;
  grid-column: col 5/span 4;
  grid-row: 1;
}

#grid_FtstnImg {
  grid-area: grid-ftstnimg;
  grid-column: col 9/span 4;
  grid-row: 1;
}

#grid_PlotImg {
  grid-area: grid-plotimg;
  grid-column: col/span 4;
  grid-row: 2;
}

#grid_PersonImg {
  grid-area: grid-personimg;
  grid-column: col 5/span 4;
  grid-row: 2;
}

#grid_MilImg {
  grid-area: grid-milimg;
  grid-column: col 9/span 4;
  grid-row: 2;
}

#grid_ObitImg {
  grid-area: grid-obitimg;
  grid-column: col/span 4;
  grid-row: 3;
}

#grid_BioImg {
  grid-area: grid-bioimg;
  grid-column: col 5/span 4;
  grid-row: 3;
}

#grid_FuncdImg {
  grid-area: grid-funcdimg;
  grid-column: col 9/span 4;
  grid-row: 3;
}

#grid_Credits {
  grid-area: grid-credits;
  grid-column: col/span 12;
  grid-row: 4;
}

#form_Grid_Tab_3 {
  grid-template-areas: "grid-inscription" "grid-milinscription" "grid-milnotes";
}

#grid_Inscription {
  grid-area: grid-inscription;
  grid-column: col/span 12;
  grid-row: 1;
}

#grid_MilInscription {
  grid-area: grid-milinscription;
  grid-column: col/span 12;
  grid-row: 2;
}

#grid_MilNotes {
  grid-area: grid-milnotes;
  grid-column: col/span 12;
  grid-row: 3;
}

#form_Grid_Tab_4 {
  grid-template-areas: "grid-rechnotes" "grid-addltext" "grid-deathcert";
}

#grid_RechNotes {
  grid-area: grid-rechnotes;
  grid-column: col/span 12;
  grid-row: 1;
}

#grid_AddlText {
  grid-area: grid-addltext;
  grid-column: col/span 12;
  grid-row: 2;
}

#grid_DeathCert {
  grid-area: grid-deathcert;
  grid-column: col/span 12;
  grid-row: 3;
}

#form_Grid_Tab_5 {
  grid-template-areas: "grid-obituary" "grid-obtheading" "grid-obtcolumns" "grid-obtbody" "grid-pubname" "grid-putlink" "grid-pubcity" "grid-pubdate";
}

#grid_Obituary {
  grid-area: grid-obituary;
  grid-column: col 1/span 12;
  grid-row: 1;
  display: none;
}

#grid_ObtHeading {
  grid-area: grid-obtheading;
  grid-column: col 4/span 4;
  grid-row: 1;
}

#grid_ObtColumns {
  grid-area: grid-obtcolumns;
  grid-column: col 8/span 2;
  grid-row: 1;
}

#grid_ObtBody {
  grid-area: grid-obtbody;
  grid-column: col 1/span 12;
  grid-row: 2;
}

#grid_PubName {
  grid-area: grid-pubname;
  grid-column: col 3/span 4;
  grid-row: 3;
}

#grid_PubLink {
  grid-area: grid-publink;
  grid-column: col 7/span 4;
  grid-row: 3;
}

#grid_PubCity {
  grid-area: grid-pubcity;
  grid-column: col 4/span 3;
  grid-row: 4;
}

#grid_PubDate {
  grid-area: grid-pubdate;
  grid-column: col 7/span 3;
  grid-row: 4;
}

#form_Grid_Tab_6 {
  grid-template-areas: "grid-parents" "grid-siblings" "grid-spouse" "grid-children" "grid-famname";
}

#grid_Parents {
  grid-area: grid-parents;
  grid-column: col/span 6;
  grid-row: 1;
}

#grid_Siblings {
  grid-area: grid-siblings;
  grid-column: col 7/span 6;
  grid-row: 1;
}

#grid_Spouse {
  grid-area: grid-spouse;
  grid-column: col/span 6;
  grid-row: 2;
}

#grid_Children {
  grid-area: grid-children;
  grid-column: col 7/span 6;
  grid-row: 2;
}

#grid_FamName {
  grid-area: grid-famname;
  grid-column: col/span 12;
  grid-row: 3;
  color: var(--accent-red);
  font-size: var(--font-size-base);
  font-weight: bold;
  text-align: center;
  margin-bottom: 0.8em;
}

@media screen and (min-width: 1200px) {
  #main_Wrapperx {
    width: var(--form-width);
  }
}
@media screen and (min-width: 992px) and (max-width: 1200px) {
  #main_Wrapperx {
    width: var(--form-width);
  }
}
@media screen and (min-width: 768px) and (max-width: 992px) {
  #main_Wrapperx {
    width: var(--form-width);
  }
}
@media screen and (max-width: 768px) {
  #main_Wrapper {
    display: none;
  }
  #small_Message {
    display: block;
    margin-top: 2em;
  }
}