.buttonshadow {
  border: none;
  text-align: center;
  text-decoration: none;
  display: inline-block;

  margin: 4px 4px;
  cursor: pointer;
  -webkit-transition-duration: 0.1s; /* Safari */
  transition-duration: 0.1s;
  padding: 0.7em 0.57em;
  box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
}

/*Menu*/
.example {
 position:relative; 
 border-radius:3px;
 -moz-border-radius:3px;
 -webkit-border-radius:3px;
}


/* main menu styles */
.nav, .nav ul {
 list-style:none;
 margin:0;
 padding:0;

}

.nav {
 position:relative;

}

.nav ul {
 height:0;
 left:0;
 overflow:hidden;
 position:absolute;
 top:1146px;

}

.nav li {
 float:left;
 position:relative;

}

  .nav li a {
    -moz-transition: 0.5s;
    -o-transition: 0.5s;
    -webkit-transition: 0.5s;
    color: #006368;
    display: block;
    font-size: 16px;
    line-height: 35px;
    padding: 5px 20px;
    text-decoration: none;
    transition: 0.5s;
  }

.nav li:hover > a {
 background:#006368;
 color:#fff;
}

.nav li:hover ul.subs {
 height:auto;
 width:180px;

}

.nav ul li {
 -moz-transition:0.5s;
 -o-transition:0.5s;
 -webkit-transition:0.5s;
 opacity:0;
 transition:0.5s;
 width:100%;

}

.nav li ul li {
 -moz-transition-delay:0s;
 -o-transition-delay:0s;
 -webkit-transition-delay:0s;
 transition-delay:0s;

}

.nav li:hover ul li {
 opacity:1;
 -moz-transition-delay:0.5s;
 -o-transition-delay:0.5s;
 -webkit-transition-delay:0.5s;
 transition-delay:0.5s;

}

.nav ul li a {
 background:#7770B4;
 border-color:#6E67A6;
 color:#fff;
 line-height:1px;
 -moz-transition:1.5s;
 -o-transition:1.5s;
 -webkit-transition:1.5s;
 transition:1.5s;

}

.nav li:hover ul li a {
   line-height:35px;  
}

.nav ul li a:hover {
 background:#8CCA33;
 background-image: -webkit-gradient(linear, 0% 0%, 0% 95%, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0)));
 background-image: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
 background-image: -o-linear-gradient(-90deg,rgba(255,255,255,0.5),rgba(255,255,25,0));

}