hi Ismeal,

I did, with @media only screen and (max-width: 480px) {
I’ll add the link, thanks

Thanks, this is almost it. I need the menu to be -120 only when it’s opened. The burger icon is good in place as it is, then when opened I would like the menu to be more to the top.

Hey Rikard, thanks for the reply. Didn’t quite do the trick.
Btw this is only for mobile version, the desktop is fine as it is.

Thanks, and sorry for being unclear.

Hi Ismael, this is exatly how I do it. Also the developer tried and gave me the answer that it doesn’t work because of the overwriting.

Works like a charm, thanks you so much!
One more; the X for closing the overlay menu scrolls over the txt when you scroll in the menu

Awesome, thank you!

Thanks a lot!

Thanks for your answer. Unfortunately the css changes nothing in the description heights.

Hey, it doesn’t work. This code hides the whole content.

All pages have this setup, I put a direct link in there. If you check this on mobile it gives a long background first, then the content.
It needs to be hidden on mobile and the content needs to be at the top of the page. The weird thing is; the homepage has no background and is also not at the top of the page.

Thanks I found the solution for the slider. It was a padding thing.

For the mobile I also mean the rest of the page; the blocks have a huge padding between them, the titles are to big and some things are overlapping.

Great, thanks a lot! Only problem now is the burger menu being left instead of right. If we can fix that I would be very happy :)

Sorry I don’t understand. When I remove the code it shows me the burger menu on fullscreen also.

@media only screen and (max-width: 1220px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

Hey Victoria,
The css I have right now is this: also because I needed the search bar in the logo header.
What can I remove to fix this?

@media only screen and (min-width: 990px) and (max-width: 1220px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

a.slide-image {
    display: none!important;
}

.slide-content .slide-meta {
display: none;
}

.avia-content-slider .slide-entry-title {
    font-size: 20px!important;
    text-transform: uppercase;
    color: white !important;
    height: 60px;
}
.html_elegant-blog .av-vertical-delimiter { display: none !important; }

.avia-content-slider {
 font-size: 13px!important;
    color: white !important;
    
}

#top .avia-slideshow-arrows a.prev-slide {
 opacity: 1;
    left: 130px;
top: -60px;
   background: #139eda;
color: white;  
}

#top .avia-slideshow-arrows a.next-slide {
 opacity: 1;
    right: 130px;
   top: -60px;
 background: #139eda;
    color: white;  
}

.avia-content-slider {
    overflow: visible;
}

#top #header .av-main-nav > li {
    padding-left: 30px;
    padding-right: 30px;
   
}

@media only screen and (max-width: 767px) {
.responsive #top .logo {
    width: auto;
}
}

#top .avia-slideshow-arrows a:before {
    background-color: transparent;
}

#scrollpijl {
background-color: transparent !important;
}

#header-home {
background-color: transparent !important;
}

.av-main-nav > li > a { padding: 0 9px; }

#header.av_header_transparency { background-color: transparent; }

#top #wrap_all #footer .flex_column p{
font-size: 12px !important;
}

.breadcrumb { 
   font-size: 10px !important;
color: #139eda  !important;
}

.breadcrumb { 
   font-size: 10px !important;
color: #0670b7 !important;
}

.inner_sidebar {
    margin-top: 20px !important;
}

@media only screen and (max-width: 767px)  {
.av-burger-menu-main{
left:300px!important;
}
#menu-item-search{
left:80px!important;
}
.logo img{
width:80%!important;
}}

.av-main-nav-wrap, .main_menu {
	width: 100% !important;
        margin-left: -21px  !important;
}
#header .widget {     width: 20%;     position: relative;      margin-left: auto;   margin-right: auto; }  

@media only screen and (max-width: 767px) { #header .widget {     width: 100%;     position: absolute;     left: 10%;     top: 100px; }}

#header .widget:nth-child(1) {
  left: 80%;
  padding-top: 25;
  position: absolute;
  top: 0;
  transform: translate(-50%);
  z-index: 999;
}
#header .widget:nth-child(2) {
  left: 50%;
  padding-top: 15;
  position: absolute;
  top: 0;
  transform: translate(-50%);
  z-index: 999;
}

@media screen and (max-width: 800px) {
  #header .widget:nth-child(1) {
    visibility: hidden;
    clear: both;
    float: left;
    margin: 10px auto 5px 20px;
    width: 28%;
    display: none;
  }
}

@media screen and (max-width: 800px) {
  #header .widget:nth-child(2) {
    visibility: hidden;
    clear: both;
    float: left;
    margin: 10px auto 5px 20px;
    width: 28%;
    display: none;
  }
}

Hey Rikard,

Thanks for your answer. Sorry for the late reply, I don’t receive the email with new comment..

It is getting better but there are still some weird issues;

Scaling the screen for half the size I get 2 burger menu’s, and the news carousel still switches the arrows en gives double text (normal text overflows the title)

Scaling it further the logo still stretches and the menu is attached to it instead of on the right of the screen.

Thanks!

Thanks that works! Only thing is, when I scale the arrows do a weird slide in positon.

This is what I did

#top .avia-slideshow-arrows a.prev-slide {
 opacity: 1;
    left: 130px;
top: -60px;
   background: #139eda;
color: white;  
}

#top .avia-slideshow-arrows a.next-slide {
 opacity: 1;
    right: 130px;
   top: -60px;
 background: #139eda;
    color: white;  
}

And do you think you can help with the second image? So the image of the down arrow and a white bar as a language menu. Thanks a lot!