.animenu > ul:after { content: ""; display: table; clear: both; }

body { -webkit-animation: bugfix infinite 1s; }

@-webkit-keyframes bugfix { from { padding: 0; }
  to { padding: 0; } }

.animenu { font: bold 10px Arial, Helvetica; }
.animenu * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.animenu ul { margin: 0; padding: 0; list-style: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; -ms-border-radius: 0px; -o-border-radius: 0px; border-radius: 0px; }
.animenu li { position: relative; }
.animenu li:hover > ul { opacity: 1; visibility: visible; margin: 0; }
.animenu li:hover > a { color: lightn(white, 80%); }
.animenu input[type=checkbox] { position: absolute; top: -9999px; left: -9999px; }
.animenu label { display: none; cursor: pointer; user-select: none; }

.animenu > ul { border: 1px solid black; background-color: #00a7dc; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -o-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; }
.animenu > ul > li { width: 25%; float: left; border-left: 1px solid #dcf7ff; -webkit-box-shadow: 1px 0 0 black; -moz-box-shadow: 1px 0 0 black; box-shadow: 1px 0 0 black; }
.animenu > ul > li > a { display: block; padding: 1em 0em; text-align: center; text-transform: none; }
.animenu > ul > li:fast-child { border-left: none; }
.animenu > ul > li.ffli { border-left: none; }
.animenu > ul a { color: white; text-decoration: none; text-shadow: 0 2px 0 #00a7dc; }
.animenu > ul ul { position: absolute; top: 100%; left: 0; z-index: 1; opacity: 0; visibility: hidden; margin: 2em 0 0 0; background-color: #2accff; background-image: none; -webkit-transition-property: margin, opacity; -moz-transition-property: margin, opacity; -o-transition-property: margin, opacity; transition-property: margin, opacity; -webkit-transition-duration: .15s; -moz-transition-duration: .15s; -o-transition-duration: .15s; transition-duration: .15s; -webkit-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; border: solid 1px #00a7dc; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; }
.animenu > ul ul li { display: block; -webkit-box-shadow: 0 1px 0 #00baf6, 0 2px 0 #5dd8ff; -moz-box-shadow: 0 1px 0 #00baf6, 0 2px 0 #5dd8ff; box-shadow: 0 1px 0 #00baf6, 0 2px 0 #5dd8ff; text-align: left; border-bottom: solid 1px #00a7dc; }
.animenu > ul ul li:first-child > a { -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; -ms-border-radius: 3px 3px 0 0; -o-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; }
.animenu > ul ul li:first-child > a:after { content: ''; position: absolute; left: 4em; top: -12px; border: 6px solid transparent; border-bottom-color: inherit; }
.animenu > ul ul li:last-child { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
.animenu > ul ul li:last-child > a { -webkit-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -ms-border-radius: 0 0 3px 3px; -o-border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px; }
.animenu > ul ul a { padding: 1em 0.25em; width: 11em; display: block; border-color: #2accff; text-align: center; }
.animenu > ul ul a:hover { background-color: #43c4f2; border-color: #43c4f2; }

@media screen and (max-width: 768px) { .animenu > ul, .animenu > ul ul { visibility: visible; opacity: 1; display: none; }
  .animenu input[type=checkbox]:checked ~ label, .animenu input[type=checkbox] ~ label:hover { color: white; }
  .animenu label { border: 1px solid #0094c3; background-color: #00a7dc; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(100%, rgba(255, 255, 255, 0))); background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: -o-linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); background-image: linear-gradient(rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0)); -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset; color: white; text-shadow: 0 1px 0 #00a7dc; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; text-transform: uppercase; position: relative; display: block; padding: 1em 3em; }
  .animenu label:before { position: absolute; left: 0.5em; top: 0.125em; content: "\2261 MENU"; font-size: 1.3em; }
  .animenu > ul { position: relative; border-color: #00a7dc; margin: 0.5em 0 !important; padding: 0.25em; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background-color: #00a7dc; background-image: none; }
  .animenu > ul:after { content: ''; position: absolute; left: 2em; top: -12px; border: 6px solid transparent; border-bottom-color: inherit; }
  .animenu > ul li { display: block; }
  .animenu > ul > li { width: 100%; float: none; border: 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background-color: #00a7dc; background-image: none; text-align: left; }
  .animenu > ul > li > a { float: none; display: block; padding: 1em; text-align: left; }
  .animenu > ul ul { position: static; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; background-color: #10c5ff; background-image: none; margin: 0; -webkit-transition-property: none; -moz-transition-property: none; -o-transition-property: none; transition-property: none; }
  .animenu > ul ul li:first-child > a { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
  .animenu > ul ul li:first-child > a:after { content: none; }
  .animenu > ul ul li:last-child > a { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
  .animenu > ul ul a { padding-left: 2em; display: block; width: auto; text-align: left; }
  .animenu input[type=checkbox]:checked ~ ul { display: block; }
  .animenu input[type=checkbox]:checked ~ ul ul { display: block; } }
@media screen and (max-width: 1056px) { .animenu > ul > li > a { display: block; padding: 1em; } }