CSS Menu

• Home
• About
• Services
  • Child Category
  • Child Category 2
  • Child Category 3
• Profile
• Contact Us

/*start:here*/
.custom-menu {
padding: 20px 0;
position: absolute;
left: 255px;
top: 40px;
}

.custom-menu ul {
padding: 0;
margin: 0;
}

.custom-menu li {
padding: 0;
margin: 0;
list-style: none;
display: inline-block;
vertical-align:top;
position: relative;
}

.custom-menu li::before {
display: none;
}

.custom-menu li a {
padding: 15px 25px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
line-height: 24px;
letter-spacing: 1.5px;
text-transform: uppercase;
color: #000;
font-weight: 600;
text-decoration:none;
}

.custom-menu li a:hover, .custom-menu li a:focus {
color: #e53c97;
text-decoration: none;
}

.custom-menu .children li {
display: block;
text-align: center;
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.custom-menu .children {
visibility: hidden;
position: absolute;
right: -30px;
top: 35px;
min-width: 230px;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
z-index: 1;
}

.custom-menu li:hover .children {
visibility: visible;
}

.custom-menu .children li {
background-color: #e53c97;
}

.custom-menu .children li:first-child:before {
content: ”;
position: absolute;
left: 50%;
top: -5px;
width: 15px;
height: 15px;
background-color: #e53c97;
transform: rotate(45deg);
display:block !important;
}
.custom-menu .children:before {
content: “\f107”;
position: absolute;
right: 35px;
top: -33px;
color: #000000;
font-size: 16px;
font-family: FontAwesome;
visibility: visible;
}
.custom-menu li:hover .children:before {
content: “\f106”;
}

.custom-menu .children a {
color: #ffffff;
font-size: 13px;
text-transform: none;
padding: 10px 0;
display: block;
}

.custom-menu .children a:hover {
color: #000;
}