@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700;800;900&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Serif:ital,opsz,wght@0,8..144,100;0,8..144,200;0,8..144,300;0,8..144,400;0,8..144,500;0,8..144,600;0,8..144,700;0,8..144,800;0,8..144,900;1,8..144,100;1,8..144,200;1,8..144,300;1,8..144,400;1,8..144,500;1,8..144,600;1,8..144,700;1,8..144,800;1,8..144,900&display=swap');




.divchestnutandhazellandingpageheaderbutton {
  font-size: 4vw;
  text-align: center;
  vertical-align: middle;
}

#centerheadertextbutton {
  text-align: center;
  vertical-align: middle;

}


.subheadercenterheadertextbutton {
  text-align: center;
  vertical-align: middle;
  grid-area: sbhead;
  background-color: #ffefea;
  padding: 2vh;

}


button:not(#modalbutton1):not(#modalbutton2) {
  border-style: outset;
  border-width: thick;
  width: auto;
  border-color: silver;
  padding: 5px 5px;
}
button:hover:not(#modalbutton1):not(#modalbutton2) {
  border-style: inset;
  border-width: thick;
  width: auto;
  border-color: silver;
  padding: 5px 5px;
}
#submitinformationcontactbutton {
  border-style: outset;
  border-width: thick;
  padding: 1px 1px;
  width: auto;
  border-color: silver;
}
#submitinformationcontactbutton:hover {
  border-style: inset;
  border-width: thick;
  padding: 1px 1px;
  width: auto;
  border-color: silver;
}

.headerbutton {
  text-decoration: none;
  border-style: outset;
  border-width: thick;
  border-color: silver;
  padding: 6px 6px;
  background-color: white;
}
.headerbutton:hover {
  text-decoration: none;
  border-style: inset;
  border-width: thick;
  border-color: silver;
  padding: 6px 6px;
}

/* 09 23 2023 09 40 00 Chestnut + Hazel's Miscellaneous Repository README.md

...

"Everything I had done has to be done 
over; I was on the wrong track entirely, 
and after working hard most of that time: 
I'm still only at the beginning." 

- Gustave Flaubert

...

This repository was created as a requirement for
completing project 13. I honestly did not want to
create a whole new repository, but, here we are.

...

William Carlos Williams

"The Young Housewife"  (1916)

At ten A.M. the young housewife
moves about in negligee behind
the wooden walls of her husband's house.
I pass solitary in my car.

Then again she comes to the curb
to call the ice-man, fish-man, and stands
shy, uncorseted, tucking in
stray ends of hair, and I compare her
to a fallen leaf.

The noiseless wheels of my car
rush with a crackling sound over
dried leaves as I bow and pass smiling.

...

WILLIAM CARLOS WILLIAMS

"The Red Wheelbarrow" (1938)

so much depends
upon

a red wheel
barrow

glazed with rain
water

beside the white
chickens

...

William Carlos Williams

"This Is Just To Say" (1962)

I have eaten
the plums
that were in
the icebox

and which
you were probably
saving
for breakfast

Forgive me
they were delicious
so sweet
and so cold

...

Kenneth Larot Yamat

"This Is Just To Say Something About The Young Housewife" (2023)

I totally ate all of the  so many    fried turkeys
that were hanging out
by the red wheelbarrow
you know     the one glazed with
soy sauce and beside the 
                      kentucky fried 
                             kung pao chickens
           which 
themselves were drenched in
              tabasco sauce

I request neither forgiveness
nor do I intend to apologize for
          my actions 

because 

I spent several hours
of quality time
with a certain young housewife

                    who

braless and dressed in negligee 

          and 

whose wild hair suggested
she spent even more additional
even higher quality time with
both the ice man
and the fish man

       either sequentially 
               or 
              simultaneously 
                     neither would surprise me

left me    breathless    exhausted
as well as      famished

I thought I gave a good
account of myself

but then along came 
          the milkman
and    she             still
   had enough energy 
       for 
    round four

I was there
I saw it all

...*/

h1 {
  text-align: center;
}

h2 {
  text-align: center;

}


.textbodyparagrahindented {
  text-indent: 50px;
}



.wrapper {
  width: 95%;
  margin-inline: auto;
}

.grid-container {
  display: grid;
  grid-template-areas:
    "header header header header header"
    "sbhead sbhead sbhead sbhead sbhead"
    "aside-one main main main aside-two"
    "aside-one main main main aside-two"
    "footer footer footer footer footer";
  min-height: 80vh;
  margin-top: 4rem;
  gap: 1.15rem;
}

.grid-item {

  padding: 1rem;
  margin: 0rem;
}


