textArea {
  width: 200px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  font-family: Altivo, Loretta;
  background-color: white;
  background-position: 10px 10px; 
  background-repeat: no-repeat;
  padding: 12px 20px 12px 20px;
  transition: 0.4s ease-in-out;
}

textArea:focus {
  width: 100%;
}
textArea.tall:focus {
  height: 600px;
}
/*input.pb-email */
input[type='email'],input[type='text']{
  width: 80%;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  font-size: 16px;
  font-family: Altivo, Loretta;
  background-color: white;
  background-position: 10px 10px; 
  background-repeat: no-repeat;
  padding: 6px 10px 6px 10px;
  transition: 0.4s ease-in-out;
}

table, th, td {
  border: 0px solid black;
}

/* element spacing */

.element-space
{
padding: 5px 5px 5px; /* top, right and bottom */
margin: 10px 10px 10px;
}
.pb-detail-item-container.pb-text, .pb-detail-item-container.pb-select,
.pb-form-item-container.pb-text, .pb-form-item-container.pb-select,
.pb-block-item-container.pb-text, .pb-block-item-container.pb-select,
.pb-block-item-container.pb-radio, .pb-form-item-container.pb-radio {
    margin-bottom: 10px;
    margin-top: 10px;
}
button.pb-button
{
  border-width:1px;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 5px;
}
.content_right
{
display: block !important;
text-align: right;
}
.content_center
{
display: block !important;
text-align: center;
}

/* just a button with a plus or minus sign in it (font needs to be bigger */
.plus_button
{
font-size: 15pt;
font-family: mono !important,Altivo,Loretta;
}
button.primary.plus_button, button.secondary.plus_button
{
/* shrink the padding; primary and secondary class makes the padding way too big */
padding: 2px 11px;
}
input[type="checkbox"]
{
  margin: 4px;
}
/* in case we need multiselects, put the label at the top of the list */
label.pb-select
{
    vertical-align: top;
}