#side_column {
  margin: 1em auto 0 1em;
  max-width: 750px;
  padding: 1.5em;
}

#information {
  background-color: #C1E0BE; /*#E9C6C2; pink 2*/
  border-radius: 15px;
  padding: 0.5em;
  
}





form {
  display: grid;
  padding: 1em;
  background: #C1E0BE; /*light green*/
  border: 1px solid #6B8F8F;
  border-radius: 15px;
  margin: 2.5rem auto 0 1em;
  max-width: 775px;
  min-width: 300px;
  padding: 1em;
  clear: right;
}
form input {
  background: #fff;
  color: black;
  border: 1px solid #9c9c9c;
  padding: 0.3em;
  margin: .2em auto auto .3em;
  font-size: 12pt;
}
form input:focus {
  outline: 3px solid #6B8F8F; 
}
form button {
  background: lightgrey;
  padding: 0.7em;
  width: 100%;
  border: 0;
}
form button:hover {
  background: #6B8F8F;
}
label {
  padding: 0.3em 0.5em 0.2em 0;
}
#submitButton {
	-webkit-appearance: none;
}



@media screen and (min-width: 400px) {
  form {
    grid-template-columns: 250px 1fr;
    grid-gap: 6px;
  }

  label{
    text-align: right;
    grid-column: 1 / 2;
  }
  form input, .group, .hint{
    grid-column: 2 / 3;
    
  }

}

P{grid-column: 1 / 3;}
.group {margin-bottom: .5em;}

#request H3{
  text-align: center;
  font-style: normal;
  grid-column: 1 / 3;
  margin: .6em .2em .2em;
}

#resbox, DIV.requestEdit {
	border: 1px solid black;
	margin: 10pt;
	padding: 0 10pt;
	background-color:#C1E0BE;
}

/* workshop collapsable */
#workshops {
  grid-column: 1 / 3;
  background-color: var(--background);
  border-radius: 15px;
  padding: 1em;
}

#wslabel{
  display: block;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
}
input#wshop{
  display: none;
}
#wslabel::before{
  content: "\2630";
  font-weight: bold;
  font-size: 1.3em;
  padding: 0 .1em 0 0;
}

DIV#enrollment {
  max-height: 0;
  overflow: hidden;
}

input#wshop:checked +label {
  
}
input#wshop:checked +label::before{
  content: "\2613";
  font-weight: bold;
  font-size: 1.3em;
  padding: 0 .1em 0 0;
}

input#wshop:checked ~ DIV#enrollment {
  max-height: 100%;
}

#enrollment P.workshop{
  display: block;
  float: left;
  margin: .5em;
}
#enrollment P.disclaimer{
  clear: both;
}

#waiver +label{
  font-weight: bold;
}

.hint{
  font-size: .7em;
  margin-top: .3em;
}