HOVER LINE ANIMATION ON MENU

#primary-menu{
li{
a{
padding-left: 0px;
padding-right: 0px;
margin-left: 10px;
margin-right: 10px;
}
@media only screen and (max-width: 1145px)  {
padding: 0 10px;
}
}
#menu-item-135,
#menu-item-136,
#menu-item-198,
#menu-item-937{
a{
padding: 19px 0px;
margin-left: 10px;
margin-right: 10px;
}
a:after{
content: '';
position: absolute;
width: 0;
height: 3px;
display: block;
margin-top: 5px;
bottom: 30px;
background: #D94C0C;
transition: width .2s ease;
-webkit-transition: width .2s ease;
}
a:hover:after{
 width: 100%;
 right: 0;
 background: #D94C0C;
}
li{
a{
padding: 19px 10px;
margin: 0px;
}
a:after{
display: none;
}
}
}
.menu-item.current-menu-item,
.current_page_parent{
a:before{
content: '';
position: absolute;
height: 3px;
display: block;
margin-top: 5px;
bottom: 30px;
background: #D94C0C;
right: 0 !important;
width: 25px !important;
}
li{
a:before{
display: none !important;
}
}
}
#menu-item-138{ // Disable Active Page Style on Contact Menu.
padding: 0px !important;
a{
padding: 6px 40px 6px 15px !important;
}
a:before{
display: none !important;
}
}
.sub-menu{
.menu-item.current-menu-item{
a:before{
bottom: 0px !important;
}
}
}
}