Change slider position

How do I do the following:

  • Make the height of the slider 50% of the default
  • Have less space between the slider and the text on the page (I have the page title hidden.)
  • Have less space between the logo and the hamburger icon
  • Vertically center the text in the new height slider

Thanks.

Hello there,

Make the height of the slider 50% of the default

Add this extra CSS code to Appearance > Customize > Additional CSS from dashboard.

.header-slider {
  height: 50vh !important;
}

70vh equals to 70% of the screen’s height.

Have less space between the slider and the text on the page (I have the page title hidden.)

.sydney-hero-area {
    margin-bottom: 90px;
}

Have less space between the logo and the hamburger icon

@media only screen and (max-width: 991px) {
     .site-header .col-md-8 {
         margin-top: -40px; 
     }
}

Vertically center the text in the new height slider

The slide’s text will be automatically centered. If not, please share a link to your site. Probably we need to add special CSS code depending on your case.

Regards,
Kharis