modifying newsletter block in footer, version 7.1

Site URL: https://vibraphone-dove-dpfn.squarespace.com/

Hi, I'm trying to modify a newsletter block in my footer. I've already used this code to modify the field and button sizes, and to decrease the top and bottom margins of the newsletter body across the entire site:

/*newsletter field*/
.sqs-block-newsletter .newsletter-form-field-element {
    padding-top: 18px !important;
    padding-bottom: 18px !important;
}

/*newsletter body*/
.newsletter-form .newsletter-form-body {
  margin-top: -15px !important;
  margin-bottom: -25px !important;
}

/* newsletter button*/
.newsletter-form .newsletter-form-button {
    padding-top: 7px !important;
    padding-bottom: 7px !important;
}

However, in the footer, I would like also to modify the h2 to either a smaller size or different font. And I want to decrease the space between the field element and the h2 to account for my omission of the newsletter block description. 

Any help would be appreciated! The password is: He@1ing

Thanks!

Kacia

Add the following to Design > Custom CSS.

/* begin footer newsletter sign-up tighten up spacing for and smaller font */

  #block-yui_3_17_2_1_1605583582666_22142.newsletter-block .newsletter-form-header-title {
  
    margin-bottom: 0;
    
    }
    
  #block-yui_3_17_2_1_1605583582666_22142 .newsletter-form-header-description {
  
    display: none;
    
    }
    
  @media screen and ( min-width: 0 ) and ( max-width:calc( 1596px - 1px ) ) and ( orientation:landscape ) {
  
    #block-yui_3_17_2_1_1605583582666_22142 .newsletter-form .newsletter-form-header-title {
    
      font-size: calc( 1.44vw + 0.5rem ) !important
      
      }
    }
    
  /* end footer newsletter sign-up tighten up spacing for and smaller font */

Let us know how it goes.

12 hours ago, creedon said:

Add the following to Design > Custom CSS.

/* begin footer newsletter sign-up tighten up spacing for and smaller font */

  #block-yui_3_17_2_1_1605583582666_22142.newsletter-block .newsletter-form-header-title {
  
    margin-bottom: 0;
    
    }
    
  #block-yui_3_17_2_1_1605583582666_22142 .newsletter-form-header-description {
  
    display: none;
    
    }
    
  @media screen and ( min-width: 0 ) and ( max-width:calc( 1596px - 1px ) ) and ( orientation:landscape ) {
  
    #block-yui_3_17_2_1_1605583582666_22142 .newsletter-form .newsletter-form-header-title {
    
      font-size: calc( 1.44vw + 0.5rem ) !important
      
      }
    }
    
  /* end footer newsletter sign-up tighten up spacing for and smaller font */

Let us know how it goes.

That worked perfectly, thank you so much!!

@Kacia I see this page doesn't look good on Tablet. You should check.

You can add this to Design > Custom CSS to increase right text width

/* Our approach text width */
@media screen and (max-width:991px) and (min-width:768px) {
body#collection-5fadc7e2dd1d4d0520ea5170 #page section:nth-child(2) .content {
    width: 90%;
}
}

https://vibraphone-dove-dpfn.squarespace.com/our-approach

2 hours ago, tuanphan said:

@Kacia I see this page doesn't look good on Tablet. You should check.

You can add this to Design > Custom CSS to increase right text width

/* Our approach text width */
@media screen and (max-width:991px) and (min-width:768px) {
body#collection-5fadc7e2dd1d4d0520ea5170 #page section:nth-child(2) .content {
    width: 90%;
}
}

https://vibraphone-dove-dpfn.squarespace.com/our-approach

 @tuanphanOh, I didn't realize the paragraph line could be forced to break like that. Thank you for catching that and for your suggestion. This is definitely code above my level!