@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&display=swap");

body {
font-family:Lato,Helvetica,Arial,sans-serif;
font-size: 16px;
line-height: 1.7em;
}

h1,h2,h3,h4,h5,h6 {
line-height:1.7em
}

.container .navbar-header {
display:inline-block;
float:unset
}

.navbar .logo {
padding-right:0;
margin:4px 0
}

.crm-container .crm-form-block {
background:none
}


div.input-group {
padding:0 8px
}

div.input-group span.input-group-addon {
padding:0 12px;
border:0;
background:none;
color:inherit;
font-weight:700
}

div.webform-component-display {
margin:8px 0
}

body.page-node-done div.links {
display:none
}

.page-civicrm .crm-container.crm-public .crm-form-block {
padding:30px
}


html body:not(.toolbar) {
margin-top:0!important
}

.page-header {
font-size:32px;
margin-bottom:12px
}

.panel-default > .panel-heading {
color:#fff;
background-color:#2c3e50;
border-color:#ddd
}

header#navbar {
text-align:center;
background-color:unset;
border:none;
margin:12px auto
}

body.page-civicrm h1.page-header {
display:block;
background-color:#2c3e50;
color:#fff;
padding: 20px 35px;
margin-bottom:40px
}

body.page-civicrm div.region-content {
margin: 0px 35px;
}

.control-group .help-inline, .help-block {
font-size:15px
}

.label {
color:#333
}

.crm-container .label .crm-marker {
   margin-right: 0px;
}


@media (max-width: 1020px) {
  #crm-container.crm-public .crm-section .label {
    display: inline-block;
    padding: 15px 5px;
    text-align: left;
  }
}

@media (max-width: 480px) {
  .crm-public .crm-section .label {
    margin-top: 7px;
    background-color: aliceblue;
  }
}


div.field-name-field-description {
font-size:17px;
font-style:italic
}

.crm-container .description {
color:#464354
}

div.crm-public div.crm-section.recaptcha-section {
margin-left: 10%;
}


#crm-container.crm-public div.event_summary-section {
padding:25px;
margin-bottom:20px;
background-color:#eee;
color:#000;
font-size:21px;
line-height:normal
}

#crm-container.crm-public div.register_link-top {
margin:28px 20px
}

div.event_date-section h2 {
margin-top: 0px;
}


/* BUTTONS */

div.crm-public div.crm-submit-buttons,
#crm-container.crm-public div#crm-submit-buttons.crm-submit-buttons {
margin-top: 1em;
margin-left: 0px;
height: 50px;
}

@media (min-width: 480px) {
  div.crm-public div.crm-submit-buttons,
  #crm-container.crm-public div#crm-submit-buttons.crm-submit-buttons {
    margin-left: 19%;
  }
}


div.crm-public button.crm-button {
margin: 0px;
padding: 10px 30px;

border-radius: 0px;

font-size: 15px;
text-shadow: none;
text-transform: uppercase;

color: #fff;
background-color:#536170;
}


div.crm-public button.crm-button:hover {
background-color: #a2dca2!important;
color: #000!important;
}

div.crm-public button.crm-button.crm-button-type-cancel:hover {
background-color: #d09999!important;;
}

.crm-petition-form-block button.crm-button-type-upload>i.crm-i,
.crm-event-register-form-block button.crm-button-type-upload>i.crm-i {
display: none;
}

h3.signature-count { margin-top: 0px; }


/* webform submit buttons */

.webform-submit.form-submit {
background-color:#536170;
color:#fff;
border-color:#536170;
font-weight:700
}

.webform-submit.form-submit:hover {
color:#effdff;
border-color:#fff;
background-color:#009eae;
font-weight:900
}


/* ma-btns */

.ma-btn {
	display: inline-block;
	margin: 10px 20px 10px 0px;
	padding: 10px 20px 10px;
	border: 2px solid #2c3e50;
	color: #2c3e50;
	position: relative;
}

.ma-btn:hover {
	background-color: #2c3e5009!important;
}

.ma-btn.pnp-btn {
	border: 3px solid #72cc84;
	background-color: #72cc84;
	color: #fff;
	font-weight: 900;
}

