:root{
  --green: #c6dabf;
  --pink: #fbcaef;
  --kelly_green: #1a936f;
  --dark_green: #114b5f;

}
nav {
  background-color: var(--pink);
  text-align: center;
  font-family: "Veranda", "Arial", sans-serif;
  font-size: 1.2em;
  padding: 1%;
  grid-area: nav;

}

figure {
  text-align: center;
  width: 100%;
  padding: 2%;
}


p{
  text-indent:2em;
}

footer {
  margin-left: auto;
  margin-right: auto;
  padding: 3% 40%;
  grid-area: footer;
  text-align: center;

}

ul {
  text-align: justify;
  margin-left: auto;
  margin-right: auto;
  padding: 0% 20%;
}

img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 100%;
}
figcaption{
  font-size:xx-small;
}


h1,
h2,
h3,
h4 {
  color: var(--dark_green);
  font-family: "Veranda", "Arial", sans-serif;
  text-align: center;
}

h2{
  font-size:medium;
  padding: 0% 10%;
}

form {
  margin: auto;
  padding: 1% 30%;
}

a:hover{
  color: var(--kelly_green);
}
#small_fig
{
  margin: auto;
  width: 40%;
}


.float-right{
  width: 30%;
  float: right;
}

nav a:link{
  background-color:var(--pink);
  color: var(--dark_green);
  text-decoration: none;
}

nav a:hover{
  text-decoration: underline;
  font-size: 2em;
}

nav a{
  display: inline-block;
  width: 19%;
}

nav{
  border: thin solid var(--kelly_green);
  text-align: center;
}
li:nth-child(odd){
  background-color: #DEF1D8;
}
li:nth-child(even){
  background-color: #B2C2AD;
}

table{
  max-width: 100%;
  border: 0.5em double var(--kelly_green);
  border-collapse: collapse;
  margin: auto;
}
tr{
  border: 0.2em double var(--kelly_green);
  border-collapse: collapse;
}
th{
  border: 0.2em double var(--kelly_green);
  border-collapse: collapse;
  font-size: 1.2em;
}

tr:nth-child(odd){
  background-color: #DEF1D8;
}
tr:nth-child(even){
  background-color: #B2C2AD;
}

tr:hover{
  background-color: yellow;
}

form p{
  text-indent:0em;
}
input, textarea{
  float: right;
}


.grid-layout #grid-item-a, #grid-item-b, #grid-item-c {
  color: var(--dark_green);
  display: grid;
  grid-template-columns: auto auto;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
#grid-item-a{
  grid-area: 1/1/3/2;
}

#grid-item-b{
  grid-area:1/2/2/3;
  
}
#grid-item-c{
  grid-area:2/2/3/3;
}
#grid-item-d{
  grid-area:2/2/3/3;
}

label{
  font-size: 0.78em;
}

input[type="text"]{
  width: 100%;
}

#txtArtists{
  height: 6em;
  width: 12em;
  resize: none;
  padding: 1%;
}


input[type="checkbox"], input[type="radio"] {
  border:0em;
  width: 80%;
  height: 1.3em;
  text-align: right;
}

html{
  background-image: url("../images/flowers.jpg");
}

input[type="submit"] {
  border-radius: 8em;
  background-color: var(--kelly_green);
  font-size: 2em;
  text-align: center;
  width: 100%;
  margin: auto;
}

p,
table,
section {
  text-align: justify;
  margin-left: auto;
  margin-right: auto;
  padding: 3% 15%;
}

p {
  color: var(--dark_green);
  font-family: "Veranda", "Arial", sans-serif;
  text-indent: 2em;
  display: block;
  text-align: justify;
  margin-left: auto;
  margin-right: auto;
  padding: 3% 3%;
}

p{
  background: rgba(255, 251, 193, 0.57);
}

.activePage{
  color: var(--kelly_green);
  font-weight: bolder;
}

.smaller{
  width:40%;
}



