/* Navbar */
.navbar-brand {
    margin-right: 80px;
    color: #26ce84 !important;
    font-size: 2.375em
}
.navbar.navbar-expand-md {
    z-index: 2
}
.navbar-collapse .nav-item a {
    padding-right: 2.5rem;
    font-size: 18px
}
.navbar-collapse .nav-item a, .navbar-collapse .nav-item a:before {
    -webkit-transition: all .2s;
    -ms-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
}
.navbar-collapse .nav-item a:hover, .navbar-collapse .nav-item a:active, .navbar-collapse .nav-item.active a {
    color: #26ce84 !important;
    text-decoration: none;
}
.navbar-collapse .nav-item a:before {
    transform-origin: 50% 50%;
    -webkit-animation: navitem .3s;
}
@-o-keyframes navitem {/*30.0 15.0 -webkit- 12.0 -o-*/
    from {-o-transform: translateX(-12px) translateY(11px) scale(0)}/*23.0 15.0 -webkit- 10.5 -o-*/
    to {-o-transform: translateX(-12px) translateY(11px) scale(1)}
}
@-moz-keyframes navitem {/*16.0, 5.0 -moz-*/
    from {-moz-transform: translateX(-12px) translateY(11px) scale(0)}/*16.0 3.5 -moz-*/
    to {-moz-transform: translateX(-12px) translateY(11px) scale(1)}
}
@-webkit-keyframes navitem {/*43.0, 4.0 -webkit- Chrome; 9.0, 4.0 -webkit- Safari*/
    from {-webkit-transform: scale(0); transform: scale(0)}/*36.0, 4.0 -webkit- Chrome; 9.0, 3.2 -webkit- Safari*/
    to {-webkit-transform: scale(1); transform: scale(1)}
}
@keyframes navitem {
    from {transform: translateX(-12px) translateY(11px) scale(0)}
    to {transform: translateX(-12px) translateY(11px) scale(1)}
}
/*@-moz-keyframes navitem {
    from {opacity: 0}
    to {opacity: 1}
}
@-webkit-keyframes navitem {
    from {opacity: 0}
    to {opacity: 1}
}
@keyframes navitem {
    from {opacity: 0}
    to {opacity: 1}
}*/
.navbar-collapse .nav-item a:hover:before, .navbar-collapse .nav-item.active a:before {/*.navbar-collapse .nav-item.active a:before, .navbar-collapse .nav-item.active a:before:after*/
    position: absolute;
    content: '';
    transform: translateX(-12px) translateY(11px);
    /*display: inline-block;/* !important - not inline */
    width: 6px;
    height: 6px;
    border: 1px solid #26ce84;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    border-radius: 6px
}

/* Navigation buttons */
.bottom-nav, .top-nav {position: absolute}
.bottom-nav {
    left: 48%;
    bottom: 5%;
    text-align: center;
    z-index: 2
}
.bottom-nav button {
    padding: 18px 8px 16px 8px;
    min-width: 70px;
    background-color: transparent
}
.bottom-nav button svg {width: 33px}
.top-nav {width: 100%}
.top-nav div {
    width: 130px;
    height: 130px
}
.top-nav > div {
    margin: 0 auto;
    transform: translateY(-65px);
}
.top-nav > div > div, .top-nav button {
    border-radius: 100%;
    background-color: #fff;
}
.top-nav > div > div {
    padding: 15px;
    text-align: center;
}
.top-nav button {
    width: 98px;
    height: 98px
}
.top-nav svg {
    margin-bottom: 10px !important;
    width: 40px !important;
}

/* Responsive */
@media screen and (max-width: 1200px) {
    .top-nav svg {width: 30px !important}
}