Hi Dude, thanks for you reply. Yep, the menus are all in the correct place. The problem is the main parent item (in a mega menu) becomes a title when switched down to mobile. At desktop size it’s fine. The image above shows the slightly lighter grey titles (which are the main mega-menu parent pages).

the code for the social bar doesnt work.

is there a conflict in some of my CSS style code?

#top .main_menu .menu li a { font-size: 18px; color: white; background-color: #4787f3; }
#top .main_menu .menu li a:hover { background-color: #4787f3; color: grey; }

#top .header_color .main_menu .menu ul li a{
background-color: #4787f3;
color: #ffffff;
font-size: 17px;
}
#header_main {
background: #4787f3;
}
@media only screen and (max-width: 989px) and (min-width: 768px) {
.responsive .main_menu ul:first-child > li > a {
padding: 0 8px;
font-size: 17px;
}
@media only screen and (max-width: 767px) and (min-width: 480px) {
.woocommerce .template-shop.content.nine.units {
width: 100%;
}
@media only screen and (max-width: 989px) and (min-width: 768px) {
.woocommerce .template-shop.content.nine.units {
}
.grid-content {
height: 70px;
}
.woocommerce .sidebar {
display: none !important;
}
.woocommerce .template-shop.content.nine.units {
width: 1030px;
border: none;
}
.header_color .sub_menu>ul>li>a {
font-size: 12px;
color: #0e75bf;
}
#top .main_menu .menu a {
color: white;
}
#top .main_menu .menu a:hover {
color: white;
}
.main_menu ul:first-child > li > a {
font-size: 17px;
font-weight: 700;
color: white;
}

#footer .widget {
padding: 30px 0 30px 0 !important;
}
.numeric_controls, .arrow_controls {
position: absolute;
bottom: 100px;
}

#top .sidebar_tab_content.sidebar_active_tab_content {
background-color: #fff;
color: black;
}
#top .sidebar_tab.sidebar_active_tab {
background-color:#0e75bf;
color: #fff;
}
.slideshow_color .breadcrumb, .slideshow_color .breadcrumb a {
color: #0e75bf;
}
.numeric_controls, .arrow_controls {
position: absolute;
bottom: 10px;
}
#top .ajax_controlls {
top: 70%;
}
#footer .widget_nav_menu li a {
font-size: 20px;
}

#menu-item-1045 a, #menu-item-1044 a, #menu-item-1043 a, #menu-item-1988 a {
color: #FFF;
font-size: 25px;
}
#footer .widget_nav_menu li a {
text-align: center;
}
.iconbox_icon {
background-color: white !important;
}
.widget_nav_menu h3.widgettitle {
text-align: center;
}
#top .iconbox {
width: 100%;
}
#top .avia_mega_div {
background-color: #f5f2f5;
color: grey;
}
#top .avia_mega_div .sub-menu {
background-color: #f5f2f5;
color: grey;
}
#top .avia_mega_div .menu-item ul {
background-color: #f5f2f5;
color: grey;
}
#top .main_menu .menu ul li a {
background-color: #f5f2f5;
color: white
}
.sidebar_tab_title {
margin-left: 10px !important;
}
#js_sort_items a {
font-size: 19px;
}
#top.woocommerce-page .woocommerce-ordering select { width: 25%; }

@media only screen and (max-width: 767px) {
#top.woocommerce-page .woocommerce-ordering select {width: auto; }
}
.chzn-container {
position: initial;
}
#top .chzn-container .chzn-drop {
top: 70px !important;
width: 325px !important;
margin-left: 3px;
}
.woocommerce-pagination {
display: none;
}
#top.tax-product_cat .container > .term-description {
display: none;
}
.added_to_cart {
display: none;
}
.form-row.address-field{
overflow: visible;
}
#top .chzn-single div b {
background-position: 5px 6px !important;
}
.widget .gform_wrapper .gform_footer br{
display: none !important;
}
div .main_color .active_tab {
background-color: #0e75bf;
color: #FFF;
}
div .main_color .tabcontainer .active_tab {
color:#FFF;
}
#top .main_color .tabcontainer .tab:hover {
#FFF:

}
.main_menu ul:first-child > li > a {
padding: 0 5px;

}
#top .main_menu ul:first-child > li > a {
padding: 0 13px;

}
.social_header .phone-info.with_nav span {
color: orange;
font-size: 20px;
}

thanks a lot!

And how can i change the logo location?

it is sticking on the top but should be moved down a little bit

I figured it out:

Add the following code to your custom.css:

#top .main_menu .menu .custom-menu-item a { color:red; }
#top .main_menu .menu .custom-menu-item a:hover { color: green; }

Then go to WP Appearance/Menus and set “custom-menu-item” class in the “CSS Classes (optional)” of your menu item.
If you can’t find “CSS Classes (optional)”, then please watch this quick video: http://www.youtube.com/watch?v=5Uncd4pjTuE

Thanks)

Hello Ismael,

Thank you for the response, but that did not add a search bar at the top of the page on an iPhone or iPad. Do I need to add any additional code there?

Thanks.

Hi have this code :

$output .= "<div data-ajax-id='{$the_id}' class=' grid-entry flex_column isotope-item all_sort {$style_class} {$post_class} {$sort_class} {$grid} {$extraClass}'>";
				$output .= "<div class='main_color inner-entry'>";
				$output .= "<a target='_blank'href='{$link}' data-rel='grid-".avia_post_grid::$grid."' class='grid-image' title='".esc_attr(strip_tags($title))."'>".get_the_post_thumbnail( $the_id, $image_size )."</a>";
				$output .= !empty($title) || !empty($excerpt) ? "<div class='grid-content'><div class='avia-arrow'></div>" : '';
				$output .= !empty($title) ? "<h3 class='grid-entry-title'><a target='_blank'href='{$title_link}' title='".esc_attr(strip_tags($title))."'>".$title."</a></h3>": '';
				$output .= !empty($excerpt) ? "<div class='grid-entry-excerpt'>".$excerpt."</div>" : '';
				$output .= !empty($title) || !empty($excerpt) ? "</div>" : '';
				$output .= "</div>";
				$output .= "</div>";

Correct. When you are at the top of the page I want the main menu to be transparent. When scrolling down I want the main menu background to become white. And it should scroll down with the page as it does by default.

Thanks guys. This solved my problem, so this topic can be marked as closed.

Thanks again.

Hi,

When I look at the site in Firefox, I don´t see the JS error on the top of the page, but in Chrome I see it. What can cause this?

I cant see the changes, you have made either in Firefox (I refreshed the cache more times) or in Chrome. I asked somebody to look at the site on his computer, he sees the same like me.

Other problems in Chrome:
1.
the woocommerce basket icon is not visible

2.
in header meta only 2 menu items of the My Account menu is visible, instead of 5 menuitems, I want to show there. (In Firefox all 5 is visible)

Thanks, Best Wishes:

MCGawain