/*
Stylesheet for setting up a CSS grid layout for the 
Participants Database responsive list display
*/

/* sets up the grid container */
.pdb-list-grid .list-container {
  display: grid;
  /* sets up the columns: here we set up 3 equal columns */
  grid-template-columns: 1fr 1fr 1fr;
  /* this defines the amount of space between the elements */
  grid-gap: 2.5em 5%;
}

/* this styles each record section */
.pdb-list-grid section {
  /* don't need margins, the grid does this for us */
  margin: 0;
}

/* make the data fields sit next to each other */
.pdb-list-grid .pdb-field {
  float: left;
  margin-right: 1ex;
}

/* this makes the 4th field start on a new line */
.pdb-list-grid .pdb-field:nth-child(4) {
  clear: left;
}

/* this styles the photo field */
.pdb-list-grid .pdb-field:first-child {
  margin: 0;
  overflow: hidden;
}

/* sets the size of the image element */
.pdb-list-grid .pdbiex-image-field-wrap,
.pdb-list-grid .image-field-wrap img {
  width: 100%;
  height: auto;
}

/* individual adaptions */
.pdb-field {
   width: 100%;
   clear: left;
}

.pdb-field-title {
   font-weight: normal;
   font-style: italic;
}

/* this is to hide unneeded elements */

.pdb-list-grid h5, .pdb-field-title-person_name, .pdb-field-title-photo, .pdb-field-title-details, .pdb-field-title-practitioner_level, .pdb-field-title-presenter_level {
  display: none;
}


.pdb_su_th, .field-group th {
   text-align: left !important;
   color: #bf9000 !important;
   vertical-align: text-top !important;
}

.pdb_su_help, .helptext {
   text-align: left !important;
   color: #808080 !important;
   font-size: 0.8em !important;
   font-weight: normal !important;
   font-style: italic !important;
   display: inherit !important;
}

.reqd {
   font-weight: normal !important;
   color: #21abb7 !important;
}

.pdb-field-data-person_name {
   font-size: 1.5em;
   color: #21abb7 !important;
   font-weight: bold !important;
}

.pdb-field-data-business_name {
   font-size: 1.25em;
   color: #bf9000 !important;
   font-weight: bold !important;
}

.pdb-field-data-practitioner_level {
   font-weight: bold !important;
}


.list-container section{
  background-color: #ffffdd;
  padding: 20px;
}

/* Edit record form */
/* No border for checkbox subgroups */

.checkbox-subgroup {
  border:none;
}

input.regular-text {
  width: 100%;
}

.pdb-single .image-field-wrap img {
    height: 300px;
    width: 225px;
    align: left;
    float: right;
}

.pdb-field-data-details {
   padding: 20px;
}

.pdb-search {
   padding-bottom: 20px;
}