.ma-btn.pnp-btn:hover {
	color: #000;
	text-decoration: unset;
}


.ma-btn.fb-btn {
	border: 3px solid #3b5998;
	background-color: #3b5998;
	color: #fff;
	font-weight: 900;
}

.ma-btn.fb-btn:hover {
	color: #000;
	text-decoration: unset;
}

.ma-btn.tw-btn {
	border: 3px solid #00acee;
	background-color: #00acee;
	color: #fff;
	font-weight: 900;
}

.ma-btn.tw-btn:hover {
	color: #000;
	text-decoration: unset;
}


/* comms pref page */

.comm-pref-block fieldset legend {
    border: 2px solid #2c3e50;
    padding: 20px;
    font-size: 20px;
}

.crm-public .group-wrapper,
#crm-communications-preferences-groups label {
font-size: 17px;
vertical-align: middle;
}

.crm-public .group-wrapper input[type="checkbox"],
.page-civicrm-gdpr-comms-prefs-update input[type="checkbox"] {
height: 20px;
width: 20px;
vertical-align: middle;
margin-right: 6px;
}

@media only screen and (min-width: 600px) {
  #crm-communications-preferences-groups div.content.group-channel-div {
    margin-left: 10%;
  }
}

div.crm-block > div.crm-group > fieldset > div.crm-public-form-item.crm-section {
white-space: normal;
}

.page-civicrm-petition-sign .crm-petitioncounter-block {
  margin: 1em 0px;
}

@media only screen and (min-width: 1020px) {
  .crm-petitioncounter-block {
    margin: 0px;
  }
}


/* WEBFORM STYLES */

/* default webform styles */




/* hide prefill fields */
.form-item-submitted-civicrm-1-activity-1-activity-survey-id.form-type-webform-number.hide
{
display: none;
}


/* boxy fieldsets and buttons */

fieldset.panel, fieldset.panel legend.panel-heading, .form-actions > button {
  border-radius: 0px;
}

/* bigger buttons */
.form-actions > button {
    padding: 10px 20px;
    font-size: 17px;
}

/* description text */

fieldset .help-block, fieldset .control-group, fieldset .help-inline {
      color: #444;
}

/* select-bubbles */

.webform-component .radio label, .webform-component .checkbox label {
border: 1px lightgrey solid;
    padding: 10px;
    display: inline-block;
    margin: 5px;
    border-radius: 5px;
    background-color: #fff;
}

.webform-component input[type="radio"], .webform-component input[type="checkbox"]  {
position: relative;
margin-right: 10px;
margin-left: 0px ! important;
}

.webform-component-checkboxes.webform-container-inline div, .webform-component-radios.webform-container-inline div {
    display: inline-block;
}

.webform-component-checkboxes .help-block, .webform-component-radios .help-block {
display: inline-block;
}


/* progressbar padding fix */
.webform-progressbar-outer {
  margin-bottom: 3em;
}


/* PNP webform styles */
.pnp * {
  font-family: "Barlow", sans-serif;
  text-transform: uppercase;
  border-radius: 0;
}
.pnp .main-container {
  max-width: 700px;
  margin: auto;
}

.pnp fieldset {
  border-radius: 0px;
  border-width: 0px;
  border: 2px solid;
  margin-top: 4rem;

  margin-bottom: 1rem;
  max-width: 700px;
  background-color: #333366;
  border-color: #eafaf1;
}
.pnp fieldset * {
  color: #eafaf1;
}

.pnp .panel-heading {
  border-bottom: 1px solid;
  background: #333366;
  padding: 1.5rem;
}

.pnp .panel-heading .panel-title {
  color: #ff4769;
  text-align: center;
  font-size: 29px;
  line-height: 40px;
}

.pnp .panel-body {
  display: flex;
  flex-direction: column;
  margin: 2rem 2.5rem;
  gap: 1rem;
}

