How To Change Mobile Navigation CSS
@media all and (max-width: 1000px) {
.header-menu {
position: relative;
z-index: 1;
width: 90%;
max-width: 600px;
margin: 0 auto 40px;
}
.menu-toggle {
background: #4ab2f1 url('../images/menu-icon.png') right center no-repeat;
padding: 15px;
font-size: 15px;
font-weight: bold;
color: #fff;
text-transform: uppercase;
cursor: pointer;
}
.top-menu {
display: none;
}
.top-menu > li {
position: relative;
margin: 1px 0;
background-color: #f6f6f6;
}
.top-menu > li > a {
display: block;
min-height: 55px;
padding: 18px;
font-size: 15px;
color: #555;
}
.top-menu > li > a:focus {
position: relative;
z-index: 1;
}
.top-menu .sublist {
display: none;
background-color: #fff;
padding: 5px 0;
}
.top-menu .sublist li {
position: relative;
margin: 1px 0 1px 20px;
}
.top-menu .sublist li a {
display: block;
padding: 15px 18px;
font-size: 15px;
}
.sublist-toggle {
position: absolute;
top: 0;
right: 0;
width: 55px;
height: 55px;
border-left: 1px solid #fff;
background: url('../images/toggle-black.png') center no-repeat;
padding: 15px;
font-size: 15px;
font-weight: bold;
color: #fff;
text-transform: uppercase;
cursor: pointer;
}
.sublist .sublist-toggle {
height: 49px;
}
.sublist .sublist li {
background-color: #f6f6f6;
}
.sublist .sublist .sublist li {
background-color: #fff;
}
.block-category-navigation {
display: none;
}
.block-account-navigation {
float: none;
margin: auto !important;
}
.write-review .review-rating {
text-align: center;
}
.write-review .review-rating div.name-description {
width: 100%;
margin: 0 5px 0 0;
text-align: center;
}
}
Modified at 2024-08-27 11:55:42