.nav-active+#nav-trigger .nav-middle,nav{opacity:0}
#nav-trigger{position:fixed;z-index:999999999;height:16px;width:36px;top:74.5px;right:100px;}
#nav-trigger span{color:#fff;text-transform:uppercase;font-size:13px;margin-top:15px;display:block;}
#nav-trigger span.open{opacity:1;-webkit-transition:0.5s ease-in-out;-moz-transition:0.5s ease-in-out;-o-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
#nav-trigger span.closenav{opacity:0;-webkit-transition:0.5s ease-in-out;-moz-transition:0.5s ease-in-out;-o-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
.nav-active + #nav-trigger span.open{opacity:0;-webkit-transition:0.5s ease-in-out;-moz-transition:0.5s ease-in-out;-o-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
.nav-active + #nav-trigger span.closenav{opacity:1;-webkit-transition:0.5s ease-in-out;-moz-transition:0.5s ease-in-out;-o-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
#nav-trigger .nav-top{position:absolute;top:0;right:0;width:80%;height:1px;background:#fff;-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;}
#nav-trigger .nav-middle{position:absolute;top:44%;right:0;width:70%;height:1px;background:#fff;-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;}
#nav-trigger .nav-bottom{position:absolute;bottom:0;right:0;width:100%;height:1px;background:#fff;-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;}
.nav-active + #nav-trigger .nav-middle{opacity:0;}
#nav-trigger:hover .nav-middle{width:100%;background:#ff0068;}
#nav-trigger:hover .nav-bottom{width:80%;background:#ff0068;}
#nav-trigger:hover .nav-top{width:70%;background:#ff0068;}
.nav-active + #nav-trigger .nav-top,
.nav-active + #nav-trigger .nav-bottom,
.nav-active + #nav-trigger span{-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;color:#fff;width:100%;}
.nav-active + #nav-trigger .nav-top,
.nav-active + #nav-trigger .nav-bottom{-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;color:#fff;width:100%;background:#ff0068;}
.nav-active + #nav-trigger .nav-top{top:7px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);transform:rotate(-45deg);}
.nav-active + #nav-trigger .nav-bottom{bottom:7px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);transform:rotate(45deg);width:100%;}
nav{bottom:0;left:0;position:fixed;right:0;top:0;transition:all .4s cubic-bezier(0.215, 0.61, 0.355, 1);-webkit-clip-path:circle(0px at calc(100% - 0px) 0px);clip-path:circle(0px at calc(100% - 0px) 0px);overflow:hidden;z-index:999999;background:rgba(0, 0, 0, 0.9);opacity:0;display:flex;}
nav span{display:block;float:left;margin-top:-75px;width:22%;text-align:right;color:#ff0068;text-transform:uppercase;font-size:20px;border-bottom:solid 1px #2f2f2f;padding:6px 0;}
nav.nav-active{transition:all .4s cubic-bezier(0.55, 0.055, 0.675, 0.19);-webkit-clip-path:circle(150% at calc(100% - 0px) 0px);clip-path:circle(150% at calc(100% - 0px) 0px);opacity:1;z-index:999999;}
.nav{position:absolute;top:0;bottom:0;left:0;width:100%;height:100%;display:table;margin:auto;text-align:center;}
.nav > div{display:table-cell;vertical-align:middle;}
.nav ul{padding:0;margin:0;list-style:none;}
.nav ul li{list-style:none;position:relative;display:inline-block;}
.nav ul li, .nav small{-webkit-animation-name:fadeUp;-moz-animation-name:fadeUp;-ms-animation-name:fadeUp;-o-animation-name:fadeUp;animation-name:fadeUp;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-iteration-count:forwards;-moz-animation-iteration-count:forwards;-ms-animation-iteration-count:forwards;-o-animation-iteration-count:forwards;animation-iteration-count:forwards;}
@-webkit-keyframes fadeUp{0%{opacity:0;-webkit-transform:translate3d(0, 200%, 0);-moz-transform:translate3d(0, 200%, 0);-ms-transform:translate3d(0, 200%, 0);-o-transform:translate3d(0, 200%, 0);transform:translate3d(0, 200%, 0);}
100%{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
}
@-moz-keyframes fadeUp{0%{opacity:0;-webkit-transform:translate3d(0, 200%, 0);-moz-transform:translate3d(0, 200%, 0);-ms-transform:translate3d(0, 200%, 0);-o-transform:translate3d(0, 200%, 0);transform:translate3d(0, 200%, 0);}
100%{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
}
@-ms-keyframes fadeUp{0%{opacity:0;-webkit-transform:translate3d(0, 200%, 0);-moz-transform:translate3d(0, 200%, 0);-ms-transform:translate3d(0, 200%, 0);-o-transform:translate3d(0, 200%, 0);transform:translate3d(0, 200%, 0);}
100%{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
}
@-o-keyframes fadeUp{0%{opacity:0;-webkit-transform:translate3d(0, 200%, 0);-moz-transform:translate3d(0, 200%, 0);-ms-transform:translate3d(0, 200%, 0);-o-transform:translate3d(0, 200%, 0);transform:translate3d(0, 200%, 0);}
100%{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
}
@keyframes fadeUp{0%{opacity:0;-webkit-transform:translate3d(0, 200%, 0);-moz-transform:translate3d(0, 200%, 0);-ms-transform:translate3d(0, 200%, 0);-o-transform:translate3d(0, 200%, 0);transform:translate3d(0, 200%, 0);}
100%{opacity:1;-webkit-transform:none;-moz-transform:none;-ms-transform:none;-o-transform:none;transform:none;}
}
.nav ul li:first-of-type{animation-delay:0.1s}
.nav ul li:nth-of-type(2){animation-delay:0.2s}
.nav ul li:nth-of-type(3){animation-delay:0.3s}
.nav ul li:nth-of-type(4){animation-delay:0.4s}
.nav ul li:nth-of-type(5){animation-delay:0.5s}
.nav ul li:nth-of-type(6){animation-delay:0.6s}
.nav ul li:nth-of-type(7){animation-delay:0.7s}
.nav ul li a{color:#64ddd1;font-size:22px;display:inline-block;position:relative;font-weight:500;margin:3px 0;text-transform:uppercase;z-index:9;padding:2px 8px;font-family:'Roboto Condensed', sans-serif;}
.nav small{display:block;animation-delay:0.8s}
.nav small a{color:#fff;font-size:16px;display:inline-block;position:relative;font-weight:500;margin:3px 0;z-index:9;padding:2px 8px;font-family:'Roboto Condensed', sans-serif;}
.nav ul li:hover > a{color:#ff0068;}
.nav ul li a:before{content:" ";position:absolute;top:auto;bottom:0;left:0;right:auto;width:3px;height:0;background:linear-gradient(0deg, #64ddd1, #ff0068);z-index:-8;-webkit-transition:0.6s;-moz-transition:0.6s;-o-transition:0.6s;transition:0.6s;}
.nav ul li a:hover:before{height:100%;top:0;bottom:auto;}
@media only screen and (max-width:768px){#nav-trigger{top:50.5px;right:20px;}
}
@media only screen and (max-width:768px){nav span{margin-top:-75px;width:50%;}
.nav ul li{display:block;}
}
@media only screen and (max-width:480px){.nav{width:100%;}
.nav-img{display:none;}
}