body {
    font-family: 'HelveticaNowText', sans-serif;
}

.text-display {
    font-family: 'HelveticaNowDisplay', sans-serif;
}

.bg-gold {
    background-color: #D4B667;
}

.text-gold {
    color: #D4B667;
}

.bg-asphalte {
    background-color: #040603;
}

.text-asphalte {
    color: #040603;
}


.text-jingle {
    font-family: 'Ripe', serif;
}

.min-h-section {
    min-height: 720px;
}

.max-h-section {
    max-height: 960px;
}


#burger-menu span,
#burger-menu span:before,
#burger-menu span:after {
    background: #040603;
    display: block;
    height: 3px;
    border-radius: 1px;
    opacity: 1;
    position: absolute;
    transition: 0.3s ease-in-out;
    width: 1.5rem;
}

#burger-menu span:before,
#burger-menu span:after {
    content: "";
}

#burger-menu span {
    right: 0px;
    top: 12px;
}

#burger-menu span:before {
    left: 0px;
    top: -8px;
}

#burger-menu span:after {
    left: 0px;
    top: 8px;
}
  
#burger-menu.close span {
    transform: rotate(-45deg);
    top: 13px;
}
  
#burger-menu.close span:before {
    top: 0px;
    transform: rotate(90deg);
}

#burger-menu.close span:after {
    top: 0px;
    left:0;
    transform: rotate(90deg);
    opacity:0;
    width:0;
}
  
#menu {
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}
  
#menu.overlay{
    visibility: visible;
    opacity: 1;
}

@keyframes bounce {
    0%,
    20%,
    50%,
    80%,
    100% {
        -moz-transform: translateY(0);
        -ms-transform: translateY(0);
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    40% {
        -moz-transform: translateY(-20px);
        -ms-transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }
    60% {
        -moz-transform: translateY(-8px);
        -ms-transform: translateY(-8px);
        -webkit-transform: translateY(-8px);
        transform: translateY(-8px);
    }
}
  
.bounce {
    -moz-animation: bounce 2s infinite;
    -webkit-animation: bounce 2s infinite;
    animation: bounce 2s infinite;
}

.appear {
    opacity: 0;
    transition: all;
    transition-duration: 300ms;
    transition-delay: 100ms;
    transform: translateY(32px);
}

.appear.animated {
    opacity: 1;
    transform: translateY(0);
}


.appear-right {
    opacity: 0;
    transition: all;
    transition-duration: 500ms;
    transition-delay: 100ms;
    transform: translateX(64px);
}

.appear-right.animated {
    opacity: 1;
    transform: translateX(0);
}

.appear-left {
    opacity: 0;
    transition: all;
    transition-duration: 500ms;
    transition-delay: 100ms;
    transform: translateX(-64px);
}

.appear-left.animated {
    opacity: 1;
    transform: translateX(0);
}


.spinning-a {
    transform: rotate(30deg);
}

.spinning-b {
    transform: rotate(-30deg);
}

.spinning-c {
    transform: rotate(15deg);
}

.spinning {
    opacity: 0;
    transition: all;
    transition-duration: 500ms;
    transition-delay: 300ms;
}

.spinning.animated {
    opacity: 1;
    transform: rotate(0deg);
}

.bump {
    opacity: 0;
    transition: all;
    transition-duration: 300ms;
    transition-delay: 200ms;
    transform: scale(0.8);
}

.bump.animated {
    opacity: 1;
    transform: scale(1);
}