.header {
  background-color: #d4e2eb;
  grid-area: header;
  display: grid;
  grid-template-areas: 
    "headerbuttonleft headerbuttoncenter headerbuttoncenter headerbuttonright"
    " subheadercenterheadertextbutton subheadercenterheadertextbutton subheadercenterheadertextbutton subheadercenterheadertextbutton";
  grid-template-columns: 1fr 5fr 1fr;
}

.main {
  grid-area: main;
  background-color: #ecdec9;
  margin: auto;
}

  /* 09 23 2023 09 40 00 Chestnut + Hazel's Miscellaneous Repository README.md

...

"Everything I had done has to be done 
over; I was on the wrong track entirely, 
and after working hard most of that time: 
I'm still only at the beginning." 

- Gustave Flaubert

...

This repository was created as a requirement for
completing project 13. I honestly did not want to
create a whole new repository, but, here we are.

...

William Carlos Williams

"The Young Housewife"  (1916)

At ten A.M. the young housewife
moves about in negligee behind
the wooden walls of her husband's house.
I pass solitary in my car.

Then again she comes to the curb
to call the ice-man, fish-man, and stands
shy, uncorseted, tucking in
stray ends of hair, and I compare her
to a fallen leaf.

The noiseless wheels of my car
rush with a crackling sound over
dried leaves as I bow and pass smiling.

...

WILLIAM CARLOS WILLIAMS

"The Red Wheelbarrow" (1938)

so much depends
upon

a red wheel
barrow

glazed with rain
water

beside the white
chickens

...

William Carlos Williams

"This Is Just To Say" (1962)

I have eaten
the plums
that were in
the icebox

and which
you were probably
saving
for breakfast

Forgive me
they were delicious
so sweet
and so cold

...

Kenneth Larot Yamat

"This Is Just To Say Something About The Young Housewife" (2023)

I totally ate all of the  so many    fried turkeys
that were hanging out
by the red wheelbarrow
you know     the one glazed with
soy sauce and beside the 
                      kentucky fried 
                             kung pao chickens
           which 
themselves were drenched in
              tabasco sauce

I request neither forgiveness
nor do I intend to apologize for
          my actions 

because 

I spent several hours
of quality time
with a certain young housewife

                    who

braless and dressed in negligee 

          and 

whose wild hair suggested
she spent even more additional
even higher quality time with
both the ice man
and the fish man

       either sequentially 
               or 
              simultaneously 
                     neither would surprise me

left me    breathless    exhausted
as well as      famished

I thought I gave a good
account of myself

but then along came 
          the milkman
and    she             still
   had enough energy 
       for 
    round four

I was there
I saw it all

...*/

  
  /* .panchorlinkhover{    transform: scale(1.08); color: blue;
  text-decoration: none;}   */
  /* transform: scale(1.08); */

  /* transform: scale(1.08); */


/* main {align-items: center;} */

/* body{align-items: center;} */

/* align-items: center; */

a:visited {
  color: black;
  text-decoration: none;
}
a {
  color: black;
  text-decoration: none;
}
.griditemsasidelefttextdrasideleft:hover {
  transform: scale(1.08);
  color: black;
  text-decoration: none;
}
 
.griditemsasidelefttextdrasideleft:visited {
  color: black;
  text-decoration: none;
}

.aside-right {
  grid-area: aside-right;
  background-color: #ffffbf;
}
#tableasideleft {
  vertical-align: top;
}




.contentouter {
  flex-basis: 0;
  flex-grow: 1;
  flex-shrink: 1;
  background-color: #e6e6fa;
  margin: 1vh;
  padding: 1vh;


}

.sidebarouter {
  flex-basis: 200px;
  flex-grow: 0;
  flex-shrink: 0;
  background-color: #ffdfbe;
  padding: 1vh;
}

.containeroverouter {
  width: 98%;
  background-color: #ffffff;
}













.aside-one {
  grid-area: aside-one;
  background-color: #cffdbc;
}



.aside-one:hover {
  transform: scale(1.02);
}
 
.aside-two {
  grid-area: aside-two;
  background-color: #ffffbf;
  vertical-align: top;
}
.aside-two:hover {
  transform: scale(1.02);
  vertical-align: top;
}







*, *::before, *::after {
  text-wrap: wrap;font-size: 1vw;font-weight: 600;box-sizing: border-box;font-family: 'Cinzel', "Century Schoolbook","Times New Roman", Times, Courier,"Georgia", serif;text-decoration: none;
  }

body {
  background-color: #fae7d4;
  color:  #000000;
  transition: all 0.4s ease-in;
}
 
