.links{
    float:right;
    margin-right: 30px;    
    position:relative;
    
    li{
      float:left;
      list-style:none;
      position:relative;
      margin:10px;
      display:inline-block;      
      
      &>a{
        position:relative;
        display:inline-block;            
        padding:0 10px;
        line-height:30px;
        height:30px;        
        
        &:hover{
          color:$color-base;
          background:$color-accent;
          border-radius:2px;
        }
        
        &[class^="trigger-"]{padding-right:40px;}
        
        .arrow{
          position:absolute;
          width:10px;height:10px;   
          top:35%;
          text-align:center;          
          right:10px;
          border-width: 5px 5px 0 5px;
          border-style:solid;
          border-color: rgba(#000, .3) transparent;
          
          &:after{            
            content:"";
            border-left:1px solid rgba(#000,.15);
            top:-10px;left:-15px;
            position:absolute;            
            height:15px;    
          }
          
        }
        
      }
                
      ul{
          position:absolute;          
          left:0; 
          //top:40px;
          margin:0;
          background:$color-base;
          border-radius:2px;          
          box-shadow:0 0 5px rgba(#000, .15);
          display:none;
        
          >li{
            clear:both;            
            list-style:none;            
            display:block;
            padding:0 10px;
            margin:0;
            width:100%;            
            
            &:hover{
              background:lighten($color-accent,40);
              >a{
                background:lighten($color-accent,40);
                color:$color-base;
              }
            }
          }         
          
        }
      
      &:hover {
          > .drop{
            display:block;
            animation:fadeInRight .3s ease;
            -webkit-animation:fadeInRight .3s ease;
        }
      }
      
    }
  }
      
}

@keyframes fadeInRight{
    0%{
        opacity:0;
        transform:translate3d(100%,0,0)
    }
    100%{
        opacity:1;
        transform:none
    }
}