I'm trying to leave a menu with a specific color and I'm not getting it, I've already changed the hover
effect but when the mouse is not positioned I would like the entire menu to be the color #e70781
and not only in hover
the CSS I have is this:
.menu_block { height:60px; background-color:#fff; } .is-sticky .menu_block { z-index:9000; left:0; width:100%; box-shadow:0 1px 0 #e9e9e9; } .menu_toggler {display:none;} .navmenu {float:right;} .navmenu li { position:relative; display:inline-block; margin:0 0 0 -3px; } .navmenu li.sub-menu:hover { background: #e70781; /* Old browsers */ background: -moz-linear-gradient(top, #e70781 0%, #e70781 90%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e70781), color-stop(90%,#e70781)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #e70781 0%,#e70781 90%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #e70781 0%,#e70781 90%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #e70781 0%,#e70781 90%); /* IE10+ */ background: linear-gradient(to bottom, #e70781 0%,#e70781 90%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e70781', endColorstr='#e70781',GradientType=0 ); /* IE6-9 */ } .navmenu li.sub-menu:hover:before { content:''; position:absolute; z-index:9999; left:0; right:0; bottom:-2px; height:3px; background-color:#fff; } .navmenu li a { position:relative; display:block; margin:0; padding:20px 16px; text-transform:uppercase; font-weight:900; line-height:20px; font-size:13px; color:#333; transition: none; -webkit-transition: none; } .navmenu li.sale_menu a { color:#cc3333; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; } .navmenu li.sale_menu a:before, .navmenu li.sale_menu a:after {display:none;} .navmenu li:hover a, .navmenu li.active a { margin-left:-1px; margin-right:-1px; border-left:1px solid #e9e9e9; border-right:1px solid #e9e9e9; } .navmenu li:hover a:before, .navmenu li.active a:before, .navmenu li:hover a:after, .navmenu li.active a:after { content:''; position:absolute; left:-1px; right:-1px; top:-2px; height:2px; background-color:#333; } .navmenu li:hover a:after, .navmenu li.active a:after {top:auto; bottom:-2px;} .navmenu li.sale_menu:hover a, .navmenu li.sale_menu.active a { margin:0; border:0; color:#fff; background-color:#cc3333; }
What I need to change is just this menu, I have already been able to change the menu color throughout its extension, doing this:
.menu_block { height:60px; background-color:#fff; }
But I need them to stay with the specific color only where it has options in the menu, except the basket and search option.
Ileavethesiteforconsultationhere: Developing site