Move mobile slider text up

Hi colls!

  1. Could you please help with usual problem: there are a lot free space between burger&menu and slider text. looks not good.

  1. phone number is green as links color. is it ok or? how avoid it?

Hi,

You can use custom css plugin to add the css code below:

  1. decrease the space between the header and slider text:
@media only screen and (max-width: 767px){
  .header-slider {
    height: 500px !important;
  }
}
  1. See this screenshot http://prntscr.com/aww811 The phone number is already has white color, did you already fix this?

Thank you for your answer, but

  1. adding custom css doesn’t help. plugin is activated but no changes after adding code. may be best way is adding to right place in style.css?

css

  1. the phone number is still green.

i’m stupid.

Hi again Awan! Many thanks for your help.

I’ve just change 500 to 300 px in “height” and it looks OK on iphone 5s for now. thanks a lot.

anyway 7-digits phone still green. strange.

and one more question., may be it was here before: is it possible to move “burger” left on the same line with logo so it will be more space at the screen. guess, i’ll have experiments with “height” after that.

thank you in advance.

Hi,

Looks like you moved the phone number to the button.

And please try this to move the menu bar:

@media only screen and (max-width: 1024px){
  .site-header .col-md-4.col-sm-8.col-xs-12 {
    margin-bottom: 0px;
  }
  .site-header .col-md-8.col-sm-4.col-xs-12 {
    top: -90px;
  }
  .btn-menu {
    float: left;
    margin-left: 20px;
  }
}

in first, thank you for your quick answer.

yes, you’re right. i’ve just choose easiest way with phone number.

so. i’ve just added additional css and burger moved to left side. anyway, what parameter is for menu black field height? less space under logo is needed (Figure 1).

and Menu after pressing hamburger looks strange and over site (Figure 2)

Hi,
Please replace the code in above using below:

@media only screen and (max-width: 1024px){
  .site-header .col-md-4.col-sm-8.col-xs-12 {
    margin-bottom: 0px;
  }
  .site-header {
    padding-bottom: 0;
  }
  .site-logo, .header-wrap .col-md-4 {
    margin-bottom: 0;
  }
  .site-header .col-md-8.col-sm-4.col-xs-12 {
    top: -60px;
  }
  #mainnav-mobi {
    top: 60px;
  }
  .btn-menu {
    float: left;
    margin-left: 20px;
  }
}

Awan, it’s great! thanks a lot for your help. you may close ticket and share link to all who wants the same.

summary:

@media only screen and (max-width: 767px){
  .header-slider {
    height: 320px !important;
  }
}

.title-post {
	display:none;
}

@media only screen and (max-width: 1024px){

.site-header .col-md-4.col-sm-8.col-xs-12 {
  margin-bottom: 0px;
}
.site-header {
  padding-bottom: 0;
}
.site-logo, .header-wrap .col-md-4 {
  margin-bottom: 0;
}
.site-header .col-md-8.col-sm-4.col-xs-12 {
  top: -60px;
}
#mainnav-mobi {
  top: 60px;
}
.btn-menu {
  float: left;
  margin-left: 20px;
}
}

.roll-button {
		font-family:PT Serif, serif!important;
		font-size: 20px;
		text-transform: none;
  		font-weight: 300;
}

Hi,

Great to know if all is worked.
Feel free to ask to this forum if you have another issue.

Regards,
Awan