/* nav .links {
float: left;
margin-right: 30px;
position: relative;
}

*/
:root {
    --green: #7dd35e;
    --dark-grey: #40493b;
    --light-grey: #a4ae9e;
    --cyan: #00daff;
    --light-blue: #0b3f66;
}
.links li .drop{
    top:40px
}
.links li { 
    list-style: none;
    position: relative;  
    display: inline-block;
    text-align:right
}
 
   .links li > a {
        position: relative;
        display: inline-block;
        text-decoration: none; 
        line-height: 30px;
        height: 30px;
        color: var(--green)
    }
 
        .drop .links li > a:hover {
            color: #fff;
            border-radius: 2px;
        } 
         .drop .links li > a[class^=trigger-] {
            padding-left: 40px;
        } 

      /* .drop .links li > a .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(0, 0, 0, 0.3) transparent;
        }

            .drop .links li > a .arrow:after {
                content: "";
                border-left: 1px solid rgba(0, 0, 0, 0.15);
                top: -10px;
                left: -15px;
                position: absolute;
                height: 15px;
            } */
     .links li ul {
        position: absolute;
      
        top:0;
        margin: 0;
        background: #fff !important;
        border-radius: 4px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
        display: none;
    }
/*
        .drop .links li ul > li {
            clear: both;
            list-style: none;
            display: block;
            padding: 0 10px;
            margin: 0;
            width: 100%;
        }

            .drop .links li ul > li:hover {
                background: #7dd35e;
            }*/

                .drop .links li ul > li:hover > a {
                   
                    color: #fff;
                }

     .links li:hover > .drop {
        display: block;
        animation: fadeInRight 0.3s ease;
        -webkit-animation: fadeInRight 0.3s ease;
    }

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

    100% {
        opacity: 1;
        transform: none;
    }
}