.backgroundcolortoggler{transition: all 0.4s ease-in;}

h1 {
  text-align: center;
  margin-top: 1.25rem;
}

.colortogglecontainer {
  margin-top: 0.70rem;
  display: grid;
  grid-template-areas:"mode-status slider" ;
  width: 100%;
  place-content: center;
  gap: 1rem;
  text-align: left;
}



.toggle-switch {
  position: relative;
  display: inline-block;
  width: 3.75rem;
  height: 2.13rem;
  margin-bottom: 0.1rem;
  margin-inline: left;
}

.toggle-switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #aad9ff;;
  transition: all 0.4s ease-in;
  border-radius: 2.13rem; 
} 
    
.slider:before {
  position: absolute;
  content: "";
  height: 1.63rem;
  width: 1.63rem;
  left: 0.25rem;
  bottom: 0.25rem;
  background-color: white;
  transition: 0.4s;
  border-radius: 50%;
}  
  
input:checked + .slider {
  background-color: #ccc;

}

input:focus + .slider {
  background-color: #aad9ff;
  
  
}

input:checked:focus + .slider {
  background-color: #ccc;
  
  }



input:checked + .slider:before {
  transform: translateX(1.63rem);
}
 
.footer {
  text-align: center;
  background-color: #ffefea;
  grid-area: footer;
  display: grid;
  grid-template-areas:
    "toptablerow"
    "bottomtablerow"
    "bottomtablerow2";
  place-items: center;
  }

  /* <!-- vscode test commit  testing a commit and sync directly from VS Code 10142023 0816--> */
 
  tr[name="toptablerow"] {
    place-items: center;
    text-align: center;
    justify-content: center;
  }
  tr[name="bottomtablerow"] {
    place-items: center;
    text-align: center;
    justify-content: center;
  }
  tr[name="bottomtablerow2"] {
    /* width: 100%; */
    /* width: 100%; */
    /* padding:5%; */
    place-items: center;
    text-align: center;
    justify-content: center;
  }
  .tryingtofixthis{width: 100%;padding: 5%;}

  /* References: https://stackoverflow.com/questions/5219175/how-to-make-an-element-width-100-minus-padding */




  .dark-mode {
    background-color: #ffffff;
    color:  #000000 ;
    transition: all 0.4s ease-in;
  }
  .dark-modefields {
    background-color: #BCC2C2;
    color:  #000000 ;
    transition: all 0.4s ease-in;
  }
  .dark-modebsbuttons {
    background-color: #899499;
    border-color: silver;
    color:  #000000 ;
    transition: all 0.4s ease-in;
  }




  /* *, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
  } */
  






  .mainpll {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
   
  #form-submitted-msg {
    margin-top: 2rem;
    border-radius: 3px;
    background-color: rgb(163, 199, 163);
    padding: 0.5rem;
    width: 100%;
    height: auto; 
    aspect-ratio: 10.05 / 4.16;
    text-align: center;
    color: #fff;
    display: none;
  }
  
  #exampleForm {
    width: 100%;
  }
  .exampleFormA {
    color:red;
    font-size: smaller;
    
  }


  
  .input-group {
    margin-bottom: 1.5rem;
  }
  
  .input-group:not(.radio):not(.checkbox) {
    gap: 0.25rem;
    flex-direction: column;
  }
  
  .input-group:not(.radio):not(.checkbox) input {
    width: 100%;
    border-radius: 0.375rem !important;
  }
   
  .input-group.checkbox {
    gap: 1rem;
  }
  
  .input-group.radio {
    display: flex;
    gap: 1.5rem;
    width: 100%;
  }
  
  .input-group.select select {
    width: 100%;
  }
  
  legend {
    font-size: 1rem;
    width: max-content;
  }
  
  .form-btns {
    display: flex;
    width: 100%;
    gap: 1rem;
    margin-top: 2.5rem;
  }
  
  .form-btns > button {
    padding: 0.3rem 1.5rem;
  }
  
  .form-btns > .submit {
    padding-inline: 3rem;
  }
  
  .error-msg {
    display: none;
  }

  .fontweightadjustment{ font-weight: 600; }

    /* 

  i basically couldn't figure out how to do this in javascript, but since this is a styling concern, I don't feel the least bit bad
  about styling it with Cascading Style Sheets:  HAHAHAHA!

  https://www.w3schools.com/tags/tag_small.asp
  https://www.w3schools.com/css/css_font_size.asp  
  https://www.w3schools.com/css/css_font_size.asp

  Currently Watching: https://www.youtube.com/watch?v=uyzZW6fpzik

  
  
  */