
.mcd-menu {
  /* list-style: none; */
  /* padding: 0; */
  /* margin: 0; */
  /* background: #FFF; */
  /*height: 100px;*/
  /* border-radius: 2px; */
  -moz-border-radius: 2px;
  /* -webkit-border-radius: 2px; *//* == */
  /* width: 250px; *//* == */
}

.mcd-menu a {
  /* display: block; */
  /* text-decoration: none; */
  /* padding: 12px 20px; */
  /* color: #777; */
  /*text-align: center;
  border-right: 1px solid #E7E7E7;*//* == */
  /* text-align: left; */
  /* height: 36px; */
  /* position: relative; */
  /* border-bottom: 1px solid #EEE; *//* == */
}



.mcd-menu a  {
  display: block;
  /* text-transform: uppercase; */
}
.mcd-menu a small {
  display: block;
  font-size: 10px;
}

.mcd-menu a i, .mcd-menu a , .mcd-menu a small {
  position: relative;
  transition: all 300ms linear;
  -o-transition: all 300ms linear;
  -ms-transition: all 300ms linear;
  -moz-transition: all 300ms linear;
  -webkit-transition: all 300ms linear;
}
.mcd-menu:hover > a i {
    opacity: 1;
    -webkit-animation: moveFromTop 300ms ease-in-out;
    -moz-animation: moveFromTop 300ms ease-in-out;
    -ms-animation: moveFromTop 300ms ease-in-out;
    -o-animation: moveFromTop 300ms ease-in-out;
    animation: moveFromTop 300ms ease-in-out;
}
.mcd-menu:hover a  {
    opacity: 1;
    -webkit-animation: moveFromLeft 300ms ease-in-out;
    -moz-animation: moveFromLeft 300ms ease-in-out;
    -ms-animation: moveFromLeft 300ms ease-in-out;
    -o-animation: moveFromLeft 300ms ease-in-out;
    animation: moveFromLeft 300ms ease-in-out;
}
.mcd-menu:hover a small {
    opacity: 1;
    -webkit-animation: moveFromRight 300ms ease-in-out;
    -moz-animation: moveFromRight 300ms ease-in-out;
    -ms-animation: moveFromRight 300ms ease-in-out;
    -o-animation: moveFromRight 300ms ease-in-out;
    animation: moveFromRight 300ms ease-in-out;
}


.mcd-menu:hover > a {
  color: #92886a;
}





@-webkit-keyframes moveFromTop {
    from {
        opacity: 0;
        -webkit-transform: translateY(200%);
        -moz-transform: translateY(200%);
        -ms-transform: translateY(200%);
        -o-transform: translateY(200%);
        transform: translateY(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -ms-transform: translateY(0%);
        -o-transform: translateY(0%);
        transform: translateY(0%);
    }
}
@-webkit-keyframes moveFromLeft {
    from {
        opacity: 0;
        -webkit-transform: translateX(200%);
        -moz-transform: translateX(200%);
        -ms-transform: translateX(200%);
        -o-transform: translateX(200%);
        transform: translateX(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}
@-webkit-keyframes moveFromRight {
    from {
        opacity: 0;
        -webkit-transform: translateX(-200%);
        -moz-transform: translateX(-200%);
        -ms-transform: translateX(-200%);
        -o-transform: translateX(-200%);
        transform: translateX(-200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}








@-moz-keyframes moveFromTop {
    from {
        opacity: 0;
        -webkit-transform: translateY(200%);
        -moz-transform: translateY(200%);
        -ms-transform: translateY(200%);
        -o-transform: translateY(200%);
        transform: translateY(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateY(0%);
        -moz-transform: translateY(0%);
        -ms-transform: translateY(0%);
        -o-transform: translateY(0%);
        transform: translateY(0%);
    }
}
@-moz-keyframes moveFromLeft {
    from {
        opacity: 0;
        -webkit-transform: translateX(200%);
        -moz-transform: translateX(200%);
        -ms-transform: translateX(200%);
        -o-transform: translateX(200%);
        transform: translateX(200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}
@-moz-keyframes moveFromRight {
    from {
        opacity: 0;
        -webkit-transform: translateX(-200%);
        -moz-transform: translateX(-200%);
        -ms-transform: translateX(-200%);
        -o-transform: translateX(-200%);
        transform: translateX(-200%);
    }
    to {
        opacity: 1;
        -webkit-transform: translateX(0%);
        -moz-transform: translateX(0%);
        -ms-transform: translateX(0%);
        -o-transform: translateX(0%);
        transform: translateX(0%);
    }
}







@media screen and (max-width: 768px){


@-webkit-keyframes moveFromTop {
    from {
        opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}
@-webkit-keyframes moveFromLeft {
    from {
       opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
       opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}
@-webkit-keyframes moveFromRight {
    from {
       opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
       opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}








@-moz-keyframes moveFromTop {
    from {
       opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}
@-moz-keyframes moveFromLeft {
    from {
        opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}
@-moz-keyframes moveFromRight {
    from {
        opacity: 0;
        -webkit-transform: none);
        -moz-transform: none);
        -ms-transform: none);
        -o-transform: none);
        transform: none);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }
}
}