/* Adjust wrapping on form labels
   so they aren't cut off by narrow widths */
div.crm-container label {
    white-space: normal;
}
div.crm-container div.label {
    white-space: normal;
    margin-top: 1px;
    /* Joomla "Isis" template is coloring some .label elements white,
     * but that makes them hard to read in some CiviCRM contexts;
     * set color to be readable in civicrm.
     * Reference: https://joinery.freshdesk.com/helpdesk/tickets/1520
     */
    color: inherit;
}

/* Fix Individual Suffix width.
   CiviCRM defaults this to a 6em width, which is
   far to narrow for OSRT's options.
*/
select#suffix_id {
  width: 200px;
}

/* Styles for narrow-width devices (mobile) */
@media (max-width: 767px) {
    .crm-container table {
      border: none;
      table-layout: fixed;
    }
    .crm-container .crm-section .content {
        margin-left: 0;
    }
    /* Display labels at full-width, stacked vertically above the fields.
     */
    .crm-container .crm-section .label {
        float: none;
        width: 100%;
        text-align: left;
        -webkit-box-sizing: border-box;
            box-sizing: border-box;
    }
    /* Because labels are now full-width, display any line-breaks
     * as spaces (site admin will probably insert <br> into some
     * long labels to make them easier to read on full-width (default)
     * displays, in which labels are shown at a fixed width to the
     * left of the field).
     */
    .crm-container .crm-section .label label br {
      /* First make the <br> contain nothing, so it won't display. */
      content: "";
    }
    .crm-container .crm-section .label label br:after {
      /* Now put a space _after_ the <br>. */
      content: " ";
    }
}

@media (max-width: 473px) {
	#editrow-street_address-Primary input {
		width: 100%;
		max-width: 100%;
		height: 39px;
		box-sizing: border-box;
	}
	.crm-section.recaptcha-section {
		transform: scale(.8);
		position: relative;
		left: -34px;
	}
}

/* Increase spacing between inline radios, and decrease spacing between radio and label.
 * Does not apply to civicrm back-end.
*/
body:not(.com_civicrm) div#crm-container input.crm-form-radio {
    margin-left: 12px;
    display: inline-block;
    margin-right: 0px;
}

/* Fix CSS conflict with site them, in which labels under CiviReport "Filters" tabs
 * are (just almost) white-on-white text, and have an unnecessary border.
 * Reference: https://joinery.freshdesk.com/helpdesk/tickets/1514
 */ 
table.report-layout tr.report-contents td.label {
	color: black;
	display: table-cell;
	font-weight: normal;
}