.pnp .form-group {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.pnp .form-inline label {
  min-width: 20%;
}

.pnp input.form-text {
  background: transparent;
  border: none;
  border-bottom: 1px solid;
  border-radius: 0;
  max-width: 500px;
  width: 70%;
  min-width: 350px;
}

.pnp input.form-text::placeholder {
  font-weight: 500;
  font-size: 18px;
  text-transform: uppercase;
  color: #eafaf1;
  opacity: 1;
  padding: 0.5em 0.75em;
}

.pnp .form-textarea-wrapper {
  width: 100%;
}
.pnp .form-textarea-wrapper .form-control {
  color: #333;
}

.pnp .select-bubbles .checkbox label, .pnp .select-bubbles .radio label {
    background-color: #2ECC71;
    color: #fff;
    border-width: 0px;
    font-weight: 500;
}
.pnp .form-actions {
  display: flex;
  flex-flow: row wrap;
  gap: 1rem;
}

.pnp .btn {
  min-width: 200px;
  text-transform: uppercase;
  font-weight: 500;
  font-family: inherit;
  font-size: 21px;
  padding: 0.5em 0.75em;
  background-color: #333366;
  color: #eafaf1;
  border: 1px solid #eafaf1;
}
.pnp .btn:hover {
  background-color: #e6e6e6;
  color: #333;
}
.pnp .btn.button-primary {
  background: #ff4769;
  border-color: #ff4769;
  color: #eafaf1;
}

.pnp .btn.button-primary:hover {
 background-color: #2ECC71;
 border-color: #2ECC71;
 color: yellow;
}


/* H4GND webform styles */

.h4gnd .webform-client-form fieldset {
  background-color: #e4eaef;
  text-transform: uppercase;
  font-size: 16px;
  border: 0px;
}

.h4gnd .webform-client-form legend.panel-heading {
  background-color: #000;
  padding: 20px;
}

.h4gnd .webform-client-form legend.panel-heading span.panel-title {
  font-size: 22px;
}



/* SECURITISATION webform styles */

.sec fieldset {
  border-color: white;
  background-color: #001C56;
  color: white;
}

.sec .select-bubbles .radio label,
.sec .select-bubbles .checkbox label {
  background: none;
}

.sec fieldset .help-block {
  color: white;
}

.sec .signature-count {
  color: white;
}

.sec p {
  color: white;
}

/* billing field stylings */


#priceset fieldset {
  border-top: none;
}

#crm-container.crm-public .price-set-row {
  margin-bottom: 10px;
}

#payment_information > fieldset {
  display: none;
}

#billing-payment-block {
  padding-top: 8px;
}


/* membership form stylings */

.webform-client-form-161 #bootstrap-panel > legend > span {
     font-size: 32px;
    text-transform: uppercase;
    padding: 17px 0px;
    line-height: 45px;
}

.webform-client-form-161 #bootstrap-panel-body  h2 {
margin-top: 0px;
}

.webform-client-form-161 label {
  display: inline-block;

  margin-right: 6px;
  margin-bottom: 10px;
  padding: 10px 20px 6px 8px;

  background: aliceblue;
  border: 1px solid #ddd;

  text-transform: uppercase;
}

.webform-client-form-161 select.form-control {
    font-size: 18px;
    height: 40px;
    margin: 14px 0px 22px;
    border-radius: 0px;
}



/* WP INSET */

.ma-inset header,
.ma-inset footer,
.ma-inset h1.page-header,
.ma-inset.page-civicrm h1.page-header,
.ma-inset #event_date,
.ma-inset #admin-menu,
.ma-inset .region-page-top {
 display: none;
}

body.ma-inset, body.ma-inset.page-civicrm {
background: unset;
padding-top: 0!important;
}

.ma-inset div.row section {
  padding-left: 0px;
  padding-right: 0px;
}

body.ma-inset.page-civicrm div.region-content {
margin: 0px;
}


#crm-payment-js-billing-form-container {
padding-bottom: 20px;
}

#webform-client-form-161 #crm-payment-js-billing-form-container {
    border-bottom: 1px solid grey;
    margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .table-responsive > .table > thead > tr > td, .table-responsive > .table > tbody > tr > td  {
    display: inline-block;
  }
}