Righty Navigation Line


Step One

From your Squarespace account, go to the Custom CSS Editor: Design > Advanced > Custom CSS

Step Two

Copy and paste the code below into the Custom CSS Editor box.

// Righty Nav Line /

@media all and (min-width:770px){
header nav a{
  display: inline-block !important; 
  float: none;

header nav a:hover:after{
  transform: scaleX(1);
header nav a:after {
  content: '';
  border-bottom: solid 2px #FECB2F;  
  transform: scaleX(0);  
  transition: transform 250ms ease-in-out;
  z-index: 999;
  transform-origin :100% 50%;

Step Three

Change the border-bottom color value to change the color.

Save and refresh the page. 👍

Moov Labs