/*!************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/home/newsletter-form/style.scss ***!
  \************************************************************************************************************************************************************************************************************************************************************/
/**
 * The following styles get applied both on the front of your site
 * and in the editor.
 *
 * Replace them with your own styles or remove the file completely.
 */
.wp-block-newsletter-form-newsletter-form {
  background-color: var(--cp-blue-secondary);
  color: var(--cp-white);
  padding: var(--spacing-2x);
}

.newsletter-form--block {
  position: relative;
  background-color: var(--cp-darker-blue);
}
@media only screen and (max-width: 767px) {
  .newsletter-form--block {
    padding: var(--spacing-12x) 0;
  }
}
.newsletter-form--wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media only screen and (max-width: 1023px) {
  .newsletter-form--wrap {
    flex-direction: column;
    align-items: flex-start;
  }
}
.newsletter-form--title {
  padding-right: var(--spacing-5x);
}
@media only screen and (max-width: 1023px) {
  .newsletter-form--title {
    margin-bottom: var(--spacing-10x);
    padding-right: 0;
    width: 100%;
  }
}
.newsletter-form--title .creativepro-h2 {
  margin-bottom: var(--spacing-3x);
}
.newsletter-form--title .creativepro-h2 span {
  color: var(--cp-light-red);
}
.newsletter-form--title p {
  font-size: var(--p-normal);
  font-weight: var(--p-weight);
  line-height: var(--p-line-height);
  color: var(--cp-white);
}
.newsletter-form--form {
  width: 45%;
}
@media only screen and (max-width: 1023px) {
  .newsletter-form--form {
    width: 100%;
    max-width: 500px;
  }
}
.newsletter-form--form .email-signup-wrap {
  display: flex;
  flex-wrap: wrap;
}
@media only screen and (max-width: 575px) {
  .newsletter-form--form .email-signup-wrap {
    display: block;
  }
}
.newsletter-form--form .email-signup_input {
  flex: 1;
  border-radius: 64px;
  padding: 0 25px;
  height: 56px;
}
.newsletter-form--form .email-signup_button {
  flex: 1;
  margin-left: var(--spacing-4x);
}
@media only screen and (max-width: 575px) {
  .newsletter-form--form .email-signup_button {
    margin-left: 0;
    margin-top: var(--spacing-4x);
  }
}

/*# sourceMappingURL=style-index.css.map*/